@reown/appkit-ui 1.8.15-viem-upgrade.0 → 1.8.15-viem-upgrade-2.0

package/dist/types/src/utils/ThemeHelperUtil.d.ts

@@ -0,0 +1,328 @@
+import { type CSSResultGroup } from 'lit';
+import type { ThemeType } from '@reown/appkit-common';
+import type { ThemeVariables } from './TypeUtil.js';
+export declare const ThemeHelperUtil: {
+    createCSSVariables<styles extends Record<string, unknown>>(styles: styles): {
+        cssVariables: styles;
+        cssVariablesVarPrefix: styles;
+    };
+    assignCSSVariables<vars extends Record<string, unknown>, styles extends Record<string, unknown>>(vars: vars, styles: styles): Record<string, string>;
+    createRootStyles(theme: ThemeType, themeVariables?: ThemeVariables): string;
+    generateW3MVariables(themeVariables?: ThemeVariables): Record<string, string>;
+    generateW3MOverrides(themeVariables?: ThemeVariables): Record<string, string>;
+    generateScaledVariables(themeVariables?: ThemeVariables): Record<string, string>;
+    generateColorMixCSS(themeVariables?: ThemeVariables, allVariables?: Record<string, string>): string;
+    generateBaseVariables(assignedCSSVariables: Record<string, string>): Record<string, string>;
+    applyColorMixToVariables(themeVariables?: ThemeVariables, allVariables?: Record<string, string>): Record<string, string>;
+};
+declare const vars: {
+    colors: {
+        black: string;
+        white: string;
+        white010: string;
+        accent010: string;
+        accent020: string;
+        accent030: string;
+        accent040: string;
+        accent050: string;
+        accent060: string;
+        accent070: string;
+        accent080: string;
+        accent090: string;
+        accent100: string;
+        accentSecondary010: string;
+        accentSecondary020: string;
+        accentSecondary030: string;
+        accentSecondary040: string;
+        accentSecondary050: string;
+        accentSecondary060: string;
+        accentSecondary070: string;
+        accentSecondary080: string;
+        accentSecondary090: string;
+        accentSecondary100: string;
+        productWalletKit: string;
+        productAppKit: string;
+        productCloud: string;
+        productDocumentation: string;
+        neutrals050: string;
+        neutrals100: string;
+        neutrals200: string;
+        neutrals300: string;
+        neutrals400: string;
+        neutrals500: string;
+        neutrals600: string;
+        neutrals700: string;
+        neutrals800: string;
+        neutrals900: string;
+        neutrals1000: string;
+        semanticSuccess010: string;
+        semanticSuccess020: string;
+        semanticSuccess030: string;
+        semanticSuccess040: string;
+        semanticSuccess050: string;
+        semanticSuccess060: string;
+        semanticSuccess070: string;
+        semanticSuccess080: string;
+        semanticSuccess090: string;
+        semanticSuccess100: string;
+        semanticError010: string;
+        semanticError020: string;
+        semanticError030: string;
+        semanticError040: string;
+        semanticError050: string;
+        semanticError060: string;
+        semanticError070: string;
+        semanticError080: string;
+        semanticError090: string;
+        semanticError100: string;
+        semanticWarning010: string;
+        semanticWarning020: string;
+        semanticWarning030: string;
+        semanticWarning040: string;
+        semanticWarning050: string;
+        semanticWarning060: string;
+        semanticWarning070: string;
+        semanticWarning080: string;
+        semanticWarning090: string;
+        semanticWarning100: string;
+    };
+    fontFamily: {
+        regular: string;
+        mono: string;
+    };
+    fontWeight: {
+        regular: string;
+        medium: string;
+    };
+    textSize: {
+        h1: string;
+        h2: string;
+        h3: string;
+        h4: string;
+        h5: string;
+        h6: string;
+        large: string;
+        medium: string;
+        small: string;
+    };
+    typography: {
+        'h1-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h1-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h1-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h2-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h2-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h2-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h3-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h3-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h3-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h4-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h4-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h4-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h5-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h5-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h5-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h6-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h6-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'h6-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'lg-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'lg-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'lg-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'md-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'md-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'md-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'sm-regular-mono': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'sm-regular': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+        'sm-medium': {
+            lineHeight: string;
+            letterSpacing: string;
+        };
+    };
+    tokens: {
+        core: {
+            backgroundAccentPrimary: string;
+            backgroundAccentCertified: string;
+            backgroundWalletKit: string;
+            backgroundAppKit: string;
+            backgroundCloud: string;
+            backgroundDocumentation: string;
+            backgroundSuccess: string;
+            backgroundError: string;
+            backgroundWarning: string;
+            textAccentPrimary: string;
+            textAccentCertified: string;
+            textWalletKit: string;
+            textAppKit: string;
+            textCloud: string;
+            textDocumentation: string;
+            textSuccess: string;
+            textError: string;
+            textWarning: string;
+            borderAccentPrimary: string;
+            borderSecondary: string;
+            borderSuccess: string;
+            borderError: string;
+            borderWarning: string;
+            foregroundAccent010: string;
+            foregroundAccent020: string;
+            foregroundAccent040: string;
+            foregroundAccent060: string;
+            foregroundSecondary020: string;
+            foregroundSecondary040: string;
+            foregroundSecondary060: string;
+            iconAccentPrimary: string;
+            iconAccentCertified: string;
+            iconSuccess: string;
+            iconError: string;
+            iconWarning: string;
+            glass010: string;
+            zIndex: string;
+        };
+        theme: {
+            overlay: string;
+            backgroundPrimary: string;
+            backgroundInvert: string;
+            textPrimary: string;
+            textSecondary: string;
+            textTertiary: string;
+            textInvert: string;
+            borderPrimary: string;
+            borderPrimaryDark: string;
+            borderSecondary: string;
+            foregroundPrimary: string;
+            foregroundSecondary: string;
+            foregroundTertiary: string;
+            iconDefault: string;
+            iconInverse: string;
+        };
+    };
+    borderRadius: {
+        '1': string;
+        '2': string;
+        '10': string;
+        '3': string;
+        '4': string;
+        '6': string;
+        '5': string;
+        '8': string;
+        '16': string;
+        '20': string;
+        '32': string;
+        '64': string;
+        '128': string;
+        round: string;
+    };
+    spacing: {
+        '0': string;
+        '01': string;
+        '1': string;
+        '2': string;
+        '3': string;
+        '4': string;
+        '5': string;
+        '6': string;
+        '7': string;
+        '8': string;
+        '9': string;
+        '10': string;
+        '12': string;
+        '14': string;
+        '16': string;
+        '20': string;
+        '32': string;
+        '64': string;
+    };
+    durations: {
+        xl: string;
+        lg: string;
+        md: string;
+        sm: string;
+    };
+    easings: {
+        'ease-out-power-2': string;
+        'ease-out-power-1': string;
+        'ease-in-power-2': string;
+        'ease-in-power-1': string;
+        'ease-inout-power-2': string;
+        'ease-inout-power-1': string;
+    };
+};
+declare function css(strings: TemplateStringsArray, ...values: ((_vars: typeof vars) => CSSResultGroup | number | string)[]): import("lit").CSSResult;
+export { css, vars };

