@ionic/core 8.2.3-dev.11721064272.19e3ddfd → 8.2.3-dev.11721225504.1476a6ac

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 (175) hide show
  1. package/components/ion-avatar.js +3 -3
  2. package/components/ion-badge.js +3 -3
  3. package/components/ion-input.js +1 -1
  4. package/components/ion-segment.js +3 -11
  5. package/components/ion-select-option.js +1 -1
  6. package/components/ion-select.js +2 -2
  7. package/components/ion-skeleton-text.js +2 -2
  8. package/components/ion-split-pane.js +2 -2
  9. package/components/ion-tab-bar.js +2 -2
  10. package/components/ion-tab-button.js +2 -2
  11. package/components/ion-tab.js +2 -2
  12. package/components/ion-tabs.js +1 -1
  13. package/components/ion-text.js +2 -2
  14. package/components/ion-textarea.js +2 -2
  15. package/components/ion-thumbnail.js +2 -2
  16. package/components/ion-title.js +2 -2
  17. package/components/ion-toast.js +2 -2
  18. package/components/ion-toggle.js +3 -3
  19. package/components/ion-toolbar.js +2 -2
  20. package/components/item.js +3 -3
  21. package/components/select-popover.js +2 -2
  22. package/components/spinner.js +33 -6
  23. package/dist/cjs/ion-app_8.cjs.entry.js +4 -4
  24. package/dist/cjs/ion-avatar_3.cjs.entry.js +8 -8
  25. package/dist/cjs/ion-input.cjs.entry.js +1 -1
  26. package/dist/cjs/ion-item_8.cjs.entry.js +5 -5
  27. package/dist/cjs/ion-segment_2.cjs.entry.js +3 -11
  28. package/dist/cjs/ion-select_3.cjs.entry.js +5 -5
  29. package/dist/cjs/ion-spinner.cjs.entry.js +30 -4
  30. package/dist/cjs/ion-split-pane.cjs.entry.js +2 -2
  31. package/dist/cjs/ion-tab-bar_2.cjs.entry.js +4 -4
  32. package/dist/cjs/ion-tab_2.cjs.entry.js +3 -3
  33. package/dist/cjs/ion-text.cjs.entry.js +2 -2
  34. package/dist/cjs/ion-textarea.cjs.entry.js +2 -2
  35. package/dist/cjs/ion-toast.cjs.entry.js +2 -2
  36. package/dist/cjs/ion-toggle.cjs.entry.js +3 -3
  37. package/dist/cjs/ionic.cjs.js +1 -1
  38. package/dist/cjs/loader.cjs.js +1 -1
  39. package/dist/collection/collection-manifest.json +0 -2
  40. package/dist/collection/components/avatar/avatar.ionic.css +17 -1
  41. package/dist/collection/components/avatar/avatar.js +5 -5
  42. package/dist/collection/components/avatar/test/shape/avatar.e2e.js +7 -0
  43. package/dist/collection/components/avatar/test/size/avatar.e2e.js +27 -0
  44. package/dist/collection/components/badge/badge.ionic.css +32 -37
  45. package/dist/collection/components/badge/badge.ios.css +94 -3
  46. package/dist/collection/components/badge/badge.md.css +94 -3
  47. package/dist/collection/components/button/test/outline/button.e2e.js +1 -2
  48. package/dist/collection/components/input/input.ionic.css +2 -1
  49. package/dist/collection/components/item/item.ionic.css +359 -65
  50. package/dist/collection/components/item/item.ios.css +94 -67
  51. package/dist/collection/components/item/item.md.css +94 -67
  52. package/dist/collection/components/segment/segment.js +3 -11
  53. package/dist/collection/components/select/select.js +2 -2
  54. package/dist/collection/components/select-option/select-option.js +1 -1
  55. package/dist/collection/components/select-popover/select-popover.js +2 -2
  56. package/dist/collection/components/skeleton-text/skeleton-text.js +2 -2
  57. package/dist/collection/components/spinner/spinner.common.css +199 -0
  58. package/dist/collection/components/spinner/{spinner.css → spinner.ionic.css} +55 -0
  59. package/dist/collection/components/spinner/spinner.js +40 -3
  60. package/dist/collection/components/spinner/test/size/spinner.e2e.js +47 -0
  61. package/dist/collection/components/split-pane/split-pane.js +2 -2
  62. package/dist/collection/components/tab/tab.js +2 -2
  63. package/dist/collection/components/tab-bar/tab-bar.js +2 -2
  64. package/dist/collection/components/tab-button/tab-button.js +2 -2
  65. package/dist/collection/components/tabs/tabs.js +1 -1
  66. package/dist/collection/components/text/text.js +2 -2
  67. package/dist/collection/components/textarea/textarea.js +2 -2
  68. package/dist/collection/components/thumbnail/thumbnail.js +2 -2
  69. package/dist/collection/components/title/title.js +2 -2
  70. package/dist/collection/components/toast/toast.js +2 -2
  71. package/dist/collection/components/toggle/toggle.js +3 -3
  72. package/dist/collection/components/toolbar/toolbar.js +2 -2
  73. package/dist/docs.json +190 -48
  74. package/dist/esm/ion-app_8.entry.js +4 -4
  75. package/dist/esm/ion-avatar_3.entry.js +8 -8
  76. package/dist/esm/ion-input.entry.js +1 -1
  77. package/dist/esm/ion-item_8.entry.js +5 -5
  78. package/dist/esm/ion-segment_2.entry.js +3 -11
  79. package/dist/esm/ion-select_3.entry.js +5 -5
  80. package/dist/esm/ion-spinner.entry.js +30 -4
  81. package/dist/esm/ion-split-pane.entry.js +2 -2
  82. package/dist/esm/ion-tab-bar_2.entry.js +4 -4
  83. package/dist/esm/ion-tab_2.entry.js +3 -3
  84. package/dist/esm/ion-text.entry.js +2 -2
  85. package/dist/esm/ion-textarea.entry.js +2 -2
  86. package/dist/esm/ion-toast.entry.js +2 -2
  87. package/dist/esm/ion-toggle.entry.js +3 -3
  88. package/dist/esm/ionic.js +1 -1
  89. package/dist/esm/loader.js +1 -1
  90. package/dist/esm-es5/ion-app_8.entry.js +1 -1
  91. package/dist/esm-es5/ion-avatar_3.entry.js +1 -1
  92. package/dist/esm-es5/ion-input.entry.js +1 -1
  93. package/dist/esm-es5/ion-item_8.entry.js +1 -1
  94. package/dist/esm-es5/ion-segment_2.entry.js +1 -1
  95. package/dist/esm-es5/ion-select_3.entry.js +1 -1
  96. package/dist/esm-es5/ion-spinner.entry.js +1 -1
  97. package/dist/esm-es5/ion-split-pane.entry.js +1 -1
  98. package/dist/esm-es5/ion-tab-bar_2.entry.js +1 -1
  99. package/dist/esm-es5/ion-tab_2.entry.js +1 -1
  100. package/dist/esm-es5/ion-text.entry.js +1 -1
  101. package/dist/esm-es5/ion-textarea.entry.js +1 -1
  102. package/dist/esm-es5/ion-toast.entry.js +1 -1
  103. package/dist/esm-es5/ion-toggle.entry.js +1 -1
  104. package/dist/esm-es5/ionic.js +1 -1
  105. package/dist/esm-es5/loader.js +1 -1
  106. package/dist/html.html-data.json +25 -29
  107. package/dist/ionic/ionic.esm.js +1 -1
  108. package/dist/ionic/{p-29f4100d.entry.js → p-01ae1aa0.entry.js} +1 -1
  109. package/dist/ionic/p-1be0295f.entry.js +4 -0
  110. package/dist/ionic/p-201d8768.system.entry.js +4 -0
  111. package/dist/ionic/{p-062c1cb9.system.entry.js → p-223bc7dd.system.entry.js} +1 -1
  112. package/dist/ionic/{p-0595a36c.system.entry.js → p-24592a4d.system.entry.js} +1 -1
  113. package/dist/ionic/{p-2aa6a169.entry.js → p-28649e61.entry.js} +1 -1
  114. package/dist/ionic/{p-385a361b.entry.js → p-39a39279.entry.js} +1 -1
  115. package/dist/ionic/p-3ce954c7.entry.js +4 -0
  116. package/dist/ionic/p-40c14f53.system.entry.js +4 -0
  117. package/dist/ionic/{p-cd6d4c1d.entry.js → p-4346453b.entry.js} +1 -1
  118. package/dist/ionic/{p-1be0ed0e.system.entry.js → p-45ca3acb.system.entry.js} +2 -2
  119. package/dist/ionic/p-4b9c6418.system.entry.js +4 -0
  120. package/dist/ionic/p-563a8d3b.entry.js +4 -0
  121. package/dist/ionic/{p-b67ed806.system.entry.js → p-56c72f65.system.entry.js} +1 -1
  122. package/dist/ionic/{p-da668343.system.entry.js → p-7ab9c88c.system.entry.js} +1 -1
  123. package/dist/ionic/p-7b590e46.system.js +1 -1
  124. package/dist/ionic/{p-c0dace15.system.entry.js → p-7dad531c.system.entry.js} +1 -1
  125. package/dist/ionic/p-85ca50a9.system.entry.js +4 -0
  126. package/dist/ionic/p-8ac5efa9.entry.js +4 -0
  127. package/dist/ionic/p-a0b51978.system.entry.js +4 -0
  128. package/dist/ionic/p-a6bb62ea.entry.js +4 -0
  129. package/dist/ionic/p-ae79f1e2.entry.js +4 -0
  130. package/dist/ionic/{p-aaf1b71f.entry.js → p-b374abe2.entry.js} +1 -1
  131. package/dist/ionic/{p-61f51286.system.entry.js → p-b5cc6e57.system.entry.js} +1 -1
  132. package/dist/ionic/p-bbefc52b.system.entry.js +4 -0
  133. package/dist/ionic/{p-adb54d5b.entry.js → p-c23822f8.entry.js} +1 -1
  134. package/dist/ionic/{p-14ae725a.entry.js → p-d2a580db.entry.js} +1 -1
  135. package/dist/ionic/p-dc8a3888.entry.js +4 -0
  136. package/dist/ionic/{p-5cc8fa7f.system.entry.js → p-f84ea1e9.system.entry.js} +1 -1
  137. package/dist/types/components/avatar/avatar.d.ts +7 -4
  138. package/dist/types/components/segment/segment.d.ts +1 -1
  139. package/dist/types/components/spinner/spinner.d.ts +11 -0
  140. package/dist/types/components.d.ts +12 -30
  141. package/hydrate/index.js +77 -151
  142. package/package.json +1 -1
  143. package/components/ion-segment-content.d.ts +0 -11
  144. package/components/ion-segment-content.js +0 -38
  145. package/components/ion-segment-view.d.ts +0 -11
  146. package/components/ion-segment-view.js +0 -86
  147. package/dist/cjs/ion-segment-content.cjs.entry.js +0 -24
  148. package/dist/cjs/ion-segment-view.cjs.entry.js +0 -72
  149. package/dist/collection/components/segment-content/segment-content.css +0 -5
  150. package/dist/collection/components/segment-content/segment-content.js +0 -22
  151. package/dist/collection/components/segment-view/segment-view.css +0 -15
  152. package/dist/collection/components/segment-view/segment-view.js +0 -81
  153. package/dist/esm/ion-segment-content.entry.js +0 -20
  154. package/dist/esm/ion-segment-view.entry.js +0 -68
  155. package/dist/esm-es5/ion-segment-content.entry.js +0 -4
  156. package/dist/esm-es5/ion-segment-view.entry.js +0 -4
  157. package/dist/ionic/p-07b804ba.entry.js +0 -4
  158. package/dist/ionic/p-405559bd.entry.js +0 -4
  159. package/dist/ionic/p-5839776e.entry.js +0 -4
  160. package/dist/ionic/p-660cf6f3.system.entry.js +0 -4
  161. package/dist/ionic/p-6ced0cc0.entry.js +0 -4
  162. package/dist/ionic/p-6d4534cb.system.entry.js +0 -4
  163. package/dist/ionic/p-72944d53.system.entry.js +0 -4
  164. package/dist/ionic/p-7813dead.system.entry.js +0 -4
  165. package/dist/ionic/p-833593dd.entry.js +0 -4
  166. package/dist/ionic/p-8ef82205.entry.js +0 -4
  167. package/dist/ionic/p-9316e014.system.entry.js +0 -4
  168. package/dist/ionic/p-a2830649.system.entry.js +0 -4
  169. package/dist/ionic/p-aa246404.entry.js +0 -4
  170. package/dist/ionic/p-aa97948b.entry.js +0 -4
  171. package/dist/ionic/p-c6e43624.entry.js +0 -4
  172. package/dist/ionic/p-f1eb1152.system.entry.js +0 -4
  173. package/dist/ionic/p-f8a16486.system.entry.js +0 -4
  174. package/dist/types/components/segment-content/segment-content.d.ts +0 -5
  175. package/dist/types/components/segment-view/segment-view.d.ts +0 -13
