fix(icon): update to ionicons 6 to resolve typescript 4.4 errors (#24185

)
ionic-team · Nov 8, 2021 · 118c606 · 118c606
1 parent 52cd5d0
commit 118c606
Show file tree

Hide file tree

Showing 10 changed files with 58 additions and 39 deletions.
diff --git a/BREAKING.md b/BREAKING.md
@@ -15,6 +15,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
 - [Components](#components)
   * [Datetime](#datetime)
   * [Header](#header)
+  * [Icons](#icons)
   * [Input](#input)
   * [Modal](#modal)
   * [Popover](#popover)
@@ -91,6 +92,10 @@ ion-header.header-collapse-condense ion-toolbar:last-of-type {
 }
 ```
 
+#### Icons
+
+Ionic 6 now ships with Ionicons 6. Please be sure to review the [Ionicons 6.0.0 Changelog](https://github.com/ionic-team/ionicons/releases/tag/v6.0.0) and make any necessary changes.
+
 #### Input
 
 The `placeholder` property now has a type of `string | undefined` rather than `null | string | undefined`.

diff --git a/angular/src/directives/proxies.ts b/angular/src/directives/proxies.ts
@@ -576,13 +576,13 @@ export class IonHeader {
 
 export declare interface IonIcon extends Components.IonIcon {}
 @ProxyCmp({
-  inputs: ['ariaHidden', 'ariaLabel', 'color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'sanitize', 'size', 'src']
+  inputs: ['color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'sanitize', 'size', 'src']
 })
 @Component({
   selector: 'ion-icon',
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: '<ng-content></ng-content>',
-  inputs: ['ariaHidden', 'ariaLabel', 'color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'sanitize', 'size', 'src']
+  inputs: ['color', 'flipRtl', 'icon', 'ios', 'lazy', 'md', 'mode', 'name', 'sanitize', 'size', 'src']
 })
 export class IonIcon {
   protected el: HTMLElement;

diff --git a/core/package-lock.json b/core/package-lock.json
diff --git a/core/package.json b/core/package.json
@@ -32,7 +32,7 @@
   ],
   "dependencies": {
     "@stencil/core": "~2.10.0",
-    "ionicons": "^5.5.4",
+    "ionicons": "^6.0.0",
     "tslib": "^2.1.0"
   },
   "devDependencies": {

diff --git a/core/src/components/accordion/accordion.tsx b/core/src/components/accordion/accordion.tsx
@@ -187,7 +187,7 @@ export class Accordion implements ComponentInterface {
     iconEl.lazy = false;
     iconEl.classList.add('ion-accordion-toggle-icon');
     iconEl.icon = toggleIcon;
-    iconEl.ariaHidden = 'true';
+    iconEl.setAttribute('aria-hidden', 'true');
 
     ionItem.appendChild(iconEl);
   }

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -41,7 +41,7 @@
   ],
   "dependencies": {
     "@ionic/core": "6.0.0-rc.2",
-    "ionicons": "^5.5.4",
+    "ionicons": "^6.0.0",
     "tslib": "*"
   },
   "peerDependencies": {

diff --git a/packages/react/src/components/IonIcon.tsx b/packages/react/src/components/IonIcon.tsx
@@ -7,7 +7,6 @@ import { IonIconInner } from './inner-proxies';
 import { createForwardRef, isPlatform } from './utils';
 
 interface IonIconProps {
-  ariaLabel?: string;
   color?: string;
   flipRtl?: boolean;
   icon?: string;

diff --git a/packages/vue/package-lock.json b/packages/vue/package-lock.json
diff --git a/packages/vue/package.json b/packages/vue/package.json
@@ -60,7 +60,7 @@
   },
   "dependencies": {
     "@ionic/core": "6.0.0-rc.2",
-    "ionicons": "^5.5.4"
+    "ionicons": "^6.0.0"
   },
   "vetur": {
     "tags": "dist/vetur/tags.json",

diff --git a/packages/vue/src/components/IonIcon.ts b/packages/vue/src/components/IonIcon.ts
@@ -6,7 +6,6 @@ import { IonIcon as IonIconCmp } from 'ionicons/components/ion-icon.js';
 export const IonIcon = /*@__PURE__*/ defineComponent({
   name: 'IonIcon',
   props: {
-    ariaLabel: String,
     color: String,
     flipRtl: Boolean,
     icon: String,