package/dist/types/src/utils/ThemeUtil.d.ts

@@ -0,0 +1,11 @@
+import type { ThemeType, ThemeVariables } from './TypeUtil.js';
+export declare function initializeTheming(themeVariables?: ThemeVariables, themeMode?: ThemeType): void;
+export declare function setColorTheme(themeMode?: ThemeType): void;
+export declare function setThemeVariables(_themeVariables?: ThemeVariables): void;
+export declare function createRootStyles(_themeVariables?: ThemeVariables): {
+    core: import("lit").CSSResult;
+    dark: import("lit").CSSResult;
+    light: import("lit").CSSResult;
+};
+export declare const resetStyles: import("lit").CSSResult;
+export declare const elementStyles: import("lit").CSSResult;

package/dist/types/src/utils/TransactionUtil.d.ts

@@ -0,0 +1,15 @@
+import type { Transaction, TransactionImage, TransactionTransfer } from '@reown/appkit-common';
+export declare const TransactionUtil: {
+    getTransactionGroupTitle(year: number, month: number): string | undefined;
+    getTransactionImages(transfers: TransactionTransfer[]): TransactionImage[];
+    getTransactionImage(transfer?: TransactionTransfer): TransactionImage;
+    getTransactionImageURL(transfer: TransactionTransfer | undefined): string | undefined;
+    getTransactionTransferTokenType(transfer?: TransactionTransfer): "FUNGIBLE" | "NFT" | undefined;
+    getTransactionDescriptions(transaction: Transaction, mergedTransfers?: TransactionTransfer[]): string[];
+    getTransferDescription(transfer?: TransactionTransfer): string;
+    getFungibleTransferDescription(transfer?: TransactionTransfer): string | null;
+    mergeTransfers(transfers: TransactionTransfer[]): TransactionTransfer[];
+    filterGasFeeTransfers(transfers: TransactionTransfer[]): TransactionTransfer[];
+    filterGasFeesFromTokenGroup(tokenTransfers: TransactionTransfer[]): TransactionTransfer[];
+    getQuantityFixedValue(value: string | undefined): string | null;
+};

