From 635ac195d9c8e1f7e63189e06928c681fdc863cb Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Tue, 6 Jul 2021 10:19:54 -0400 Subject: [PATCH 01/22] docs(router-outlet): add react note to docs (#23580) --- core/src/components/router-outlet/readme.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/core/src/components/router-outlet/readme.md b/core/src/components/router-outlet/readme.md index 9e7883c0b3..2c6d5917e3 100644 --- a/core/src/components/router-outlet/readme.md +++ b/core/src/components/router-outlet/readme.md @@ -1,8 +1,8 @@ # ion-router-outlet -Router outlet is a component used in routing within an Angular or Vue app. It behaves in a similar way to Angular's built-in router outlet component and Vue's router view component, but contains the logic for providing a stacked navigation, and animating views in and out. +Router outlet is a component used in routing within an Angular, React, or Vue app. It behaves in a similar way to Angular's built-in router outlet component and Vue's router view component, but contains the logic for providing a stacked navigation, and animating views in and out. -> Note: this component should only be used with Angular and Vue projects. For vanilla or Stencil JavaScript projects, use [`ion-router`](../router) and [`ion-route`](../route). +> Note: this component should only be used with Angular, React, and Vue projects. For vanilla or Stencil JavaScript projects, use [`ion-router`](../router) and [`ion-route`](../route). Although router outlet has methods for navigating around, it's recommended to use the navigation methods in your framework's router. From a15cace13989463c14ba7781f804532267831fdd Mon Sep 17 00:00:00 2001 From: omar2205 Date: Wed, 7 Jul 2021 15:04:10 +0200 Subject: [PATCH 02/22] docs(loading): show how to use dismiss method returns from useIonLoading for react (#23537) --- core/src/components/loading/readme.md | 14 ++++++++++---- core/src/components/loading/usage/react.md | 14 ++++++++++---- 2 files changed, 20 insertions(+), 8 deletions(-) diff --git a/core/src/components/loading/readme.md b/core/src/components/loading/readme.md index 949708ff24..5a901ff680 100644 --- a/core/src/components/loading/readme.md +++ b/core/src/components/loading/readme.md @@ -139,17 +139,23 @@ import { IonButton, IonContent, IonPage, useIonLoading } from '@ionic/react'; interface LoadingProps {} const LoadingExample: React.FC = () => { - const [present] = useIonLoading(); + const [present, dismiss] = useIonLoading(); + /** + * The recommended way of dismissing is to use the `dismiss` property + * on `IonLoading`, but the `dismiss` method returned from `useIonLoading` + * can be used for more complex scenarios. + */ return ( + onClick={() => { present({ - duration: 3000, + message: 'Loading...', + duration: 3000 }) - } + }} > Show Loading diff --git a/core/src/components/loading/usage/react.md b/core/src/components/loading/usage/react.md index b99e0d2951..a9f65cb595 100644 --- a/core/src/components/loading/usage/react.md +++ b/core/src/components/loading/usage/react.md @@ -7,17 +7,23 @@ import { IonButton, IonContent, IonPage, useIonLoading } from '@ionic/react'; interface LoadingProps {} const LoadingExample: React.FC = () => { - const [present] = useIonLoading(); + const [present, dismiss] = useIonLoading(); + /** + * The recommended way of dismissing is to use the `dismiss` property + * on `IonLoading`, but the `dismiss` method returned from `useIonLoading` + * can be used for more complex scenarios. + */ return ( + onClick={() => { present({ - duration: 3000, + message: 'Loading...', + duration: 3000 }) - } + }} > Show Loading From 39315bc857b850347dca386776665e21c9742cad Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 8 Jul 2021 09:38:00 -0400 Subject: [PATCH 03/22] fix(action-sheet): header, subheader, and icon alignment better matches native ios (#23322) resolves #23317 --- core/src/components/action-sheet/action-sheet.ios.scss | 6 ++++++ .../components/action-sheet/action-sheet.ios.vars.scss | 9 ++++++--- core/src/components/action-sheet/action-sheet.tsx | 5 ++++- 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/core/src/components/action-sheet/action-sheet.ios.scss b/core/src/components/action-sheet/action-sheet.ios.scss index 126e346f8e..4bd0540db8 100644 --- a/core/src/components/action-sheet/action-sheet.ios.scss +++ b/core/src/components/action-sheet/action-sheet.ios.scss @@ -110,10 +110,16 @@ text-align: $action-sheet-ios-text-align; } +.action-sheet-title.action-sheet-has-sub-title { + font-weight: $action-sheet-ios-title-with-sub-title-font-weight; +} + .action-sheet-sub-title { @include padding($action-sheet-ios-sub-title-padding-top, $action-sheet-ios-sub-title-padding-end, $action-sheet-ios-sub-title-padding-bottom, $action-sheet-ios-sub-title-padding-start); font-size: $action-sheet-ios-sub-title-font-size; + + font-weight: $action-sheet-ios-title-font-weight; } diff --git a/core/src/components/action-sheet/action-sheet.ios.vars.scss b/core/src/components/action-sheet/action-sheet.ios.vars.scss index 137d19a260..f984d4902e 100644 --- a/core/src/components/action-sheet/action-sheet.ios.vars.scss +++ b/core/src/components/action-sheet/action-sheet.ios.vars.scss @@ -55,6 +55,9 @@ $action-sheet-ios-title-font-size: 13px !default; /// @prop - Font weight of the action sheet title $action-sheet-ios-title-font-weight: 400 !default; +/// @prop - Font weight of the action sheet title when it has a sub title +$action-sheet-ios-title-with-sub-title-font-weight: 600 !default; + /// @prop - Border width of the action sheet title $action-sheet-ios-title-border-width: $hairlines-width !default; @@ -72,10 +75,10 @@ $action-sheet-ios-title-border-color: rgba($text-col // -------------------------------------------------- /// @prop - Font size of the action sheet sub title -$action-sheet-ios-sub-title-font-size: 12px !default; +$action-sheet-ios-sub-title-font-size: 13px !default; /// @prop - Padding top of the action sheet sub title -$action-sheet-ios-sub-title-padding-top: 15px !default; +$action-sheet-ios-sub-title-padding-top: 6px !default; /// @prop - Padding end of the action sheet sub title $action-sheet-ios-sub-title-padding-end: 0 !default; @@ -103,7 +106,7 @@ $action-sheet-ios-button-text-color: ion-color(prim $action-sheet-ios-button-icon-font-size: 28px !default; /// @prop - Padding right of the action sheet button icon -$action-sheet-ios-button-icon-padding-right: .1em !default; +$action-sheet-ios-button-icon-padding-right: .3em !default; /// @prop - Font size of the action sheet button $action-sheet-ios-button-font-size: 20px !default; diff --git a/core/src/components/action-sheet/action-sheet.tsx b/core/src/components/action-sheet/action-sheet.tsx index 84c7d81c0a..47581a62e5 100644 --- a/core/src/components/action-sheet/action-sheet.tsx +++ b/core/src/components/action-sheet/action-sheet.tsx @@ -258,7 +258,10 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
this.groupEl = el}> {this.header !== undefined && -
+
{this.header} {this.subHeader &&
{this.subHeader}
}
From 9021e7cc4b48a69ccc94faa7d2ddcb10a2afa340 Mon Sep 17 00:00:00 2001 From: William Martin Date: Fri, 9 Jul 2021 09:19:48 -0400 Subject: [PATCH 04/22] fix(item): mirror disabled prop to aria attribute (#23544) resolves #23513 --- core/src/components/item/item.tsx | 5 +- core/src/components/item/test/a11y/e2e.ts | 11 ++ core/src/components/item/test/a11y/index.html | 105 ++++++++++++++++++ 3 files changed, 119 insertions(+), 2 deletions(-) create mode 100644 core/src/components/item/test/a11y/e2e.ts create mode 100644 core/src/components/item/test/a11y/index.html diff --git a/core/src/components/item/item.tsx b/core/src/components/item/item.tsx index b9fdaf94db..1ed8aa6bd3 100644 --- a/core/src/components/item/item.tsx +++ b/core/src/components/item/item.tsx @@ -251,7 +251,7 @@ export class Item implements ComponentInterface, AnchorInterface, ButtonInterfac render() { const { detail, detailIcon, download, labelColorStyles, lines, disabled, href, rel, target, routerAnimation, routerDirection } = this; - const childStyles = {}; + const childStyles = {} as any; const mode = getIonMode(this); const clickable = this.isClickable(); const canActivate = this.canActivate(); @@ -273,10 +273,11 @@ export class Item implements ComponentInterface, AnchorInterface, ButtonInterfac this.itemStyles.forEach(value => { Object.assign(childStyles, value); }); + const ariaDisabled = (disabled || childStyles['item-interactive-disabled']) ? 'true' : null; return ( { + const page = await newE2EPage({ + url: '/src/components/item/test/a11y?ionic:_testing=true' + }); + + const results = await new AxePuppeteer(page).analyze(); + expect(results.violations.length).toEqual(0); +}); diff --git a/core/src/components/item/test/a11y/index.html b/core/src/components/item/test/a11y/index.html new file mode 100644 index 0000000000..d59901d3cb --- /dev/null +++ b/core/src/components/item/test/a11y/index.html @@ -0,0 +1,105 @@ + + + + + Item - a11y + + + + + + + + + +
+

Item

+ + + Item with Input + + + + + Item disabled with Input + + + + + Item with Input disabled + + + + + Item with Select + + No Game Console + NES + Nintendo64 + PlayStation + Sega Genesis + Sega Saturn + SNES + + + + + Item disabled with Select + + No Game Console + NES + Nintendo64 + PlayStation + Sega Genesis + Sega Saturn + SNES + + + + + Item with Select disabled + + No Game Console + NES + Nintendo64 + PlayStation + Sega Genesis + Sega Saturn + SNES + + + + + Item with Toggle + + + + + Item disabled with Toggle + + + + + Item with Toggle disabled + + + + + Item with Radio + + + + + Item disabled with Radio + + + + + Item with Radio disabled + + + +
+ + From 3b803ebe024be3dbcf814a30a18df51ce23c8880 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 9 Jul 2021 09:27:11 -0400 Subject: [PATCH 05/22] fix(button): buttons are now disabled during page transitions (#23589) resolves #23588 --- core/src/components/button/button.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/core/src/components/button/button.scss b/core/src/components/button/button.scss index 44b2288767..00eebd84a8 100644 --- a/core/src/components/button/button.scss +++ b/core/src/components/button/button.scss @@ -62,7 +62,6 @@ user-select: none; vertical-align: top; // the better option for most scenarios vertical-align: -webkit-baseline-middle; // the best for those that support it - pointer-events: auto; font-kerning: none; } From fa069424b265891852a07869b6d086a1cb041e93 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 9 Jul 2021 09:29:16 -0400 Subject: [PATCH 06/22] fix(router-outlet): improve reliability of swipe back gesture when quickly swiping back (#23527) resolves #22895 --- .../components/router-outlet/route-outlet.tsx | 49 ++++++++++++++++--- .../cypress/integration/swipe-to-go-back.js | 1 + 2 files changed, 42 insertions(+), 8 deletions(-) diff --git a/core/src/components/router-outlet/route-outlet.tsx b/core/src/components/router-outlet/route-outlet.tsx index bba06a8c63..fe81399802 100644 --- a/core/src/components/router-outlet/route-outlet.tsx +++ b/core/src/components/router-outlet/route-outlet.tsx @@ -19,7 +19,7 @@ export class RouterOutlet implements ComponentInterface, NavOutlet { private waitPromise?: Promise; private gesture?: Gesture; private ani?: Animation; - private animationEnabled = true; + private gestureOrAnimationInProgress = false; @Element() el!: HTMLElement; @@ -61,17 +61,22 @@ export class RouterOutlet implements ComponentInterface, NavOutlet { @Event({ bubbles: false }) ionNavDidChange!: EventEmitter; async connectedCallback() { + const onStart = () => { + this.gestureOrAnimationInProgress = true; + if (this.swipeHandler) { + this.swipeHandler.onStart(); + } + } + this.gesture = (await import('../../utils/gesture/swipe-back')).createSwipeBackGesture( this.el, - () => !!this.swipeHandler && this.swipeHandler.canStart() && this.animationEnabled, - () => this.swipeHandler && this.swipeHandler.onStart(), + () => !this.gestureOrAnimationInProgress && !!this.swipeHandler && this.swipeHandler.canStart(), + () => onStart(), step => this.ani && this.ani.progressStep(step), (shouldComplete, step, dur) => { if (this.ani) { - this.animationEnabled = false; - this.ani.onFinish(() => { - this.animationEnabled = true; + this.gestureOrAnimationInProgress = false; if (this.swipeHandler) { this.swipeHandler.onEnd(shouldComplete); @@ -97,7 +102,8 @@ export class RouterOutlet implements ComponentInterface, NavOutlet { } this.ani.progressEnd(shouldComplete ? 1 : 0, newStepValue, dur); - + } else { + this.gestureOrAnimationInProgress = false; } } ); @@ -191,7 +197,34 @@ export class RouterOutlet implements ComponentInterface, NavOutlet { leavingEl, baseEl: el, progressCallback: (opts.progressAnimation - ? ani => this.ani = ani + ? ani => { + /** + * Because this progress callback is called asynchronously + * it is possible for the gesture to start and end before + * the animation is ever set. In that scenario, we should + * immediately call progressEnd so that the transition promise + * resolves and the gesture does not get locked up. + */ + if (ani !== undefined && !this.gestureOrAnimationInProgress) { + this.gestureOrAnimationInProgress = true; + ani.onFinish(() => { + this.gestureOrAnimationInProgress = false; + if (this.swipeHandler) { + this.swipeHandler.onEnd(false); + } + }, { oneTimeCallback: true }); + + /** + * Playing animation to beginning + * with a duration of 0 prevents + * any flickering when the animation + * is later cleaned up. + */ + ani.progressEnd(0, 0, 0); + } else { + this.ani = ani; + } + } : undefined ), ...opts, diff --git a/packages/react-router/test-app/cypress/integration/swipe-to-go-back.js b/packages/react-router/test-app/cypress/integration/swipe-to-go-back.js index a7e721ccd2..973ec70da4 100644 --- a/packages/react-router/test-app/cypress/integration/swipe-to-go-back.js +++ b/packages/react-router/test-app/cypress/integration/swipe-to-go-back.js @@ -10,6 +10,7 @@ describe('Swipe To Go Back', () => { cy.ionPageVisible('main'); cy.ionNav('ion-item', 'Details'); cy.ionPageVisible('details'); + cy.ionPageHidden('main'); cy.ionSwipeToGoBack(true); cy.ionPageVisible('main'); }); From c08345df2ee3175f3f0d11ff877c7b6f1a102321 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Mon, 12 Jul 2021 08:52:03 -0400 Subject: [PATCH 07/22] fix(menu-button): custom aria-label can now be set (#23608) resolves #23604 --- .../components/menu-button/menu-button.tsx | 13 ++++++++++-- .../components/menu-button/test/a11y/e2e.ts | 11 ++++++++++ .../menu-button/test/a11y/index.html | 21 +++++++++++++++++++ .../menu-button/test/basic/index.html | 1 + 4 files changed, 44 insertions(+), 2 deletions(-) create mode 100644 core/src/components/menu-button/test/a11y/e2e.ts create mode 100644 core/src/components/menu-button/test/a11y/index.html diff --git a/core/src/components/menu-button/menu-button.tsx b/core/src/components/menu-button/menu-button.tsx index fda94193d9..5e2af949f9 100644 --- a/core/src/components/menu-button/menu-button.tsx +++ b/core/src/components/menu-button/menu-button.tsx @@ -4,6 +4,7 @@ import { config } from '../../global/config'; import { getIonMode } from '../../global/ionic-global'; import { Color } from '../../interface'; import { ButtonInterface } from '../../utils/element-interface'; +import { inheritAttributes } from '../../utils/helpers'; import { menuController } from '../../utils/menu-controller'; import { createColorClasses, hostContext } from '../../utils/theme'; import { updateVisibility } from '../menu-toggle/menu-toggle-util'; @@ -23,6 +24,8 @@ import { updateVisibility } from '../menu-toggle/menu-toggle-util'; shadow: true }) export class MenuButton implements ComponentInterface, ButtonInterface { + private inheritedAttributes: { [k: string]: any } = {}; + @Element() el!: HTMLIonSegmentElement; @State() visible = false; @@ -54,6 +57,10 @@ export class MenuButton implements ComponentInterface, ButtonInterface { */ @Prop() type: 'submit' | 'reset' | 'button' = 'button'; + componentWillLoad() { + this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']); + } + componentDidLoad() { this.visibilityChanged(); } @@ -69,7 +76,7 @@ export class MenuButton implements ComponentInterface, ButtonInterface { } render() { - const { color, disabled } = this; + const { color, disabled, inheritedAttributes } = this; const mode = getIonMode(this); const menuIcon = config.get('menuIcon', mode === 'ios' ? 'menu-outline' : 'menu-sharp'); const hidden = this.autoHide && !this.visible; @@ -78,6 +85,8 @@ export class MenuButton implements ComponentInterface, ButtonInterface { type: this.type }; + const ariaLabel = inheritedAttributes['aria-label'] || 'menu'; + return ( diff --git a/core/src/components/menu-button/test/a11y/e2e.ts b/core/src/components/menu-button/test/a11y/e2e.ts new file mode 100644 index 0000000000..d38ad0fa36 --- /dev/null +++ b/core/src/components/menu-button/test/a11y/e2e.ts @@ -0,0 +1,11 @@ +import { newE2EPage } from '@stencil/core/testing'; +import { AxePuppeteer } from '@axe-core/puppeteer'; + +test('menu-button: axe', async () => { + const page = await newE2EPage({ + url: '/src/components/menu-button/test/a11y?ionic:_testing=true' + }); + + const results = await new AxePuppeteer(page).analyze(); + expect(results.violations.length).toEqual(0); +}); diff --git a/core/src/components/menu-button/test/a11y/index.html b/core/src/components/menu-button/test/a11y/index.html new file mode 100644 index 0000000000..f0b0c6d23f --- /dev/null +++ b/core/src/components/menu-button/test/a11y/index.html @@ -0,0 +1,21 @@ + + + + + Menu Button - a11y + + + + + + + + +
+

Menu Button

+ + +
+ + diff --git a/core/src/components/menu-button/test/basic/index.html b/core/src/components/menu-button/test/basic/index.html index 409122163e..00bc406db6 100644 --- a/core/src/components/menu-button/test/basic/index.html +++ b/core/src/components/menu-button/test/basic/index.html @@ -29,6 +29,7 @@ +

Colors

From 4b56744d7fb22af6d3e7204e787a7425cfacaee9 Mon Sep 17 00:00:00 2001 From: jcesarmobile Date: Mon, 12 Jul 2021 20:39:18 +0200 Subject: [PATCH 08/22] docs(react): install @ionic/cli instead of ionic (#23610) --- packages/react/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/README.md b/packages/react/README.md index fec4540857..9ec88af101 100644 --- a/packages/react/README.md +++ b/packages/react/README.md @@ -2,7 +2,7 @@ These are React specific building blocks on top of [@ionic/core](https://www.npmjs.com/package/@ionic/core) components/services. -To get started, install the Ionic CLI by running `npm i -g ionic`. Then, start a new Ionic React Project by running `ionic start myapp --type=react`. +To get started, install the Ionic CLI by running `npm i -g @ionic/cli`. Then, start a new Ionic React Project by running `ionic start myapp --type=react`. # Current Status of Components From 7315e0157b917d2e3586c64f8082026827812943 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Tue, 13 Jul 2021 14:03:58 -0400 Subject: [PATCH 09/22] chore(): switch to using disallow terminology (#23618) --- core/.stylelintrc.yml | 2 +- core/src/components/content/content.scss | 12 ++++++------ .../components/item-options/item-options.scss | 12 ++++++------ .../components/item-sliding/item-sliding.scss | 4 ++-- core/src/components/menu/menu.scss | 4 ++-- .../components/progress-bar/progress-bar.scss | 18 +++++++++--------- core/src/components/range/range.md.scss | 4 ++-- core/src/components/range/range.scss | 6 +++--- .../skeleton-text/skeleton-text.scss | 4 ++-- .../virtual-scroll/virtual-scroll.scss | 2 +- 10 files changed, 34 insertions(+), 34 deletions(-) diff --git a/core/.stylelintrc.yml b/core/.stylelintrc.yml index 6cd3fda7b9..70a8b0c17b 100644 --- a/core/.stylelintrc.yml +++ b/core/.stylelintrc.yml @@ -254,7 +254,7 @@ rules: - visibility - z-index - property-blacklist: + property-disallowed-list: - background-position - right - left diff --git a/core/src/components/content/content.scss b/core/src/components/content/content.scss index 4bd6f5e3f5..f341888456 100644 --- a/core/src/components/content/content.scss +++ b/core/src/components/content/content.scss @@ -150,9 +150,9 @@ display: none; position: absolute; - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ left: -100%; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ width: 100%; height: 100vh; @@ -165,9 +165,9 @@ .transition-cover { position: absolute; - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: 0; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ width: 100%; height: 100%; @@ -181,9 +181,9 @@ display: block; position: absolute; - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: 0; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ width: 10px; height: 100%; diff --git a/core/src/components/item-options/item-options.scss b/core/src/components/item-options/item-options.scss index 5e64d23bf9..50774c6856 100644 --- a/core/src/components/item-options/item-options.scss +++ b/core/src/components/item-options/item-options.scss @@ -5,10 +5,10 @@ ion-item-options { @include multi-dir() { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ top: 0; right: 0; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ } @include ltr() { @@ -19,10 +19,10 @@ ion-item-options { justify-content: flex-start; &:not(.item-options-end) { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: auto; left: 0; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ justify-content: flex-end; } @@ -41,10 +41,10 @@ ion-item-options { .item-options-start { @include multi-dir() { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: auto; left: 0; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ } @include ltr() { diff --git a/core/src/components/item-sliding/item-sliding.scss b/core/src/components/item-sliding/item-sliding.scss index 0ff0ae2384..0e2cc06795 100644 --- a/core/src/components/item-sliding/item-sliding.scss +++ b/core/src/components/item-sliding/item-sliding.scss @@ -32,7 +32,7 @@ ion-item-sliding .item { .item-sliding-active-swipe-end .item-options-end .item-option-expandable { @include multi-dir() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ padding-left: 100%; } @@ -50,7 +50,7 @@ ion-item-sliding .item { .item-sliding-active-swipe-start .item-options-start .item-option-expandable { @include multi-dir() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ padding-right: 100%; } diff --git a/core/src/components/menu/menu.scss b/core/src/components/menu/menu.scss index c02884a5a6..890c424c2e 100644 --- a/core/src/components/menu/menu.scss +++ b/core/src/components/menu/menu.scss @@ -63,7 +63,7 @@ --ion-safe-area-right: 0px; @include multi-dir() { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: auto; left: 0; } @@ -75,7 +75,7 @@ @include multi-dir() { right: 0; left: auto; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ } } diff --git a/core/src/components/progress-bar/progress-bar.scss b/core/src/components/progress-bar/progress-bar.scss index d9bc8dfe0c..0752c79d17 100644 --- a/core/src/components/progress-bar/progress-bar.scss +++ b/core/src/components/progress-bar/progress-bar.scss @@ -46,10 +46,10 @@ // Extend a bit to overflow. The size of animated distance. .buffer-circles { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ right: -10px; left: -10px; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ } // Determinate progress bar @@ -58,7 +58,7 @@ .progress, .progress-buffer-bar, .buffer-circles-container { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ transform-origin: left top; transition: transform 150ms linear; @@ -88,12 +88,12 @@ // -------------------------------------------------- .indeterminate-bar-primary { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ top: 0; right: 0; bottom: 0; left: -145.166611%; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ animation: primary-indeterminate-translate 2s infinite linear; @@ -104,12 +104,12 @@ } .indeterminate-bar-secondary { - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ top: 0; right: 0; bottom: 0; left: -54.888891%; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ animation: secondary-indeterminate-translate 2s infinite linear; @@ -125,11 +125,11 @@ .buffer-circles { background-image: radial-gradient(ellipse at center, var(--buffer-background) 0%, var(--buffer-background) 30%, transparent 30%); - /* stylelint-disable property-blacklist */ + /* stylelint-disable property-disallowed-list */ background-repeat: repeat-x; background-position: 5px center; background-size: 10px 10px; - /* stylelint-enable property-blacklist */ + /* stylelint-enable property-disallowed-list */ z-index: 0; animation: buffering 450ms infinite linear; diff --git a/core/src/components/range/range.md.scss b/core/src/components/range/range.md.scss index 52aa9b23aa..987f286e90 100644 --- a/core/src/components/range/range.md.scss +++ b/core/src/components/range/range.md.scss @@ -105,12 +105,12 @@ @include margin-horizontal(-13px, null); @include multi-dir() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ border-radius: 50% 50% 50% 0; } @include rtl() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ left: unset; } diff --git a/core/src/components/range/range.scss b/core/src/components/range/range.scss index 89e6ab6cbb..10c92149b1 100644 --- a/core/src/components/range/range.scss +++ b/core/src/components/range/range.scss @@ -82,7 +82,7 @@ ); @include rtl() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ left: unset; } @@ -104,7 +104,7 @@ @include position(calc((var(--height) - var(--bar-height)) / 2), null, null, 0); @include rtl() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ left: unset; } @@ -127,7 +127,7 @@ ); @include rtl() { - /* stylelint-disable-next-line property-blacklist */ + /* stylelint-disable-next-line property-disallowed-list */ left: unset; } diff --git a/core/src/components/skeleton-text/skeleton-text.scss b/core/src/components/skeleton-text/skeleton-text.scss index 0f7a69c0f1..455fe41ade 100644 --- a/core/src/components/skeleton-text/skeleton-text.scss +++ b/core/src/components/skeleton-text/skeleton-text.scss @@ -61,7 +61,7 @@ span { animation-timing-function: linear; } -/* stylelint-disable property-blacklist */ +/* stylelint-disable property-disallowed-list */ @keyframes shimmer { 0% { background-position: -400px 0; @@ -71,4 +71,4 @@ span { background-position: 400px 0; } } -/* stylelint-enable property-blacklist */ +/* stylelint-enable property-disallowed-list */ diff --git a/core/src/components/virtual-scroll/virtual-scroll.scss b/core/src/components/virtual-scroll/virtual-scroll.scss index df56ac21e3..00ff1c872c 100644 --- a/core/src/components/virtual-scroll/virtual-scroll.scss +++ b/core/src/components/virtual-scroll/virtual-scroll.scss @@ -16,7 +16,7 @@ ion-virtual-scroll > .virtual-loading { } ion-virtual-scroll > .virtual-item { - /* stylelint-disable declaration-no-important, property-blacklist */ + /* stylelint-disable declaration-no-important, property-disallowed-list */ position: absolute !important; top: 0 !important; From 3cebcb08833d891bbbb829d344e70ecd12c6d4b8 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 08:59:31 -0400 Subject: [PATCH 10/22] chore(): warn if developer forgot to use ionpage component in view (#23625) --- packages/vue/src/components/IonRouterOutlet.ts | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/packages/vue/src/components/IonRouterOutlet.ts b/packages/vue/src/components/IonRouterOutlet.ts index 4c6be263f0..98d1f24d51 100644 --- a/packages/vue/src/components/IonRouterOutlet.ts +++ b/packages/vue/src/components/IonRouterOutlet.ts @@ -323,6 +323,17 @@ export const IonRouterOutlet = defineComponent({ if (!enteringViewItem) { enteringViewItem = viewStacks.createViewItem(id, matchedRouteRef.value.components.default, matchedRouteRef.value, currentRoute); viewStacks.add(enteringViewItem); + + /** + * All views that can be transitioned to must have + * an `` element for transitions and lifecycle + * methods to work properly. + */ + if (enteringViewItem.vueComponent?.components?.IonPage === undefined) { + console.warn(`[@ionic/vue Warning]: The view you are trying to render for path ${currentRoute.pathname} does not have the required component. Transitions and lifecycle methods may not work as expected. + +See https://ionicframework.com/docs/vue/navigation#ionpage for more information.`); + } } if (!enteringViewItem.mount) { From 174b7de741beb71ce1c52a6e807ece6c252267cc Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 10:18:17 -0400 Subject: [PATCH 11/22] docs(vue): add card style modal example (#23628) --- core/src/components/modal/readme.md | 42 ++++++++++++++++++++++++ core/src/components/modal/usage/react.md | 1 + core/src/components/modal/usage/vue.md | 41 +++++++++++++++++++++++ 3 files changed, 84 insertions(+) diff --git a/core/src/components/modal/readme.md b/core/src/components/modal/readme.md index d74c7a7d8e..e361e80af7 100644 --- a/core/src/components/modal/readme.md +++ b/core/src/components/modal/readme.md @@ -489,6 +489,7 @@ In most scenarios, setting a ref on `IonRouterOutlet` and passing that ref's `cu isOpen={show2ndModal} cssClass='my-custom-class' presentingElement={firstModalRef.current} + swipeToClose={true} onDidDismiss={() => setShow2ndModal(false)}>

This is more modal content

setShow2ndModal(false)}>Close Modal @@ -751,6 +752,47 @@ export default defineComponent({ > If you need a wrapper element inside of your modal component, we recommend using an `` so that the component dimensions are still computed properly. +### Swipeable Modals + +Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. + +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + +```html + + + +``` + ## Properties diff --git a/core/src/components/modal/usage/react.md b/core/src/components/modal/usage/react.md index 1aecc080c8..702e17f681 100644 --- a/core/src/components/modal/usage/react.md +++ b/core/src/components/modal/usage/react.md @@ -147,6 +147,7 @@ In most scenarios, setting a ref on `IonRouterOutlet` and passing that ref's `cu isOpen={show2ndModal} cssClass='my-custom-class' presentingElement={firstModalRef.current} + swipeToClose={true} onDidDismiss={() => setShow2ndModal(false)}>

This is more modal content

setShow2ndModal(false)}>Close Modal diff --git a/core/src/components/modal/usage/vue.md b/core/src/components/modal/usage/vue.md index 47afb4083d..86d06cc394 100644 --- a/core/src/components/modal/usage/vue.md +++ b/core/src/components/modal/usage/vue.md @@ -93,3 +93,44 @@ export default defineComponent({ ``` > If you need a wrapper element inside of your modal component, we recommend using an `` so that the component dimensions are still computed properly. + +### Swipeable Modals + +Modals in iOS mode have the ability to be presented in a card-style and swiped to close. The card-style presentation and swipe to close gesture are not mutually exclusive, meaning you can pick and choose which features you want to use. For example, you can have a card-style modal that cannot be swiped or a full sized modal that can be swiped. + +> Card style modals when running on iPhone-sized devices do not have backdrops. As a result, the `--backdrop-opacity` variable will not have any effect. + +```html + + + +``` \ No newline at end of file From c940bd18d247e3bc38c7f0924887b73af0b476e0 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 14:49:30 -0400 Subject: [PATCH 12/22] chore(): use new github form template for bug reports (#23629) --- .github/ISSUE_TEMPLATE/bug_report.md | 60 -------------------------- .github/ISSUE_TEMPLATE/bug_report.yaml | 56 ++++++++++++++++++++++++ 2 files changed, 56 insertions(+), 60 deletions(-) delete mode 100644 .github/ISSUE_TEMPLATE/bug_report.md create mode 100644 .github/ISSUE_TEMPLATE/bug_report.yaml diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md deleted file mode 100644 index b1c6055fea..0000000000 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ /dev/null @@ -1,60 +0,0 @@ ---- -name: Bug Report -about: Create a report to help us improve -title: 'bug: ' -labels: '' -assignees: '' ---- - - - - - - - - - -# Bug Report - -**Ionic version:** - - -[ ] **4.x** -[ ] **5.x** -[ ] **6.x** - -**Current behavior:** - - -**Expected behavior:** - - -**Steps to reproduce:** - - -**Related code:** - - - -``` -insert short code snippets here -``` - -**Other information:** - - -**Ionic info:** - - -``` -insert the output from ionic info here -``` diff --git a/.github/ISSUE_TEMPLATE/bug_report.yaml b/.github/ISSUE_TEMPLATE/bug_report.yaml new file mode 100644 index 0000000000..e65f3823b6 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug_report.yaml @@ -0,0 +1,56 @@ +name: Bug Report +about: Create a report to help us improve Ionic Framework +title: 'bug: ' +body: + - type: checkboxes + attributes: + label: Prequisites + description: Please ensure you have completed all of the following. + options: + - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). + required: true + - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). + required: true + - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. + required: true + - type: checkboxes + attributes: + label: Ionic Framework Version + description: Please select which versions of Ionic Framework this issue impacts. For Ionic Framework 1.x issues, please use https://github.com/ionic-team/ionic-v1. For Ionic Framework 2.x and 3.x issues, please use https://github.com/ionic-team/ionic-v3. + options: + - label: v4.x + - label: v5.x + - label: v6.x + - type: textarea + attributes: + label: Current Behavior + description: A clear description of what the bug is and how it manifests. + validations: + required: true + - type: textarea + attributes: + label: Expected Behavior + description: A clear description of what you expected to happen. + validations: + required: true + - type: textarea + attributes: + label: Steps to Reproduce + description: Please explain the steps required to duplicate this issue. + validations: + required: true + - type: input + attributes: + label: Code Reproduction URL + description: Please reproduce this issue in a blank Ionic Framework starter application and provide a link to the repo. Try out our [Getting Started Wizard](https://ionicframework.com/start#basics) to quickly spin up an Ionic Framework starter app. This is the best way to ensure this issue is triaged quickly. Issues without a code reproduction may be closed if the Ionic Team cannot reproduce the issue you are reporting. + placeholder: https://github.com/... + - type: textarea + attributes: + label: Ionic Info + description: Please run `ionic info` from within your Ionic Framework project directory and paste the output below. + validations: + requred: true + - type: textarea + attributes: + label: Additional Information + description: List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to fix, Stack Overflow links, forum links, etc. From d10d9f9f741ac338aa1a76b991545fc3b61fc993 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 15:18:49 -0400 Subject: [PATCH 13/22] chore(): fix bug issue name (#23630) --- .github/ISSUE_TEMPLATE/{bug_report.yaml => bug_report.yml} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename .github/ISSUE_TEMPLATE/{bug_report.yaml => bug_report.yml} (100%) diff --git a/.github/ISSUE_TEMPLATE/bug_report.yaml b/.github/ISSUE_TEMPLATE/bug_report.yml similarity index 100% rename from .github/ISSUE_TEMPLATE/bug_report.yaml rename to .github/ISSUE_TEMPLATE/bug_report.yml From e35386a52df75c6a1f83a516347ac7fa0798e128 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 15:50:34 -0400 Subject: [PATCH 14/22] chore(): fix yaml errors (#23632) --- .github/ISSUE_TEMPLATE/bug_report.yml | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml index e65f3823b6..07773cf432 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.yml +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -3,16 +3,16 @@ about: Create a report to help us improve Ionic Framework title: 'bug: ' body: - type: checkboxes - attributes: - label: Prequisites - description: Please ensure you have completed all of the following. - options: - - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). - required: true - - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). - required: true - - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. - required: true + attributes: + label: Prequisites + description: Please ensure you have completed all of the following. + options: + - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). + required: true + - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). + required: true + - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. + required: true - type: checkboxes attributes: label: Ionic Framework Version From d2ca304c12f356a299645f0da52eec7247fc2e96 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 16:26:48 -0400 Subject: [PATCH 15/22] chore(): use supported form keys (#23633) --- .github/ISSUE_TEMPLATE/bug_report.yml | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml index 07773cf432..74d46cd7c1 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.yml +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -1,26 +1,26 @@ name: Bug Report -about: Create a report to help us improve Ionic Framework +description: Create a report to help us improve Ionic Framework title: 'bug: ' body: - type: checkboxes attributes: label: Prequisites description: Please ensure you have completed all of the following. - options: - - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). - required: true - - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). - required: true - - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. - required: true + options: + - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). + required: true + - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). + required: true + - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. + required: true - type: checkboxes attributes: label: Ionic Framework Version description: Please select which versions of Ionic Framework this issue impacts. For Ionic Framework 1.x issues, please use https://github.com/ionic-team/ionic-v1. For Ionic Framework 2.x and 3.x issues, please use https://github.com/ionic-team/ionic-v3. - options: - - label: v4.x - - label: v5.x - - label: v6.x + options: + - label: v4.x + - label: v5.x + - label: v6.x - type: textarea attributes: label: Current Behavior From 6d94a27fb964bfc8feea69c3e65cf301eee0a559 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 18:54:18 -0400 Subject: [PATCH 16/22] chore(): convert remaining issue templates to forms (#23634) --- .github/ISSUE_TEMPLATE/cli.md | 11 ------ .github/ISSUE_TEMPLATE/cli.yml | 7 ++++ .github/ISSUE_TEMPLATE/documentation.md | 11 ------ .github/ISSUE_TEMPLATE/documentation.yml | 7 ++++ .github/ISSUE_TEMPLATE/feature_request.md | 39 ------------------- .github/ISSUE_TEMPLATE/feature_request.yml | 43 +++++++++++++++++++++ .github/ISSUE_TEMPLATE/support_question.md | 11 ------ .github/ISSUE_TEMPLATE/support_question.yml | 7 ++++ 8 files changed, 64 insertions(+), 72 deletions(-) delete mode 100644 .github/ISSUE_TEMPLATE/cli.md create mode 100644 .github/ISSUE_TEMPLATE/cli.yml delete mode 100644 .github/ISSUE_TEMPLATE/documentation.md create mode 100644 .github/ISSUE_TEMPLATE/documentation.yml delete mode 100644 .github/ISSUE_TEMPLATE/feature_request.md create mode 100644 .github/ISSUE_TEMPLATE/feature_request.yml delete mode 100644 .github/ISSUE_TEMPLATE/support_question.md create mode 100644 .github/ISSUE_TEMPLATE/support_question.yml diff --git a/.github/ISSUE_TEMPLATE/cli.md b/.github/ISSUE_TEMPLATE/cli.md deleted file mode 100644 index 213bc40092..0000000000 --- a/.github/ISSUE_TEMPLATE/cli.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -name: CLI -about: Suggest an improvement for the CLI -title: '' -labels: 'ionitron: cli' -assignees: '' ---- - -# CLI - -Please do not submit bug reports or feature requests related to the Ionic CLI. Instead, please submit an issue to the [Ionic CLI Repository](https://github.com/ionic-team/ionic-cli/issues/new/choose). diff --git a/.github/ISSUE_TEMPLATE/cli.yml b/.github/ISSUE_TEMPLATE/cli.yml new file mode 100644 index 0000000000..9eb9d8b88f --- /dev/null +++ b/.github/ISSUE_TEMPLATE/cli.yml @@ -0,0 +1,7 @@ +name: CLI +about: Suggest an idea for the Ionic CLI +title: '' +labels: 'ionitron: cli' +body: + - type: markdown + value: "Please do not submit bug reports or feature requests related to the Ionic CLI. Instead, please submit an issue to the [Ionic CLI Repository](https://github.com/ionic-team/ionic-cli/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/documentation.md b/.github/ISSUE_TEMPLATE/documentation.md deleted file mode 100644 index 255df15c4c..0000000000 --- a/.github/ISSUE_TEMPLATE/documentation.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -name: Documentation -about: Suggest an improvement for the documentation of this project -title: '' -labels: 'ionitron: docs' -assignees: '' ---- - -# Documentation - -Please do not submit issues on how to improve or fix the documentation. Instead, please submit an issue to the [Ionic Docs Repository](https://github.com/ionic-team/ionic-docs/issues/new/choose). diff --git a/.github/ISSUE_TEMPLATE/documentation.yml b/.github/ISSUE_TEMPLATE/documentation.yml new file mode 100644 index 0000000000..1e3dbd85a9 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/documentation.yml @@ -0,0 +1,7 @@ +name: Documentation +about: Suggest an improvement for the Ionic Framework documentation +title: '' +labels: 'ionitron: docs' +body: + - type: markdown + value: "Please do not submit issues on how to improve or fix the documentation. Instead, please submit an issue to the [Ionic Docs Repository](https://github.com/ionic-team/ionic-docs/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md deleted file mode 100644 index b798af2804..0000000000 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ /dev/null @@ -1,39 +0,0 @@ ---- -name: Feature Request -about: Suggest an idea for this project -title: 'feat: ' -labels: '' -assignees: '' ---- - - - - - - - - - -# Feature Request - -**Ionic version:** - - -[ ] **4.x** -[ ] **5.x** -[ ] **6.x** - -**Describe the Feature Request** - - -**Describe Preferred Solution** - - -**Describe Alternatives** - - -**Related Code** - - -**Additional Context** - diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml new file mode 100644 index 0000000000..2a757a5337 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request.yml @@ -0,0 +1,43 @@ +name: Feature Request +about: Suggest an idea for Ionic Framework +title: 'feat: ' +body: + - type: checkboxes + attributes: + label: Prequisites + description: Please ensure you have completed all of the following. + options: + - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). + required: true + - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). + required: true + - label: I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already include this feature request, without success. + required: true + - type: textarea + attributes: + label: Describe the Feature Request + description: A clear and concise description of what the feature does. + validations: + required: true + - type: textarea + attributes: + label: Describe the Use Case + description: A clear and concise use case for what problem this feature would solve. + validations: + required: true + - type: textarea + attributes: + label: Describe Preferred Solution + description: A clear and concise description of what you how you want this feature to be added to Ionic Framework. + - type: textarea + attributes: + label: Describe Alternatives + description: A clear and concise description of any alternative solutions or features you have considered. + - type: textarea + attributes: + label: Related Code + description: If you are able to illustrate the feature request with an example, please provide a sample Ionic Framework application. Try out our [Getting Started Wizard](https://ionicframework.com/start#basics) to quickly spin up an Ionic Framework starter app. + - type: textarea + attributes: + label: Additional Information + description: List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to implement, Stack Overflow links, forum links, etc. diff --git a/.github/ISSUE_TEMPLATE/support_question.md b/.github/ISSUE_TEMPLATE/support_question.md deleted file mode 100644 index c72195f886..0000000000 --- a/.github/ISSUE_TEMPLATE/support_question.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -name: Support Question -about: Question on how to use this project -title: 'support: ' -labels: 'ionitron: support' -assignees: '' ---- - -# Support Question - -Please do not submit support requests or "How to" questions here. Instead, please use the Ionic Forum: https://forum.ionicframework.com/ diff --git a/.github/ISSUE_TEMPLATE/support_question.yml b/.github/ISSUE_TEMPLATE/support_question.yml new file mode 100644 index 0000000000..b87fd90458 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/support_question.yml @@ -0,0 +1,7 @@ +name: Support Question +about: Question on how to use Ionic Framework +title: 'support: ' +labels: 'ionitron: support' +body: + - type: markdown + value: "Please do not submit support requests or "How to" questions here. Instead, please use the Ionic Forum: https://forum.ionicframework.com/." From 3134e0afcda5d96c4d9800631acf442045f99aac Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Wed, 14 Jul 2021 19:31:04 -0400 Subject: [PATCH 17/22] chore(): fix form template typos (#23635) --- .github/ISSUE_TEMPLATE/bug_report.yml | 2 +- .github/ISSUE_TEMPLATE/cli.yml | 6 +++--- .github/ISSUE_TEMPLATE/documentation.yml | 6 +++--- .github/ISSUE_TEMPLATE/feature_request.yml | 16 ++++++++-------- .github/ISSUE_TEMPLATE/support_question.yml | 5 +++-- 5 files changed, 18 insertions(+), 17 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml index 74d46cd7c1..ff82042346 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.yml +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -11,7 +11,7 @@ body: required: true - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). required: true - - label: I have search for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. + - label: I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success. required: true - type: checkboxes attributes: diff --git a/.github/ISSUE_TEMPLATE/cli.yml b/.github/ISSUE_TEMPLATE/cli.yml index 9eb9d8b88f..9e18d9aba6 100644 --- a/.github/ISSUE_TEMPLATE/cli.yml +++ b/.github/ISSUE_TEMPLATE/cli.yml @@ -1,7 +1,7 @@ name: CLI -about: Suggest an idea for the Ionic CLI -title: '' +description: Suggest an idea for the Ionic CLI labels: 'ionitron: cli' body: - type: markdown - value: "Please do not submit bug reports or feature requests related to the Ionic CLI. Instead, please submit an issue to the [Ionic CLI Repository](https://github.com/ionic-team/ionic-cli/issues/new/choose)." + attributes: + value: "Please do not submit bug reports or feature requests related to the Ionic CLI. Instead, please submit an issue to the [Ionic CLI Repository](https://github.com/ionic-team/ionic-cli/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/documentation.yml b/.github/ISSUE_TEMPLATE/documentation.yml index 1e3dbd85a9..e0c9e681a3 100644 --- a/.github/ISSUE_TEMPLATE/documentation.yml +++ b/.github/ISSUE_TEMPLATE/documentation.yml @@ -1,7 +1,7 @@ name: Documentation -about: Suggest an improvement for the Ionic Framework documentation -title: '' +description: Suggest an improvement for the Ionic Framework documentation labels: 'ionitron: docs' body: - type: markdown - value: "Please do not submit issues on how to improve or fix the documentation. Instead, please submit an issue to the [Ionic Docs Repository](https://github.com/ionic-team/ionic-docs/issues/new/choose)." + attributes: + value: "Please do not submit issues on how to improve or fix the documentation. Instead, please submit an issue to the [Ionic Docs Repository](https://github.com/ionic-team/ionic-docs/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml index 2a757a5337..ba83f0668c 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.yml +++ b/.github/ISSUE_TEMPLATE/feature_request.yml @@ -1,18 +1,18 @@ name: Feature Request -about: Suggest an idea for Ionic Framework +description: Suggest an idea for Ionic Framework title: 'feat: ' body: - type: checkboxes attributes: label: Prequisites description: Please ensure you have completed all of the following. - options: - - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). - required: true - - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). - required: true - - label: I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already include this feature request, without success. - required: true + options: + - label: I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue). + required: true + - label: I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct). + required: true + - label: I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already include this feature request, without success. + required: true - type: textarea attributes: label: Describe the Feature Request diff --git a/.github/ISSUE_TEMPLATE/support_question.yml b/.github/ISSUE_TEMPLATE/support_question.yml index b87fd90458..f31830a04f 100644 --- a/.github/ISSUE_TEMPLATE/support_question.yml +++ b/.github/ISSUE_TEMPLATE/support_question.yml @@ -1,7 +1,8 @@ name: Support Question -about: Question on how to use Ionic Framework +description: Question on how to use Ionic Framework title: 'support: ' labels: 'ionitron: support' body: - type: markdown - value: "Please do not submit support requests or "How to" questions here. Instead, please use the Ionic Forum: https://forum.ionicframework.com/." + attributes: + value: "Please do not submit support requests or "How to" questions here. Instead, please use the Ionic Forum: https://forum.ionicframework.com/." From 773bbcb211d3cf0caf38c25b44e666d98ddfafe5 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 15 Jul 2021 08:50:50 -0400 Subject: [PATCH 18/22] fix(overlays): overlay interfaces are now exported from framework packages and documented (#23619) resolves #22790 --- angular/src/index.ts | 42 ++++++++++++- core/src/components/action-sheet/readme.md | 33 ++++++++++ core/src/components/alert/readme.md | 70 ++++++++++++++++++++++ core/src/components/loading/readme.md | 22 +++++++ core/src/components/modal/readme.md | 24 ++++++++ core/src/components/picker/readme.md | 64 ++++++++++++++++++++ core/src/components/popover/readme.md | 23 +++++++ core/src/components/toast/readme.md | 37 ++++++++++++ packages/react/src/components/index.ts | 28 ++++++++- packages/vue/src/index.ts | 27 ++++++++- 10 files changed, 366 insertions(+), 4 deletions(-) diff --git a/angular/src/index.ts b/angular/src/index.ts index fa4cb21abe..a77a85614a 100644 --- a/angular/src/index.ts +++ b/angular/src/index.ts @@ -46,4 +46,44 @@ export { IonicModule } from './ionic-module'; export { IonicSafeString, getPlatforms, isPlatform, createAnimation } from '@ionic/core'; // CORE TYPES -export { Animation, AnimationBuilder, AnimationCallbackOptions, AnimationDirection, AnimationFill, AnimationKeyFrames, AnimationLifecycle, Gesture, GestureConfig, GestureDetail, mdTransitionAnimation, iosTransitionAnimation, NavComponentWithProps } from '@ionic/core'; +export { + Animation, + AnimationBuilder, + AnimationCallbackOptions, + AnimationDirection, + AnimationFill, + AnimationKeyFrames, + AnimationLifecycle, + Gesture, + GestureConfig, + GestureDetail, + mdTransitionAnimation, + iosTransitionAnimation, + NavComponentWithProps, + + SpinnerTypes, + + ActionSheetOptions, + ActionSheetButton, + + AlertOptions, + AlertInput, + AlertTextareaAttributes, + AlertInputAttributes, + AlertButton, + + LoadingOptions, + + ModalOptions, + + PickerOptions, + PickerButton, + PickerColumn, + PickerColumnOption, + + PopoverOptions, + + ToastOptions, + ToastButton + +} from '@ionic/core'; diff --git a/core/src/components/action-sheet/readme.md b/core/src/components/action-sheet/readme.md index 775696c94a..d40f2d0ea2 100644 --- a/core/src/components/action-sheet/readme.md +++ b/core/src/components/action-sheet/readme.md @@ -34,6 +34,39 @@ Any of the defined [CSS Custom Properties](#css-custom-properties) can be used t > If you are building an Ionic Angular app, the styles need to be added to a global stylesheet file. Read [Style Placement](#style-placement) in the Angular section below for more information. +## Interfaces + +### ActionSheetButton + +```typescript +interface ActionSheetButton { + text?: string; + role?: 'cancel' | 'destructive' | 'selected' | string; + icon?: string; + cssClass?: string | string[]; + handler?: () => boolean | void | Promise; +} +``` + +### ActionSheetOptions + +```typescript +interface ActionSheetOptions { + header?: string; + subHeader?: string; + cssClass?: string | string[]; + buttons: (ActionSheetButton | string)[]; + backdropDismiss?: boolean; + translucent?: boolean; + animated?: boolean; + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` diff --git a/core/src/components/alert/readme.md b/core/src/components/alert/readme.md index d5904bbc15..ab4dbc9a79 100644 --- a/core/src/components/alert/readme.md +++ b/core/src/components/alert/readme.md @@ -41,6 +41,76 @@ Any of the defined [CSS Custom Properties](#css-custom-properties) can be used t > If you are building an Ionic Angular app, the styles need to be added to a global stylesheet file. Read [Style Placement](#style-placement) in the Angular section below for more information. +## Interfaces + +### AlertButton + +```typescript +interface AlertButton { + text: string; + role?: string; + cssClass?: string | string[]; + handler?: (value: any) => boolean | void | {[key: string]: any}; +} +``` + + +### AlertInput + +```typescript +interface AlertInput { + type?: TextFieldTypes | 'checkbox' | 'radio' | 'textarea'; + name?: string; + placeholder?: string; + value?: any; + label?: string; + checked?: boolean; + disabled?: boolean; + id?: string; + handler?: (input: AlertInput) => void; + min?: string | number; + max?: string | number; + cssClass?: string | string[]; + attributes?: AlertInputAttributes | AlertTextareaAttributes; + tabindex?: number; +} +``` + +### AlertInputAttributes + +```typescript +interface AlertInputAttributes extends JSXBase.InputHTMLAttributes {} +``` + +### AlertOptions + +```typescript +interface AlertOptions { + header?: string; + subHeader?: string; + message?: string | IonicSafeString; + cssClass?: string | string[]; + inputs?: AlertInput[]; + buttons?: (AlertButton | string)[]; + backdropDismiss?: boolean; + translucent?: boolean; + animated?: boolean; + + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` + +### AlertTextareaAttributes +```typescript +interface AlertTextareaAttributes extends JSXBase.TextareaHTMLAttributes {} +``` + + diff --git a/core/src/components/loading/readme.md b/core/src/components/loading/readme.md index 5a901ff680..b4487fc656 100644 --- a/core/src/components/loading/readme.md +++ b/core/src/components/loading/readme.md @@ -37,6 +37,28 @@ Any of the defined [CSS Custom Properties](#css-custom-properties) can be used t > If you are building an Ionic Angular app, the styles need to be added to a global stylesheet file. Read [Style Placement](#style-placement) in the Angular section below for more information. +## Interfaces + +### LoadingOptions + +```typescript +interface LoadingOptions { + spinner?: SpinnerTypes | null; + message?: string | IonicSafeString; + cssClass?: string | string[]; + showBackdrop?: boolean; + duration?: number; + translucent?: boolean; + animated?: boolean; + backdropDismiss?: boolean; + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` diff --git a/core/src/components/modal/readme.md b/core/src/components/modal/readme.md index e361e80af7..325493333c 100644 --- a/core/src/components/modal/readme.md +++ b/core/src/components/modal/readme.md @@ -42,6 +42,30 @@ ion-modal.stack-modal { } ``` +## Interfaces + +### ModalOptions + +```typescript +interface ModalOptions { + component: T; + componentProps?: ComponentProps; + presentingElement?: HTMLElement; + showBackdrop?: boolean; + backdropDismiss?: boolean; + cssClass?: string | string[]; + animated?: boolean; + swipeToClose?: boolean; + + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` + diff --git a/core/src/components/picker/readme.md b/core/src/components/picker/readme.md index bcae3a1a86..e1f001b448 100644 --- a/core/src/components/picker/readme.md +++ b/core/src/components/picker/readme.md @@ -2,7 +2,71 @@ A Picker is a dialog that displays a row of buttons and columns underneath. It appears on top of the app's content, and at the bottom of the viewport. +## Interfaces +### PickerButton + +```typescript +interface PickerButton { + text?: string; + role?: string; + cssClass?: string | string[]; + handler?: (value: any) => boolean | void; +} +``` + +### PickerColumn + +```typescript +interface PickerColumn { + name: string; + align?: string; + selectedIndex?: number; + prevSelected?: number; + prefix?: string; + suffix?: string; + options: PickerColumnOption[]; + cssClass?: string | string[]; + columnWidth?: string; + prefixWidth?: string; + suffixWidth?: string; + optionsWidth?: string; + refresh?: () => void; +} +``` + +### PickerColumnOption + +```typescript +interface PickerColumnOption { + text?: string; + value?: any; + disabled?: boolean; + duration?: number; + transform?: string; + selected?: boolean; +} +``` + +### PickerOptions + +```typescript +interface PickerOptions { + columns: PickerColumn[]; + buttons?: PickerButton[]; + cssClass?: string | string[]; + showBackdrop?: boolean; + backdropDismiss?: boolean; + animated?: boolean; + + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` diff --git a/core/src/components/popover/readme.md b/core/src/components/popover/readme.md index 7017ee1555..279dc471d8 100644 --- a/core/src/components/popover/readme.md +++ b/core/src/components/popover/readme.md @@ -34,6 +34,29 @@ Any of the defined [CSS Custom Properties](#css-custom-properties) can be used t > If you are building an Ionic Angular app, the styles need to be added to a global stylesheet file. Read [Style Placement](#style-placement) in the Angular section below for more information. +## Interfaces + +### PopoverOptions + +```typescript +interface PopoverOptions { + component: any; + componentProps?: { [key: string]: any }; + showBackdrop?: boolean; + backdropDismiss?: boolean; + translucent?: boolean; + cssClass?: string | string[]; + event?: Event; + animated?: boolean; + + mode?: 'ios' | 'md'; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` diff --git a/core/src/components/toast/readme.md b/core/src/components/toast/readme.md index a345835716..ea6324d5b5 100644 --- a/core/src/components/toast/readme.md +++ b/core/src/components/toast/readme.md @@ -10,6 +10,43 @@ Toasts can be positioned at the top, bottom or middle of the viewport. The posit The toast can be dismissed automatically after a specific amount of time by passing the number of milliseconds to display it in the `duration` of the toast options. If a button with a role of `"cancel"` is added, then that button will dismiss the toast. To dismiss the toast after creation, call the `dismiss()` method on the instance. +## Interfaces + +### ToastButton + +```typescript +interface ToastButton { + text?: string; + icon?: string; + side?: 'start' | 'end'; + role?: 'cancel' | string; + cssClass?: string | string[]; + handler?: () => boolean | void | Promise; +} +``` + +### ToastOptions + +```typescript +interface ToastOptions { + header?: string; + message?: string | IonicSafeString; + cssClass?: string | string[]; + duration?: number; + buttons?: (ToastButton | string)[]; + position?: 'top' | 'bottom' | 'middle'; + translucent?: boolean; + animated?: boolean; + + color?: Color; + mode?: Mode; + keyboardClose?: boolean; + id?: string; + + enterAnimation?: AnimationBuilder; + leaveAnimation?: AnimationBuilder; +} +``` diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts index 0395ab811a..808f80ac88 100644 --- a/packages/react/src/components/index.ts +++ b/packages/react/src/components/index.ts @@ -25,8 +25,6 @@ export { AnimationLifecycle, createAnimation, createGesture, - AlertButton, - AlertInput, Gesture, GestureConfig, GestureDetail, @@ -35,6 +33,32 @@ export { mdTransitionAnimation, NavComponentWithProps, setupConfig, + + SpinnerTypes, + + ActionSheetOptions, + ActionSheetButton, + + AlertOptions, + AlertInput, + AlertTextareaAttributes, + AlertInputAttributes, + AlertButton, + + LoadingOptions, + + ModalOptions, + + PickerOptions, + PickerButton, + PickerColumn, + PickerColumnOption, + + PopoverOptions, + + ToastOptions, + ToastButton + } from '@ionic/core'; export * from './proxies'; diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts index f121e581ce..1dd6a55697 100644 --- a/packages/vue/src/index.ts +++ b/packages/vue/src/index.ts @@ -70,7 +70,32 @@ export { getTimeGivenProgression, // Hardware Back Button - BackButtonEvent + BackButtonEvent, + + SpinnerTypes, + + ActionSheetOptions, + ActionSheetButton, + + AlertOptions, + AlertInput, + AlertTextareaAttributes, + AlertInputAttributes, + AlertButton, + + LoadingOptions, + + ModalOptions, + + PickerOptions, + PickerButton, + PickerColumn, + PickerColumnOption, + + PopoverOptions, + + ToastOptions, + ToastButton } from '@ionic/core'; // Icons that are used by internal components From 3016b79717294dc08b1d7442f4b658093c13f680 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 15 Jul 2021 10:00:21 -0400 Subject: [PATCH 19/22] chore(): remove cli, docs, and support templates in favor of directing visitors to correct place url (#23644) --- .github/ISSUE_TEMPLATE/cli.yml | 7 ------- .github/ISSUE_TEMPLATE/config.yml | 10 ++++++++++ .github/ISSUE_TEMPLATE/documentation.yml | 7 ------- .github/ISSUE_TEMPLATE/support_question.yml | 8 -------- 4 files changed, 10 insertions(+), 22 deletions(-) delete mode 100644 .github/ISSUE_TEMPLATE/cli.yml create mode 100644 .github/ISSUE_TEMPLATE/config.yml delete mode 100644 .github/ISSUE_TEMPLATE/documentation.yml delete mode 100644 .github/ISSUE_TEMPLATE/support_question.yml diff --git a/.github/ISSUE_TEMPLATE/cli.yml b/.github/ISSUE_TEMPLATE/cli.yml deleted file mode 100644 index 9e18d9aba6..0000000000 --- a/.github/ISSUE_TEMPLATE/cli.yml +++ /dev/null @@ -1,7 +0,0 @@ -name: CLI -description: Suggest an idea for the Ionic CLI -labels: 'ionitron: cli' -body: - - type: markdown - attributes: - value: "Please do not submit bug reports or feature requests related to the Ionic CLI. Instead, please submit an issue to the [Ionic CLI Repository](https://github.com/ionic-team/ionic-cli/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml new file mode 100644 index 0000000000..773f5ad325 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -0,0 +1,10 @@ +contact_links: + - name: Documentation + url: https://github.com/ionic-team/ionic-docs/issues/new/choose + about: This issue tracker is not for documentation issues. Please file documentation issues on the Ionic Docs repo. + - name: CLI + url: https://github.com/ionic-team/ionic-cli/issues/new/choose + about: This issue tracker is not for CLI issues. PLease file CLI issues on the Ionic CLI repo. + - name: Support Question + url: https://forum.ionicframework.com/ + about: This issue tracker is not for support questions. Please post your question on the Ionic Forums. diff --git a/.github/ISSUE_TEMPLATE/documentation.yml b/.github/ISSUE_TEMPLATE/documentation.yml deleted file mode 100644 index e0c9e681a3..0000000000 --- a/.github/ISSUE_TEMPLATE/documentation.yml +++ /dev/null @@ -1,7 +0,0 @@ -name: Documentation -description: Suggest an improvement for the Ionic Framework documentation -labels: 'ionitron: docs' -body: - - type: markdown - attributes: - value: "Please do not submit issues on how to improve or fix the documentation. Instead, please submit an issue to the [Ionic Docs Repository](https://github.com/ionic-team/ionic-docs/issues/new/choose)." diff --git a/.github/ISSUE_TEMPLATE/support_question.yml b/.github/ISSUE_TEMPLATE/support_question.yml deleted file mode 100644 index f31830a04f..0000000000 --- a/.github/ISSUE_TEMPLATE/support_question.yml +++ /dev/null @@ -1,8 +0,0 @@ -name: Support Question -description: Question on how to use Ionic Framework -title: 'support: ' -labels: 'ionitron: support' -body: - - type: markdown - attributes: - value: "Please do not submit support requests or "How to" questions here. Instead, please use the Ionic Forum: https://forum.ionicframework.com/." From 86ece8f8b55f9fa73c1f29ffa0ef7cc66651d282 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 15 Jul 2021 11:36:25 -0400 Subject: [PATCH 20/22] chore(): fix typo in config (#23645) --- .github/ISSUE_TEMPLATE/config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 773f5ad325..0bdcf29f7d 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -4,7 +4,7 @@ contact_links: about: This issue tracker is not for documentation issues. Please file documentation issues on the Ionic Docs repo. - name: CLI url: https://github.com/ionic-team/ionic-cli/issues/new/choose - about: This issue tracker is not for CLI issues. PLease file CLI issues on the Ionic CLI repo. + about: This issue tracker is not for CLI issues. Please file CLI issues on the Ionic CLI repo. - name: Support Question url: https://forum.ionicframework.com/ about: This issue tracker is not for support questions. Please post your question on the Ionic Forums. From d8a2db73e2a51bd39d92f10577cd803bb58e6dc0 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 15 Jul 2021 13:55:16 -0400 Subject: [PATCH 21/22] chore(): add emojis to issue template titles (#23648) resolves #23647 --- .github/ISSUE_TEMPLATE/bug_report.yml | 2 +- .github/ISSUE_TEMPLATE/config.yml | 6 +++--- .github/ISSUE_TEMPLATE/feature_request.yml | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml index ff82042346..d7e064089f 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.yml +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -1,4 +1,4 @@ -name: Bug Report +name: 🐛 Bug Report description: Create a report to help us improve Ionic Framework title: 'bug: ' body: diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index 0bdcf29f7d..25a8dbb606 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -1,10 +1,10 @@ contact_links: - - name: Documentation + - name: 📚 Documentation url: https://github.com/ionic-team/ionic-docs/issues/new/choose about: This issue tracker is not for documentation issues. Please file documentation issues on the Ionic Docs repo. - - name: CLI + - name: 💻 CLI url: https://github.com/ionic-team/ionic-cli/issues/new/choose about: This issue tracker is not for CLI issues. Please file CLI issues on the Ionic CLI repo. - - name: Support Question + - name: 🤔 Support Question url: https://forum.ionicframework.com/ about: This issue tracker is not for support questions. Please post your question on the Ionic Forums. diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml index ba83f0668c..2a955b4446 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.yml +++ b/.github/ISSUE_TEMPLATE/feature_request.yml @@ -1,4 +1,4 @@ -name: Feature Request +name: 💡 Feature Request description: Suggest an idea for Ionic Framework title: 'feat: ' body: From ae0a1a3deb5dd0ea59b146c8adb5d3174d8ee676 Mon Sep 17 00:00:00 2001 From: Ikko Ashimine Date: Wed, 21 Jul 2021 00:21:39 +0900 Subject: [PATCH 22/22] chore(nav): fix typo in test comment (#23658) --- core/src/components/nav/test/nav-controller.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/src/components/nav/test/nav-controller.spec.ts b/core/src/components/nav/test/nav-controller.spec.ts index e6a6eab9ce..cca03cc5ed 100644 --- a/core/src/components/nav/test/nav-controller.spec.ts +++ b/core/src/components/nav/test/nav-controller.spec.ts @@ -169,7 +169,7 @@ describe('NavController', () => { describe('insert', () => { - it('should insert at the begining with no async transition', async () => { + it('should insert at the beginning with no async transition', async () => { const view4 = mockView(MockView4); const instance4 = spyOnLifecycles(view4); const opts: NavOptions = {};