@@ -0,0 +1,47 @@
1
+ /*!
2
+ * (C) Ionic http://ionicframework.com - MIT License
3
+ */
4
+ import { expect } from "@playwright/test";
5
+ import { configs, test } from "../../../../utils/test/playwright/index";
6
+ /**
7
+ * This behavior does not vary across directions.
8
+ */
9
+ configs({ directions: ['ltr'], modes: ['ionic-md'] }).forEach(({ config, screenshot, title }) => {
10
+ test.describe(title('spinner: size'), () => {
11
+ test('should render xsmall spinner', async ({ page }) => {
12
+ await page.setContent(`
13
+ <ion-spinner size="xsmall"></ion-spinner>
14
+ `, config);
15
+ const spinner = page.locator('ion-spinner');
16
+ await expect(spinner).toHaveScreenshot(screenshot(`spinner-size-xsmall`));
17
+ });
18
+ test('should render small spinner', async ({ page }) => {
19
+ await page.setContent(`
20
+ <ion-spinner size="small"></ion-spinner>
21
+ `, config);
22
+ const spinner = page.locator('ion-spinner');
23
+ await expect(spinner).toHaveScreenshot(screenshot(`spinner-size-small`));
24
+ });
25
+ test('should render medium spinner', async ({ page }) => {
26
+ await page.setContent(`
27
+ <ion-spinner size="medium"></ion-spinner>
28
+ `, config);
29
+ const spinner = page.locator('ion-spinner');
30
+ await expect(spinner).toHaveScreenshot(screenshot(`spinner-size-medium`));
31
+ });
32
+ test('should render large spinner', async ({ page }) => {
33
+ await page.setContent(`
34
+ <ion-spinner size="large"></ion-spinner>
35
+ `, config);
36
+ const spinner = page.locator('ion-spinner');
37
+ await expect(spinner).toHaveScreenshot(screenshot(`spinner-size-large`));
38
+ });
39
+ test('should render xlarge spinner', async ({ page }) => {
40
+ await page.setContent(`
41
+ <ion-spinner size="xlarge"></ion-spinner>
42
+ `, config);
43
+ const spinner = page.locator('ion-spinner');
44
+ await expect(spinner).toHaveScreenshot(screenshot(`spinner-size-xlarge`));
45
+ });
46
+ });
47
+ });
@@ -122,12 +122,12 @@ export class SplitPane {
122
122
  }
