From 03c1d19e0740365ed109298c013441138b28353f Mon Sep 17 00:00:00 2001 From: Manu MA Date: Wed, 10 Jul 2019 16:33:33 +0200 Subject: [PATCH] perf(all): minify better by using arrow functions (#18730) --- .../components/action-sheet/action-sheet.tsx | 4 +- .../action-sheet/animations/ios.enter.ts | 4 +- .../action-sheet/animations/ios.leave.ts | 4 +- .../action-sheet/animations/md.enter.ts | 4 +- .../action-sheet/animations/md.leave.ts | 4 +- .../action-sheet/test/test.utils.ts | 22 ++--- core/src/components/alert/alert.tsx | 4 +- .../components/alert/animations/ios.enter.ts | 4 +- .../components/alert/animations/ios.leave.ts | 4 +- .../components/alert/animations/md.enter.ts | 4 +- .../components/alert/animations/md.leave.ts | 4 +- core/src/components/alert/test/test.utils.ts | 6 +- core/src/components/app/app.tsx | 46 +++------- core/src/components/content/content.tsx | 14 +-- core/src/components/datetime/datetime-util.ts | 88 +++++++++--------- core/src/components/datetime/datetime.tsx | 8 +- core/src/components/fab/test/test.utils.ts | 28 +++--- .../components/item-sliding/item-sliding.tsx | 4 +- .../item-sliding/test/interactive/e2e.ts | 8 +- .../item-sliding/test/test.utils.ts | 8 +- core/src/components/item/test/inputs/e2e.ts | 4 +- .../loading/animations/ios.enter.ts | 6 +- .../loading/animations/ios.leave.ts | 6 +- .../components/loading/animations/md.enter.ts | 4 +- .../components/loading/animations/md.leave.ts | 4 +- .../src/components/loading/test/test.utils.ts | 6 +- .../menu-controller/animations/base.ts | 10 +-- .../menu-controller/animations/overlay.ts | 4 +- .../menu-controller/animations/push.ts | 8 +- .../menu-controller/animations/reveal.ts | 4 +- core/src/components/menu/menu.tsx | 12 +-- core/src/components/menu/test/test.utils.ts | 6 +- .../components/modal/animations/ios.enter.ts | 6 +- .../components/modal/animations/ios.leave.ts | 6 +- .../components/modal/animations/md.enter.ts | 4 +- .../components/modal/animations/md.leave.ts | 4 +- core/src/components/modal/test/test.utils.ts | 6 +- core/src/components/nav/view-controller.ts | 12 +-- .../picker-column/test/test.utils.ts | 6 +- .../components/picker/animations/ios.enter.ts | 4 +- .../components/picker/animations/ios.leave.ts | 4 +- core/src/components/picker/picker.tsx | 8 +- .../popover/animations/ios.enter.ts | 5 +- .../popover/animations/ios.leave.ts | 4 +- .../components/popover/animations/md.enter.ts | 5 +- .../components/popover/animations/md.leave.ts | 4 +- .../src/components/popover/test/test.utils.ts | 6 +- core/src/components/range/range.tsx | 14 +-- .../reorder-group/reorder-group.tsx | 12 +-- .../reorder-group/test/interactive/e2e.ts | 4 +- .../reorder-group/test/test.utils.ts | 4 +- .../ripple-effect/ripple-effect.tsx | 4 +- core/src/components/router/utils/debug.ts | 8 +- core/src/components/router/utils/dom.ts | 18 ++-- core/src/components/router/utils/matching.ts | 32 +++---- core/src/components/router/utils/parser.ts | 24 ++--- core/src/components/router/utils/path.ts | 24 ++--- core/src/components/select/select.tsx | 20 ++--- core/src/components/spinner/spinner.tsx | 8 +- core/src/components/split-pane/split-pane.tsx | 4 +- .../components/toast/animations/ios.enter.ts | 4 +- .../components/toast/animations/ios.leave.ts | 4 +- .../components/toast/animations/md.enter.ts | 4 +- .../components/toast/animations/md.leave.ts | 4 +- core/src/components/toast/test/test.utils.ts | 6 +- core/src/components/toast/toast.tsx | 4 +- core/src/components/toggle/toggle.tsx | 4 +- .../virtual-scroll/virtual-scroll-utils.ts | 66 +++++++------- core/src/global/ionic-global.ts | 9 +- core/src/utils/animation/animator.ts | 8 +- core/src/utils/animation/index.ts | 4 +- core/src/utils/animation/transition-end.ts | 12 +-- core/src/utils/config.ts | 4 +- core/src/utils/focus-visible.ts | 18 ++-- core/src/utils/framework-delegate.ts | 12 +-- core/src/utils/gesture/index.ts | 90 +++++++++---------- core/src/utils/gesture/listener.ts | 20 ++--- core/src/utils/gesture/pointer-events.ts | 46 +++++----- core/src/utils/gesture/recognizers.ts | 4 +- core/src/utils/gesture/swipe-back.ts | 18 ++-- core/src/utils/haptic.ts | 28 +++--- core/src/utils/hardware-back-button.ts | 8 +- core/src/utils/helpers.ts | 48 +++++----- core/src/utils/input-shims/hacks/common.ts | 18 ++-- .../src/utils/input-shims/hacks/hide-caret.ts | 4 +- .../utils/input-shims/hacks/input-blurring.ts | 18 ++-- .../utils/input-shims/hacks/scroll-assist.ts | 16 ++-- .../utils/input-shims/hacks/scroll-data.ts | 14 +-- .../utils/input-shims/hacks/scroll-padding.ts | 16 ++-- core/src/utils/input-shims/input-shims.ts | 16 ++-- core/src/utils/media.ts | 4 +- core/src/utils/status-tap.ts | 4 +- core/src/utils/tap-click.ts | 60 ++++++------- core/src/utils/test/utils.ts | 18 ++-- core/src/utils/theme.ts | 20 ++--- core/src/utils/transition/index.ts | 76 ++++++++-------- core/src/utils/transition/ios.transition.ts | 8 +- core/src/utils/transition/md.transition.ts | 8 +- core/tslint.json | 1 + 99 files changed, 653 insertions(+), 679 deletions(-) diff --git a/core/src/components/action-sheet/action-sheet.tsx b/core/src/components/action-sheet/action-sheet.tsx index 403c74cdd3..207f8945cb 100644 --- a/core/src/components/action-sheet/action-sheet.tsx +++ b/core/src/components/action-sheet/action-sheet.tsx @@ -260,11 +260,11 @@ export class ActionSheet implements ComponentInterface, OverlayInterface { } } -function buttonClass(button: ActionSheetButton): CssClassMap { +const buttonClass = (button: ActionSheetButton): CssClassMap => { return { 'action-sheet-button': true, 'ion-activatable': true, [`action-sheet-${button.role}`]: button.role !== undefined, ...getClassMap(button.cssClass), }; -} +}; diff --git a/core/src/components/action-sheet/animations/ios.enter.ts b/core/src/components/action-sheet/animations/ios.enter.ts index d0fa4d362a..cd132bf64c 100644 --- a/core/src/components/action-sheet/animations/ios.enter.ts +++ b/core/src/components/action-sheet/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Action Sheet Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/action-sheet/animations/ios.leave.ts b/core/src/components/action-sheet/animations/ios.leave.ts index 46aa67a5de..8fe15082b5 100644 --- a/core/src/components/action-sheet/animations/ios.leave.ts +++ b/core/src/components/action-sheet/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Action Sheet Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/action-sheet/animations/md.enter.ts b/core/src/components/action-sheet/animations/md.enter.ts index 06fa6f1a49..a11c60c460 100644 --- a/core/src/components/action-sheet/animations/md.enter.ts +++ b/core/src/components/action-sheet/animations/md.enter.ts @@ -4,7 +4,7 @@ import { Animation } from '../../../interface'; /** * MD Action Sheet Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/action-sheet/animations/md.leave.ts b/core/src/components/action-sheet/animations/md.leave.ts index 60cfd06fbf..a84c5d0031 100644 --- a/core/src/components/action-sheet/animations/md.leave.ts +++ b/core/src/components/action-sheet/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * MD Action Sheet Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/action-sheet/test/test.utils.ts b/core/src/components/action-sheet/test/test.utils.ts index 0f300727ac..4ff515e2c5 100644 --- a/core/src/components/action-sheet/test/test.utils.ts +++ b/core/src/components/action-sheet/test/test.utils.ts @@ -2,12 +2,12 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testActionSheet( +export const testActionSheet = async ( type: string, selector: string, rtl = false, - afterScreenshotHook = async (..._args: any[]): Promise => {/**/} -) { + afterScreenshotHook = async (..._args: any[]): Promise => {/**/ } +) => { try { const pageUrl = generateE2EUrl('action-sheet', type, rtl); @@ -42,13 +42,13 @@ export async function testActionSheet( } catch (err) { throw err; } -} +}; -export async function testActionSheetBackdrop( +export const testActionSheetBackdrop = async ( page: any, screenshotCompares: any, actionSheet: any -) { +) => { try { const backdrop = await page.find('ion-backdrop'); await backdrop.click(); @@ -57,15 +57,15 @@ export async function testActionSheetBackdrop( const isVisible = await actionSheet.isVisible(); expect(isVisible).toBe(true); -} catch (err) { + } catch (err) { throw err; } -} +}; -export async function testActionSheetAlert( +export const testActionSheetAlert = async ( page: any, screenshotCompares: any -) { +) => { try { const openAlertBtn = await page.find({ text: 'Open Alert' }); await openAlertBtn.click(); @@ -81,4 +81,4 @@ export async function testActionSheetAlert( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/alert/alert.tsx b/core/src/components/alert/alert.tsx index e52dc95ea4..be2ed27ee6 100644 --- a/core/src/components/alert/alert.tsx +++ b/core/src/components/alert/alert.tsx @@ -459,11 +459,11 @@ export class Alert implements ComponentInterface, OverlayInterface { } } -function buttonClass(button: AlertButton): CssClassMap { +const buttonClass = (button: AlertButton): CssClassMap => { return { 'alert-button': true, 'ion-focusable': true, 'ion-activatable': true, ...getClassMap(button.cssClass) }; -} +}; diff --git a/core/src/components/alert/animations/ios.enter.ts b/core/src/components/alert/animations/ios.enter.ts index f539b29b3f..d8eb042bac 100644 --- a/core/src/components/alert/animations/ios.enter.ts +++ b/core/src/components/alert/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Alert Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/alert/animations/ios.leave.ts b/core/src/components/alert/animations/ios.leave.ts index ad14e0fcda..8639222dfd 100644 --- a/core/src/components/alert/animations/ios.leave.ts +++ b/core/src/components/alert/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Alert Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -24,4 +24,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .add(wrapperAnimation); return Promise.resolve(ani); -} +}; diff --git a/core/src/components/alert/animations/md.enter.ts b/core/src/components/alert/animations/md.enter.ts index 2f976e8b87..8de2c382f4 100644 --- a/core/src/components/alert/animations/md.enter.ts +++ b/core/src/components/alert/animations/md.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Alert Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(150) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/alert/animations/md.leave.ts b/core/src/components/alert/animations/md.leave.ts index d13fb06232..8f87c978de 100644 --- a/core/src/components/alert/animations/md.leave.ts +++ b/core/src/components/alert/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Alert Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(150) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/alert/test/test.utils.ts b/core/src/components/alert/test/test.utils.ts index d147019a96..e7790d1ef7 100644 --- a/core/src/components/alert/test/test.utils.ts +++ b/core/src/components/alert/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testAlert( +export const testAlert = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('alert', type, rtl); @@ -41,4 +41,4 @@ export async function testAlert( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/app/app.tsx b/core/src/components/app/app.tsx index c6e8d6db82..9568f01567 100644 --- a/core/src/components/app/app.tsx +++ b/core/src/components/app/app.tsx @@ -16,13 +16,16 @@ export class App implements ComponentInterface { componentDidLoad() { rIC(() => { if (!config.getBoolean('_testing')) { - importTapClick(); + import('../../utils/tap-click').then(module => module.startTapClick(config)); } + if (config.getBoolean('statusTap', isPlatform(window, 'hybrid'))) { + import('../../utils/status-tap').then(module => module.startStatusTap()); + } + if (config.getBoolean('inputShims', needInputShims())) { + import('../../utils/input-shims/input-shims').then(module => module.startInputShims(config)); + } + import('../../utils/focus-visible').then(module => module.startFocusVisible()); - importInputShims(); - importStatusTap(); - importHardwareBackButton(); - importFocusVisible(); }); } @@ -39,35 +42,6 @@ export class App implements ComponentInterface { } } -function importHardwareBackButton() { - const hardwareBackConfig = config.getBoolean('hardwareBackButton', isPlatform(window, 'hybrid')); - if (hardwareBackConfig) { - import('../../utils/hardware-back-button').then(module => module.startHardwareBackButton()); - } -} - -function importStatusTap() { - const statusTap = config.getBoolean('statusTap', isPlatform(window, 'hybrid')); - if (statusTap) { - import('../../utils/status-tap').then(module => module.startStatusTap()); - } -} - -function importFocusVisible() { - import('../../utils/focus-visible').then(module => module.startFocusVisible()); -} - -function importTapClick() { - import('../../utils/tap-click').then(module => module.startTapClick(config)); -} - -function importInputShims() { - const inputShims = config.getBoolean('inputShims', needInputShims()); - if (inputShims) { - import('../../utils/input-shims/input-shims').then(module => module.startInputShims(config)); - } -} - -function needInputShims() { +const needInputShims = () => { return isPlatform(window, 'ios') && isPlatform(window, 'mobile'); -} +}; diff --git a/core/src/components/content/content.tsx b/core/src/components/content/content.tsx index 92471727cf..38e9db67e0 100644 --- a/core/src/components/content/content.tsx +++ b/core/src/components/content/content.tsx @@ -334,7 +334,7 @@ export class Content implements ComponentInterface { } } -function getParentElement(el: any) { +const getParentElement = (el: any) => { if (el.parentElement) { // normal element with a parent element return el.parentElement; @@ -344,9 +344,9 @@ function getParentElement(el: any) { return el.parentNode.host; } return null; -} +}; -function getPageElement(el: HTMLElement) { +const getPageElement = (el: HTMLElement) => { const tabs = el.closest('ion-tabs'); if (tabs) { return tabs; @@ -356,15 +356,15 @@ function getPageElement(el: HTMLElement) { return page; } return getParentElement(el); -} +}; // ******** DOM READ **************** -function updateScrollDetail( +const updateScrollDetail = ( detail: ScrollDetail, el: Element, timestamp: number, shouldStart: boolean -) { +) => { const prevX = detail.currentX; const prevY = detail.currentY; const prevT = detail.timeStamp; @@ -390,4 +390,4 @@ function updateScrollDetail( detail.velocityX = velocityX * 0.7 + detail.velocityX * 0.3; detail.velocityY = velocityY * 0.7 + detail.velocityY * 0.3; } -} +}; diff --git a/core/src/components/datetime/datetime-util.ts b/core/src/components/datetime/datetime-util.ts index bd8ff7ab45..9e41ea75f1 100644 --- a/core/src/components/datetime/datetime-util.ts +++ b/core/src/components/datetime/datetime-util.ts @@ -3,16 +3,16 @@ * Defaults to the current date if * no date given */ -export function getDateValue(date: DatetimeData, format: string): number { +export const getDateValue = (date: DatetimeData, format: string): number => { const getValue = getValueFromFormat(date, format); if (getValue !== undefined) { return getValue; } const defaultDate = parseDate(new Date().toISOString()); return getValueFromFormat((defaultDate as DatetimeData), format); -} +}; -export function renderDatetime(template: string, value: DatetimeData | undefined, locale: LocaleData): string | undefined { +export const renderDatetime = (template: string, value: DatetimeData | undefined, locale: LocaleData): string | undefined => { if (value === undefined) { return undefined; } @@ -43,9 +43,9 @@ export function renderDatetime(template: string, value: DatetimeData | undefined } return template; -} +}; -export function renderTextFormat(format: string, value: any, date: DatetimeData | undefined, locale: LocaleData): string | undefined { +export const renderTextFormat = (format: string, value: any, date: DatetimeData | undefined, locale: LocaleData): string | undefined => { if ((format === FORMAT_DDDD || format === FORMAT_DDD)) { try { value = (new Date(date!.year!, date!.month! - 1, date!.day)).getDay(); @@ -80,8 +80,8 @@ export function renderTextFormat(format: string, value: any, date: DatetimeData } if (format === FORMAT_YY || format === FORMAT_MM || - format === FORMAT_DD || format === FORMAT_HH || - format === FORMAT_mm || format === FORMAT_ss) { + format === FORMAT_DD || format === FORMAT_HH || + format === FORMAT_mm || format === FORMAT_ss) { return twoDigit(value); } @@ -110,9 +110,9 @@ export function renderTextFormat(format: string, value: any, date: DatetimeData } return value.toString(); -} +}; -export function dateValueRange(format: string, min: DatetimeData, max: DatetimeData): any[] { +export const dateValueRange = (format: string, min: DatetimeData, max: DatetimeData): any[] => { const opts: any[] = []; if (format === FORMAT_YYYY || format === FORMAT_YY) { @@ -126,8 +126,8 @@ export function dateValueRange(format: string, min: DatetimeData, max: DatetimeD } } else if (format === FORMAT_MMMM || format === FORMAT_MMM || - format === FORMAT_MM || format === FORMAT_M || - format === FORMAT_hh || format === FORMAT_h) { + format === FORMAT_MM || format === FORMAT_M || + format === FORMAT_hh || format === FORMAT_h) { // month or 12-hour for (let i = 1; i < 13; i++) { @@ -135,7 +135,7 @@ export function dateValueRange(format: string, min: DatetimeData, max: DatetimeD } } else if (format === FORMAT_DDDD || format === FORMAT_DDD || - format === FORMAT_DD || format === FORMAT_D) { + format === FORMAT_DD || format === FORMAT_D) { // day for (let i = 1; i < 32; i++) { opts.push(i); @@ -165,28 +165,28 @@ export function dateValueRange(format: string, min: DatetimeData, max: DatetimeD } return opts; -} +}; -export function dateSortValue(year: number | undefined, month: number | undefined, day: number | undefined, hour = 0, minute = 0): number { +export const dateSortValue = (year: number | undefined, month: number | undefined, day: number | undefined, hour = 0, minute = 0): number => { return parseInt(`1${fourDigit(year)}${twoDigit(month)}${twoDigit(day)}${twoDigit(hour)}${twoDigit(minute)}`, 10); -} +}; -export function dateDataSortValue(data: DatetimeData): number { +export const dateDataSortValue = (data: DatetimeData): number => { return dateSortValue(data.year, data.month, data.day, data.hour, data.minute); -} +}; -export function daysInMonth(month: number, year: number): number { +export const daysInMonth = (month: number, year: number): number => { return (month === 4 || month === 6 || month === 9 || month === 11) ? 30 : (month === 2) ? isLeapYear(year) ? 29 : 28 : 31; -} +}; -export function isLeapYear(year: number): boolean { +export const isLeapYear = (year: number): boolean => { return (year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0); -} +}; const ISO_8601_REGEXP = /^(\d{4}|[+\-]\d{6})(?:-(\d{2})(?:-(\d{2}))?)?(?:T(\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/; const TIME_REGEXP = /^((\d{2}):(\d{2})(?::(\d{2})(?:\.(\d{3}))?)?(?:(Z)|([+\-])(\d{2})(?::(\d{2}))?)?)?$/; -export function parseDate(val: string | undefined | null): DatetimeData | undefined { +export const parseDate = (val: string | undefined | null): DatetimeData | undefined => { // manually parse IS0 cuz Date.parse cannot be trusted // ISO 8601 format: 1994-12-15T13:47:20Z let parse: any[] | null = null; @@ -239,7 +239,7 @@ export function parseDate(val: string | undefined | null): DatetimeData | undefi millisecond: parse[7], tzOffset, }; -} +}; /** * Converts a valid UTC datetime string @@ -286,7 +286,7 @@ export const getLocalDateTime = (dateString: any = ''): Date => { ); }; -export function updateDate(existingData: DatetimeData, newData: any): boolean { +export const updateDate = (existingData: DatetimeData, newData: any): boolean => { if (!newData || typeof newData === 'string') { const localDateTime = getLocalDateTime(newData); @@ -338,9 +338,9 @@ export function updateDate(existingData: DatetimeData, newData: any): boolean { } } return false; -} +}; -export function parseTemplate(template: string): string[] { +export const parseTemplate = (template: string): string[] => { const formats: string[] = []; template = template.replace(/[^\w\s]/gi, ' '); @@ -358,7 +358,7 @@ export function parseTemplate(template: string): string[] { if (word === FORMAT_A || word === FORMAT_a) { // this format is an am/pm format, so it's an "a" or "A" if ((formats.indexOf(FORMAT_h) < 0 && formats.indexOf(FORMAT_hh) < 0) || - VALID_AMPM_PREFIX.indexOf(words[i - 1]) === -1) { + VALID_AMPM_PREFIX.indexOf(words[i - 1]) === -1) { // template does not already have a 12-hour format // or this am/pm format doesn't have a hour, minute, or second format immediately before it // so do not treat this word "a" or "A" as the am/pm format @@ -371,9 +371,9 @@ export function parseTemplate(template: string): string[] { }); return formats; -} +}; -export function getValueFromFormat(date: DatetimeData, format: string) { +export const getValueFromFormat = (date: DatetimeData, format: string) => { if (format === FORMAT_A || format === FORMAT_a) { return (date.hour! < 12 ? 'am' : 'pm'); } @@ -381,18 +381,18 @@ export function getValueFromFormat(date: DatetimeData, format: string) { return (date.hour! > 12 ? date.hour! - 12 : date.hour); } return (date as any)[convertFormatToKey(format)!]; -} +}; -export function convertFormatToKey(format: string): string | undefined { +export const convertFormatToKey = (format: string): string | undefined => { for (const k in FORMAT_KEYS) { if (FORMAT_KEYS[k].f === format) { return FORMAT_KEYS[k].k; } } return undefined; -} +}; -export function convertDataToISO(data: DatetimeData): string { +export const convertDataToISO = (data: DatetimeData): string => { // https://www.w3.org/TR/NOTE-datetime let rtn = ''; if (data.year !== undefined) { @@ -445,13 +445,13 @@ export function convertDataToISO(data: DatetimeData): string { } return rtn; -} +}; /** * Use to convert a string of comma separated strings or * an array of strings, and clean up any user input */ -export function convertToArrayOfStrings(input: string | string[] | undefined | null, type: string): string[] | undefined { +export const convertToArrayOfStrings = (input: string | string[] | undefined | null, type: string): string[] | undefined => { if (input == null) { return undefined; } @@ -473,13 +473,13 @@ export function convertToArrayOfStrings(input: string | string[] | undefined | n } return values; -} +}; /** * Use to convert a string of comma separated numbers or * an array of numbers, and clean up any user input */ -export function convertToArrayOfNumbers(input: any[] | string | number, type: string): number[] { +export const convertToArrayOfNumbers = (input: any[] | string | number, type: string): number[] => { if (typeof input === 'string') { // convert the string to an array of strings // auto remove any whitespace and [] characters @@ -501,19 +501,19 @@ export function convertToArrayOfNumbers(input: any[] | string | number, type: st } return values; -} +}; -function twoDigit(val: number | undefined): string { +const twoDigit = (val: number | undefined): string => { return ('0' + (val !== undefined ? Math.abs(val) : '0')).slice(-2); -} +}; -function threeDigit(val: number | undefined): string { +const threeDigit = (val: number | undefined): string => { return ('00' + (val !== undefined ? Math.abs(val) : '0')).slice(-3); -} +}; -function fourDigit(val: number | undefined): string { +const fourDigit = (val: number | undefined): string => { return ('000' + (val !== undefined ? Math.abs(val) : '0')).slice(-4); -} +}; export interface DatetimeData { year?: number; diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx index 1cf77789f7..dde5733bec 100644 --- a/core/src/components/datetime/datetime.tsx +++ b/core/src/components/datetime/datetime.tsx @@ -636,7 +636,7 @@ export class Datetime implements ComponentInterface { } } -function divyColumns(columns: PickerColumn[]): PickerColumn[] { +const divyColumns = (columns: PickerColumn[]): PickerColumn[] => { const columnsWidth: number[] = []; let col: PickerColumn; let width: number; @@ -666,8 +666,8 @@ function divyColumns(columns: PickerColumn[]): PickerColumn[] { columns[2].align = 'left'; } return columns; -} - -let datetimeIds = 0; +}; const DEFAULT_FORMAT = 'MMM D, YYYY'; + +let datetimeIds = 0; diff --git a/core/src/components/fab/test/test.utils.ts b/core/src/components/fab/test/test.utils.ts index b3f7ab2f29..6376896a00 100644 --- a/core/src/components/fab/test/test.utils.ts +++ b/core/src/components/fab/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testFab( +export const testFab = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('fab', type, rtl); @@ -41,13 +41,13 @@ export async function testFab( } catch (err) { throw err; } -} +}; -export async function testDisabledFab( +export const testDisabledFab = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('fab', type, rtl); @@ -71,23 +71,23 @@ export async function testDisabledFab( } catch (err) { throw err; } -} +}; -async function getFabComponent(page: any, selector: string) { +const getFabComponent = async (page: any, selector: string) => { return page.find(selector); -} +}; -async function getFabButton(fabComponent: any) { +const getFabButton = async (fabComponent: any) => { return fabComponent.find('ion-fab-button'); -} +}; -async function getFabList(fabComponent: any) { +const getFabList = async (fabComponent: any) => { return fabComponent.find('ion-fab-list'); -} +}; -async function ensureFabState(fab: any, state: string) { +const ensureFabState = async (fab: any, state: string) => { const active = (state === 'active') ? true : false; const fabList = await getFabList(fab); expect(fabList.classList.contains('fab-list-active')).toBe(active); -} +}; diff --git a/core/src/components/item-sliding/item-sliding.tsx b/core/src/components/item-sliding/item-sliding.tsx index a01d79ba32..1b8c5d2c15 100644 --- a/core/src/components/item-sliding/item-sliding.tsx +++ b/core/src/components/item-sliding/item-sliding.tsx @@ -389,7 +389,7 @@ export class ItemSliding implements ComponentInterface { } } -function swipeShouldReset(isResetDirection: boolean, isMovingFast: boolean, isOnResetZone: boolean): boolean { +const swipeShouldReset = (isResetDirection: boolean, isMovingFast: boolean, isOnResetZone: boolean): boolean => { // The logic required to know when the sliding item should close (openAmount=0) // depends on three booleans (isResetDirection, isMovingFast, isOnResetZone) // and it ended up being too complicated to be written manually without errors @@ -405,4 +405,4 @@ function swipeShouldReset(isResetDirection: boolean, isMovingFast: boolean, isOn // 1 | 1 | 1 || 1 // The resulting expression was generated by resolving the K-map (Karnaugh map): return (!isMovingFast && isOnResetZone) || (isResetDirection && isMovingFast); -} +}; diff --git a/core/src/components/item-sliding/test/interactive/e2e.ts b/core/src/components/item-sliding/test/interactive/e2e.ts index 608820f88e..0c49d99c13 100644 --- a/core/src/components/item-sliding/test/interactive/e2e.ts +++ b/core/src/components/item-sliding/test/interactive/e2e.ts @@ -28,7 +28,7 @@ test('item-sliding: interactive', async () => { } }); -async function slideAndDelete(item: any, page: any) { +const slideAndDelete = async (item: any, page: any) => { try { // Get the element's ID const id = await(await item.getProperty('id')).jsonValue(); @@ -37,9 +37,9 @@ async function slideAndDelete(item: any, page: any) { } catch (err) { throw err; } -} +}; -async function deleteItemSliding(item: any, page: any, id: string) { +const deleteItemSliding = async (item: any, page: any, id: string) => { // Click the "delete" option const options = await item.$$('ion-item-option'); await options[0].click(); @@ -48,4 +48,4 @@ async function deleteItemSliding(item: any, page: any, id: string) { await page.waitForSelector(id, { hidden: true }); await page.waitFor(1000); -} +}; diff --git a/core/src/components/item-sliding/test/test.utils.ts b/core/src/components/item-sliding/test/test.utils.ts index ab7ca3306b..a4f65fcf74 100644 --- a/core/src/components/item-sliding/test/test.utils.ts +++ b/core/src/components/item-sliding/test/test.utils.ts @@ -1,5 +1,5 @@ // Opens a sliding item by simulating a drag event -export async function openItemSliding(id: string, page: any, rtl = false) { +export const openItemSliding = async (id: string, page: any, rtl = false) => { try { const slidingItem = await page.$(id); @@ -46,13 +46,13 @@ export async function openItemSliding(id: string, page: any, rtl = false) { } catch (err) { throw err; } -} +}; // Close a sliding item after taking a screenshot // to allow other sliding items to open -export async function closeItemSliding(page: any) { +export const closeItemSliding = async (page: any) => { await page.mouse.move(0, 0); await page.mouse.down(); await page.mouse.up(); await page.waitFor(1000); -} +}; diff --git a/core/src/components/item/test/inputs/e2e.ts b/core/src/components/item/test/inputs/e2e.ts index e05f5f8121..22410321e9 100644 --- a/core/src/components/item/test/inputs/e2e.ts +++ b/core/src/components/item/test/inputs/e2e.ts @@ -64,8 +64,8 @@ test('item: inputs', async () => { expect(compare).toMatchScreenshot(); }); -async function checkFormResult(page: E2EPage, content: string) { +const checkFormResult = async (page: E2EPage, content: string) => { const div = await page.find('#form-result'); expect(div.textContent).toEqual(content); -} +}; diff --git a/core/src/components/loading/animations/ios.enter.ts b/core/src/components/loading/animations/ios.enter.ts index 490b2dbcef..026effeca5 100644 --- a/core/src/components/loading/animations/ios.enter.ts +++ b/core/src/components/loading/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Loading Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -15,7 +15,7 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P backdropAnimation.fromTo('opacity', 0.01, 0.3); wrapperAnimation.fromTo('opacity', 0.01, 1) - .fromTo('scale', 1.1, 1); + .fromTo('scale', 1.1, 1); return Promise.resolve(baseAnimation .addElement(baseEl) @@ -23,4 +23,4 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(200) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/loading/animations/ios.leave.ts b/core/src/components/loading/animations/ios.leave.ts index 54920b8f15..9ca250e180 100644 --- a/core/src/components/loading/animations/ios.leave.ts +++ b/core/src/components/loading/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Loading Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -15,7 +15,7 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P backdropAnimation.fromTo('opacity', 0.3, 0); wrapperAnimation.fromTo('opacity', 0.99, 0) - .fromTo('scale', 1, 0.9); + .fromTo('scale', 1, 0.9); return Promise.resolve(baseAnimation .addElement(baseEl) @@ -23,4 +23,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(200) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/loading/animations/md.enter.ts b/core/src/components/loading/animations/md.enter.ts index d25e753ce9..bb93b14bb9 100644 --- a/core/src/components/loading/animations/md.enter.ts +++ b/core/src/components/loading/animations/md.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Loading Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(200) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/loading/animations/md.leave.ts b/core/src/components/loading/animations/md.leave.ts index 66c89b7564..697dbd1742 100644 --- a/core/src/components/loading/animations/md.leave.ts +++ b/core/src/components/loading/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Loading Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(200) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/loading/test/test.utils.ts b/core/src/components/loading/test/test.utils.ts index d71ddadb29..05867f018b 100644 --- a/core/src/components/loading/test/test.utils.ts +++ b/core/src/components/loading/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testLoading( +export const testLoading = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('loading', type, rtl); @@ -41,4 +41,4 @@ export async function testLoading( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/menu-controller/animations/base.ts b/core/src/components/menu-controller/animations/base.ts index 80430f9e7d..096a3f4567 100644 --- a/core/src/components/menu-controller/animations/base.ts +++ b/core/src/components/menu-controller/animations/base.ts @@ -6,7 +6,7 @@ import { Animation } from '../../../interface'; * type will provide their own animations for open and close * and registers itself with Menu. */ -export function baseAnimation(AnimationC: Animation): Promise { +export const baseAnimation = (AnimationC: Animation): Promise => { // https://material.io/guidelines/motion/movement.html#movement-movement-in-out-of-screen-bounds // https://material.io/guidelines/motion/duration-easing.html#duration-easing-natural-easing-curves @@ -15,7 +15,7 @@ export function baseAnimation(AnimationC: Animation): Promise { // this transition typically occurs over 300ms" -- MD Motion Guide return Promise.resolve( new AnimationC() - .easing('cubic-bezier(0.0, 0.0, 0.2, 1)') // Deceleration curve (Entering the screen) - .easingReverse('cubic-bezier(0.4, 0.0, 0.6, 1)') // Sharp curve (Temporarily leaving the screen) - .duration(300)); -} + .easing('cubic-bezier(0.0, 0.0, 0.2, 1)') // Deceleration curve (Entering the screen) + .easingReverse('cubic-bezier(0.4, 0.0, 0.6, 1)') // Sharp curve (Temporarily leaving the screen) + .duration(300)); +}; diff --git a/core/src/components/menu-controller/animations/overlay.ts b/core/src/components/menu-controller/animations/overlay.ts index 1d1ae6dcfc..bea382ddee 100644 --- a/core/src/components/menu-controller/animations/overlay.ts +++ b/core/src/components/menu-controller/animations/overlay.ts @@ -8,7 +8,7 @@ const BOX_SHADOW_WIDTH = 8; * The menu slides over the content. The content * itself, which is under the menu, does not move. */ -export function menuOverlayAnimation(AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise { +export const menuOverlayAnimation = (AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise => { let closedX: string; let openedX: string; const width = menu.width + BOX_SHADOW_WIDTH; @@ -35,4 +35,4 @@ export function menuOverlayAnimation(AnimationC: Animation, _: HTMLElement, menu return animation.add(menuAnimation) .add(backdropAnimation); }); -} +}; diff --git a/core/src/components/menu-controller/animations/push.ts b/core/src/components/menu-controller/animations/push.ts index ffde17948a..4abd3e5244 100644 --- a/core/src/components/menu-controller/animations/push.ts +++ b/core/src/components/menu-controller/animations/push.ts @@ -7,7 +7,7 @@ import { baseAnimation } from './base'; * The content slides over to reveal the menu underneath. * The menu itself also slides over to reveal its bad self. */ -export function menuPushAnimation(AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise { +export const menuPushAnimation = (AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise => { let contentOpenedX: string; let menuClosedX: string; @@ -35,7 +35,7 @@ export function menuPushAnimation(AnimationC: Animation, _: HTMLElement, menu: M return baseAnimation(AnimationC).then(animation => { return animation.add(menuAnimation) - .add(backdropAnimation) - .add(contentAnimation); + .add(backdropAnimation) + .add(contentAnimation); }); -} +}; diff --git a/core/src/components/menu-controller/animations/reveal.ts b/core/src/components/menu-controller/animations/reveal.ts index 5e9f9cc994..35de1304a8 100644 --- a/core/src/components/menu-controller/animations/reveal.ts +++ b/core/src/components/menu-controller/animations/reveal.ts @@ -7,7 +7,7 @@ import { baseAnimation } from './base'; * The content slides over to reveal the menu underneath. * The menu itself, which is under the content, does not move. */ -export function menuRevealAnimation(AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise { +export const menuRevealAnimation = (AnimationC: Animation, _: HTMLElement, menu: MenuI): Promise => { const openedX = (menu.width * (menu.isEndSide ? -1 : 1)) + 'px'; const contentOpen = new AnimationC() @@ -17,4 +17,4 @@ export function menuRevealAnimation(AnimationC: Animation, _: HTMLElement, menu: return baseAnimation(AnimationC).then(animation => { return animation.add(contentOpen); }); -} +}; diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx index a20ab5d8b4..b576e91ebc 100644 --- a/core/src/components/menu/menu.tsx +++ b/core/src/components/menu/menu.tsx @@ -531,26 +531,26 @@ export class Menu implements ComponentInterface, MenuI { } } -function computeDelta( +const computeDelta = ( deltaX: number, isOpen: boolean, isEndSide: boolean -): number { +): number => { return Math.max(0, isOpen !== isEndSide ? -deltaX : deltaX); -} +}; -function checkEdgeSide( +const checkEdgeSide = ( win: Window, posX: number, isEndSide: boolean, maxEdgeStart: number -): boolean { +): boolean => { if (isEndSide) { return posX >= win.innerWidth - maxEdgeStart; } else { return posX <= maxEdgeStart; } -} +}; const SHOW_MENU = 'show-menu'; const SHOW_BACKDROP = 'show-backdrop'; diff --git a/core/src/components/menu/test/test.utils.ts b/core/src/components/menu/test/test.utils.ts index e84782f2ba..6f80dbff50 100644 --- a/core/src/components/menu/test/test.utils.ts +++ b/core/src/components/menu/test/test.utils.ts @@ -2,12 +2,12 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testMenu( +export const testMenu = async ( type: string, selector: string, menuId = '', rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('menu', type, rtl); @@ -41,4 +41,4 @@ export async function testMenu( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/modal/animations/ios.enter.ts b/core/src/components/modal/animations/ios.enter.ts index 3014af0ba2..96bb87dadd 100644 --- a/core/src/components/modal/animations/ios.enter.ts +++ b/core/src/components/modal/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Modal Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -13,7 +13,7 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P wrapperAnimation.addElement(baseEl.querySelector('.modal-wrapper')); wrapperAnimation.beforeStyles({ 'opacity': 1 }) - .fromTo('translateY', '100%', '0%'); + .fromTo('translateY', '100%', '0%'); backdropAnimation.fromTo('opacity', 0.01, 0.4); @@ -24,7 +24,7 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P .beforeAddClass('show-modal') .add(backdropAnimation) .add(wrapperAnimation)); -} +}; /** * Animations for modals diff --git a/core/src/components/modal/animations/ios.leave.ts b/core/src/components/modal/animations/ios.leave.ts index 9712046694..16882a715f 100644 --- a/core/src/components/modal/animations/ios.leave.ts +++ b/core/src/components/modal/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Modal Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -15,7 +15,7 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P const wrapperElRect = wrapperEl!.getBoundingClientRect(); wrapperAnimation.beforeStyles({ 'opacity': 1 }) - .fromTo('translateY', '0%', `${(baseEl.ownerDocument as any).defaultView.innerHeight - wrapperElRect.top}px`); + .fromTo('translateY', '0%', `${(baseEl.ownerDocument as any).defaultView.innerHeight - wrapperElRect.top}px`); backdropAnimation.fromTo('opacity', 0.4, 0.0); @@ -25,4 +25,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(250) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/modal/animations/md.enter.ts b/core/src/components/modal/animations/md.enter.ts index a406bf669f..eca6c4890b 100644 --- a/core/src/components/modal/animations/md.enter.ts +++ b/core/src/components/modal/animations/md.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Modal Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -25,4 +25,4 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .beforeAddClass('show-modal') .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/modal/animations/md.leave.ts b/core/src/components/modal/animations/md.leave.ts index b9fc0f5738..486253b400 100644 --- a/core/src/components/modal/animations/md.leave.ts +++ b/core/src/components/modal/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Modal Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -25,4 +25,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(200) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/modal/test/test.utils.ts b/core/src/components/modal/test/test.utils.ts index 4c5e772a89..762c23762a 100644 --- a/core/src/components/modal/test/test.utils.ts +++ b/core/src/components/modal/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testModal( +export const testModal = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('modal', type, rtl); @@ -39,4 +39,4 @@ export async function testModal( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/nav/view-controller.ts b/core/src/components/nav/view-controller.ts index 99903f2335..ab62b1b455 100644 --- a/core/src/components/nav/view-controller.ts +++ b/core/src/components/nav/view-controller.ts @@ -46,7 +46,7 @@ export class ViewController { } } -export function matches(view: ViewController | undefined, id: string, params: ComponentProps | undefined): view is ViewController { +export const matches = (view: ViewController | undefined, id: string, params: ComponentProps | undefined): view is ViewController => { if (!view) { return false; } @@ -76,9 +76,9 @@ export function matches(view: ViewController | undefined, id: string, params: Co } } return true; -} +}; -export function convertToView(page: any, params: ComponentProps | undefined): ViewController | null { +export const convertToView = (page: any, params: ComponentProps | undefined): ViewController | null => { if (!page) { return null; } @@ -86,9 +86,9 @@ export function convertToView(page: any, params: ComponentProps | undefined): Vi return page; } return new ViewController(page, params); -} +}; -export function convertToViews(pages: any[]): ViewController[] { +export const convertToViews = (pages: any[]): ViewController[] => { return pages.map(page => { if (page instanceof ViewController) { return page; @@ -98,4 +98,4 @@ export function convertToViews(pages: any[]): ViewController[] { } return convertToView(page, undefined); }).filter(v => v !== null) as ViewController[]; -} +}; diff --git a/core/src/components/picker-column/test/test.utils.ts b/core/src/components/picker-column/test/test.utils.ts index c984660e9d..e27431f165 100644 --- a/core/src/components/picker-column/test/test.utils.ts +++ b/core/src/components/picker-column/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { dragElementBy, generateE2EUrl, listenForEvent, waitForFunctionTestContext } from '../../../utils/test/utils'; -export async function testPickerColumn( +export const testPickerColumn = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('picker-column', type, rtl); @@ -53,4 +53,4 @@ export async function testPickerColumn( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/picker/animations/ios.enter.ts b/core/src/components/picker/animations/ios.enter.ts index 55ed754867..39fcb3c5e9 100644 --- a/core/src/components/picker/animations/ios.enter.ts +++ b/core/src/components/picker/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Picker Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(400) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/picker/animations/ios.leave.ts b/core/src/components/picker/animations/ios.leave.ts index 3a4787badf..6f8eea7d4b 100644 --- a/core/src/components/picker/animations/ios.leave.ts +++ b/core/src/components/picker/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Picker Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -22,4 +22,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(400) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/picker/picker.tsx b/core/src/components/picker/picker.tsx index 34fa951701..ef9d6da5b6 100644 --- a/core/src/components/picker/picker.tsx +++ b/core/src/components/picker/picker.tsx @@ -251,17 +251,17 @@ export class Picker implements ComponentInterface, OverlayInterface { } } -function buttonWrapperClass(button: PickerButton): CssClassMap { +const buttonWrapperClass = (button: PickerButton): CssClassMap => { return { [`picker-toolbar-${button.role}`]: button.role !== undefined, 'picker-toolbar-button': true }; -} +}; -function buttonClass(button: PickerButton): CssClassMap { +const buttonClass = (button: PickerButton): CssClassMap => { return { 'picker-button': true, 'ion-activatable': true, ...getClassMap(button.cssClass) }; -} +}; diff --git a/core/src/components/popover/animations/ios.enter.ts b/core/src/components/popover/animations/ios.enter.ts index 3f29ca6303..bb2d7e80b4 100644 --- a/core/src/components/popover/animations/ios.enter.ts +++ b/core/src/components/popover/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Popover Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev?: Event): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement, ev?: Event): Promise => { let originY = 'top'; let originX = 'left'; @@ -113,5 +113,6 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev .duration(100) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; + const POPOVER_IOS_BODY_PADDING = 5; diff --git a/core/src/components/popover/animations/ios.leave.ts b/core/src/components/popover/animations/ios.leave.ts index 85de24c8c4..89ce868689 100644 --- a/core/src/components/popover/animations/ios.leave.ts +++ b/core/src/components/popover/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Popover Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -21,4 +21,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): P .duration(500) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/popover/animations/md.enter.ts b/core/src/components/popover/animations/md.enter.ts index 1cef116f31..0a776b5263 100644 --- a/core/src/components/popover/animations/md.enter.ts +++ b/core/src/components/popover/animations/md.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Popover Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev?: Event): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: HTMLElement, ev?: Event): Promise => { const doc = (baseEl.ownerDocument as any); const isRTL = doc.dir === 'rtl'; @@ -106,5 +106,6 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: HTMLElement, ev? .add(wrapperAnimation) .add(contentAnimation) .add(viewportAnimation)); -} +}; + const POPOVER_MD_BODY_PADDING = 12; diff --git a/core/src/components/popover/animations/md.leave.ts b/core/src/components/popover/animations/md.leave.ts index a7b64d228f..5c5dc6a65d 100644 --- a/core/src/components/popover/animations/md.leave.ts +++ b/core/src/components/popover/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * Md Popover Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: HTMLElement): Promise => { const baseAnimation = new AnimationC(); const backdropAnimation = new AnimationC(); @@ -21,4 +21,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: HTMLElement): Pr .duration(500) .add(backdropAnimation) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/popover/test/test.utils.ts b/core/src/components/popover/test/test.utils.ts index ba05312465..341f30d299 100644 --- a/core/src/components/popover/test/test.utils.ts +++ b/core/src/components/popover/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testPopover( +export const testPopover = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('popover', type, rtl); @@ -39,4 +39,4 @@ export async function testPopover( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/range/range.tsx b/core/src/components/range/range.tsx index 7530d4664d..b386228096 100644 --- a/core/src/components/range/range.tsx +++ b/core/src/components/range/range.tsx @@ -483,7 +483,7 @@ interface RangeKnob { handleKeyboard: (name: KnobName, isIncrease: boolean) => void; } -function renderKnob(isRTL: boolean, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard }: RangeKnob) { +const renderKnob = (isRTL: boolean, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard }: RangeKnob) => { const start = isRTL ? 'right' : 'left'; const knobStyle = () => { @@ -529,21 +529,21 @@ function renderKnob(isRTL: boolean, { knob, value, ratio, min, max, disabled, pr ); -} +}; -function ratioToValue( +const ratioToValue = ( ratio: number, min: number, max: number, step: number -): number { +): number => { let value = (max - min) * ratio; if (step > 0) { value = Math.round(value / step) * step + min; } return clamp(min, value, max); -} +}; -function valueToRatio(value: number, min: number, max: number): number { +const valueToRatio = (value: number, min: number, max: number): number => { return clamp(0, (value - min) / (max - min), 1); -} +}; diff --git a/core/src/components/reorder-group/reorder-group.tsx b/core/src/components/reorder-group/reorder-group.tsx index aadca4c872..5982e13307 100644 --- a/core/src/components/reorder-group/reorder-group.tsx +++ b/core/src/components/reorder-group/reorder-group.tsx @@ -309,11 +309,11 @@ export class ReorderGroup implements ComponentInterface { } } -function indexForItem(element: any): number { +const indexForItem = (element: any): number => { return element['$ionIndex']; -} +}; -function findReorderItem(node: HTMLElement | null, container: HTMLElement): HTMLElement | undefined { +const findReorderItem = (node: HTMLElement | null, container: HTMLElement): HTMLElement | undefined => { let parent: HTMLElement | null; while (node) { parent = node.parentElement; @@ -323,15 +323,15 @@ function findReorderItem(node: HTMLElement | null, container: HTMLElement): HTML node = parent; } return undefined; -} +}; const AUTO_SCROLL_MARGIN = 60; const SCROLL_JUMP = 10; const ITEM_REORDER_SELECTED = 'reorder-selected'; -function reorderArray(array: any[], from: number, to: number): any[] { +const reorderArray = (array: any[], from: number, to: number): any[] => { const element = array[from]; array.splice(from, 1); array.splice(to, 0, element); return array.slice(); -} +}; diff --git a/core/src/components/reorder-group/test/interactive/e2e.ts b/core/src/components/reorder-group/test/interactive/e2e.ts index 5172415f7d..2de064f432 100644 --- a/core/src/components/reorder-group/test/interactive/e2e.ts +++ b/core/src/components/reorder-group/test/interactive/e2e.ts @@ -51,11 +51,11 @@ test('reorder: interactive', async () => { } }); -async function moveItem(id: string, page: pd.E2EPage, direction: 'up' | 'down' = 'up', numberOfSpaces = 1, ...parentSelectors: string[]) { +const moveItem = async (id: string, page: pd.E2EPage, direction: 'up' | 'down' = 'up', numberOfSpaces = 1, ...parentSelectors: string[]) => { try { await moveReorderItem(`#${id}`, page, direction, numberOfSpaces, ...parentSelectors); await page.waitFor(50); } catch (err) { throw err; } -} +}; diff --git a/core/src/components/reorder-group/test/test.utils.ts b/core/src/components/reorder-group/test/test.utils.ts index 747a8aef1a..d3e2b2400a 100644 --- a/core/src/components/reorder-group/test/test.utils.ts +++ b/core/src/components/reorder-group/test/test.utils.ts @@ -5,7 +5,7 @@ import { dragElementBy, queryDeep } from '../../../utils/test/utils'; /** * Moves a reorder item by simulating a drag event */ -export async function moveReorderItem(id: string, page: pd.E2EPage, direction: 'up' | 'down' = 'up', numberOfSpaces = 1, ...parentSelectors: string[]) { +export const moveReorderItem = async (id: string, page: pd.E2EPage, direction: 'up' | 'down' = 'up', numberOfSpaces = 1, ...parentSelectors: string[]) => { try { const reorderItem = parentSelectors && parentSelectors.length > 0 ? await (await queryDeep(page, ...parentSelectors)).$(id) : await page.$(id); @@ -19,4 +19,4 @@ export async function moveReorderItem(id: string, page: pd.E2EPage, direction: ' } catch (err) { throw err; } -} +}; diff --git a/core/src/components/ripple-effect/ripple-effect.tsx b/core/src/components/ripple-effect/ripple-effect.tsx index af9c906952..00d4a60334 100644 --- a/core/src/components/ripple-effect/ripple-effect.tsx +++ b/core/src/components/ripple-effect/ripple-effect.tsx @@ -89,12 +89,12 @@ export class RippleEffect implements ComponentInterface { } } -function removeRipple(ripple: HTMLElement) { +const removeRipple = (ripple: HTMLElement) => { ripple.classList.add('fade-out'); setTimeout(() => { ripple.remove(); }, 200); -} +}; const PADDING = 10; const INITIAL_ORIGIN_SCALE = 0.5; diff --git a/core/src/components/router/utils/debug.ts b/core/src/components/router/utils/debug.ts index 478702f00c..1649a40b51 100644 --- a/core/src/components/router/utils/debug.ts +++ b/core/src/components/router/utils/debug.ts @@ -1,7 +1,7 @@ import { RouteChain, RouteRedirect } from './interface'; import { generatePath } from './path'; -export function printRoutes(routes: RouteChain[]) { +export const printRoutes = (routes: RouteChain[]) => { console.group(`[ion-core] ROUTES[${routes.length}]`); for (const chain of routes) { const path: string[] = []; @@ -10,9 +10,9 @@ export function printRoutes(routes: RouteChain[]) { console.debug(`%c ${generatePath(path)}`, 'font-weight: bold; padding-left: 20px', '=>\t', `(${ids.join(', ')})`); } console.groupEnd(); -} +}; -export function printRedirects(redirects: RouteRedirect[]) { +export const printRedirects = (redirects: RouteRedirect[]) => { console.group(`[ion-core] REDIRECTS[${redirects.length}]`); for (const redirect of redirects) { if (redirect.to) { @@ -20,4 +20,4 @@ export function printRedirects(redirects: RouteRedirect[]) { } } console.groupEnd(); -} +}; diff --git a/core/src/components/router/utils/dom.ts b/core/src/components/router/utils/dom.ts index a95d46c19e..1330e4cfae 100644 --- a/core/src/components/router/utils/dom.ts +++ b/core/src/components/router/utils/dom.ts @@ -2,13 +2,13 @@ import { NavOutletElement, RouteChain, RouteID, RouterDirection } from '../../.. import { ROUTER_INTENT_NONE } from './constants'; -export async function writeNavState( +export const writeNavState = async ( root: HTMLElement | undefined, chain: RouteChain, direction: RouterDirection, index: number, changed = false -): Promise { +): Promise => { try { // find next navigation outlet in the DOM const outlet = searchNavNode(root); @@ -42,9 +42,9 @@ export async function writeNavState( console.error(e); return false; } -} +}; -export async function readNavState(root: HTMLElement | undefined) { +export const readNavState = async (root: HTMLElement | undefined) => { const ids: RouteID[] = []; let outlet: NavOutletElement | undefined; let node: HTMLElement | undefined = root; @@ -65,20 +65,20 @@ export async function readNavState(root: HTMLElement | undefined) { } } return { ids, outlet }; -} +}; -export function waitUntilNavNode() { +export const waitUntilNavNode = () => { if (searchNavNode(document.body)) { return Promise.resolve(); } return new Promise(resolve => { window.addEventListener('ionNavWillLoad', resolve, { once: true }); }); -} +}; const QUERY = ':not([no-router]) ion-nav, :not([no-router]) ion-tabs, :not([no-router]) ion-router-outlet'; -function searchNavNode(root: HTMLElement | undefined): NavOutletElement | undefined { +const searchNavNode = (root: HTMLElement | undefined): NavOutletElement | undefined => { if (!root) { return undefined; } @@ -87,4 +87,4 @@ function searchNavNode(root: HTMLElement | undefined): NavOutletElement | undefi } const outlet = root.querySelector(QUERY); return outlet ? outlet : undefined; -} +}; diff --git a/core/src/components/router/utils/matching.ts b/core/src/components/router/utils/matching.ts index a398e1b788..69c4d3c9ad 100644 --- a/core/src/components/router/utils/matching.ts +++ b/core/src/components/router/utils/matching.ts @@ -1,6 +1,6 @@ import { RouteChain, RouteID, RouteRedirect } from './interface'; -export function matchesRedirect(input: string[], route: RouteRedirect): route is RouteRedirect { +export const matchesRedirect = (input: string[], route: RouteRedirect): route is RouteRedirect => { const { from, to } = route; if (to === undefined) { return false; @@ -20,13 +20,13 @@ export function matchesRedirect(input: string[], route: RouteRedirect): route is } } return from.length === input.length; -} +}; -export function routeRedirect(path: string[], routes: RouteRedirect[]) { +export const routeRedirect = (path: string[], routes: RouteRedirect[]) => { return routes.find(route => matchesRedirect(path, route)) as RouteRedirect | undefined; -} +}; -export function matchesIDs(ids: string[], chain: RouteChain): number { +export const matchesIDs = (ids: string[], chain: RouteChain): number => { const len = Math.min(ids.length, chain.length); let i = 0; for (; i < len; i++) { @@ -35,9 +35,9 @@ export function matchesIDs(ids: string[], chain: RouteChain): number { } } return i; -} +}; -export function matchesPath(inputPath: string[], chain: RouteChain): RouteChain | null { +export const matchesPath = (inputPath: string[], chain: RouteChain): RouteChain | null => { const segments = new RouterSegments(inputPath); let matchesDefault = false; let allparams: any[] | undefined; @@ -78,9 +78,9 @@ export function matchesPath(inputPath: string[], chain: RouteChain): RouteChain })); } return chain; -} +}; -export function mergeParams(a: any, b: any): any { +export const mergeParams = (a: any, b: any): any => { if (!a && b) { return b; } else if (a && !b) { @@ -92,9 +92,9 @@ export function mergeParams(a: any, b: any): any { }; } return undefined; -} +}; -export function routerIDsToChain(ids: RouteID[], chains: RouteChain[]): RouteChain | null { +export const routerIDsToChain = (ids: RouteID[], chains: RouteChain[]): RouteChain | null => { let match: RouteChain | null = null; let maxMatches = 0; const plainIDs = ids.map(i => i.id); @@ -113,9 +113,9 @@ export function routerIDsToChain(ids: RouteID[], chains: RouteChain[]): RouteCha })); } return null; -} +}; -export function routerPathToChain(path: string[], chains: RouteChain[]): RouteChain | null { +export const routerPathToChain = (path: string[], chains: RouteChain[]): RouteChain | null => { let match: RouteChain | null = null; let matches = 0; for (const chain of chains) { @@ -129,9 +129,9 @@ export function routerPathToChain(path: string[], chains: RouteChain[]): RouteCh } } return match; -} +}; -export function computePriority(chain: RouteChain): number { +export const computePriority = (chain: RouteChain): number => { let score = 1; let level = 1; for (const route of chain) { @@ -145,7 +145,7 @@ export function computePriority(chain: RouteChain): number { } } return score; -} +}; export class RouterSegments { private path: string[]; diff --git a/core/src/components/router/utils/parser.ts b/core/src/components/router/utils/parser.ts index 2a8a0789e9..9aa8e48329 100644 --- a/core/src/components/router/utils/parser.ts +++ b/core/src/components/router/utils/parser.ts @@ -1,7 +1,7 @@ import { RouteChain, RouteNode, RouteRedirect, RouteTree } from './interface'; import { parsePath } from './path'; -export function readRedirects(root: Element): RouteRedirect[] { +export const readRedirects = (root: Element): RouteRedirect[] => { return (Array.from(root.children) as HTMLIonRouteRedirectElement[]) .filter(el => el.tagName === 'ION-ROUTE-REDIRECT') .map(el => { @@ -11,13 +11,13 @@ export function readRedirects(root: Element): RouteRedirect[] { to: to == null ? undefined : parsePath(to), }; }); -} +}; -export function readRoutes(root: Element): RouteChain[] { +export const readRoutes = (root: Element): RouteChain[] => { return flattenRouterTree(readRouteNodes(root)); -} +}; -export function readRouteNodes(root: Element, node = root): RouteTree { +export const readRouteNodes = (root: Element, node = root): RouteTree => { return (Array.from(node.children) as HTMLIonRouteElement[]) .filter(el => el.tagName === 'ION-ROUTE' && el.component) .map(el => { @@ -32,9 +32,9 @@ export function readRouteNodes(root: Element, node = root): RouteTree { children: readRouteNodes(root, el) }; }); -} +}; -export function readProp(el: HTMLElement, prop: string): string | null | undefined { +export const readProp = (el: HTMLElement, prop: string): string | null | undefined => { if (prop in el) { return (el as any)[prop]; } @@ -42,17 +42,17 @@ export function readProp(el: HTMLElement, prop: string): string | null | undefin return el.getAttribute(prop); } return null; -} +}; -export function flattenRouterTree(nodes: RouteTree): RouteChain[] { +export const flattenRouterTree = (nodes: RouteTree): RouteChain[] => { const routes: RouteChain[] = []; for (const node of nodes) { flattenNode([], routes, node); } return routes; -} +}; -function flattenNode(chain: RouteChain, routes: RouteChain[], node: RouteNode) { +const flattenNode = (chain: RouteChain, routes: RouteChain[], node: RouteNode) => { const s = chain.slice(); s.push({ id: node.id, @@ -67,4 +67,4 @@ function flattenNode(chain: RouteChain, routes: RouteChain[], node: RouteNode) { for (const sub of node.children) { flattenNode(s, routes, sub); } -} +}; diff --git a/core/src/components/router/utils/path.ts b/core/src/components/router/utils/path.ts index 16f91baaa3..e0acb1748a 100644 --- a/core/src/components/router/utils/path.ts +++ b/core/src/components/router/utils/path.ts @@ -2,15 +2,15 @@ import { RouteChain, RouterDirection } from '../../../interface'; import { ROUTER_INTENT_FORWARD } from './constants'; -export function generatePath(segments: string[]): string { +export const generatePath = (segments: string[]): string => { const path = segments .filter(s => s.length > 0) .join('/'); return '/' + path; -} +}; -export function chainToPath(chain: RouteChain): string[] | null { +export const chainToPath = (chain: RouteChain): string[] | null => { const path = []; for (const route of chain) { for (const segment of route.path) { @@ -26,9 +26,9 @@ export function chainToPath(chain: RouteChain): string[] | null { } } return path; -} +}; -export function writePath(history: History, root: string, useHash: boolean, path: string[], direction: RouterDirection, state: number) { +export const writePath = (history: History, root: string, useHash: boolean, path: string[], direction: RouterDirection, state: number) => { let url = generatePath([ ...parsePath(root), ...path @@ -41,9 +41,9 @@ export function writePath(history: History, root: string, useHash: boolean, path } else { history.replaceState(state, '', url); } -} +}; -export function removePrefix(prefix: string[], path: string[]): string[] | null { +export const removePrefix = (prefix: string[], path: string[]): string[] | null => { if (prefix.length > path.length) { return null; } @@ -59,9 +59,9 @@ export function removePrefix(prefix: string[], path: string[]): string[] | null return ['']; } return path.slice(prefix.length); -} +}; -export function readPath(loc: Location, root: string, useHash: boolean): string[] | null { +export const readPath = (loc: Location, root: string, useHash: boolean): string[] | null => { let pathname = loc.pathname; if (useHash) { const hash = loc.hash; @@ -73,9 +73,9 @@ export function readPath(loc: Location, root: string, useHash: boolean): string[ const prefix = parsePath(root); const path = parsePath(pathname); return removePrefix(prefix, path); -} +}; -export function parsePath(path: string | undefined | null): string[] { +export const parsePath = (path: string | undefined | null): string[] => { if (path == null) { return ['']; } @@ -88,4 +88,4 @@ export function parsePath(path: string | undefined | null): string[] { } else { return segments; } -} +}; diff --git a/core/src/components/select/select.tsx b/core/src/components/select/select.tsx index 298a61f93f..e9c2047393 100644 --- a/core/src/components/select/select.tsx +++ b/core/src/components/select/select.tsx @@ -496,7 +496,7 @@ export class Select implements ComponentInterface { } } -function parseValue(value: any) { +const parseValue = (value: any) => { if (value == null) { return undefined; } @@ -504,9 +504,9 @@ function parseValue(value: any) { return value.join(','); } return value.toString(); -} +}; -function isOptionSelected(currentValue: any[] | any, compareValue: any, compareWith?: string | SelectCompareFn | null) { +const isOptionSelected = (currentValue: any[] | any, compareValue: any, compareWith?: string | SelectCompareFn | null) => { if (currentValue === undefined) { return false; } @@ -515,9 +515,9 @@ function isOptionSelected(currentValue: any[] | any, compareValue: any, compareW } else { return compareOptions(currentValue, compareValue, compareWith); } -} +}; -function compareOptions(currentValue: any, compareValue: any, compareWith?: string | SelectCompareFn | null): boolean { +const compareOptions = (currentValue: any, compareValue: any, compareWith?: string | SelectCompareFn | null): boolean => { if (typeof compareWith === 'function') { return compareWith(currentValue, compareValue); } else if (typeof compareWith === 'string') { @@ -525,9 +525,9 @@ function compareOptions(currentValue: any, compareValue: any, compareWith?: stri } else { return currentValue === compareValue; } -} +}; -function generateText(opts: HTMLIonSelectOptionElement[], value: any | any[], compareWith?: string | SelectCompareFn | null) { +const generateText = (opts: HTMLIonSelectOptionElement[], value: any | any[], compareWith?: string | SelectCompareFn | null) => { if (value === undefined) { return ''; } @@ -539,15 +539,15 @@ function generateText(opts: HTMLIonSelectOptionElement[], value: any | any[], co } else { return textForValue(opts, value, compareWith) || ''; } -} +}; -function textForValue(opts: HTMLIonSelectOptionElement[], value: any, compareWith?: string | SelectCompareFn | null): string | null { +const textForValue = (opts: HTMLIonSelectOptionElement[], value: any, compareWith?: string | SelectCompareFn | null): string | null => { const selectOpt = opts.find(opt => { return compareOptions(opt.value, value, compareWith); }); return selectOpt ? selectOpt.textContent : null; -} +}; let selectIds = 0; diff --git a/core/src/components/spinner/spinner.tsx b/core/src/components/spinner/spinner.tsx index 9922b5e15d..05bcb1cb7b 100644 --- a/core/src/components/spinner/spinner.tsx +++ b/core/src/components/spinner/spinner.tsx @@ -80,7 +80,7 @@ export class Spinner implements ComponentInterface { } } -function buildCircle(spinner: SpinnerConfig, duration: number, index: number, total: number) { +const buildCircle = (spinner: SpinnerConfig, duration: number, index: number, total: number) => { const data = spinner.fn(duration, index, total); data.style['animation-duration'] = `${duration}ms`; @@ -89,9 +89,9 @@ function buildCircle(spinner: SpinnerConfig, duration: number, index: number, to ); -} +}; -function buildLine(spinner: SpinnerConfig, duration: number, index: number, total: number) { +const buildLine = (spinner: SpinnerConfig, duration: number, index: number, total: number) => { const data = spinner.fn(duration, index, total); data.style['animation-duration'] = `${duration}ms`; @@ -100,4 +100,4 @@ function buildLine(spinner: SpinnerConfig, duration: number, index: number, tota ); -} +}; diff --git a/core/src/components/split-pane/split-pane.tsx b/core/src/components/split-pane/split-pane.tsx index 157c19b56c..69031405f9 100644 --- a/core/src/components/split-pane/split-pane.tsx +++ b/core/src/components/split-pane/split-pane.tsx @@ -164,7 +164,7 @@ export class SplitPane implements ComponentInterface { } } -function setPaneClass(el: HTMLElement, isMain: boolean) { +const setPaneClass = (el: HTMLElement, isMain: boolean) => { let toAdd; let toRemove; if (isMain) { @@ -177,4 +177,4 @@ function setPaneClass(el: HTMLElement, isMain: boolean) { const classList = el.classList; classList.add(toAdd); classList.remove(toRemove); -} +}; diff --git a/core/src/components/toast/animations/ios.enter.ts b/core/src/components/toast/animations/ios.enter.ts index f738c21967..116fd5b008 100644 --- a/core/src/components/toast/animations/ios.enter.ts +++ b/core/src/components/toast/animations/ios.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Toast Enter Animation */ -export function iosEnterAnimation(AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise { +export const iosEnterAnimation = (AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise => { const baseAnimation = new AnimationC(); const wrapperAnimation = new AnimationC(); @@ -36,4 +36,4 @@ export function iosEnterAnimation(AnimationC: Animation, baseEl: ShadowRoot, pos .easing('cubic-bezier(.155,1.105,.295,1.12)') .duration(400) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/toast/animations/ios.leave.ts b/core/src/components/toast/animations/ios.leave.ts index 9ee06c70ab..db26035b2b 100644 --- a/core/src/components/toast/animations/ios.leave.ts +++ b/core/src/components/toast/animations/ios.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * iOS Toast Leave Animation */ -export function iosLeaveAnimation(AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise { +export const iosLeaveAnimation = (AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise => { const baseAnimation = new AnimationC(); const wrapperAnimation = new AnimationC(); @@ -32,4 +32,4 @@ export function iosLeaveAnimation(AnimationC: Animation, baseEl: ShadowRoot, pos .easing('cubic-bezier(.36,.66,.04,1)') .duration(300) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/toast/animations/md.enter.ts b/core/src/components/toast/animations/md.enter.ts index 8d72e59b9f..00c6f27db8 100644 --- a/core/src/components/toast/animations/md.enter.ts +++ b/core/src/components/toast/animations/md.enter.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * MD Toast Enter Animation */ -export function mdEnterAnimation(AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise { +export const mdEnterAnimation = (AnimationC: Animation, baseEl: ShadowRoot, position: string): Promise => { const baseAnimation = new AnimationC(); const wrapperAnimation = new AnimationC(); @@ -38,4 +38,4 @@ export function mdEnterAnimation(AnimationC: Animation, baseEl: ShadowRoot, posi .easing('cubic-bezier(.36,.66,.04,1)') .duration(400) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/toast/animations/md.leave.ts b/core/src/components/toast/animations/md.leave.ts index f07b8359c3..da8fa7d586 100644 --- a/core/src/components/toast/animations/md.leave.ts +++ b/core/src/components/toast/animations/md.leave.ts @@ -3,7 +3,7 @@ import { Animation } from '../../../interface'; /** * md Toast Leave Animation */ -export function mdLeaveAnimation(AnimationC: Animation, baseEl: ShadowRoot): Promise { +export const mdLeaveAnimation = (AnimationC: Animation, baseEl: ShadowRoot): Promise => { const baseAnimation = new AnimationC(); const wrapperAnimation = new AnimationC(); @@ -20,4 +20,4 @@ export function mdLeaveAnimation(AnimationC: Animation, baseEl: ShadowRoot): Pro .easing('cubic-bezier(.36,.66,.04,1)') .duration(300) .add(wrapperAnimation)); -} +}; diff --git a/core/src/components/toast/test/test.utils.ts b/core/src/components/toast/test/test.utils.ts index dfc81a63dd..115905cfc6 100644 --- a/core/src/components/toast/test/test.utils.ts +++ b/core/src/components/toast/test/test.utils.ts @@ -2,11 +2,11 @@ import { newE2EPage } from '@stencil/core/testing'; import { generateE2EUrl } from '../../../utils/test/utils'; -export async function testToast( +export const testToast = async ( type: string, selector: string, rtl = false -) { +) => { try { const pageUrl = generateE2EUrl('toast', type, rtl); @@ -45,4 +45,4 @@ export async function testToast( } catch (err) { throw err; } -} +}; diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx index 726d2cf238..81627ad131 100644 --- a/core/src/components/toast/toast.tsx +++ b/core/src/components/toast/toast.tsx @@ -301,7 +301,7 @@ export class Toast implements ComponentInterface, OverlayInterface { } } -function buttonClass(button: ToastButton): CssClassMap { +const buttonClass = (button: ToastButton): CssClassMap => { return { 'toast-button': true, 'toast-button-icon-only': button.icon !== undefined && button.text === undefined, @@ -310,4 +310,4 @@ function buttonClass(button: ToastButton): CssClassMap { 'ion-activatable': true, ...getClassMap(button.cssClass) }; -} +}; diff --git a/core/src/components/toggle/toggle.tsx b/core/src/components/toggle/toggle.tsx index 0266b5b688..bfc3b600eb 100644 --- a/core/src/components/toggle/toggle.tsx +++ b/core/src/components/toggle/toggle.tsx @@ -216,7 +216,7 @@ export class Toggle implements ComponentInterface { } } -function shouldToggle(doc: HTMLDocument, checked: boolean, deltaX: number, margin: number): boolean { +const shouldToggle = (doc: HTMLDocument, checked: boolean, deltaX: number, margin: number): boolean => { const isRTL = doc.dir === 'rtl'; if (checked) { @@ -226,6 +226,6 @@ function shouldToggle(doc: HTMLDocument, checked: boolean, deltaX: number, margi return (!isRTL && (- margin < deltaX)) || (isRTL && (margin > deltaX)); } -} +}; let toggleIds = 0; diff --git a/core/src/components/virtual-scroll/virtual-scroll-utils.ts b/core/src/components/virtual-scroll/virtual-scroll-utils.ts index aa01cb64eb..a11d9df119 100644 --- a/core/src/components/virtual-scroll/virtual-scroll-utils.ts +++ b/core/src/components/virtual-scroll/virtual-scroll-utils.ts @@ -15,7 +15,7 @@ export interface Range { const MIN_READS = 2; -export function updateVDom(dom: VirtualNode[], heightIndex: Uint32Array, cells: Cell[], range: Range) { +export const updateVDom = (dom: VirtualNode[], heightIndex: Uint32Array, cells: Cell[], range: Range) => { // reset dom for (const node of dom) { node.change = NODE_CHANGE_NONE; @@ -63,19 +63,19 @@ export function updateVDom(dom: VirtualNode[], heightIndex: Uint32Array, cells: } } dom - .filter(n => n.d && n.top !== -9999) - .forEach(n => { - n.change = NODE_CHANGE_POSITION; - n.top = -9999; - }); -} + .filter(n => n.d && n.top !== -9999) + .forEach(n => { + n.change = NODE_CHANGE_POSITION; + n.top = -9999; + }); +}; -export function doRender( +export const doRender = ( el: HTMLElement, nodeRender: ItemRenderFn, dom: VirtualNode[], updateCellHeight: (cell: Cell, node: HTMLElement) => void -) { +) => { const children = Array.from(el.children).filter(n => n.tagName !== 'TEMPLATE'); const childrenNu = children.length; let child: HTMLElement; @@ -121,32 +121,32 @@ export function doRender( cell.reads--; } } -} +}; -function createNode(el: HTMLElement, type: CellType): HTMLElement | null { +const createNode = (el: HTMLElement, type: CellType): HTMLElement | null => { const template = getTemplate(el, type); if (template && el.ownerDocument) { return el.ownerDocument.importNode(template.content, true).children[0] as HTMLElement; } return null; -} +}; -function getTemplate(el: HTMLElement, type: CellType): HTMLTemplateElement | null { +const getTemplate = (el: HTMLElement, type: CellType): HTMLTemplateElement | null => { switch (type) { case CELL_TYPE_ITEM: return el.querySelector('template:not([name])'); case CELL_TYPE_HEADER: return el.querySelector('template[name=header]'); case CELL_TYPE_FOOTER: return el.querySelector('template[name=footer]'); } -} +}; -export function getViewport(scrollTop: number, vierportHeight: number, margin: number): Viewport { +export const getViewport = (scrollTop: number, vierportHeight: number, margin: number): Viewport => { return { top: Math.max(scrollTop - margin, 0), bottom: scrollTop + vierportHeight + margin }; -} +}; -export function getRange(heightIndex: Uint32Array, viewport: Viewport, buffer: number): Range { +export const getRange = (heightIndex: Uint32Array, viewport: Viewport, buffer: number): Range => { const topPos = viewport.top; const bottomPos = viewport.bottom; @@ -169,18 +169,18 @@ export function getRange(heightIndex: Uint32Array, viewport: Viewport, buffer: n const end = Math.min(i + buffer, heightIndex.length); const length = end - offset; return { offset, length }; -} +}; -export function getShouldUpdate(dirtyIndex: number, currentRange: Range, range: Range) { +export const getShouldUpdate = (dirtyIndex: number, currentRange: Range, range: Range) => { const end = range.offset + range.length; return ( dirtyIndex <= end || currentRange.offset !== range.offset || currentRange.length !== range.length ); -} +}; -export function findCellIndex(cells: Cell[], index: number): number { +export const findCellIndex = (cells: Cell[], index: number): number => { const max = cells.length > 0 ? cells[cells.length - 1].index : 0; if (index === 0) { return 0; @@ -189,9 +189,9 @@ export function findCellIndex(cells: Cell[], index: number): number { } else { return cells.findIndex(c => c.index === index); } -} +}; -export function inplaceUpdate(dst: Cell[], src: Cell[], offset: number) { +export const inplaceUpdate = (dst: Cell[], src: Cell[], offset: number) => { if (offset === 0 && src.length >= dst.length) { return src; } @@ -199,9 +199,9 @@ export function inplaceUpdate(dst: Cell[], src: Cell[], offset: number) { dst[i + offset] = src[i]; } return dst; -} +}; -export function calcCells( +export const calcCells = ( items: any[], itemHeight: ItemHeightFn | undefined, @@ -215,7 +215,7 @@ export function calcCells( j: number, offset: number, len: number -): Cell[] { +): Cell[] => { const cells: Cell[] = []; const end = len + offset; for (let i = offset; i < end; i++) { @@ -261,18 +261,18 @@ export function calcCells( } } return cells; -} +}; -export function calcHeightIndex(buf: Uint32Array, cells: Cell[], index: number): number { +export const calcHeightIndex = (buf: Uint32Array, cells: Cell[], index: number): number => { let acum = buf[index]; for (let i = index; i < buf.length; i++) { buf[i] = acum; acum += cells[i].height; } return acum; -} +}; -export function resizeBuffer(buf: Uint32Array | undefined, len: number) { +export const resizeBuffer = (buf: Uint32Array | undefined, len: number) => { if (!buf) { return new Uint32Array(len); } @@ -285,12 +285,12 @@ export function resizeBuffer(buf: Uint32Array | undefined, len: number) { } else { return buf.subarray(0, len); } -} +}; -export function positionForIndex(index: number, cells: Cell[], heightIndex: Uint32Array): number { +export const positionForIndex = (index: number, cells: Cell[], heightIndex: Uint32Array): number => { const cell = cells.find(c => c.type === CELL_TYPE_ITEM && c.index === index); if (cell) { return heightIndex[cell.i]; } return -1; -} +}; diff --git a/core/src/global/ionic-global.ts b/core/src/global/ionic-global.ts index 5e0657424e..e1ff792518 100644 --- a/core/src/global/ionic-global.ts +++ b/core/src/global/ionic-global.ts @@ -9,11 +9,11 @@ declare const Context: any; let mode: Mode; -export function getIonMode(ref?: any): Mode { +export const getIonMode = (ref?: any): Mode => { return (ref && getMode(ref)) || mode; -} +}; -export default function() { +export default () => { const doc = document; const win = window; Context.config = config; @@ -52,5 +52,4 @@ export default function() { setMode( (elm: any) => (elm as any).mode = (elm as any).mode || elm.getAttribute('mode') || mode ); - -} +}; diff --git a/core/src/utils/animation/animator.ts b/core/src/utils/animation/animator.ts index 1fc64f436a..72bdd6648d 100644 --- a/core/src/utils/animation/animator.ts +++ b/core/src/utils/animation/animator.ts @@ -515,7 +515,7 @@ export class Animator { _asyncEnd(dur: number, shouldComplete: boolean) { const self = this; - function onTransitionEnd() { + const onTransitionEnd = () => { // congrats! a successful transition completed! // ensure transition end events and timeouts have been cleared self._clearAsync(); @@ -525,9 +525,9 @@ export class Animator { // transition finished self._didFinishAll(shouldComplete, true, false); - } + }; - function onTransitionFallback() { + const onTransitionFallback = () => { // oh noz! the transition end event didn't fire in time! // instead the fallback timer when first // if all goes well this fallback should never fire @@ -542,7 +542,7 @@ export class Animator { // transition finished self._didFinishAll(shouldComplete, true, false); - } + }; // set the TRANSITION END event on one of the transition elements self._unregisterTrnsEnd = transitionEnd(self._transEl(), onTransitionEnd); diff --git a/core/src/utils/animation/index.ts b/core/src/utils/animation/index.ts index aca054e577..6e8d3dd5fc 100644 --- a/core/src/utils/animation/index.ts +++ b/core/src/utils/animation/index.ts @@ -2,9 +2,9 @@ import { Animation, AnimationBuilder } from '../../interface'; import { Animator } from './animator'; -export function create(animationBuilder?: AnimationBuilder, baseEl?: any, opts?: any): Promise { +export const create = (animationBuilder?: AnimationBuilder, baseEl?: any, opts?: any): Promise => { if (animationBuilder) { return animationBuilder(Animator as any, baseEl, opts); } return Promise.resolve(new Animator() as any); -} +}; diff --git a/core/src/utils/animation/transition-end.ts b/core/src/utils/animation/transition-end.ts index 9568cb103d..a7e51e0dd8 100644 --- a/core/src/utils/animation/transition-end.ts +++ b/core/src/utils/animation/transition-end.ts @@ -1,20 +1,20 @@ -export function transitionEnd(el: HTMLElement | null, callback: (ev?: TransitionEvent) => void) { +export const transitionEnd = (el: HTMLElement | null, callback: (ev?: TransitionEvent) => void) => { let unRegTrans: (() => void) | undefined; const opts: any = { passive: true }; - function unregister() { + const unregister = () => { if (unRegTrans) { unRegTrans(); } - } + }; - function onTransitionEnd(ev: Event) { + const onTransitionEnd = (ev: Event) => { if (el === ev.target) { unregister(); callback(ev as TransitionEvent); } - } + }; if (el) { el.addEventListener('webkitTransitionEnd', onTransitionEnd, opts); @@ -27,4 +27,4 @@ export function transitionEnd(el: HTMLElement | null, callback: (ev?: Transition } return unregister; -} +}; diff --git a/core/src/utils/config.ts b/core/src/utils/config.ts index bfd3fcc58d..bd3377ac40 100644 --- a/core/src/utils/config.ts +++ b/core/src/utils/config.ts @@ -180,7 +180,7 @@ export interface IonicConfig { _zoneGate?: (h: () => any) => any; } -export function setupConfig(config: IonicConfig) { +export const setupConfig = (config: IonicConfig) => { const win = window as any; const Ionic = win.Ionic; if (Ionic && Ionic.config && Ionic.config.constructor.name !== 'Object') { @@ -193,4 +193,4 @@ export function setupConfig(config: IonicConfig) { ...config }; return win.Ionic.config; -} +}; diff --git a/core/src/utils/focus-visible.ts b/core/src/utils/focus-visible.ts index 5085ac8238..db1ce05ac9 100644 --- a/core/src/utils/focus-visible.ts +++ b/core/src/utils/focus-visible.ts @@ -3,17 +3,21 @@ const ION_FOCUSED = 'ion-focused'; const ION_FOCUSABLE = 'ion-focusable'; const FOCUS_KEYS = ['Tab', 'ArrowDown', 'Space', 'Escape', ' ', 'Shift', 'Enter', 'ArrowLeft', 'ArrowRight', 'ArrowUp']; -export function startFocusVisible() { - const doc = document; +export const startFocusVisible = () => { let currentFocus: Element[] = []; let keyboardMode = true; - function setFocus(elements: Element[]) { + const doc = document; + const setFocus = (elements: Element[]) => { currentFocus.forEach(el => el.classList.remove(ION_FOCUSED)); elements.forEach(el => el.classList.add(ION_FOCUSED)); currentFocus = elements; - } + }; + const pointerDown = () => { + keyboardMode = false; + setFocus([]); + }; doc.addEventListener('keydown', ev => { keyboardMode = FOCUS_KEYS.includes(ev.key); @@ -22,10 +26,6 @@ export function startFocusVisible() { } }); - const pointerDown = () => { - keyboardMode = false; - setFocus([]); - }; doc.addEventListener('focusin', ev => { if (keyboardMode && ev.composedPath) { const toFocus = ev.composedPath().filter((el: any) => { @@ -44,4 +44,4 @@ export function startFocusVisible() { }); doc.addEventListener('touchstart', pointerDown); doc.addEventListener('mousedown', pointerDown); -} +}; diff --git a/core/src/utils/framework-delegate.ts b/core/src/utils/framework-delegate.ts index c65fa628e5..3c1a9e1764 100644 --- a/core/src/utils/framework-delegate.ts +++ b/core/src/utils/framework-delegate.ts @@ -1,12 +1,12 @@ import { ComponentRef, FrameworkDelegate } from '../interface'; -export async function attachComponent( +export const attachComponent = async ( delegate: FrameworkDelegate | undefined, container: Element, component: ComponentRef, cssClasses?: string[], - componentProps?: {[key: string]: any} -): Promise { + componentProps?: { [key: string]: any } +): Promise => { if (delegate) { return delegate.attachViewToDom(container, component, componentProps, cssClasses); } @@ -30,9 +30,9 @@ export async function attachComponent( await el.componentOnReady(); } return el; -} +}; -export function detachComponent(delegate: FrameworkDelegate | undefined, element: HTMLElement | undefined) { +export const detachComponent = (delegate: FrameworkDelegate | undefined, element: HTMLElement | undefined) => { if (element) { if (delegate) { const container = element.parentElement; @@ -41,4 +41,4 @@ export function detachComponent(delegate: FrameworkDelegate | undefined, element element.remove(); } return Promise.resolve(); -} +}; diff --git a/core/src/utils/gesture/index.ts b/core/src/utils/gesture/index.ts index 5850915ccb..717e5247c8 100644 --- a/core/src/utils/gesture/index.ts +++ b/core/src/utils/gesture/index.ts @@ -4,7 +4,12 @@ import { GESTURE_CONTROLLER } from './gesture-controller'; import { createPointerEvents } from './pointer-events'; import { createPanRecognizer } from './recognizers'; -export function createGesture(config: GestureConfig): Gesture { +export const createGesture = (config: GestureConfig): Gesture => { + let hasCapturedPan = false; + let hasStartedPan = false; + let hasFiredStart = true; + let isMoveQueued = false; + const finalConfig = { disableScroll: false, direction: 'x', @@ -40,16 +45,6 @@ export function createGesture(config: GestureConfig): Gesture { data: undefined }; - const pointerEvents = createPointerEvents( - finalConfig.el, - pointerDown, - pointerMove, - pointerUp, - { - capture: false, - } - ); - const pan = createPanRecognizer(finalConfig.direction, finalConfig.threshold, finalConfig.maxAngle); const gesture = GESTURE_CONTROLLER.createGesture({ name: config.gestureName, @@ -57,12 +52,7 @@ export function createGesture(config: GestureConfig): Gesture { disableScroll: config.disableScroll }); - let hasCapturedPan = false; - let hasStartedPan = false; - let hasFiredStart = true; - let isMoveQueued = false; - - function pointerDown(ev: UIEvent): boolean { + const pointerDown = (ev: UIEvent): boolean => { const timeStamp = now(ev); if (hasStartedPan || !hasFiredStart) { return false; @@ -93,9 +83,9 @@ export function createGesture(config: GestureConfig): Gesture { } pan.start(detail.startX, detail.startY); return true; - } + }; - function pointerMove(ev: UIEvent) { + const pointerMove = (ev: UIEvent) => { // fast path, if gesture is currently captured // do minimum job to get user-land even dispatched if (hasCapturedPan) { @@ -114,9 +104,9 @@ export function createGesture(config: GestureConfig): Gesture { abortGesture(); } } - } + }; - function fireOnMove() { + const fireOnMove = () => { // Since fireOnMove is called inside a RAF, onEnd() might be called, // we must double check hasCapturedPan if (!hasCapturedPan) { @@ -126,9 +116,9 @@ export function createGesture(config: GestureConfig): Gesture { if (onMove) { onMove(detail); } - } + }; - function tryToCapturePan(): boolean { + const tryToCapturePan = (): boolean => { if (gesture && !gesture.capture()) { return false; } @@ -151,35 +141,27 @@ export function createGesture(config: GestureConfig): Gesture { fireOnStart(); } return true; - } + }; - function fireOnStart() { + const fireOnStart = () => { if (onStart) { onStart(detail); } hasFiredStart = true; - } + }; - function abortGesture() { - reset(); - pointerEvents.stop(); - if (notCaptured) { - notCaptured(detail); - } - } - - function reset() { + const reset = () => { hasCapturedPan = false; hasStartedPan = false; isMoveQueued = false; hasFiredStart = true; gesture.release(); - } + }; // END ************************* - function pointerUp(ev: UIEvent | undefined) { + const pointerUp = (ev: UIEvent | undefined) => { const tmpHasCaptured = hasCapturedPan; const tmpHasFiredStart = hasFiredStart; reset(); @@ -201,7 +183,25 @@ export function createGesture(config: GestureConfig): Gesture { if (notCaptured) { notCaptured(detail); } - } + }; + + const pointerEvents = createPointerEvents( + finalConfig.el, + pointerDown, + pointerMove, + pointerUp, + { + capture: false, + } + ); + + const abortGesture = () => { + reset(); + pointerEvents.stop(); + if (notCaptured) { + notCaptured(detail); + } + }; return { setDisabled(disabled: boolean) { @@ -215,9 +215,9 @@ export function createGesture(config: GestureConfig): Gesture { pointerEvents.destroy(); } }; -} +}; -function calcGestureData(detail: GestureDetail, ev: UIEvent | undefined) { +const calcGestureData = (detail: GestureDetail, ev: UIEvent | undefined) => { if (!ev) { return; } @@ -240,9 +240,9 @@ function calcGestureData(detail: GestureDetail, ev: UIEvent | undefined) { detail.deltaX = currentX - detail.startX; detail.deltaY = currentY - detail.startY; detail.event = ev; -} +}; -function updateDetail(ev: any, detail: GestureDetail) { +const updateDetail = (ev: any, detail: GestureDetail) => { // get X coordinates for either a mouse click // or a touch depending on the given event let x = 0; @@ -260,11 +260,11 @@ function updateDetail(ev: any, detail: GestureDetail) { } detail.currentX = x; detail.currentY = y; -} +}; -function now(ev: UIEvent) { +const now = (ev: UIEvent) => { return ev.timeStamp || Date.now(); -} +}; export interface GestureDetail { type: string; diff --git a/core/src/utils/gesture/listener.ts b/core/src/utils/gesture/listener.ts index e1d140a5d7..ff92b03a39 100644 --- a/core/src/utils/gesture/listener.ts +++ b/core/src/utils/gesture/listener.ts @@ -1,5 +1,5 @@ -export function addEventListener( +export const addEventListener = ( el: any, eventName: string, callback: EventListenerOrEventListenerObject, @@ -7,13 +7,13 @@ export function addEventListener( passive?: boolean; capture?: boolean } -): () => void { +): (() => void) => { // use event listener options when supported // otherwise it's just a boolean for the "capture" arg const listenerOpts = supportsPassive(el) ? { - 'capture': !!opts.capture, - 'passive': !!opts.passive, - } : !!opts.capture; + 'capture': !!opts.capture, + 'passive': !!opts.passive, + } : !!opts.capture; let add: string; let remove: string; @@ -29,11 +29,9 @@ export function addEventListener( return () => { el[remove](eventName, callback, listenerOpts); }; -} +}; -let _sPassive: boolean | undefined; - -function supportsPassive(node: Node) { +const supportsPassive = (node: Node) => { if (_sPassive === undefined) { try { const opts = Object.defineProperty({}, 'passive', { @@ -47,4 +45,6 @@ function supportsPassive(node: Node) { } } return !!_sPassive; -} +}; + +let _sPassive: boolean | undefined; diff --git a/core/src/utils/gesture/pointer-events.ts b/core/src/utils/gesture/pointer-events.ts index b6789ed255..b8a0d5aa62 100644 --- a/core/src/utils/gesture/pointer-events.ts +++ b/core/src/utils/gesture/pointer-events.ts @@ -2,13 +2,13 @@ import { addEventListener } from './listener'; const MOUSE_WAIT = 2000; -export function createPointerEvents( +export const createPointerEvents = ( el: Node, pointerDown: any, pointerMove: any, pointerUp: any, options: EventListenerOptions -) { +) => { let rmTouchStart: (() => void) | undefined; let rmTouchMove: (() => void) | undefined; @@ -19,7 +19,7 @@ export function createPointerEvents( let rmMouseUp: (() => void) | undefined; let lastTouchEvent = 0; - function handleTouchStart(ev: any) { + const handleTouchStart = (ev: any) => { lastTouchEvent = Date.now() + MOUSE_WAIT; if (!pointerDown(ev)) { return; @@ -33,9 +33,9 @@ export function createPointerEvents( if (!rmTouchCancel) { rmTouchCancel = addEventListener(el, 'touchcancel', handleTouchEnd, options); } - } + }; - function handleMouseDown(ev: any) { + const handleMouseDown = (ev: any) => { if (lastTouchEvent > Date.now()) { return; } @@ -48,23 +48,23 @@ export function createPointerEvents( if (!rmMouseUp) { rmMouseUp = addEventListener(getDocument(el), 'mouseup', handleMouseUp, options); } - } + }; - function handleTouchEnd(ev: any) { + const handleTouchEnd = (ev: any) => { stopTouch(); if (pointerUp) { pointerUp(ev); } - } + }; - function handleMouseUp(ev: any) { + const handleMouseUp = (ev: any) => { stopMouse(); if (pointerUp) { pointerUp(ev); } - } + }; - function stopTouch() { + const stopTouch = () => { if (rmTouchMove) { rmTouchMove(); } @@ -75,9 +75,9 @@ export function createPointerEvents( rmTouchCancel(); } rmTouchMove = rmTouchEnd = rmTouchCancel = undefined; - } + }; - function stopMouse() { + const stopMouse = () => { if (rmMouseMove) { rmMouseMove(); } @@ -85,14 +85,14 @@ export function createPointerEvents( rmMouseUp(); } rmMouseMove = rmMouseUp = undefined; - } + }; - function stop() { + const stop = () => { stopTouch(); stopMouse(); - } + }; - function setDisabled(disabled: boolean) { + const setDisabled = (disabled: boolean) => { if (disabled) { if (rmTouchStart) { rmTouchStart(); @@ -111,23 +111,23 @@ export function createPointerEvents( rmMouseStart = addEventListener(el, 'mousedown', handleMouseDown, options); } } - } + }; - function destroy() { + const destroy = () => { setDisabled(true); pointerUp = pointerMove = pointerDown = undefined; - } + }; return { setDisabled, stop, destroy }; -} +}; -function getDocument(node: Node) { +const getDocument = (node: Node) => { return node instanceof Document ? node : node.ownerDocument; -} +}; export interface PointerEventsConfig { element?: HTMLElement; diff --git a/core/src/utils/gesture/recognizers.ts b/core/src/utils/gesture/recognizers.ts index bb44618b81..1c05ad6b46 100644 --- a/core/src/utils/gesture/recognizers.ts +++ b/core/src/utils/gesture/recognizers.ts @@ -6,7 +6,7 @@ export interface PanRecognizer { getDirection(): number; } -export function createPanRecognizer(direction: string, thresh: number, maxAngle: number): PanRecognizer { +export const createPanRecognizer = (direction: string, thresh: number, maxAngle: number): PanRecognizer => { const radians = maxAngle * (Math.PI / 180); const isDirX = direction === 'x'; const maxCosine = Math.cos(radians); @@ -63,4 +63,4 @@ export function createPanRecognizer(direction: string, thresh: number, maxAngle: return isPan; } }; -} +}; diff --git a/core/src/utils/gesture/swipe-back.ts b/core/src/utils/gesture/swipe-back.ts index e0bbf79299..a0f3e76074 100644 --- a/core/src/utils/gesture/swipe-back.ts +++ b/core/src/utils/gesture/swipe-back.ts @@ -1,26 +1,26 @@ import { Gesture, GestureDetail, createGesture } from './index'; -export function createSwipeBackGesture( +export const createSwipeBackGesture = ( el: HTMLElement, canStartHandler: () => boolean, onStartHandler: () => void, onMoveHandler: (step: number) => void, onEndHandler: (shouldComplete: boolean, step: number, dur: number) => void, -): Gesture { +): Gesture => { const win = el.ownerDocument!.defaultView!; - function canStart(detail: GestureDetail) { + const canStart = (detail: GestureDetail) => { return detail.startX <= 50 && canStartHandler(); - } + }; - function onMove(detail: GestureDetail) { + const onMove = (detail: GestureDetail) => { // set the transition animation's progress const delta = detail.deltaX; const stepValue = delta / win.innerWidth; onMoveHandler(stepValue); - } + }; - function onEnd(detail: GestureDetail) { + const onEnd = (detail: GestureDetail) => { // the swipe back gesture has ended const delta = detail.deltaX; const width = win.innerWidth; @@ -38,7 +38,7 @@ export function createSwipeBackGesture( realDur = Math.min(dur, 300); } onEndHandler(shouldComplete, stepValue, realDur); - } + }; return createGesture({ el, @@ -50,4 +50,4 @@ export function createSwipeBackGesture( onMove, onEnd }); -} +}; diff --git a/core/src/utils/haptic.ts b/core/src/utils/haptic.ts index a540361b37..a164724cab 100644 --- a/core/src/utils/haptic.ts +++ b/core/src/utils/haptic.ts @@ -2,71 +2,71 @@ * Check to see if the Haptic Plugin is available * @return Returns `true` or false if the plugin is available */ -export function hapticAvailable(): boolean { +export const hapticAvailable = (): boolean => { const engine = (window as any).TapticEngine; return !!engine; -} +}; /** * Trigger a selection changed haptic event. Good for one-time events * (not for gestures) */ -export function hapticSelection() { +export const hapticSelection = () => { const engine = (window as any).TapticEngine; if (engine) { engine.selection(); } -} +}; /** * Tell the haptic engine that a gesture for a selection change is starting. */ -export function hapticSelectionStart() { +export const hapticSelectionStart = () => { const engine = (window as any).TapticEngine; if (engine) { engine.gestureSelectionStart(); } -} +}; /** * Tell the haptic engine that a selection changed during a gesture. */ -export function hapticSelectionChanged() { +export const hapticSelectionChanged = () => { const engine = (window as any).TapticEngine; if (engine) { engine.gestureSelectionChanged(); } -} +}; /** * Tell the haptic engine we are done with a gesture. This needs to be * called lest resources are not properly recycled. */ -export function hapticSelectionEnd() { +export const hapticSelectionEnd = () => { const engine = (window as any).TapticEngine; if (engine) { engine.gestureSelectionEnd(); } -} +}; /** * Use this to indicate success/failure/warning to the user. * options should be of the type `{ type: 'success' }` (or `warning`/`error`) */ -export function hapticNotification(options: { type: 'success' | 'warning' | 'error' }) { +export const hapticNotification = (options: { type: 'success' | 'warning' | 'error' }) => { const engine = (window as any).TapticEngine; if (engine) { engine.notification(options); } -} +}; /** * Use this to indicate success/failure/warning to the user. * options should be of the type `{ style: 'light' }` (or `medium`/`heavy`) */ -export function hapticImpact(options: { style: 'light' | 'medium' | 'heavy' }) { +export const hapticImpact = (options: { style: 'light' | 'medium' | 'heavy' }) => { const engine = (window as any).TapticEngine; if (engine) { engine.impact(options); } -} +}; diff --git a/core/src/utils/hardware-back-button.ts b/core/src/utils/hardware-back-button.ts index ddcec8771c..897b86ed4e 100644 --- a/core/src/utils/hardware-back-button.ts +++ b/core/src/utils/hardware-back-button.ts @@ -7,7 +7,7 @@ interface HandlerRegister { handler: Handler; } -export function startHardwareBackButton() { +export const startHardwareBackButton = () => { const doc = document; let busy = false; @@ -41,9 +41,9 @@ export function startHardwareBackButton() { executeAction(selectedHandler).then(() => busy = false); } }); -} +}; -async function executeAction(handler: Handler | undefined) { +const executeAction = async (handler: Handler | undefined) => { try { if (handler) { const result = handler(); @@ -54,4 +54,4 @@ async function executeAction(handler: Handler | undefined) { } catch (e) { console.error(e); } -} +}; diff --git a/core/src/utils/helpers.ts b/core/src/utils/helpers.ts index 6a7c333818..29d0ecbd05 100644 --- a/core/src/utils/helpers.ts +++ b/core/src/utils/helpers.ts @@ -2,27 +2,27 @@ import { EventEmitter } from '@stencil/core'; import { Side } from '../interface'; -export function rIC(callback: () => void) { +export const rIC = (callback: () => void) => { if ('requestIdleCallback' in window) { (window as any).requestIdleCallback(callback); } else { setTimeout(callback, 32); } -} +}; -export function hasShadowDom(el: HTMLElement) { +export const hasShadowDom = (el: HTMLElement) => { return !!el.shadowRoot && !!(el as any).attachShadow; -} +}; -export function findItemLabel(componentEl: HTMLElement) { +export const findItemLabel = (componentEl: HTMLElement) => { const itemEl = componentEl.closest('ion-item'); if (itemEl) { return itemEl.querySelector('ion-label'); } return null; -} +}; -export function renderHiddenInput(always: boolean, container: HTMLElement, name: string, value: string | undefined | null, disabled: boolean) { +export const renderHiddenInput = (always: boolean, container: HTMLElement, name: string, value: string | undefined | null, disabled: boolean) => { if (always || hasShadowDom(container)) { let input = container.querySelector('input.aux-input') as HTMLInputElement | null; if (!input) { @@ -35,26 +35,26 @@ export function renderHiddenInput(always: boolean, container: HTMLElement, name: input.name = name; input.value = value || ''; } -} +}; -export function clamp(min: number, n: number, max: number) { +export const clamp = (min: number, n: number, max: number) => { return Math.max(min, Math.min(n, max)); -} +}; -export function assert(actual: any, reason: string) { +export const assert = (actual: any, reason: string) => { if (!actual) { const message = 'ASSERT: ' + reason; console.error(message); debugger; // tslint:disable-line throw new Error(message); } -} +}; -export function now(ev: UIEvent) { +export const now = (ev: UIEvent) => { return ev.timeStamp || Date.now(); -} +}; -export function pointerCoord(ev: any): {x: number, y: number} { +export const pointerCoord = (ev: any): { x: number, y: number } => { // get X coordinates for either a mouse click // or a touch depending on the given event if (ev) { @@ -68,7 +68,7 @@ export function pointerCoord(ev: any): {x: number, y: number} { } } return { x: 0, y: 0 }; -} +}; /** * @hidden @@ -77,7 +77,7 @@ export function pointerCoord(ev: any): {x: number, y: number} { * @param side the side * @param isRTL whether the application dir is rtl */ -export function isEndSide(side: Side): boolean { +export const isEndSide = (side: Side): boolean => { const isRTL = document.dir === 'rtl'; switch (side) { case 'start': return isRTL; @@ -85,24 +85,24 @@ export function isEndSide(side: Side): boolean { default: throw new Error(`"${side}" is not a valid value for [side]. Use "start" or "end" instead.`); } -} +}; -export function deferEvent(event: EventEmitter): EventEmitter { +export const deferEvent = (event: EventEmitter): EventEmitter => { return debounceEvent(event, 0); -} +}; -export function debounceEvent(event: EventEmitter, wait: number): EventEmitter { +export const debounceEvent = (event: EventEmitter, wait: number): EventEmitter => { const original = (event as any)._original || event; return { _original: event, emit: debounce(original.emit.bind(original), wait) } as EventEmitter; -} +}; -export function debounce(func: (...args: any[]) => void, wait = 0) { +export const debounce = (func: (...args: any[]) => void, wait = 0) => { let timer: any; return (...args: any[]): any => { clearTimeout(timer); timer = setTimeout(func, wait, ...args); }; -} +}; diff --git a/core/src/utils/input-shims/hacks/common.ts b/core/src/utils/input-shims/hacks/common.ts index e4fa87b802..a886d40170 100644 --- a/core/src/utils/input-shims/hacks/common.ts +++ b/core/src/utils/input-shims/hacks/common.ts @@ -1,11 +1,11 @@ const cloneMap = new WeakMap(); -export function relocateInput( +export const relocateInput = ( componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement, shouldRelocate: boolean, inputRelativeY = 0 -) { +) => { if (cloneMap.has(componentEl) === shouldRelocate) { return; } @@ -15,13 +15,13 @@ export function relocateInput( } else { removeClone(componentEl, inputEl); } -} +}; -export function isFocused(input: HTMLInputElement | HTMLTextAreaElement): boolean { +export const isFocused = (input: HTMLInputElement | HTMLTextAreaElement): boolean => { return input === (input as any).getRootNode().activeElement; -} +}; -function addClone(componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement, inputRelativeY: number) { +const addClone = (componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement, inputRelativeY: number) => { // this allows for the actual input to receive the focus from // the user's touch event, but before it receives focus, it // moves the actual input to a location that will not screw @@ -44,9 +44,9 @@ function addClone(componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLText const tx = doc.dir === 'rtl' ? 9999 : -9999; componentEl.style.pointerEvents = 'none'; inputEl.style.transform = `translate3d(${tx}px,${inputRelativeY}px,0) scale(0)`; -} +}; -function removeClone(componentEl: HTMLElement, inputEl: HTMLElement) { +const removeClone = (componentEl: HTMLElement, inputEl: HTMLElement) => { const clone = cloneMap.get(componentEl); if (clone) { cloneMap.delete(componentEl); @@ -54,4 +54,4 @@ function removeClone(componentEl: HTMLElement, inputEl: HTMLElement) { } componentEl.style.pointerEvents = ''; inputEl.style.transform = ''; -} +}; diff --git a/core/src/utils/input-shims/hacks/hide-caret.ts b/core/src/utils/input-shims/hacks/hide-caret.ts index 15c4c24a6b..a7c3dd9334 100644 --- a/core/src/utils/input-shims/hacks/hide-caret.ts +++ b/core/src/utils/input-shims/hacks/hide-caret.ts @@ -1,6 +1,6 @@ import { isFocused, relocateInput } from './common'; -export function enableHideCaretOnScroll(componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement | undefined, scrollEl: HTMLIonContentElement | undefined) { +export const enableHideCaretOnScroll = (componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement | undefined, scrollEl: HTMLIonContentElement | undefined) => { if (!scrollEl || !inputEl) { return () => { return; }; } @@ -24,4 +24,4 @@ export function enableHideCaretOnScroll(componentEl: HTMLElement, inputEl: HTMLI scrollEl.removeEventListener('ionScrollEnd', showCaret); inputEl.addEventListener('ionBlur', onBlur); }; -} +}; diff --git a/core/src/utils/input-shims/hacks/input-blurring.ts b/core/src/utils/input-shims/hacks/input-blurring.ts index 881f5b5132..062b82e013 100644 --- a/core/src/utils/input-shims/hacks/input-blurring.ts +++ b/core/src/utils/input-shims/hacks/input-blurring.ts @@ -1,20 +1,20 @@ const SKIP_SELECTOR = 'input, textarea, [no-blur]'; -export function enableInputBlurring() { - const doc = document; +export const enableInputBlurring = () => { let focused = true; let didScroll = false; - function onScroll() { + const doc = document; + const onScroll = () => { didScroll = true; - } + }; - function onFocusin() { + const onFocusin = () => { focused = true; - } + }; - function onTouchend(ev: any) { + const onTouchend = (ev: any) => { // if app did scroll return early if (didScroll) { didScroll = false; @@ -46,7 +46,7 @@ export function enableInputBlurring() { active.blur(); } }, 50); - } + }; doc.addEventListener('ionScrollStart', onScroll); doc.addEventListener('focusin', onFocusin, true); @@ -57,4 +57,4 @@ export function enableInputBlurring() { doc.removeEventListener('focusin', onFocusin, true); doc.removeEventListener('touchend', onTouchend, false); }; -} +}; diff --git a/core/src/utils/input-shims/hacks/scroll-assist.ts b/core/src/utils/input-shims/hacks/scroll-assist.ts index 5e67ca3ca6..88aaf52a9c 100644 --- a/core/src/utils/input-shims/hacks/scroll-assist.ts +++ b/core/src/utils/input-shims/hacks/scroll-assist.ts @@ -3,12 +3,12 @@ import { pointerCoord } from '../../helpers'; import { isFocused, relocateInput } from './common'; import { getScrollData } from './scroll-data'; -export function enableScrollAssist( +export const enableScrollAssist = ( componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement, contentEl: HTMLIonContentElement, keyboardHeight: number -) { +) => { let coord: any; const touchStart = (ev: Event) => { coord = pointerCoord(ev); @@ -39,14 +39,14 @@ export function enableScrollAssist( componentEl.removeEventListener('touchstart', touchStart, true); componentEl.removeEventListener('touchend', touchEnd, true); }; -} +}; -function jsSetFocus( +const jsSetFocus = ( componentEl: HTMLElement, inputEl: HTMLInputElement | HTMLTextAreaElement, contentEl: HTMLIonContentElement, keyboardHeight: number -) { +) => { const scrollData = getScrollData(componentEl, contentEl, keyboardHeight); if (Math.abs(scrollData.scrollAmount) < 4) { // the text input is in a safe position that doesn't @@ -70,9 +70,9 @@ function jsSetFocus( // ensure this is the focused input inputEl.focus(); }); -} +}; -function hasPointerMoved(threshold: number, startCoord: PointerCoordinates | undefined, endCoord: PointerCoordinates | undefined) { +const hasPointerMoved = (threshold: number, startCoord: PointerCoordinates | undefined, endCoord: PointerCoordinates | undefined) => { if (startCoord && endCoord) { const deltaX = (startCoord.x - endCoord.x); const deltaY = (startCoord.y - endCoord.y); @@ -80,7 +80,7 @@ function hasPointerMoved(threshold: number, startCoord: PointerCoordinates | und return distance > (threshold * threshold); } return false; -} +}; export interface PointerCoordinates { x: number; diff --git a/core/src/utils/input-shims/hacks/scroll-data.ts b/core/src/utils/input-shims/hacks/scroll-data.ts index 5f012959f1..bb3f01599d 100644 --- a/core/src/utils/input-shims/hacks/scroll-data.ts +++ b/core/src/utils/input-shims/hacks/scroll-data.ts @@ -8,7 +8,7 @@ export interface ScrollData { inputSafeY: number; } -export function getScrollData(componentEl: HTMLElement, contentEl: HTMLElement, keyboardHeight: number): ScrollData { +export const getScrollData = (componentEl: HTMLElement, contentEl: HTMLElement, keyboardHeight: number): ScrollData => { const itemEl = componentEl.closest('ion-item,[ion-item]') as HTMLElement || componentEl; return calcScrollData( itemEl.getBoundingClientRect(), @@ -16,14 +16,14 @@ export function getScrollData(componentEl: HTMLElement, contentEl: HTMLElement, keyboardHeight, (componentEl as any).ownerDocument.defaultView.innerHeight ); -} +}; -function calcScrollData( +const calcScrollData = ( inputRect: ClientRect, contentRect: ClientRect, keyboardHeight: number, platformHeight: number -): ScrollData { +): ScrollData => { // compute input's Y values relative to the body const inputTop = inputRect.top; const inputBottom = inputRect.bottom; @@ -44,8 +44,8 @@ function calcScrollData( const desiredScrollAmount = Math.round((distanceToBottom < 0) ? -distanceToBottom : (distanceToTop > 0) - ? -distanceToTop - : 0); + ? -distanceToTop + : 0); // our calculations make some assumptions that aren't always true, like the keyboard being closed when an input // gets focus, so make sure we don't scroll the input above the visible area @@ -61,4 +61,4 @@ function calcScrollData( scrollPadding: keyboardHeight, inputSafeY: -(inputTop - safeAreaTop) + 4 }; -} +}; diff --git a/core/src/utils/input-shims/hacks/scroll-padding.ts b/core/src/utils/input-shims/hacks/scroll-padding.ts index a3af006de3..cf9037e45f 100644 --- a/core/src/utils/input-shims/hacks/scroll-padding.ts +++ b/core/src/utils/input-shims/hacks/scroll-padding.ts @@ -1,14 +1,14 @@ const PADDING_TIMER_KEY = '$ionPaddingTimer'; -export function enableScrollPadding(keyboardHeight: number) { +export const enableScrollPadding = (keyboardHeight: number) => { const doc = document; - function onFocusin(ev: any) { + const onFocusin = (ev: any) => { setScrollPadding(ev.target, keyboardHeight); - } - function onFocusout(ev: any) { + }; + const onFocusout = (ev: any) => { setScrollPadding(ev.target, 0); - } + }; doc.addEventListener('focusin', onFocusin); doc.addEventListener('focusout', onFocusout); @@ -17,9 +17,9 @@ export function enableScrollPadding(keyboardHeight: number) { doc.removeEventListener('focusin', onFocusin); doc.removeEventListener('focusout', onFocusout); }; -} +}; -function setScrollPadding(input: HTMLElement, keyboardHeight: number) { +const setScrollPadding = (input: HTMLElement, keyboardHeight: number) => { if (input.tagName !== 'INPUT') { return; } @@ -50,4 +50,4 @@ function setScrollPadding(input: HTMLElement, keyboardHeight: number) { el.style.setProperty('--keyboard-offset', '0px'); }, 120); } -} +}; diff --git a/core/src/utils/input-shims/input-shims.ts b/core/src/utils/input-shims/input-shims.ts index e249c8e573..fbe9940070 100644 --- a/core/src/utils/input-shims/input-shims.ts +++ b/core/src/utils/input-shims/input-shims.ts @@ -11,20 +11,19 @@ const SCROLL_ASSIST = true; const SCROLL_PADDING = true; const HIDE_CARET = true; -export function startInputShims( - config: Config, -) { +export const startInputShims = (config: Config) => { const doc = document; const keyboardHeight = config.getNumber('keyboardHeight', 290); const scrollAssist = config.getBoolean('scrollAssist', true); const hideCaret = config.getBoolean('hideCaretOnScroll', true); const inputBlurring = config.getBoolean('inputBlurring', true); const scrollPadding = config.getBoolean('scrollPadding', true); + const inputs = Array.from(doc.querySelectorAll('ion-input, ion-textarea')) as HTMLElement[]; const hideCaretMap = new WeakMap void>(); const scrollAssistMap = new WeakMap void>(); - function registerInput(componentEl: HTMLElement) { + const registerInput = (componentEl: HTMLElement) => { const inputEl = (componentEl.shadowRoot || componentEl).querySelector('input') || (componentEl.shadowRoot || componentEl).querySelector('textarea'); const scrollEl = componentEl.closest('ion-content'); @@ -41,9 +40,9 @@ export function startInputShims( const rmFn = enableScrollAssist(componentEl, inputEl, scrollEl, keyboardHeight); scrollAssistMap.set(componentEl, rmFn); } - } + }; - function unregisterInput(componentEl: HTMLElement) { + const unregisterInput = (componentEl: HTMLElement) => { if (HIDE_CARET && hideCaret) { const fn = hideCaretMap.get(componentEl); if (fn) { @@ -59,7 +58,7 @@ export function startInputShims( } scrollAssistMap.delete(componentEl); } - } + }; if (inputBlurring && INPUT_BLURRING) { enableInputBlurring(); @@ -72,7 +71,6 @@ export function startInputShims( // Input might be already loaded in the DOM before ion-device-hacks did. // At this point we need to look for all of the inputs not registered yet // and register them. - const inputs = Array.from(doc.querySelectorAll('ion-input, ion-textarea')) as HTMLElement[]; for (const input of inputs) { registerInput(input); } @@ -84,4 +82,4 @@ export function startInputShims( doc.body.addEventListener('ionInputDidUnload', event => { unregisterInput(event.target as any); }); -} +}; diff --git a/core/src/utils/media.ts b/core/src/utils/media.ts index 6802ae2f94..93135d8641 100644 --- a/core/src/utils/media.ts +++ b/core/src/utils/media.ts @@ -10,7 +10,7 @@ export const SIZE_TO_MEDIA: any = { // Check if the window matches the media query // at the breakpoint passed // e.g. matchBreakpoint('sm') => true if screen width exceeds 576px -export function matchBreakpoint(breakpoint: string | undefined) { +export const matchBreakpoint = (breakpoint: string | undefined) => { if (breakpoint === undefined || breakpoint === '') { return true; } @@ -19,4 +19,4 @@ export function matchBreakpoint(breakpoint: string | undefined) { return window.matchMedia(mediaQuery).matches; } return false; -} +}; diff --git a/core/src/utils/status-tap.ts b/core/src/utils/status-tap.ts index efe5f8d34c..124eef47e8 100644 --- a/core/src/utils/status-tap.ts +++ b/core/src/utils/status-tap.ts @@ -1,6 +1,6 @@ import { readTask, writeTask } from '@stencil/core'; -export function startStatusTap() { +export const startStatusTap = () => { const win = window; win.addEventListener('statusTap', () => { readTask(() => { @@ -18,4 +18,4 @@ export function startStatusTap() { } }); }); -} +}; diff --git a/core/src/utils/tap-click.ts b/core/src/utils/tap-click.ts index c06d68687c..593a2ad321 100644 --- a/core/src/utils/tap-click.ts +++ b/core/src/utils/tap-click.ts @@ -2,7 +2,7 @@ import { Config } from '../interface'; import { now, pointerCoord } from './helpers'; -export function startTapClick(config: Config) { +export const startTapClick = (config: Config) => { let lastTouch = -MOUSE_WAIT * 10; let lastActivated = 0; let scrollingEl: HTMLElement | undefined; @@ -14,57 +14,57 @@ export function startTapClick(config: Config) { const useRippleEffect = config.getBoolean('animated', true) && config.getBoolean('rippleEffect', true); const clearDefers = new WeakMap(); - function isScrolling() { + const isScrolling = () => { return scrollingEl !== undefined && scrollingEl.parentElement !== null; - } + }; // Touch Events - function onTouchStart(ev: TouchEvent) { + const onTouchStart = (ev: TouchEvent) => { lastTouch = now(ev); pointerDown(ev); - } + }; - function onTouchEnd(ev: TouchEvent) { + const onTouchEnd = (ev: TouchEvent) => { lastTouch = now(ev); pointerUp(ev); - } + }; - function onMouseDown(ev: MouseEvent) { + const onMouseDown = (ev: MouseEvent) => { const t = now(ev) - MOUSE_WAIT; if (lastTouch < t) { pointerDown(ev); } - } + }; - function onMouseUp(ev: MouseEvent) { + const onMouseUp = (ev: MouseEvent) => { const t = now(ev) - MOUSE_WAIT; if (lastTouch < t) { pointerUp(ev); } - } + }; - function cancelActive() { + const cancelActive = () => { clearTimeout(activeDefer); activeDefer = undefined; if (activatableEle) { removeActivated(false); activatableEle = undefined; } - } + }; - function pointerDown(ev: any) { + const pointerDown = (ev: any) => { if (activatableEle || isScrolling()) { return; } scrollingEl = undefined; setActivatedElement(getActivatableTarget(ev), ev); - } + }; - function pointerUp(ev: UIEvent) { + const pointerUp = (ev: UIEvent) => { setActivatedElement(undefined, ev); - } + }; - function setActivatedElement(el: HTMLElement | undefined, ev: UIEvent) { + const setActivatedElement = (el: HTMLElement | undefined, ev: UIEvent) => { // do nothing if (el && el === activatableEle) { return; @@ -101,9 +101,9 @@ export function startTapClick(config: Config) { }, delay); } activatableEle = el; - } + }; - function addActivated(el: HTMLElement, x: number, y: number) { + const addActivated = (el: HTMLElement, x: number, y: number) => { lastActivated = Date.now(); el.classList.add(ACTIVATED); @@ -111,9 +111,9 @@ export function startTapClick(config: Config) { if (rippleEffect && rippleEffect.addRipple) { activeRipple = rippleEffect.addRipple(x, y); } - } + }; - function removeActivated(smooth: boolean) { + const removeActivated = (smooth: boolean) => { if (activeRipple !== undefined) { activeRipple.then(remove => remove()); } @@ -131,7 +131,7 @@ export function startTapClick(config: Config) { } else { active.classList.remove(ACTIVATED); } - } + }; const doc = document; doc.addEventListener('ionScrollStart', ev => { @@ -149,9 +149,9 @@ export function startTapClick(config: Config) { doc.addEventListener('mousedown', onMouseDown, true); doc.addEventListener('mouseup', onMouseUp, true); -} +}; -function getActivatableTarget(ev: any): any { +const getActivatableTarget = (ev: any): any => { if (ev.composedPath) { const path = ev.composedPath() as HTMLElement[]; for (let i = 0; i < path.length - 2; i++) { @@ -163,13 +163,13 @@ function getActivatableTarget(ev: any): any { } else { return ev.target.closest('.ion-activatable'); } -} +}; -function isInstant(el: HTMLElement) { +const isInstant = (el: HTMLElement) => { return el.classList.contains('ion-activatable-instant'); -} +}; -function getRippleEffect(el: HTMLElement) { +const getRippleEffect = (el: HTMLElement) => { if (el.shadowRoot) { const ripple = el.shadowRoot.querySelector('ion-ripple-effect'); if (ripple) { @@ -177,7 +177,7 @@ function getRippleEffect(el: HTMLElement) { } } return el.querySelector('ion-ripple-effect'); -} +}; const ACTIVATED = 'activated'; const ADD_ACTIVATED_DEFERS = 200; diff --git a/core/src/utils/test/utils.ts b/core/src/utils/test/utils.ts index c0b1aa91a5..6ecb7aa31a 100644 --- a/core/src/utils/test/utils.ts +++ b/core/src/utils/test/utils.ts @@ -1,14 +1,14 @@ import { E2EElement, E2EPage } from '@stencil/core/testing'; import { ElementHandle } from 'puppeteer'; -export function generateE2EUrl(component: string, type: string, rtl = false): string { +export const generateE2EUrl = (component: string, type: string, rtl = false): string => { let url = `/src/components/${component}/test/${type}?ionic:_testing=true`; if (rtl) { url = `${url}&rtl=true`; } return url; -} +}; /** * Gets the value of a property on an element @@ -98,11 +98,11 @@ export const waitForFunctionTestContext = async (fn: any, params: any, interval * Pierce through shadow roots * https://github.com/GoogleChrome/puppeteer/issues/858#issuecomment-359763824 */ -export async function queryDeep(page: E2EPage, ...selectors: string[]): Promise { +export const queryDeep = async (page: E2EPage, ...selectors: string[]): Promise => { const shadowSelectorFn = (el: Element, selector: string): Element | null => (el && el.shadowRoot) && el.shadowRoot.querySelector(selector); return new Promise(async resolve => { - const [ firstSelector, ...restSelectors ] = selectors; + const [firstSelector, ...restSelectors] = selectors; let parentElement = await page.$(firstSelector); for (const selector of restSelectors) { @@ -111,7 +111,7 @@ export async function queryDeep(page: E2EPage, ...selectors: string[]): Promise< if (parentElement) { resolve(parentElement); } }); -} +}; /** * Given an element and optional selector, use the selector if @@ -128,7 +128,7 @@ export async function queryDeep(page: E2EPage, ...selectors: string[]): Promise< * await checkComponentModeClasses(await page.find('ion-card-content'), 'some-class') * => expect(el).toHaveClass(`some-class-{mode}`); */ -export async function checkComponentModeClasses(el: E2EElement, selector?: string) { +export const checkComponentModeClasses = async (el: E2EElement, selector?: string) => { // If passed a selector to use, use that, else grab the nodeName // of the element and remove the ion prefix to get the class selector const component = selector !== undefined ? selector : el.nodeName.toLowerCase().replace('ion-', ''); @@ -136,14 +136,14 @@ export async function checkComponentModeClasses(el: E2EElement, selector?: strin const mode = await el.getProperty('mode'); expect(el).toHaveClass(`${component}-${mode}`); -} +}; /** * Given an element, get the mode and verify it exists as a class * * @param el: E2EElement - the element to verify the mode class on */ -export async function checkModeClasses(el: E2EElement, globalMode: string) { +export const checkModeClasses = async (el: E2EElement, globalMode: string) => { const mode = (await el.getProperty('mode')) || globalMode; expect(el).toHaveClass(`${mode}`); -} +}; diff --git a/core/src/utils/theme.ts b/core/src/utils/theme.ts index df0b2ddfcc..c846c013b1 100644 --- a/core/src/utils/theme.ts +++ b/core/src/utils/theme.ts @@ -1,20 +1,20 @@ import { Color, CssClassMap, RouterDirection } from '../interface'; -export function hostContext(selector: string, el: HTMLElement): boolean { +export const hostContext = (selector: string, el: HTMLElement): boolean => { return el.closest(selector) !== null; -} +}; /** * Create the mode and color classes for the component based on the classes passed in */ -export function createColorClasses(color: Color | undefined | null): CssClassMap | undefined { +export const createColorClasses = (color: Color | undefined | null): CssClassMap | undefined => { return (typeof color === 'string' && color.length > 0) ? { 'ion-color': true, [`ion-color-${color}`]: true } : undefined; -} +}; -export function getClassList(classes: string | (string | null | undefined)[] | undefined): string[] { +export const getClassList = (classes: string | (string | null | undefined)[] | undefined): string[] => { if (classes !== undefined) { const array = Array.isArray(classes) ? classes : classes.split(' '); return array @@ -23,17 +23,17 @@ export function getClassList(classes: string | (string | null | undefined)[] | u .filter(c => c !== ''); } return []; -} +}; -export function getClassMap(classes: string | string[] | undefined): CssClassMap { +export const getClassMap = (classes: string | string[] | undefined): CssClassMap => { const map: CssClassMap = {}; getClassList(classes).forEach(c => map[c] = true); return map; -} +}; const SCHEME = /^[a-z][a-z0-9+\-.]*:/; -export async function openURL(url: string | undefined | null, ev: Event | undefined | null, direction: RouterDirection): Promise { +export const openURL = async (url: string | undefined | null, ev: Event | undefined | null, direction: RouterDirection): Promise => { if (url != null && url[0] !== '#' && !SCHEME.test(url)) { const router = document.querySelector('ion-router'); if (router) { @@ -45,4 +45,4 @@ export async function openURL(url: string | undefined | null, ev: Event | undefi } } return false; -} +}; diff --git a/core/src/utils/transition/index.ts b/core/src/utils/transition/index.ts index d4a495073b..4168455c84 100644 --- a/core/src/utils/transition/index.ts +++ b/core/src/utils/transition/index.ts @@ -6,7 +6,7 @@ import { Animation, AnimationBuilder, NavDirection, NavOptions } from '../../int const iosTransitionAnimation = () => import('./ios.transition'); const mdTransitionAnimation = () => import('./md.transition'); -export function transition(opts: TransitionOptions): Promise { +export const transition = (opts: TransitionOptions): Promise => { return new Promise((resolve, reject) => { writeTask(() => { beforeTransition(opts); @@ -22,9 +22,9 @@ export function transition(opts: TransitionOptions): Promise { }); }); }); -} +}; -function beforeTransition(opts: TransitionOptions) { +const beforeTransition = (opts: TransitionOptions) => { const enteringEl = opts.enteringEl; const leavingEl = opts.leavingEl; @@ -39,27 +39,27 @@ function beforeTransition(opts: TransitionOptions) { if (leavingEl) { setPageHidden(leavingEl, false); } -} +}; -async function runTransition(opts: TransitionOptions): Promise { +const runTransition = async (opts: TransitionOptions): Promise => { const animationBuilder = await getAnimationBuilder(opts); const ani = (animationBuilder) ? animation(animationBuilder, opts) : noAnimation(opts); // fast path for no animation return ani; -} +}; -function afterTransition(opts: TransitionOptions) { +const afterTransition = (opts: TransitionOptions) => { const enteringEl = opts.enteringEl; const leavingEl = opts.leavingEl; enteringEl.classList.remove('ion-page-invisible'); if (leavingEl !== undefined) { leavingEl.classList.remove('ion-page-invisible'); } -} +}; -async function getAnimationBuilder(opts: TransitionOptions): Promise { +const getAnimationBuilder = async (opts: TransitionOptions): Promise => { if (!opts.leavingEl || !opts.animated || opts.duration === 0) { return undefined; } @@ -71,9 +71,9 @@ async function getAnimationBuilder(opts: TransitionOptions): Promise { +const animation = async (animationBuilder: AnimationBuilder, opts: TransitionOptions): Promise => { await waitForReady(opts, true); const trans = await import('../animation').then(mod => mod.create(animationBuilder, opts.baseEl, opts)); @@ -90,9 +90,9 @@ async function animation(animationBuilder: AnimationBuilder, opts: TransitionOpt hasCompleted: trans.hasCompleted, animation: trans }; -} +}; -async function noAnimation(opts: TransitionOptions): Promise { +const noAnimation = async (opts: TransitionOptions): Promise => { const enteringEl = opts.enteringEl; const leavingEl = opts.leavingEl; @@ -104,29 +104,29 @@ async function noAnimation(opts: TransitionOptions): Promise { return { hasCompleted: true }; -} +}; -async function waitForReady(opts: TransitionOptions, defaultDeep: boolean) { +const waitForReady = async (opts: TransitionOptions, defaultDeep: boolean) => { const deep = opts.deepWait !== undefined ? opts.deepWait : defaultDeep; const promises = deep ? [ deepReady(opts.enteringEl), deepReady(opts.leavingEl), ] : [ - shallowReady(opts.enteringEl), - shallowReady(opts.leavingEl), - ]; + shallowReady(opts.enteringEl), + shallowReady(opts.leavingEl), + ]; await Promise.all(promises); await notifyViewReady(opts.viewIsReady, opts.enteringEl); -} +}; -async function notifyViewReady(viewIsReady: undefined | ((enteringEl: HTMLElement) => Promise), enteringEl: HTMLElement) { +const notifyViewReady = async (viewIsReady: undefined | ((enteringEl: HTMLElement) => Promise), enteringEl: HTMLElement) => { if (viewIsReady) { await viewIsReady(enteringEl); } -} +}; -function playTransition(trans: Animation, opts: TransitionOptions): Promise { +const playTransition = (trans: Animation, opts: TransitionOptions): Promise => { const progressCallback = opts.progressCallback; const promise = new Promise(resolve => trans.onFinish(resolve)); @@ -145,19 +145,19 @@ function playTransition(trans: Animation, opts: TransitionOptions): Promise { lifecycle(leavingEl, LIFECYCLE_WILL_LEAVE); lifecycle(enteringEl, LIFECYCLE_WILL_ENTER); -} +}; -function fireDidEvents(enteringEl: HTMLElement | undefined, leavingEl: HTMLElement | undefined) { +const fireDidEvents = (enteringEl: HTMLElement | undefined, leavingEl: HTMLElement | undefined) => { lifecycle(enteringEl, LIFECYCLE_DID_ENTER); lifecycle(leavingEl, LIFECYCLE_DID_LEAVE); -} +}; -export function lifecycle(el: HTMLElement | undefined, eventName: string) { +export const lifecycle = (el: HTMLElement | undefined, eventName: string) => { if (el) { const ev = new CustomEvent(eventName, { bubbles: false, @@ -165,16 +165,16 @@ export function lifecycle(el: HTMLElement | undefined, eventName: string) { }); el.dispatchEvent(ev); } -} +}; -function shallowReady(el: Element | undefined): Promise { +const shallowReady = (el: Element | undefined): Promise => { if (el && (el as any).componentOnReady) { return (el as any).componentOnReady(); } return Promise.resolve(); -} +}; -export async function deepReady(el: any | undefined): Promise { +export const deepReady = async (el: any | undefined): Promise => { const element = el as any; if (element) { if (element.componentOnReady != null) { @@ -185,9 +185,9 @@ export async function deepReady(el: any | undefined): Promise { } await Promise.all(Array.from(element.children).map(deepReady)); } -} +}; -export function setPageHidden(el: HTMLElement, hidden: boolean) { +export const setPageHidden = (el: HTMLElement, hidden: boolean) => { if (hidden) { el.setAttribute('aria-hidden', 'true'); el.classList.add('ion-page-hidden'); @@ -196,13 +196,13 @@ export function setPageHidden(el: HTMLElement, hidden: boolean) { el.removeAttribute('aria-hidden'); el.classList.remove('ion-page-hidden'); } -} +}; -function setZIndex( +const setZIndex = ( enteringEl: HTMLElement | undefined, leavingEl: HTMLElement | undefined, direction: NavDirection | undefined, -) { +) => { if (enteringEl !== undefined) { enteringEl.style.zIndex = (direction === 'back') ? '99' @@ -211,7 +211,7 @@ function setZIndex( if (leavingEl !== undefined) { leavingEl.style.zIndex = '100'; } -} +}; export interface TransitionOptions extends NavOptions { progressCallback?: ((ani: Animation | undefined) => void); diff --git a/core/src/utils/transition/ios.transition.ts b/core/src/utils/transition/ios.transition.ts index 49c2ac35d1..607bbeea9d 100644 --- a/core/src/utils/transition/ios.transition.ts +++ b/core/src/utils/transition/ios.transition.ts @@ -9,11 +9,11 @@ const TRANSLATEX = 'translateX'; const CENTER = '0%'; const OFF_OPACITY = 0.8; -export function shadow(el: T): ShadowRoot | T { +export const shadow = (el: T): ShadowRoot | T => { return el.shadowRoot || el; -} +}; -export function iosTransitionAnimation(AnimationC: Animation, navEl: HTMLElement, opts: TransitionOptions): Promise { +export const iosTransitionAnimation = (AnimationC: Animation, navEl: HTMLElement, opts: TransitionOptions): Promise => { const isRTL = (navEl.ownerDocument as any).dir === 'rtl'; const OFF_RIGHT = isRTL ? '-99.5%' : '99.5%'; @@ -228,4 +228,4 @@ export function iosTransitionAnimation(AnimationC: Animation, navEl: HTMLElement } // Return the rootTransition promise return Promise.resolve(rootTransition); -} +}; diff --git a/core/src/utils/transition/md.transition.ts b/core/src/utils/transition/md.transition.ts index d2089224e6..ae7f0cd680 100644 --- a/core/src/utils/transition/md.transition.ts +++ b/core/src/utils/transition/md.transition.ts @@ -5,7 +5,7 @@ const TRANSLATEY = 'translateY'; const OFF_BOTTOM = '40px'; const CENTER = '0px'; -export function mdTransitionAnimation(AnimationC: Animation, _: HTMLElement, opts: TransitionOptions): Promise { +export const mdTransitionAnimation = (AnimationC: Animation, _: HTMLElement, opts: TransitionOptions): Promise => { const enteringEl = opts.enteringEl; const leavingEl = opts.leavingEl; @@ -57,9 +57,9 @@ export function mdTransitionAnimation(AnimationC: Animation, _: HTMLElement, opt } return Promise.resolve(rootTransition); -} +}; -function getIonPageElement(element: HTMLElement) { +const getIonPageElement = (element: HTMLElement) => { if (element.classList.contains('ion-page')) { return element; } @@ -69,4 +69,4 @@ function getIonPageElement(element: HTMLElement) { } // idk, return the original element so at least something animates and we don't have a null pointer return element; -} +}; diff --git a/core/tslint.json b/core/tslint.json index 10f4c2b230..83ad4ddede 100644 --- a/core/tslint.json +++ b/core/tslint.json @@ -18,6 +18,7 @@ "no-floating-promises": false, "no-invalid-template-strings": true, "ban-export-const-enum": true, + "only-arrow-functions": true, "jsx-key": false, "jsx-self-close": false,