diff --git a/angular/src/app-initialize.ts b/angular/src/app-initialize.ts index f45630042a..ce2db5d071 100644 --- a/angular/src/app-initialize.ts +++ b/angular/src/app-initialize.ts @@ -14,6 +14,7 @@ export function appInitialize(config: Config, doc: Document) { return applyPolyfills().then(() => { return defineCustomElements(win, { exclude: ['ion-tabs', 'ion-tab'], + resourcesUrl: document.baseURI, syncQueue: true, raf: h => (win.__zone_symbol__requestAnimationFrame) ? win.__zone_symbol__requestAnimationFrame(h) : requestAnimationFrame(h), ael(elm, eventName, cb, opts) { diff --git a/core/api.txt b/core/api.txt index f1073f9232..14cb78051c 100644 --- a/core/api.txt +++ b/core/api.txt @@ -930,6 +930,7 @@ ion-router-link,prop,color,string | undefined,undefined,false,false ion-router-link,prop,href,string | undefined,undefined,false,false ion-router-link,prop,rel,string | undefined,undefined,false,false ion-router-link,prop,routerDirection,"back" | "forward" | "root",'forward',false,false +ion-router-link,prop,target,string | undefined,undefined,false,false ion-router-link,css-prop,--background ion-router-link,css-prop,--color diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 0f9d588141..525e3f684b 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -2016,6 +2016,10 @@ export namespace Components { * When using a router, it specifies the transition direction when navigating to another page using `href`. */ 'routerDirection': RouterDirection; + /** + * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`. + */ + 'target': string | undefined; } interface IonRouterOutlet { /** @@ -5248,6 +5252,10 @@ declare namespace LocalJSX { * When using a router, it specifies the transition direction when navigating to another page using `href`. */ 'routerDirection'?: RouterDirection; + /** + * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`. + */ + 'target'?: string | undefined; } interface IonRouterOutlet extends JSXBase.HTMLAttributes { /** diff --git a/core/src/components/fab-button/fab-button.scss b/core/src/components/fab-button/fab-button.scss index ae24110897..4ca8ec024c 100755 --- a/core/src/components/fab-button/fab-button.scss +++ b/core/src/components/fab-button/fab-button.scss @@ -132,7 +132,7 @@ // -------------------------------------------------- :host(.fab-button-disabled) { - --opacity: .5; + opacity: .5; pointer-events: none; } diff --git a/core/src/components/router-link/readme.md b/core/src/components/router-link/readme.md index be83f2fdd5..c65c3af851 100644 --- a/core/src/components/router-link/readme.md +++ b/core/src/components/router-link/readme.md @@ -15,6 +15,7 @@ The router link component is used for navigating to a specified link. Similar to | `href` | `href` | Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered. | `string \| undefined` | `undefined` | | `rel` | `rel` | Specifies the relationship of the target object to the link object. The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types). | `string \| undefined` | `undefined` | | `routerDirection` | `router-direction` | When using a router, it specifies the transition direction when navigating to another page using `href`. | `"back" \| "forward" \| "root"` | `'forward'` | +| `target` | `target` | Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`. | `string \| undefined` | `undefined` | ## CSS Custom Properties diff --git a/core/src/components/router-link/router-link.tsx b/core/src/components/router-link/router-link.tsx index 2b9e224844..66dd51a6df 100644 --- a/core/src/components/router-link/router-link.tsx +++ b/core/src/components/router-link/router-link.tsx @@ -36,6 +36,13 @@ export class RouterLink implements ComponentInterface { */ @Prop() routerDirection: RouterDirection = 'forward'; + /** + * Specifies where to display the linked URL. + * Only applies when an `href` is provided. + * Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`. + */ + @Prop() target: string | undefined; + private onClick = (ev: Event) => { openURL(this.href, ev, this.routerDirection); } @@ -44,7 +51,8 @@ export class RouterLink implements ComponentInterface { const mode = getIonMode(this); const attrs = { href: this.href, - rel: this.rel + rel: this.rel, + target: this.target }; return (

- Underline Router Link + External Router Link

diff --git a/core/stencil.config.ts b/core/stencil.config.ts index 6b5d4ca39b..0bd383a3b4 100644 --- a/core/stencil.config.ts +++ b/core/stencil.config.ts @@ -37,7 +37,7 @@ export const config: Config = { { components: ['ion-refresher', 'ion-refresher-content'] }, { components: ['ion-reorder', 'ion-reorder-group'] }, { components: ['ion-ripple-effect'] }, - { components: ['ion-anchor', 'ion-router', 'ion-route', 'ion-route-redirect', 'ion-router-link', 'ion-router-outlet'] }, + { components: ['ion-router', 'ion-route', 'ion-route-redirect', 'ion-router-link', 'ion-router-outlet'] }, { components: ['ion-searchbar'] }, { components: ['ion-segment', 'ion-segment-button'] }, { components: ['ion-select', 'ion-select-option', 'ion-select-popover'] }, @@ -50,7 +50,10 @@ export const config: Config = { { components: ['ion-toast'] }, { components: ['ion-toggle'] }, { components: ['ion-virtual-scroll'] }, + + // Deprecated { components: [ + 'ion-anchor', 'ion-action-sheet-controller', 'ion-alert-controller', 'ion-loading-controller', @@ -68,7 +71,7 @@ export const config: Config = { type: 'dist', esmLoaderPath: '../loader', copy: [ - { src: 'themes/*.scss' } + { src: '**/*.scss' } ] }, // {