123
123
  render() {
124
124
  const theme = getIonTheme(this);
125
- return (h(Host, { key: 'a52854c638f501f9464c3d1d4c30bee020fd781e', class: {
125
+ return (h(Host, { key: 'f2090ca1bf3210b4ba6e20adafbc6f5839704cdd', class: {
126
126
  [theme]: true,
127
127
  // Used internally for styling
128
128
  [`split-pane-${theme}`]: true,
129
129
  'split-pane-visible': this.visible,
130
- } }, h("slot", { key: 'b2164b195c5811dda3d855c47f1bb59975172329' })));
130
+ } }, h("slot", { key: '3ecadb0aa95e4b7799b34122afe25d028bba8710' })));
131
131
  }
132
132
  static get is() { return "ion-split-pane"; }
133
133
  static get encapsulation() { return "shadow"; }
@@ -52,10 +52,10 @@ export class Tab {
52
52
  }
53
53
  render() {
54
54
  const { tab, active, component } = this;
55
- return (h(Host, { key: '121affd326db55663c47d9c917e64e863f909028', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
55
+ return (h(Host, { key: '91a0d6e7f70446804044b06eaf22e6fe0eb14510', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
56
56
  'ion-page': component === undefined,
57
57
  'tab-hidden': !active,
58
- } }, h("slot", { key: '8c80289c7e745a8a07692565519b9b13eb56ff19' })));
58
+ } }, h("slot", { key: '6bb7036c2a8a149212b5afdc0a34c6131efd1aee' })));
59
59
  }