package/dist/types/src/utils/TypeUtil.d.ts

@@ -0,0 +1,126 @@
+import type { vars } from './ThemeHelperUtil.js';
+export type ColorType = string;
+export type BackgroundColorType = 'foregroundSecondary' | 'foregroundAccent010';
+export type AlertType = 'success' | 'error' | 'warning' | 'info';
+export type IconColorType = 'inherit' | 'accent-primary' | 'accent-certified' | 'success' | 'error' | 'warning' | 'default' | 'inverse';
+export type TextColorType = 'inherit' | 'primary' | 'secondary' | 'tertiary' | 'invert' | 'error' | 'warning' | 'accent-primary';
+export type FontFamilyType = 'regular' | 'mono';
+export type TextType = 'h1-regular-mono' | 'h1-regular' | 'h1-medium' | 'h2-regular-mono' | 'h2-regular' | 'h2-medium' | 'h3-regular-mono' | 'h3-regular' | 'h3-medium' | 'h4-regular-mono' | 'h4-regular' | 'h4-medium' | 'h5-regular-mono' | 'h5-regular' | 'h5-medium' | 'h6-regular-mono' | 'h6-regular' | 'h6-medium' | 'lg-regular-mono' | 'lg-regular' | 'lg-medium' | 'md-regular-mono' | 'md-regular' | 'md-medium' | 'sm-regular-mono' | 'sm-regular' | 'sm-medium';
+export type TextAlign = 'center' | 'left' | 'right';
+export type LineClamp = '1' | '2';
+export type SizeType = 'inherit' | 'xl' | 'lg' | 'md' | 'mdl' | 'sm' | 'xs' | 'xxs' | 'xxl';
+export type SelectSize = 'lg' | 'md' | 'sm';
+export type SpacingType = keyof typeof vars.spacing;
+export type IconSizeType = 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | 'inherit';
+export type BorderRadiusType = Exclude<SpacingType, '1xs' | 'xl' | 'xxl'> | 'xs';
+export type FlexDirectionType = 'column-reverse' | 'column' | 'row-reverse' | 'row';
+export type FlexWrapType = 'nowrap' | 'wrap-reverse' | 'wrap';
+export type FlexBasisType = 'auto' | 'content' | 'fit-content' | 'max-content' | 'min-content';
+export type FlexGrowType = '0' | '1';
+export type FlexShrinkType = '0' | '1';
+export type FlexAlignItemsType = 'baseline' | 'center' | 'flex-end' | 'flex-start' | 'stretch';
+export type FlexJustifyContentType = 'center' | 'flex-end' | 'flex-start' | 'space-around' | 'space-between' | 'space-evenly';
+export interface IWalletImage {
+    src: string;
+    walletName?: string;
+}
+export type TabSize = 'sm' | 'md';
+export type ToastMessageVariant = 'info' | 'success' | 'warning' | 'error';
+export type GridContentType = 'center' | 'end' | 'space-around' | 'space-between' | 'space-evenly' | 'start' | 'stretch';
+export type GridItemsType = 'center' | 'end' | 'start' | 'stretch';
+export type IconType = 'user' | 'add' | 'allWallets' | 'arrowBottomCircle' | 'appStore' | 'chromeStore' | 'apple' | 'arrowBottom' | 'arrowLeft' | 'arrowRight' | 'arrowTop' | 'arrowTopRight' | 'arrowClockWise' | 'bin' | 'bank' | 'browser' | 'card' | 'checkmark' | 'checkmarkBold' | 'download' | 'sealCheck' | 'chevronBottom' | 'chevronLeft' | 'chevronRight' | 'chevronTop' | 'clock' | 'close' | 'coinPlaceholder' | 'compass' | 'copy' | 'cursor' | 'desktop' | 'signOut' | 'discord' | 'dollar' | 'etherscan' | 'extension' | 'externalLink' | 'exclamationCircle' | 'facebook' | 'farcaster' | 'filters' | 'github' | 'google' | 'helpCircle' | 'image' | 'id' | 'lightbulb' | 'mail' | 'mobile' | 'more' | 'networkPlaceholder' | 'nftPlaceholder' | 'playStore' | 'plus' | 'power' | 'qrCode' | 'questionMark' | 'recycleHorizontal' | 'refresh' | 'reown' | 'search' | 'send' | 'spinner' | 'swapHorizontal' | 'swapVertical' | 'telegram' | 'threeDots' | 'ton' | 'twitch' | 'twitter' | 'twitterIcon' | 'verify' | 'verifyFilled' | 'wallet' | 'walletConnect' | 'walletConnectInvert' | 'walletConnectLightBrown' | 'walletConnectBrown' | 'warning' | 'warningCircle' | 'x' | 'info' | 'ethereum' | 'solana' | 'bitcoin';
+export type IconWeightType = 'regular' | 'bold' | 'fill';
+export type VisualType = 'browser' | 'meld' | 'dao' | 'defi' | 'defiAlt' | 'eth' | 'google' | 'layers' | 'lightbulb' | 'lock' | 'login' | 'network' | 'nft' | 'noun' | 'onrampCard' | 'profile' | 'system' | 'pencil' | 'solana' | 'bitcoin' | 'ton';
+export type VisualSize = 'sm' | 'md' | 'lg';
+export type LogoType = 'apple' | 'discord' | 'facebook' | 'github' | 'google' | 'more' | 'telegram' | 'twitch' | 'x' | 'farcaster';
+export type PlacementType = 'bottom' | 'left' | 'right' | 'top';
+export type SemanticChipType = 'success' | 'error' | 'warning';
+export type SemanticChipSize = 'sm' | 'md' | 'lg';
+export type ChipButtonType = 'accent' | 'neutral';
+export type ChipButtonSize = 'sm' | 'md' | 'lg';
+export type DomainChipVariant = 'success' | 'warning' | 'error';
+export type DomainChipSize = 'sm' | 'md';
+export type ButtonSize = 'lg' | 'md' | 'sm';
+export type ToggleSize = 'lg' | 'md' | 'sm';
+export type CheckboxSize = 'lg' | 'md' | 'sm';
+export type TooltipSize = 'md' | 'sm';
+export type TagVariant = 'accent' | 'info' | 'success' | 'warning' | 'error' | 'certified';
+export type TagSize = 'md' | 'sm';
+export type IconButtonVariant = 'neutral-primary' | 'neutral-secondary' | 'accent-primary';
+export type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';
+export type ButtonVariant = 'accent-primary' | 'accent-secondary' | 'neutral-primary' | 'neutral-secondary' | 'error-primary' | 'error-secondary' | 'neutral-tertiary';
+export type ButtonShortcutVariant = 'accent' | 'secondary';
+export type ButtonLinkVariant = 'accent' | 'secondary';
+export type TransactionThumbnailType = TransactionType | 'fiat' | 'unknown' | 'nft';
+export type TransactionThumbnailSize = 'sm' | 'lg';
+export type TransactionType = 'approve' | 'bought' | 'borrow' | 'burn' | 'cancel' | 'claim' | 'deploy' | 'deposit' | 'execute' | 'mint' | 'receive' | 'repay' | 'send' | 'stake' | 'trade' | 'unstake' | 'withdraw';
+export declare enum TransactionTypePastTense {
+    'approve' = "approved",
+    'bought' = "bought",
+    'borrow' = "borrowed",
+    'burn' = "burnt",
+    'cancel' = "canceled",
+    'claim' = "claimed",
+    'deploy' = "deployed",
+    'deposit' = "deposited",
+    'execute' = "executed",
+    'mint' = "minted",
+    'receive' = "received",
+    'repay' = "repaid",
+    'send' = "sent",
+    'sell' = "sold",
+    'stake' = "staked",
+    'trade' = "swapped",
+    'unstake' = "unstaked",
+    'withdraw' = "withdrawn"
+}
+export type TransactionIconType = 'arrowBottom' | 'arrowTop' | 'swapVertical' | 'swapHorizontal' | 'checkmark' | 'close';
+export type CardSelectType = 'network' | 'wallet';
+export type BackgroundType = 'opaque' | 'gray' | 'transparent';
+export type TagType = 'accent' | 'info' | 'success' | 'warning' | 'error' | 'certified';
+export type AccountEntryType = 'icon' | 'image';
+export type ThemeType = 'dark' | 'light';
+export type InputType = 'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week';
+export interface ThemeVariables {
+    '--w3m-font-family'?: string;
+    '--w3m-accent'?: string;
+    '--w3m-color-mix'?: string;
+    '--w3m-color-mix-strength'?: number;
+    '--w3m-font-size-master'?: string;
+    '--w3m-border-radius-master'?: string;
+    '--w3m-z-index'?: number;
+    '--w3m-qr-color'?: string;
+    '--apkt-font-family'?: string;
+    '--apkt-accent'?: string;
+    '--apkt-color-mix'?: string;
+    '--apkt-color-mix-strength'?: number;
+    '--apkt-font-size-master'?: string;
+    '--apkt-border-radius-master'?: string;
+    '--apkt-z-index'?: number;
+    '--apkt-qr-color'?: string;
+}
+export type IconBoxBorderType = 'wui-color-bg-125' | 'wui-accent-glass-010';
+export type TruncateType = 'start' | 'middle' | 'end';
+export type WalletGuideType = 'get-started' | 'explore';
+export type TruncateOptions = {
+    string: string;
+    charsStart: number;
+    charsEnd: number;
+    truncate: TruncateType;
+};
+export interface TokenInfo {
+    address: `0x${string}`;
+    symbol: string;
+    name: string;
+    decimals: number;
+    logoURI: string;
+    domainVersion?: string;
+    eip2612?: boolean;
+    isFoT?: boolean;
+    tags?: string[];
+}
+export type MaskInputOptions = {
+    value: string;
+    decimals?: number;
+    integers?: number;
+};

