inviton-powerduck 0.0.168 → 0.0.170

package/common/utils/utils.ts

@@ -23,14 +23,40 @@ export class PortalUtils {
 	 * Determines if current device runs iOS
 	 */
 	static isIOS(): boolean {
-		return ((/iPad|iPhone|iPod/.test(navigator.userAgent) && !globalState.MSStream) || navigator.userAgent.match(/(iPad)/) != null || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1));
+		let retVal: boolean;
+		if (globalState.windowExists) {
+			retVal = ((/iPad|iPhone|iPod/.test(navigator.userAgent) && !globalState.MSStream) || navigator.userAgent.match(/(iPad)/) != null || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1));
+		} else {
+			retVal = false;
+		}
+
+		if (retVal) {
+			PortalUtils.isIOS = () => true;
+		} else {
+			PortalUtils.isIOS = () => false;
+		}
+
+		return retVal;
 	}
 
 	/**
 	 * Determines if current device runs Android
 	 */
 	static isAndroid(): boolean {
-		return navigator.userAgent.toLowerCase().includes('android');
+		let retVal: boolean;
+		if (globalState.windowExists) {
+			retVal = navigator.userAgent.toLowerCase().includes('android');
+		} else {
+			retVal = false;
+		}
+
+		if (retVal) {
+			PortalUtils.isAndroid = () => true;
+		} else {
+			PortalUtils.isAndroid = () => false;
+		}
+
+		return retVal;
 	}
 
 	/**
@@ -71,7 +97,20 @@ export class PortalUtils {
 	 * Determines if current browser is Chrome
 	 */
 	static isBrowserChrome(): boolean {
-		return /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
+		let retVal: boolean;
+		if (globalState.windowExists) {
+			retVal = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
+		} else {
+			retVal = false;
+		}
+
+		if (retVal) {
+			PortalUtils.isBrowserChrome = () => true;
+		} else {
+			PortalUtils.isBrowserChrome = () => false;
+		}
+
+		return retVal;
 	}
 
 	/**
@@ -151,8 +190,8 @@ export class PortalUtils {
 	}
 
 	/*
-     * Obtains URL for asset either on CDN, or on local
-     */
+	 * Obtains URL for asset either on CDN, or on local
+	 */
 	static getAssetPath(path: string): string {
 		return PowerduckState.getCdnPath() + path;
 	}