60
60
  static get is() { return "ion-tab"; }
61
61
  static get encapsulation() { return "shadow"; }
@@ -52,11 +52,11 @@ export class TabBar {
52
52
  const { color, translucent, keyboardVisible } = this;
53
53
  const theme = getIonTheme(this);
54
54
  const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
55
- return (h(Host, { key: 'cf965ce80081170fd2200e7368c69cd6ccdada5d', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
55
+ return (h(Host, { key: 'a17e0599a93095bd47d519336fda9ceeda3029d1', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: createColorClasses(color, {
56
56
  [theme]: true,
57
57
  'tab-bar-translucent': translucent,
58
58
  'tab-bar-hidden': shouldHide,
59
- }) }, h("slot", { key: '94538a393f7cf1000f4c476a4afdc73b7d593f32' })));
59
+ }) }, h("slot", { key: '7c1f1abe56e8a0f3f24d3479dd6c839aaf90c7be' })));
60
60
  }
61
61
  static get is() { return "ion-tab-bar"; }
62
62
  static get encapsulation() { return "shadow"; }
@@ -71,7 +71,7 @@ export class TabButton {
71
71
  rel,
72
72
  target,
73
73
  };
74
- return (h(Host, { key: 'c5d5a400c9e489dca8f69a474e9d2f7321181352', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
74
+ return (h(Host, { key: '9d7ead0ffeaea5d99e3aa357bff6c5ac64fa1f26', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
75
75
  [theme]: true,
76
76
  'tab-selected': selected,
77
77
  'tab-disabled': disabled,
@@ -83,7 +83,7 @@ export class TabButton {
83
83
  'ion-activatable': true,
84
84
  'ion-selectable': true,
85
85
  'ion-focusable': true,
86
- } }, h("a", Object.assign({ key: '7c8ebc51f564778ebd07615b06466e9250539682' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), h("span", { key: '0ec2cb0c616c612af1a97338b5b774196c7498e5', class: "button-inner" }, h("slot", { key: '84ba9e4c88466da0ae7c71de19f9896c9e4e93ef' })), theme === 'md' && h("ion-ripple-effect", { key: '647c96627b7f8339d72c36ca01320677b8b7839c', type: "unbounded" }))));
86
+ } }, h("a", Object.assign({ key: 'fa0e9730e8b396d83df43a97b41067bbc6b195c2' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), h("span", { key: '70b80731de0115a7720de8f0e1f16bac4eb326c3', class: "button-inner" }, h("slot", { key: '3abf65a17ef45a00ae54909b3301f68117a04575' })), theme === 'md' && h("ion-ripple-effect", { key: 'becf3d93675dc8943dc16fc27d204b5c1ad00817', type: "unbounded" }))));
87
87
  }