package/dist/types/src/utils/UiHelperUtil.d.ts

@@ -0,0 +1,18 @@
+import type { MaskInputOptions, SpacingType, ThemeType, TruncateOptions } from './TypeUtil.js';
+export declare const UiHelperUtil: {
+    getSpacingStyles(spacing: SpacingType | SpacingType[], index: number): string | undefined;
+    getFormattedDate(date: Date): string;
+    formatCurrency(amount?: number | string, options?: Intl.NumberFormatOptions): string;
+    getHostName(url: string): string;
+    getTruncateString({ string, charsStart, charsEnd, truncate }: TruncateOptions): string;
+    generateAvatarColors(address: string): string;
+    hexToRgb(hex: string): [number, number, number];
+    tintColor(rgb: [number, number, number], tint: number): [number, number, number];
+    isNumber(character: string): boolean;
+    getColorTheme(theme: ThemeType | undefined): ThemeType;
+    splitBalance(input: string): [string, string];
+    roundNumber(number: number, threshold: number, fixed: number): string | number;
+    cssDurationToNumber(duration: string): number;
+    maskInput({ value, decimals, integers }: MaskInputOptions): string;
+    capitalize(value: string | undefined): string;
+};

package/dist/types/src/utils/WebComponentsUtil.d.ts

@@ -0,0 +1,17 @@
+type Constructor<T> = new (...args: any[]) => T;
+interface ClassDescriptor {
+    kind: 'class';
+    elements: ClassElement[];
+    finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
+}
+interface ClassElement {
+    kind: 'field' | 'method';
+    key: PropertyKey;
+    placement: 'static' | 'prototype' | 'own';
+    initializer?: Function;
+    extras?: ClassElement[];
+    finisher?: <T>(clazz: Constructor<T>) => undefined | Constructor<T>;
+    descriptor?: PropertyDescriptor;
+}
+export declare function customElement(tagName: string): (classOrDescriptor: Constructor<HTMLElement> | ClassDescriptor) => any;
+export {};