@@ -173,9 +212,9 @@ export class PortalUtils {
 	 * Determines width of the scrollbar
 	 */
 	static getScrollbarWidth(): number {
-        if (!globalState.windowExists) {
-            return 0;
-        }
+		if (!globalState.windowExists) {
+			return 0;
+		}
 
 		const outer = document.createElement('div');
 		outer.style.visibility = 'hidden';
@@ -280,7 +319,7 @@ export class PortalUtils {
 	 * Determines if device supports Native share API
 	 */
 	static hasNativeShare(): boolean {
-		return navigator.share != null;
+		return globalState.navigator?.share != null;
 	}
 
 	/**
@@ -361,9 +400,9 @@ export class PortalUtils {
 		scrollPos: number,
 		offset?: number,
 	) {
-        if (!globalState.windowExists) {
-            return;
-        }
+		if (!globalState.windowExists) {
+			return;
+		}
 
 		if ((element as any).inviDom || (element as any).jquery) {
 			element = element[0];

package/components/input/plugins/currency-editor/currency-format.ts

@@ -1,4 +1,6 @@
 import type { CurrencyInputOptions } from './api';
+import { globalState } from '../../../../app/global-state';
+import PowerduckState from '../../../../app/powerduck-state';
 import { CurrencyDisplay } from './api';
 import { escapeRegExp, substringBefore } from './utils';
 
@@ -27,7 +29,7 @@ export default class CurrencyFormat {
 
 	constructor(options: CurrencyInputOptions) {
 		const { currency, currencyDisplay, locale, precision, accountingSign, useGrouping } = options;
-		this.locale = navigator.language ? navigator.language : (navigator as any).browserLanguage;
+		this.locale = PowerduckState.getCurrentLanguage() ?? globalState.navigator?.language ? navigator.language : (globalState.navigator as any)?.browserLanguage;
 		this.options = {
 			currency,
 			useGrouping,
@@ -102,9 +104,9 @@ export default class CurrencyFormat {
 	}
 
 	format(value: number | null, options: Intl.NumberFormatOptions = {
-      minimumFractionDigits: this.minimumFractionDigits,
-      maximumFractionDigits: this.maximumFractionDigits,
-    }): string {
+		minimumFractionDigits: this.minimumFractionDigits,
+		maximumFractionDigits: this.maximumFractionDigits,
+	}): string {
 		return value != null ? value.toLocaleString(this.locale, { ...this.options, ...options }) : '';
 	}
 

package/components/input/radio-button-group.tsx

@@ -1,18 +1,19 @@
 import type { DropdownButtonItemArgs } from '../dropdown-button/dropdown-button-item';
 import type { FormItemWrapperArgs, HintType, MarginType } from '../form/form-item-wrapper';
+import { render } from 'vue';
 import { Prop, toNative } from 'vue-facing-decorator';
 import TsxComponent, { Component } from '../../app/vuetsx';
+import { capitalize } from '../../common/extensions/string-extensions';
 import { PortalUtils } from '../../common/utils/utils';
 import FormItemWrapper from '../form/form-item-wrapper';
 import HtmlLiteral from '../html-literal/html-literal';
 import './css/radio-button-group.css';
-import { capitalize } from '../../common/extensions/string-extensions';
 
 type RowToString = (row) => string;
 interface RadioButtonGroupArgs extends FormItemWrapperArgs {
 	changed: (newValue: string | any) => void;
-	formatResult?: (state: RadioDisplayArgs) => JQuery | string;
-	formatSelection?: (state: RadioDisplayArgs) => JQuery | string;
+	customRenderOption?: (h, state: RadioDisplayArgs) => any;
+	customRenderSelectionResult?: (h, state: RadioDisplayArgs) => any;
 	options: Array<string> | Array<any>;
 	displayMember?: string | RowToString;
 	valueMember?: string | RowToString;
@@ -53,12 +54,12 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 	@Prop() valueMember!: (row) => string | string;
 	@Prop() selected!: string | any;
 	@Prop() changed: (newValue: string | any) => void;
-	@Prop() formatResult!: (state: RadioDisplayArgs) => JQuery | string;
-	@Prop() formatSelection!: (state: RadioDisplayArgs) => JQuery | string;
+	@Prop() customRenderOption?: (h, state: RadioDisplayArgs) => any;
+	@Prop() customRenderSelectionResult?: (h, state: RadioDisplayArgs) => any;
 
-	getFormatedResult(item: RadioDisplayArgs): string {
-		if (this.formatResult != null) {
-			return (this.formatResult(item) as JQuery<HTMLElement>).html();
+	getCustomFormatOptions(h, item: RadioDisplayArgs): string {
+		if (this.customRenderOption != null) {
+			return this.customRenderOption(h, item);
 		}
 	}
 
@@ -116,7 +117,7 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 		}
 	}
 
-	getOptions(): RadioDisplayArgs[] {
+	getOptions(h): RadioDisplayArgs[] {
 		const retVal: RadioDisplayArgs[] = [];
 		const opts = this.options as any;
 
@@ -130,7 +131,7 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 				opts.forEach((item) => {
 					retVal.push({
 						id: this.getReflectedRowValue(item, true),
-						text: this.formatResult != null ? this.getFormatedResult(item) : this.getReflectedRowValue(item, false),
+						text: this.customRenderOption != null ? this.handleCustomRenderResult(h, this.customRenderOption(h, item)) : this.getReflectedRowValue(item, false),
 						dataRow: item,
 					});
 				});
@@ -140,8 +141,26 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 		return retVal;
 	}
 
-	getSelectedItem(opts?: RadioDisplayArgs[]): RadioDisplayArgs {
-		opts = opts || this.getOptions();
+	private handleCustomRenderResult(h: any, renderResult: any): string {
+		if (renderResult == null) {
+			return '';
+		}
+
+		if (renderResult?.__v_isVNode) {
+			const container = document.createElement('div');
+			render(renderResult as any, container);
+			return container.innerHTML;
+		}
+
+		if (renderResult instanceof HTMLElement) {
+			return renderResult.outerHTML;
+		}
+
+		return renderResult;
+	}
+
+	getSelectedItem(h, opts?: RadioDisplayArgs[]): RadioDisplayArgs {
+		opts = opts || this.getOptions(h);
 
 		if (this.selected == null || opts.length == 0) {
 			return opts[0];
@@ -189,10 +208,10 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 		);
 	}
 
-	handleRadioValueChanged() {
+	handleRadioValueChanged(h) {
 		const selectedValue = this.$el.querySelector('input[type="radio"]:checked').value;
 		if (selectedValue != null) {
-			const opts = this.getOptions();
+			const opts = this.getOptions(h);
 			for (let i = 0, len = opts.length; i < len; i++) {
 				const optItem = opts[i];
 				if (optItem.id == selectedValue) {
@@ -205,12 +224,12 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 
 	renderInput(h) {
 		const nameId = `iei-group-${PortalUtils.randomString(6)}`;
-		const selectedItem = this.getSelectedItem();
+		const selectedItem = this.getSelectedItem(h);
 		const isSmall = this.radioButtonSize === RadioButtonSize.Small;
 
 		return (
 			<div class="radio-group-wrap">
-				{this.getOptions().map((optionItem) => {
+				{this.getOptions(h).map((optionItem) => {
 					const uuid = `iei-input-${PortalUtils.randomString(10)}`;
 					const selected = optionItem.id == selectedItem?.id;
 					const disabled = optionItem.dataRow?.disabled ?? false;
@@ -234,7 +253,7 @@ class RadioButtonGroupComponent extends TsxComponent<RadioButtonGroupArgs> imple
 									id={uuid}
 									value={optionItem.id}
 									disabled={disabled}
-									onChange={() => this.handleRadioValueChanged()}
+									onChange={() => this.handleRadioValueChanged(h)}
 								/>
 								<label class="form-check-label" for={uuid}>
 									<HtmlLiteral innerHTML={optionItem.text} />

package/components/input/ts/dateInputHelper.ts

@@ -21,7 +21,7 @@ export default class DateInputHelper {
 
 	static getLocale(): string {
 		const locale = PowerduckState.getCurrentLanguage();
-		if (locale == 'en') {
+		if (locale == 'en' && globalState.windowExists) {
 			const navigatorLang = navigator.language || (navigator as any).userLanguage;
 			if (navigatorLang != null && navigatorLang.indexOf('en-') == 0) {
 				return navigatorLang;

package/components/open-street-map/ts/gesture-handling/gesture-handling.ts

@@ -3,6 +3,7 @@
 * * Version 1.1.8
 */
 import L from 'leaflet';
+import { globalState } from '../../../../app/global-state';
 import PowerduckState from '../../../../app/powerduck-state';
 import { Language } from '../../../../common/enums/language';
 import './css/leaflet-gesture-handling.scss';
@@ -20,9 +21,9 @@ const LanguageContent = {
 	cs: {
 		touch: 'K\u00A0posunut\u00ED mapy pou\u017Eijte dva prsty',
 		scroll:
-            'Velikost zobrazen\u00ED mapy zm\u011B\u0148te podr\u017Een\u00EDm kl\u00E1vesy Ctrl a\u00A0posouv\u00E1n\u00EDm kole\u010Dka my\u0161i',
+			'Velikost zobrazen\u00ED mapy zm\u011B\u0148te podr\u017Een\u00EDm kl\u00E1vesy Ctrl a\u00A0posouv\u00E1n\u00EDm kole\u010Dka my\u0161i',
 		scrollMac:
-            'Velikost zobrazen\u00ED mapy zm\u011Bn\u00EDte podr\u017Een\u00EDm kl\u00E1vesy \u2318 a\u00A0posunut\u00EDm kole\u010Dka my\u0161i / touchpadu',
+			'Velikost zobrazen\u00ED mapy zm\u011Bn\u00EDte podr\u017Een\u00EDm kl\u00E1vesy \u2318 a\u00A0posunut\u00EDm kole\u010Dka my\u0161i / touchpadu',
 	},
 	// German
 	de: {
@@ -40,17 +41,17 @@ const LanguageContent = {
 	pl: {
 		touch: 'Przesu\u0144 map\u0119 dwoma palcami',
 		scroll:
-            'Naci\u015Bnij CTRL i przewi\u0144, by przybli\u017Cy\u0107 map\u0119',
+			'Naci\u015Bnij CTRL i przewi\u0144, by przybli\u017Cy\u0107 map\u0119',
 		scrollMac:
-            'Naci\u015Bnij\u00A0\u2318 i przewi\u0144, by przybli\u017Cy\u0107 map\u0119',
+			'Naci\u015Bnij\u00A0\u2318 i przewi\u0144, by przybli\u017Cy\u0107 map\u0119',
 	},
 	// Slovak
 	sk: {
 		touch: 'Mapu m\u00F4\u017Eete posun\u00FA\u0165 dvoma prstami',
 		scroll:
-            'Ak chcete pribl\u00ED\u017Ei\u0165 mapu, stla\u010Dte kl\u00E1ves ctrl a\u00A0pos\u00FAvajte',
+			'Ak chcete pribl\u00ED\u017Ei\u0165 mapu, stla\u010Dte kl\u00E1ves ctrl a\u00A0pos\u00FAvajte',
 		scrollMac:
-            'Ak chcete pribl\u00ED\u017Ei\u0165 mapu, stla\u010Dte kl\u00E1ves \u2318 a\u00A0pos\u00FAvajte kolieskom my\u0161i',
+			'Ak chcete pribl\u00ED\u017Ei\u0165 mapu, stla\u010Dte kl\u00E1ves \u2318 a\u00A0pos\u00FAvajte kolieskom my\u0161i',
 	},
 };
 
@@ -242,7 +243,7 @@ export default class LeafletGestureHandler {
 
 		// Check if they're on a mac for display of command instead of ctrl
 		let mac = false;
-		if (navigator.platform.toUpperCase().includes('MAC')) {
+		if ((globalState.navigator?.platform || '').toUpperCase().includes('MAC')) {
 			mac = true;
 		}
 

package/components/share/share-modal.tsx

@@ -5,7 +5,7 @@ import { PortalUtils } from '../../common/utils/utils';
 import Modal from '../modal/modal';
 import ModalBody from '../modal/modal-body';
 
-interface ShareComponentBindingArgs {}
+interface ShareComponentBindingArgs { }
 
 interface ShareComponentDisplayArgs {
 	dialogTitle: string;
@@ -21,7 +21,7 @@ class ShareModalComponent extends TsxComponent<ShareComponentBindingArgs> implem
 	FB_APP_ID: string = '144914712372771';
 
 	public share(args: ShareComponentDisplayArgs) {
-		if (navigator.share) {
+		if (globalState.navigator?.share) {
 			navigator.share({
 				title: args.shareTitle,
 				text: '',
@@ -79,12 +79,9 @@ class ShareModalComponent extends TsxComponent<ShareComponentBindingArgs> implem
 		if (this.isMobile()) {
 			globalState.open(`fb-messenger://share?link=${encodeURIComponent(this.getUrl())}&app_id=${encodeURIComponent(this.FB_APP_ID)}`, '_system');
 		} else {
-			globalState.open(`https://www.facebook.com/dialog/send?link=${
-				encodeURIComponent(this.getUrl())
-			}&app_id=${
-				encodeURIComponent(this.FB_APP_ID)
-			}&redirect_uri=${
-				encodeURIComponent(this.getUrl())}`, '_system');
+			globalState.open(`https://www.facebook.com/dialog/send?link=${encodeURIComponent(this.getUrl())
+				}&app_id=${encodeURIComponent(this.FB_APP_ID)
+				}&redirect_uri=${encodeURIComponent(this.getUrl())}`, '_system');
 		}
 	}
 

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "inviton-powerduck",
 	"type": "module",
-	"version": "0.0.168",
+	"version": "0.0.170",
 	"files": [
 		"app/",
 		"common/",