88
88
  static get is() { return "ion-tab-button"; }
89
89
  static get encapsulation() { return "shadow"; }
@@ -138,7 +138,7 @@ export class Tabs {
138
138
  return Array.from(this.el.querySelectorAll('ion-tab'));
139
139
  }
140
140
  render() {
141
- return (h(Host, { key: 'ba731d1538baa664111266c5f9bc3311fe02f9b7', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '51f8ca87cd096a8e638a0b15d4fbab5aa730f5fa', name: "top" }), h("div", { key: 'e608434927bb5aac108027a4ce9389a0d930e1c2', class: "tabs-inner" }, h("slot", { key: '2922d0e28afc21fda97f2b29a8b5222d9782a6b4' })), h("slot", { key: 'f42306887fc30a816c961fea6cb609375eb56875', name: "bottom" })));
141
+ return (h(Host, { key: 'b38aa13e0115484aa4201c438956ba598671c7f7', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '47c5aead7a4caf5a496a020e2c4bcac2f5b4082a', name: "top" }), h("div", { key: '839c4cf7b8adbf3263b6e8b94963fe41ba7b1b35', class: "tabs-inner" }, h("slot", { key: '74d33c76bb578a3eddc6a2bfc833018b912b2947' })), h("slot", { key: '45919fcd3ba83ab5d3a928ec83ca14039dde68e2', name: "bottom" })));
142
142
  }
143
143
  static get is() { return "ion-tabs"; }
144
144
  static get encapsulation() { return "shadow"; }
@@ -14,9 +14,9 @@ export class Text {
14
14
  }
