@pallasoft/ps-mobile-components 1.1.0 → 1.3.0

package/dist/interfaces/ps-mobile-theme.d.ts

@@ -6,8 +6,12 @@ export interface PsMobileTheme {
     chart: string[];
     danger: string;
     dangerSoft: string;
+    dangerText: string;
     fonts: PsMobileFonts;
     hasHaptics: boolean;
+    info: string;
+    infoSoft: string;
+    infoText: string;
     isDark: boolean;
     isReduceMotion: boolean;
     ink: string;
@@ -15,17 +19,45 @@ export interface PsMobileTheme {
     muted: string;
     overlay: string;
     primary: string;
+    primary100: string;
+    primary200: string;
+    primary300: string;
+    primary400: string;
+    primary50: string;
+    primary500: string;
+    primary600: string;
+    primary700: string;
+    primary800: string;
+    primary900: string;
     primaryContrast: string;
+    primaryPressed: string;
     primarySoft: string;
+    primarySoftStrong: string;
+    primaryText: string;
     secondary: string;
+    secondary100: string;
+    secondary200: string;
+    secondary300: string;
+    secondary400: string;
+    secondary50: string;
+    secondary500: string;
+    secondary600: string;
+    secondary700: string;
+    secondary800: string;
+    secondary900: string;
     secondaryContrast: string;
+    secondaryPressed: string;
     secondarySoft: string;
+    secondarySoftStrong: string;
+    secondaryText: string;
     skeletonBase: string;
     skeletonSweep: string;
     success: string;
     successSoft: string;
+    successText: string;
     surface: string;
     warning: string;
     warningSoft: string;
+    warningText: string;
     white: string;
 }

package/dist/interfaces/ps-sheet-leading-kind.d.ts

@@ -0,0 +1 @@
+export type PsSheetLeadingKind = 'back' | 'close';

package/dist/interfaces/ps-sheet-leading-kind.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/ps-sheet-page.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from 'react';
+export interface PsSheetPage {
+    backLabel: string;
+    children: ReactNode;
+    id: string;
+    onBack: () => void;
+    title: string;
+}

package/dist/interfaces/ps-sheet-page.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/ps-tab-bar-context-data.d.ts

@@ -0,0 +1,4 @@
+export interface PsTabBarContextData {
+    isHidden: boolean;
+    setIsHidden: (isHidden: boolean) => void;
+}

package/dist/interfaces/ps-tab-bar-context-data.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/use-ps-app-lock-options.d.ts

@@ -0,0 +1,6 @@
+import type { PsAppLockPrompt } from './ps-app-lock-prompt';
+export interface UsePsAppLockOptions {
+    graceSeconds?: number;
+    isEnabled: boolean;
+    prompt: PsAppLockPrompt;
+}

package/dist/interfaces/use-ps-app-lock-options.js

@@ -0,0 +1 @@
+export {};

package/dist/interfaces/use-ps-app-lock-result.d.ts

@@ -0,0 +1,7 @@
+export interface UsePsAppLockResult {
+    isCovered: boolean;
+    isLocked: boolean;
+    isUnlocking: boolean;
+    lock: () => void;
+    unlock: () => Promise<boolean>;
+}

package/dist/interfaces/use-ps-app-lock-result.js

@@ -0,0 +1 @@
+export {};

package/dist/services/ps-action-menu-service.d.ts

@@ -1,4 +1,5 @@
 import type { SFSymbol } from 'sf-symbols-typescript';
+import type { PsActionMenuHeader } from '../interfaces/ps-action-menu-header';
 import type { PsActionMenuSection } from '../interfaces/ps-action-menu-section';
 import type { PsMenuItem } from '../interfaces/ps-menu-item';
 export declare class PsActionMenuService {
@@ -6,5 +7,8 @@ export declare class PsActionMenuService {
     static consistent(sections: PsActionMenuSection[]): PsActionMenuSection[];
     static flatten(sections: PsActionMenuSection[]): PsMenuItem[];
     static expand(item: PsMenuItem): PsMenuItem[];
+    static hasAvatar(item: PsMenuItem): boolean;
+    static monogram(item: PsMenuItem): SFSymbol | undefined;
+    static headerSymbol(header: PsActionMenuHeader): SFSymbol;
     static symbol(item: PsMenuItem): SFSymbol | undefined;
 }

package/dist/services/ps-action-menu-service.js

@@ -7,7 +7,7 @@ export class PsActionMenuService {
     }
     static consistent(sections) {
         const items = sections.flatMap((section) => section.items);
-        const hasAll = items.every((item) => item.iconKey !== undefined || item.isChecked === true);
+        const hasAll = items.every((item) => item.iconKey !== undefined || item.isChecked === true || PsActionMenuService.hasAvatar(item));
         if (hasAll)
             return sections;
         return sections.map((section) => ({
@@ -26,9 +26,32 @@ export class PsActionMenuService {
             ...item.children.flatMap((child) => this.expand(child)),
         ];
     }
+    static hasAvatar(item) {
+        return item.imageUri !== undefined || item.monogram !== undefined;
+    }
+    static monogram(item) {
+        if (item.monogram === undefined)
+            return undefined;
+        const monograms = PsSfSymbolConfig.monograms;
+        return monograms[item.monogram.trim().normalize('NFD').charAt(0).toLowerCase()];
+    }
+    static headerSymbol(header) {
+        const monogram = header.initials === undefined
+            ? undefined
+            : PsActionMenuService.monogram({
+                id: 'header',
+                label: header.title,
+                monogram: header.initials,
+                onSelect: () => undefined,
+            });
+        return monogram === undefined ? PsSfSymbolConfig.headerSymbol : monogram;
+    }
     static symbol(item) {
-        if (item.isChecked)
+        if (item.isChecked && !PsActionMenuService.hasAvatar(item))
             return PsSfSymbolConfig.checkedSymbol;
+        const monogram = PsActionMenuService.monogram(item);
+        if (monogram !== undefined)
+            return monogram;
         if (item.iconKey === undefined)
             return undefined;
         const symbols = PsSfSymbolConfig.symbols;

package/dist/services/ps-app-lock-grace-service.d.ts

@@ -0,0 +1,6 @@
+export declare class PsAppLockGraceService {
+    static isExpired(backgroundedAt: number | null, now: number, graceSeconds: number): boolean;
+    static isActive(state: string): boolean;
+    static isHidden(state: string): boolean;
+    static isBackground(state: string): boolean;
+}

package/dist/services/ps-app-lock-grace-service.js

@@ -0,0 +1,17 @@
+import { PsAppLockConfig } from '../constants/ps-app-lock-config';
+export class PsAppLockGraceService {
+    static isExpired(backgroundedAt, now, graceSeconds) {
+        if (backgroundedAt === null)
+            return false;
+        return now - backgroundedAt >= graceSeconds;
+    }
+    static isActive(state) {
+        return state === PsAppLockConfig.activeState;
+    }
+    static isHidden(state) {
+        return state === PsAppLockConfig.inactiveState || state === PsAppLockConfig.backgroundState;
+    }
+    static isBackground(state) {
+        return state === PsAppLockConfig.backgroundState;
+    }
+}

package/dist/services/ps-app-lock-service.d.ts

@@ -0,0 +1,10 @@
+import { PsBiometryKind } from '../constants/ps-biometry-kind';
+export declare class PsAppLockService {
+    private static busyCount;
+    static isAvailable(): Promise<boolean>;
+    static biometryKind(): Promise<PsBiometryKind>;
+    static kindOf(types: number[], level: number, platform: string): PsBiometryKind;
+    static authenticate(prompt: string, cancelLabel: string): Promise<boolean>;
+    static isBusy(): boolean;
+    private static load;
+}

package/dist/services/ps-app-lock-service.js

@@ -0,0 +1,84 @@
+import { requireOptionalNativeModule } from 'expo';
+import { Platform } from 'react-native';
+import { PsAppLockConfig } from '../constants/ps-app-lock-config';
+import { PsAuthenticationTypeCode, PsSecurityLevelCode, } from '../constants/ps-app-lock-native-codes';
+import { PsBiometryKind } from '../constants/ps-biometry-kind';
+export class PsAppLockService {
+    static async isAvailable() {
+        const native = PsAppLockService.load();
+        if (native === null)
+            return false;
+        try {
+            return (await native.getEnrolledLevelAsync()) > PsSecurityLevelCode.none;
+        }
+        catch {
+            return false;
+        }
+    }
+    static async biometryKind() {
+        const native = PsAppLockService.load();
+        if (native === null)
+            return PsBiometryKind.passcode;
+        try {
+            const [types, level] = await Promise.all([
+                native.supportedAuthenticationTypesAsync(),
+                native.getEnrolledLevelAsync(),
+            ]);
+            return PsAppLockService.kindOf(types, level, Platform.OS);
+        }
+        catch {
+            return PsBiometryKind.passcode;
+        }
+    }
+    static kindOf(types, level, platform) {
+        if (level < PsSecurityLevelCode.biometricWeak)
+            return PsBiometryKind.passcode;
+        const has = (code) => types.includes(code);
+        const face = has(PsAuthenticationTypeCode.face);
+        const fingerprint = has(PsAuthenticationTypeCode.fingerprint);
+        if (platform === PsAppLockConfig.iosPlatform && face)
+            return PsBiometryKind.face;
+        if (fingerprint)
+            return PsBiometryKind.fingerprint;
+        if (face)
+            return PsBiometryKind.face;
+        if (has(PsAuthenticationTypeCode.iris))
+            return PsBiometryKind.iris;
+        return PsBiometryKind.passcode;
+    }
+    static async authenticate(prompt, cancelLabel) {
+        const native = PsAppLockService.load();
+        if (native === null)
+            return false;
+        PsAppLockService.busyCount += 1;
+        try {
+            const result = await native.authenticateAsync({
+                cancelLabel,
+                disableDeviceFallback: false,
+                promptMessage: prompt,
+            });
+            return result.success;
+        }
+        catch {
+            return false;
+        }
+        finally {
+            PsAppLockService.busyCount -= 1;
+        }
+    }
+    static isBusy() {
+        return PsAppLockService.busyCount > 0;
+    }
+    static load() {
+        try {
+            if (requireOptionalNativeModule(PsAppLockConfig.nativeModuleName) === null)
+                return null;
+            const loaded = require('expo-local-authentication');
+            return typeof loaded.authenticateAsync === 'function' ? loaded : null;
+        }
+        catch {
+            return null;
+        }
+    }
+}
+PsAppLockService.busyCount = 0;

package/dist/services/ps-badge-tone-service.js

@@ -4,13 +4,13 @@ export class PsBadgeToneService {
     static resolve(tone, theme) {
         switch (tone) {
             case 'danger':
-                return { background: theme.dangerSoft, foreground: theme.danger };
+                return { background: theme.dangerSoft, foreground: theme.dangerText };
             case 'primary':
                 return { background: theme.primarySoft, foreground: theme.ink };
             case 'success':
-                return { background: theme.successSoft, foreground: theme.success };
+                return { background: theme.successSoft, foreground: theme.successText };
             case 'warning':
-                return { background: theme.warningSoft, foreground: theme.warning };
+                return { background: theme.warningSoft, foreground: theme.warningText };
             default:
                 return {
                     background: PsMobileColorService.withAlpha(theme.ink, PsMobileControlConfig.neutralAlpha),

package/dist/services/ps-button-style-service.js

@@ -9,8 +9,8 @@ export class PsButtonStyleService {
                     background: theme.primary,
                     border: theme.primary,
                     foreground: theme.primaryContrast,
-                    pressedBackground: theme.primary,
-                    pressedBorder: theme.primary,
+                    pressedBackground: theme.primaryPressed,
+                    pressedBorder: theme.primaryPressed,
                 };
             case 'danger':
                 return {

package/dist/services/ps-context-menu-service.d.ts

@@ -3,4 +3,5 @@ import type { PsMenuItem } from '../interfaces/ps-menu-item';
 import type { PsMobileTheme } from '../interfaces/ps-mobile-theme';
 export declare class PsContextMenuService {
     static actions(items: PsMenuItem[], theme: PsMobileTheme, hasSymbols: boolean): MenuAction[];
+    static find(items: PsMenuItem[], id: string): PsMenuItem | undefined;
 }

package/dist/services/ps-context-menu-service.js

@@ -4,6 +4,9 @@ export class PsContextMenuService {
         const consistent = PsActionMenuService.consistent([{ id: 'items', items }]);
         const entries = consistent.length === 0 ? [] : consistent[0].items;
         return entries.map((item) => ({
+            subactions: item.children === undefined || item.children.length === 0
+                ? undefined
+                : PsContextMenuService.actions(item.children, theme, hasSymbols),
             attributes: {
                 destructive: item.isDanger === true,
                 disabled: item.isDisabled === true,
@@ -14,4 +17,14 @@ export class PsContextMenuService {
             title: item.label,
         }));
     }
+    static find(items, id) {
+        for (const item of items) {
+            if (item.id === id)
+                return item;
+            const nested = item.children === undefined ? undefined : PsContextMenuService.find(item.children, id);
+            if (nested !== undefined)
+                return nested;
+        }
+        return undefined;
+    }
 }

package/dist/services/ps-count-badge-service.d.ts

@@ -0,0 +1,3 @@
+export declare class PsCountBadgeService {
+    static text(count: number): string;
+}

package/dist/services/ps-count-badge-service.js

@@ -0,0 +1,6 @@
+import { PsCountBadgeConfig } from '../constants/ps-count-badge-config';
+export class PsCountBadgeService {
+    static text(count) {
+        return count > PsCountBadgeConfig.maxCount ? `${PsCountBadgeConfig.maxCount}+` : String(count);
+    }
+}

package/dist/services/ps-list-row-style-service.d.ts

@@ -0,0 +1,4 @@
+import type { PsMobileTheme } from '../interfaces/ps-mobile-theme';
+export declare class PsListRowStyleService {
+    static background(isSelected: boolean, isPressed: boolean, theme: PsMobileTheme): string;
+}

package/dist/services/ps-list-row-style-service.js

@@ -0,0 +1,11 @@
+import { PsMobileControlConfig } from '../constants/ps-mobile-control-config';
+import { PsMobileColorService } from './ps-mobile-color-service';
+export class PsListRowStyleService {
+    static background(isSelected, isPressed, theme) {
+        if (isSelected)
+            return isPressed ? theme.primarySoftStrong : theme.primarySoft;
+        return isPressed
+            ? PsMobileColorService.withAlpha(theme.ink, PsMobileControlConfig.pressedAlpha)
+            : theme.surface;
+    }
+}

package/dist/services/ps-menu-tile-service.d.ts

@@ -0,0 +1,16 @@
+import type { PsActionMenuHeader } from '../interfaces/ps-action-menu-header';
+import type { PsActionMenuSection } from '../interfaces/ps-action-menu-section';
+import type { PsMenuItem } from '../interfaces/ps-menu-item';
+import type { PsMenuTileRequest } from '../interfaces/ps-menu-tile-request';
+export declare class PsMenuTileService {
+    static itemRequest(item: PsMenuItem): PsMenuTileRequest | null;
+    static headerRequest(header: PsActionMenuHeader | undefined): PsMenuTileRequest | null;
+    static requests(header: PsActionMenuHeader | undefined, sections: PsActionMenuSection[]): PsMenuTileRequest[];
+    static sections(sections: PsActionMenuSection[], tiles: Record<string, string>): PsActionMenuSection[];
+    static item(item: PsMenuItem, tiles: Record<string, string>): PsMenuItem;
+    static header(header: PsActionMenuHeader | undefined, tiles: Record<string, string>): PsActionMenuHeader | undefined;
+    static letter(value: string): string;
+    private static tile;
+    private static tree;
+    private static request;
+}

package/dist/services/ps-menu-tile-service.js

@@ -0,0 +1,70 @@
+import { PsActionMenuService } from './ps-action-menu-service';
+export class PsMenuTileService {
+    static itemRequest(item) {
+        if (!PsActionMenuService.hasAvatar(item))
+            return null;
+        const text = PsMenuTileService.letter(item.monogram === undefined ? item.label : item.monogram);
+        return PsMenuTileService.request('rounded', item.imageUri, text);
+    }
+    static headerRequest(header) {
+        if (header === undefined)
+            return null;
+        if (header.imageUri === undefined && header.initials === undefined)
+            return null;
+        return PsMenuTileService.request('circle', header.imageUri, header.initials === undefined ? '' : header.initials.trim().toUpperCase());
+    }
+    static requests(header, sections) {
+        const all = [
+            PsMenuTileService.headerRequest(header),
+            ...sections
+                .flatMap((section) => section.items.flatMap((item) => PsMenuTileService.tree(item)))
+                .map((item) => PsMenuTileService.itemRequest(item)),
+        ].filter((request) => request !== null);
+        return all.filter((request, index) => all.findIndex((other) => other.key === request.key) === index);
+    }
+    static sections(sections, tiles) {
+        return sections.map((section) => ({
+            ...section,
+            items: section.items.map((item) => PsMenuTileService.item(item, tiles)),
+        }));
+    }
+    static item(item, tiles) {
+        const children = item.children === undefined
+            ? undefined
+            : item.children.map((child) => PsMenuTileService.item(child, tiles));
+        const request = PsMenuTileService.itemRequest(item);
+        if (request === null)
+            return { ...item, children };
+        return {
+            ...item,
+            children,
+            imageUri: PsMenuTileService.tile(request, tiles),
+            monogram: item.monogram === undefined ? item.label : item.monogram,
+        };
+    }
+    static header(header, tiles) {
+        const request = PsMenuTileService.headerRequest(header);
+        if (header === undefined || request === null)
+            return header;
+        return { ...header, imageUri: PsMenuTileService.tile(request, tiles) };
+    }
+    static letter(value) {
+        return Array.from(value.trim()).slice(0, 1).join('').toUpperCase();
+    }
+    static tile(request, tiles) {
+        return request.key in tiles ? tiles[request.key] : undefined;
+    }
+    static tree(item) {
+        if (item.children === undefined)
+            return [item];
+        return [item, ...item.children.flatMap((child) => PsMenuTileService.tree(child))];
+    }
+    static request(shape, imageUri, text) {
+        return {
+            imageUri,
+            key: [shape, imageUri === undefined ? '' : imageUri, text].join('|'),
+            shape,
+            text,
+        };
+    }
+}

package/dist/services/ps-menu-tile-style-service.d.ts

@@ -0,0 +1,4 @@
+import type { ViewStyle } from 'react-native';
+export declare class PsMenuTileStyleService {
+    static canvas(): ViewStyle;
+}

package/dist/services/ps-menu-tile-style-service.js

@@ -0,0 +1,5 @@
+export class PsMenuTileStyleService {
+    static canvas() {
+        return { left: 0, opacity: 0, position: 'absolute', top: 0 };
+    }
+}

package/dist/services/ps-mobile-brand-service.d.ts

@@ -0,0 +1,5 @@
+import type { PsMobileBrandColors } from '../interfaces/ps-mobile-brand-colors';
+import type { PsMobileBrandInput } from '../interfaces/ps-mobile-brand-input';
+export declare class PsMobileBrandService {
+    static resolve({ primaryColor, primaryContrastColor, product, secondaryColor, }: PsMobileBrandInput): PsMobileBrandColors;
+}

package/dist/services/ps-mobile-brand-service.js

@@ -0,0 +1,24 @@
+import { PallasoftColor, PallasoftProductBrandService } from '@pallasoft/ps-design-system';
+export class PsMobileBrandService {
+    static resolve({ primaryColor, primaryContrastColor, product, secondaryColor, }) {
+        const brand = product === undefined ? null : PallasoftProductBrandService.colors(product);
+        if (primaryColor === undefined) {
+            return brand === null
+                ? {
+                    primary: PallasoftColor.Accent,
+                    primaryContrast: primaryContrastColor,
+                    secondary: secondaryColor,
+                }
+                : {
+                    primary: brand.primary,
+                    primaryContrast: brand.primaryContrast,
+                    secondary: secondaryColor === undefined ? brand.secondary : secondaryColor,
+                };
+        }
+        return {
+            primary: primaryColor,
+            primaryContrast: primaryContrastColor,
+            secondary: secondaryColor === undefined && brand !== null ? brand.secondary : secondaryColor,
+        };
+    }
+}

package/dist/services/ps-mobile-theme-service.d.ts

@@ -2,6 +2,4 @@ import type { PsMobileTheme } from '../interfaces/ps-mobile-theme';
 import type { PsMobileThemeInput } from '../interfaces/ps-mobile-theme-input';
 export declare class PsMobileThemeService {
     static create({ chart, hasHaptics, isDark, isReduceMotion, primary, primaryContrast, secondary, }: PsMobileThemeInput): PsMobileTheme;
-    private static light;
-    private static dark;
 }