package/dist/types/tests/Math.test.d.ts

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

package/dist/types/tests/QrCode.test.d.ts

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

package/dist/types/tests/ThemeHelperUtils.test.d.ts

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

package/dist/types/tests/ThemeUtil.test.d.ts

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

package/dist/types/tests/TransactionUtil.test.d.ts

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

package/dist/types/tests/UiHelperUtil.test.d.ts

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reown/appkit-ui",
-  "version": "1.8.15-viem-upgrade.0",
+  "version": "1.8.15-viem-upgrade-2.0",
   "type": "module",
   "main": "./dist/esm/index.js",
   "types": "./dist/types/index.d.ts",
@@ -450,9 +450,9 @@
     "@phosphor-icons/webcomponents": "2.1.5",
     "lit": "3.3.0",
     "qrcode": "1.5.3",
-    "@reown/appkit-common": "1.8.15-viem-upgrade.0",
-    "@reown/appkit-controllers": "1.8.15-viem-upgrade.0",
-    "@reown/appkit-wallet": "1.8.15-viem-upgrade.0"
+    "@reown/appkit-common": "1.8.15-viem-upgrade-2.0",
+    "@reown/appkit-controllers": "1.8.15-viem-upgrade-2.0",
+    "@reown/appkit-wallet": "1.8.15-viem-upgrade-2.0"
   },
   "devDependencies": {
     "@types/qrcode": "1.5.5",