15
15
  render() {
16
16
  const theme = getIonTheme(this);
17
- return (h(Host, { key: 'e1398a44433bb39074bd1c03a157968fde144dbd', class: createColorClasses(this.color, {
17
+ return (h(Host, { key: '1d7afeee75e183280309a1300a919eb6b554226c', class: createColorClasses(this.color, {
18
18
  [theme]: true,
19
- }) }, h("slot", { key: '1c26cfb6121b165c9129fad3e98ae8a373949721' })));
19
+ }) }, h("slot", { key: '5083935a5010701514fb18576912eabb738bb862' })));
20
20
  }
21
21
  static get is() { return "ion-text"; }
22
22
  static get encapsulation() { return "shadow"; }
@@ -360,7 +360,7 @@ export class Textarea {
360
360
  * TODO(FW-5592): Remove hasStartEndSlots condition
361
361
  */
362
362
  const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || hasFocus || hasStartEndSlots));
363
- return (h(Host, { key: '35aa08db103e5deb78d957cab4b927f6b75cfa0d', class: createColorClasses(this.color, {
363
+ return (h(Host, { key: '911726b3af25343ca7ba3084a00f6f70d10c11ed', class: createColorClasses(this.color, {
364
364
  [theme]: true,
365
365
  'has-value': hasValue,
366
366
  'has-focus': hasFocus,
@@ -369,7 +369,7 @@ export class Textarea {
369
369
  [`textarea-shape-${shape}`]: shape !== undefined,
370
370
  [`textarea-label-placement-${labelPlacement}`]: true,
371
371
  'textarea-disabled': disabled,
372
- }) }, h("label", { key: '088fd6d57899f9b1595712c7a63642e9877f5e00', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: '3f1ab81e9c4a7a286f985fa7f6f30dca5f26833b', class: "textarea-wrapper-inner" }, h("div", { key: '4afa68f18bb62b32138a91d903c75672d9a8a9ba', class: "start-slot-wrapper" }, h("slot", { key: '635fa7a5c9754654a3d7f012d33fc12cbe9fd0cf', name: "start" })), h("div", { key: '0895b08cb759a157783a38f423c04967ec8c0ce1', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: 'ec1ebe99508fbce9897c870d5e74239a32dfba91', class: "native-textarea", ref: (el) => (this.nativeInput = el), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, minLength: this.minlength, maxLength: this.maxlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value)), h("div", { key: '411186d7c420c386233296edcbc9afd1d3de03a7', class: "end-slot-wrapper" }, h("slot", { key: 'b37cd68f0dc3f310cd78107d6f61933ba0e27d83', name: "end" }))), shouldRenderHighlight && h("div", { key: '43c7ae2f1e797701d9dbfd905d40320bb0f40e89', class: "textarea-highlight" })), this.renderBottomContent()));
372
+ }) }, h("label", { key: '6f5f1633788b266b919c4bf9da1598fe3e33d9c0', class: "textarea-wrapper", htmlFor: inputId }, this.renderLabelContainer(), h("div", { key: 'bc04ce5f1174737a931c45f8851ba5a2b96e3f88', class: "textarea-wrapper-inner" }, h("div", { key: 'fa8552e1782232e56d7ff0ad69cd77f5bdff1dd8', class: "start-slot-wrapper" }, h("slot", { key: '96f59a916db5d3d386f5d87bfe5490b55bc39573', name: "start" })), h("div", { key: '7b0bab61d53d051bc0bfd8b7da99e9d8bc28d7d0', class: "native-wrapper", ref: (el) => (this.textareaWrapper = el) }, h("textarea", Object.assign({ key: '162f9bafda1156f8b370e108a2acc76540b69f9a', class: "native-textarea", ref: (el) => (this.nativeInput = el), id: inputId, disabled: disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, minLength: this.minlength, maxLength: this.maxlength, name: this.name, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown }, this.inheritedAttributes), value)), h("div", { key: '00f6074ba777a9c4410267a41ac3303c30be4b43', class: "end-slot-wrapper" }, h("slot", { key: '633af4fbfbbada66b4755ead8f1fe8ec412530b7', name: "end" }))), shouldRenderHighlight && h("div", { key: '04e74015f00c89279f23a13cc8f67944f8c9d336', class: "textarea-highlight" })), this.renderBottomContent()));
373
373
  }
374
374
  static get is() { return "ion-textarea"; }
375
375
  static get encapsulation() { return "scoped"; }
@@ -10,9 +10,9 @@ import { getIonTheme } from "../../global/ionic-global";
10
10
  export class Thumbnail {
11
11
  render() {
12
12
  const theme = getIonTheme(this);
13
- return (h(Host, { key: '43ea61d750f53e8f3623df191eb3795a59599e40', class: {
13
+ return (h(Host, { key: '8911848dc9edd536023c8a68e51752b751e3f0ab', class: {
14
14
  [theme]: true,
15
- } }, h("slot", { key: 'feaecfa188c84b219d61ff99296b34c7ab26ec66' })));
15
+ } }, h("slot", { key: 'aaa7d7010d4050eebaed490b3ef7e641b076607c' })));
16
16
  }
17
17
  static get is() { return "ion-thumbnail"; }
18
18
  static get encapsulation() { return "shadow"; }
@@ -31,11 +31,11 @@ export class ToolbarTitle {
31
31
  render() {
32
32
  const theme = getIonTheme(this);
33
33
  const size = this.getSize();
34
- return (h(Host, { key: '2312208012fcc0021511e9f83a797f0efecc95d7', class: createColorClasses(this.color, {
34
+ return (h(Host, { key: '67f00e2664322d0a5df32e093c7e227fc6f16c98', class: createColorClasses(this.color, {
35
35
  [theme]: true,
36
36
  [`title-${size}`]: true,
37
37
  'title-rtl': document.dir === 'rtl',
38
- }) }, h("div", { key: '0d5cb6cb7065aa70a299061ebd1d7be04f0c5d22', class: "toolbar-title" }, h("slot", { key: '9f95add2dda42160f45137f7ebd8df0f3c3f1a69' }))));
38
+ }) }, h("div", { key: 'cfc8295c9c599a9a61ea794b30169fdd574708f1', class: "toolbar-title" }, h("slot", { key: '2065458af3ed39d230c935332e7ff9c9d2d20e78' }))));
39
39
  }
40
40
  static get is() { return "ion-title"; }
41
41
  static get encapsulation() { return "shadow"; }
@@ -390,9 +390,9 @@ export class Toast {
390
390
  if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
391
391
  printIonWarning('This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
392
392
  }
393
- return (h(Host, Object.assign({ key: 'c479651c07a43bc57908af9c40ebd096cf37b055', tabindex: "-1" }, this.htmlAttributes, { style: {
393
+ return (h(Host, Object.assign({ key: 'cb84d6f739571bc4193840fb790caa5bb5d86570', tabindex: "-1" }, this.htmlAttributes, { style: {
394
394
  zIndex: `${60000 + this.overlayIndex}`,
395
- }, class: createColorClasses(this.color, Object.assign(Object.assign({ [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: 'd4939b5d4f3ffee11ad3167387fbcf5d65107ddc', class: wrapperClass }, h("div", { key: 'bea0d04b6c936b61d0a8df70eb147f2792b7dadd', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'ea29fdcf23d8b915bb3c294bff094743e3e06e82', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: 'c0092793067bbc2cd5b7e538ccdc82aacd424fe1', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
395
+ }, class: createColorClasses(this.color, Object.assign(Object.assign({ [theme]: true }, getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), h("div", { key: '2d9d8ce5d886779f406410197df2a6244032c012', class: wrapperClass }, h("div", { key: '3a64cc8e864daf97f13c94416a544a80738273ba', class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (h("ion-icon", { key: 'c1461d577adabfb1244be84d5bc433c256a86a38', class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), h("div", { key: '5a4cfe8b8fe74fa550468183b3f43294827b800f', class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
396
396
  }
397
397
  static get is() { return "ion-toast"; }
398
398
  static get encapsulation() { return "shadow"; }
@@ -207,7 +207,7 @@ export class Toggle {
207
207
  const value = this.getValue();
208
208
  const rtl = isRTL(el) ? 'rtl' : 'ltr';
209
209
  renderHiddenInput(true, el, name, checked ? value : '', disabled);
210
- return (h(Host, { key: 'aa9dc67384dc4be027ac562730e899f4315fdcfc', onClick: this.onClick, class: createColorClasses(color, {
210
+ return (h(Host, { key: '06f5bc54f99b5f27f0d67a6934aea6bb671ec440', onClick: this.onClick, class: createColorClasses(color, {
211
211
  [theme]: true,
212
212
  'in-item': hostContext('ion-item', el),
213
213
  'toggle-activated': activated,
@@ -217,10 +217,10 @@ export class Toggle {
217
217
  [`toggle-alignment-${alignment}`]: true,
218
218
  [`toggle-label-placement-${labelPlacement}`]: true,
219
219
  [`toggle-${rtl}`]: true,
220
- }) }, h("label", { key: 'f154b73f5def7cc59a9d5f355eece52c57e5b493', class: "toggle-wrapper" }, h("input", Object.assign({ key: 'a1c4864c94a8f28a0d2e018ae35275125674cfa6', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), h("div", { key: '074b23eb8020c8318aeb8747c5bcef7e0ee235bb', class: {
220
+ }) }, h("label", { key: '7831cd36159ce5fc9d854ebecb597ae3c659a1c1', class: "toggle-wrapper" }, h("input", Object.assign({ key: '11ea2c3830239223c8b570216ca84109155d7776', type: "checkbox", role: "switch", "aria-checked": `${checked}`, checked: checked, disabled: disabled, id: inputId, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, this.inheritedAttributes)), h("div", { key: '5ae16c5503913089ca9ec268cf4db8a7745460b6', class: {
221
221
  'label-text-wrapper': true,
222
222
  'label-text-wrapper-hidden': !this.hasLabel,
223
- }, part: "label" }, h("slot", { key: '94d49b13cf0a4fa6fd0177931217446661691bc0' })), h("div", { key: 'c4468059e95a4f6342c60ccaaf3956e45a9b13cc', class: "native-wrapper" }, this.renderToggleControl()))));
223
+ }, part: "label" }, h("slot", { key: '8787021fe340347d6ae44c22959f387f03b871e0' })), h("div", { key: '7ac6cf4bfeb41fc0e8ff9fa2e55571234ab07d03', class: "native-wrapper" }, this.renderToggleControl()))));
224
224
  }
225
225
  static get is() { return "ion-toggle"; }
226
226
  static get encapsulation() { return "shadow"; }
@@ -63,10 +63,10 @@ export class Toolbar {
63
63
  this.childrenStyles.forEach((value) => {
64
64
  Object.assign(childStyles, value);
65
65
  });
66
- return (h(Host, { key: '301c7915c8331f4b00cf929068083102ec85a75d', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
66
+ return (h(Host, { key: '958f4b7dd7edd7e14188ede019a3ec83955047e7', class: Object.assign(Object.assign({}, childStyles), createColorClasses(this.color, {
67
67
  [theme]: true,
68
68
  'in-toolbar': hostContext('ion-toolbar', this.el),
69
- })) }, h("div", { key: 'fa60782795f4c50a2bf6fe85799439ee4469c51f', class: "toolbar-background" }), h("div", { key: 'd22e03c135a3360b796c9149018888a176d05a7e', class: "toolbar-container" }, h("slot", { key: 'e97e52fd2426ef4fdddcad9202a5331c4d1ef6b7', name: "start" }), h("slot", { key: '1f82aa2d95a17ab478d13ade7ae52da227de2bfc', name: "secondary" }), h("div", { key: 'e7698f82a464a9c863bd3a602d396a14d987bad0', class: "toolbar-content" }, h("slot", { key: '215f4fcd1cae042da6e2d5ef9832d9857db1b7c6' })), h("slot", { key: '962027f724f2a3ba009dcb218f71bbc97fb6927a', name: "primary" }), h("slot", { key: '5d7d1a5132501a436a82e267d660ec7feea96012', name: "end" }))));
69
+ })) }, h("div", { key: '13c34671af2a47ee2d13c3348d87590696fe2043', class: "toolbar-background" }), h("div", { key: '00cb26c46ab564017c5b59133082966487f3268a', class: "toolbar-container" }, h("slot", { key: 'a9c5fc777ff5eab4ef91d7c9b274a53012280f35', name: "start" }), h("slot", { key: 'a5a4e11b5d5847ff167ae95b86cd3625d482e257', name: "secondary" }), h("div", { key: 'e9f06b74b6aa933363aa0b671216b37300cc660c', class: "toolbar-content" }, h("slot", { key: '05929530a64a6d497ef5bc69dbc42adc11c9694f' })), h("slot", { key: 'f03445495cd36c54a7a43b47ab47169c53d9d15b', name: "primary" }), h("slot", { key: 'd8a60db04c290933462b517cc6627500bd9ebe34', name: "end" }))));
70
70
  }
71
71
  static get is() { return "ion-toolbar"; }
72
72
  static get encapsulation() { return "shadow"; }