@24i/bigscreen-sdk 0.9.9-alpha.2147

package/packages/i18n/src/middlewares/icu/shared/matchSwitchCase.ts

@@ -0,0 +1,80 @@
+import { forEach, map } from '@24i/bigscreen-sdk/perf-utils/array';
+import { unwrap } from './unwrap';
+
+type Options = {
+    includeDigits?: boolean,
+    extraParamsMatch?: string,
+};
+
+export type SwitchCase = {
+    match: string,
+    keyName: string,
+    matchedParams: string | undefined,
+    cases: {
+        [matcher: string]: string,
+    }
+};
+
+const BASE_PARTS_COUNT = 3;
+
+const rawCasesToCases = (
+    rawCases: string,
+    regexpCases: string[],
+): Record<string, string> => {
+    const cases: Record<string, string> = {};
+    const regexp = new RegExp(
+        `(${regexpCases.join('|')})\\s*\\{.+?\\}`, 'g',
+    );
+    const matches = rawCases.match(regexp);
+    if (!matches) return cases;
+    forEach(matches, (match) => {
+        const [matcher, ...rawValue] = match.split(' ');
+        cases[matcher] = unwrap(rawValue.join(' '));
+    });
+    return cases;
+};
+
+const matchToSwitchCase = (regexpCases: string[]) => (
+    (match: string): SwitchCase => {
+        let keyName: string;
+        let rawCases: string;
+        let matchedParams: string | undefined;
+        const parts = unwrap(match).split(/,\s*/g);
+        if (parts.length === BASE_PARTS_COUNT) {
+            [keyName, , rawCases] = parts;
+        } else {
+            rawCases = parts.pop()!;
+            keyName = parts.shift()!;
+            parts.shift(); // switchProcessor
+            matchedParams = parts.join('');
+        }
+        return {
+            match,
+            keyName,
+            matchedParams,
+            cases: rawCasesToCases(rawCases, regexpCases),
+        };
+    }
+);
+
+export const matchSwitchCase = (
+    switchProcessor: string,
+    cases: string[],
+    value: string,
+    {
+        includeDigits,
+        extraParamsMatch = '',
+    }: Options = {},
+): SwitchCase[] => {
+    const regexpCases = map(cases, (c) => `(${c})`);
+    if (includeDigits) regexpCases.unshift('(=\\d+)');
+    const params = extraParamsMatch ? `(${extraParamsMatch},\\s*)?` : '';
+    const regexp = new RegExp(
+        // eslint-disable-next-line max-len
+        `\\{\\w+,\\s*${switchProcessor},\\s*${params}((${regexpCases.join('|')})\\s*\\{.+?\\}\\s*?)+?\\}`,
+        'g',
+    );
+    const matches = value.match(regexp);
+    if (!matches) return [];
+    return map(matches, matchToSwitchCase(regexpCases));
+};

package/packages/i18n/src/middlewares/icu/shared/unwrap.ts

@@ -0,0 +1 @@
+export const unwrap = (s: string) => s.replace(/^\{|\}$/g, '');

package/packages/i18n/src/pluralsCommon/PluralsHelper.ts

@@ -0,0 +1,54 @@
+import { i18n } from '../I18n';
+
+type PluralFormType<PluralFormResolver extends (n: number) => ReturnType<PluralFormResolver>> = {
+    languages: string[],
+    pluralFormResolver: PluralFormResolver,
+};
+
+export class PluralsHelper<
+    PluralFormResolver extends (n: number) => ReturnType<PluralFormResolver>,
+> {
+    private pluralsResolver: PluralFormResolver;
+
+    private readonly resolverByLanguage: PluralFormType<PluralFormResolver>[];
+
+    private readonly pluralFormsCount: number;
+
+    constructor(RESOLVER_BY_LANGUAGE: PluralFormType<PluralFormResolver>[]) {
+        this.resolverByLanguage = RESOLVER_BY_LANGUAGE;
+        this.pluralFormsCount = RESOLVER_BY_LANGUAGE.length;
+
+        this.pluralsResolver = this.getPluralResolverByLanguage();
+        i18n.addEventListener('languagechange', this.onLanguageChange);
+    }
+
+    resolveForm(count: number) {
+        return this.pluralsResolver(count);
+    }
+
+    private readonly onLanguageChange = () => {
+        this.pluralsResolver = this.getPluralResolverByLanguage();
+    };
+
+    private getPluralResolverByLanguage() {
+        const currentLanguage = i18n.getLanguage();
+        const isLong = currentLanguage.indexOf('-') !== -1;
+        const shortLng = isLong ? currentLanguage.split('-')[0] : currentLanguage;
+        const longLng = currentLanguage;
+        return (
+            this.findPluralResolverByCode(longLng)
+            || this.findPluralResolverByCode(shortLng)
+            || this.resolverByLanguage[0].pluralFormResolver
+        );
+    }
+
+    private findPluralResolverByCode(lngCode: string) {
+        for (let i = 0; i < this.pluralFormsCount; i++) {
+            const pluralForm = this.resolverByLanguage[i];
+            if (pluralForm.languages.indexOf(lngCode) !== -1) {
+                return pluralForm.pluralFormResolver;
+            }
+        }
+        return null;
+    }
+}

package/packages/i18n/src/pluralsCommon/ResolverByLanguage.ts

@@ -0,0 +1,129 @@
+type Resolver<PluralFormResolver extends (n: number) => ReturnType<PluralFormResolver>> = {
+    resolver1: PluralFormResolver,
+    resolver2: PluralFormResolver,
+    resolver3: PluralFormResolver,
+    resolver4: PluralFormResolver,
+    resolver5: PluralFormResolver,
+    resolver6: PluralFormResolver,
+    resolver7: PluralFormResolver,
+    resolver8: PluralFormResolver,
+    resolver9: PluralFormResolver,
+    resolver10: PluralFormResolver,
+    resolver11: PluralFormResolver,
+    resolver12: PluralFormResolver,
+    resolver13: PluralFormResolver,
+    resolver14: PluralFormResolver,
+    resolver15: PluralFormResolver,
+    resolver16: PluralFormResolver,
+    resolver17: PluralFormResolver,
+    resolver18: PluralFormResolver,
+    resolver19: PluralFormResolver,
+    resolver20: PluralFormResolver,
+    resolver21: PluralFormResolver,
+    resolver22: PluralFormResolver,
+};
+
+export const resolverByLanguage = <
+    PluralFormResolver extends (n: number) => ReturnType<PluralFormResolver>,
+>(resolvers: Resolver<PluralFormResolver>) => [
+    {
+        languages: [
+            'ach', 'ak', 'am', 'arn', 'br', 'fil', 'gun', 'ln', 'mfe', 'mg', 'mi', 'oc', 'pt',
+            'pt-BR', 'tg', 'ti', 'tr', 'uz', 'wa',
+        ],
+        pluralFormResolver: resolvers.resolver1,
+    },
+    {
+        languages: [
+            'af', 'an', 'ast', 'az', 'bg', 'bn', 'ca', 'da', 'de', 'dev', 'el', 'en', 'eo', 'es',
+            'et', 'eu', 'fi', 'fo', 'fur', 'fy', 'gl', 'gu', 'ha', 'hi', 'hu', 'hy', 'ia', 'it',
+            'kn', 'ku', 'lb', 'mai', 'ml', 'mn', 'mr', 'nah', 'nap', 'nb', 'ne', 'nl', 'nn', 'no',
+            'nso', 'or', 'pa', 'pap', 'pms', 'ps', 'pt-PT', 'rm', 'sco', 'se', 'si', 'so', 'son',
+            'sq', 'sv', 'sw', 'ta', 'te', 'tk', 'ur', 'yo',
+        ],
+        pluralFormResolver: resolvers.resolver2,
+    },
+    {
+        languages: [
+            'ay', 'bo', 'cgg', 'fa', 'ht', 'id', 'ja', 'jbo', 'ka', 'kk', 'km', 'ko', 'ky', 'lo',
+            'ms', 'sah', 'su', 'th', 'tt', 'ug', 'vi', 'wo', 'zh',
+        ],
+        pluralFormResolver: resolvers.resolver3,
+    },
+    {
+        languages: ['be', 'bs', 'cnr', 'dz', 'hr', 'ru', 'sr', 'uk'],
+        pluralFormResolver: resolvers.resolver4,
+    },
+    {
+        languages: ['ar'],
+        pluralFormResolver: resolvers.resolver5,
+    },
+    {
+        languages: ['cs', 'sk'],
+        pluralFormResolver: resolvers.resolver6,
+    },
+    {
+        languages: ['csb', 'pl'],
+        pluralFormResolver: resolvers.resolver7,
+    },
+    {
+        languages: ['cy'],
+        pluralFormResolver: resolvers.resolver8,
+    },
+    {
+        languages: ['fr'],
+        pluralFormResolver: resolvers.resolver9,
+    },
+    {
+        languages: ['ga'],
+        pluralFormResolver: resolvers.resolver10,
+    },
+    {
+        languages: ['gd'],
+        pluralFormResolver: resolvers.resolver11,
+    },
+    {
+        languages: ['is'],
+        pluralFormResolver: resolvers.resolver12,
+    },
+    {
+        languages: ['jv'],
+        pluralFormResolver: resolvers.resolver13,
+    },
+    {
+        languages: ['kw'],
+        pluralFormResolver: resolvers.resolver14,
+    },
+    {
+        languages: ['lt'],
+        pluralFormResolver: resolvers.resolver15,
+    },
+    {
+        languages: ['lv'],
+        pluralFormResolver: resolvers.resolver16,
+    },
+    {
+        languages: ['mk'],
+        pluralFormResolver: resolvers.resolver17,
+    },
+    {
+        languages: ['mnk'],
+        pluralFormResolver: resolvers.resolver18,
+    },
+    {
+        languages: ['mt'],
+        pluralFormResolver: resolvers.resolver19,
+    },
+    {
+        languages: ['ro'],
+        pluralFormResolver: resolvers.resolver20,
+    },
+    {
+        languages: ['sl'],
+        pluralFormResolver: resolvers.resolver21,
+    },
+    {
+        languages: ['he', 'iw'],
+        pluralFormResolver: resolvers.resolver22,
+    },
+];

package/packages/i18n/src/t.tsx

@@ -0,0 +1,6 @@
+import { Translation } from './Translation';
+import { TranslationKey, TranslationOptions } from './types';
+
+export const t = (translationKey: TranslationKey, options: TranslationOptions | string = {}) => (
+    <Translation translationKey={translationKey} options={options} />
+);

package/packages/i18n/src/typedTranslate.ts

@@ -0,0 +1,31 @@
+import { i18n } from './I18n';
+import { t } from './t';
+import { TranslationOptions } from './types';
+
+export type TypedDictionary<T extends string, Dictionary = any> = (
+    T extends `${infer A}.${infer B}`
+        ? A extends keyof Dictionary
+            ? `${A}.${Extract<TypedDictionary<B, Dictionary[A]>, string>}`
+            : never
+        : T extends keyof Dictionary
+            ? Dictionary[T] extends string
+                ? T
+                : never
+            : never
+);
+
+export const getTypedI18nT = <Dictionary>(namespace = '') => (
+    <T extends string>(
+        key: TypedDictionary<T, Dictionary>, options?: string | TranslationOptions,
+    ) => (
+        i18n.t(namespace + key, options)
+    )
+);
+
+export const getTypedT = <Dictionary>(namespace = '') => (
+    <T extends string>(
+        key: TypedDictionary<T, Dictionary>, options?: string | TranslationOptions,
+    ) => t(namespace + key, options)
+);
+
+// Try at: https://tsplay.dev/Nd4VdN :-)

package/packages/i18n/src/types.ts

@@ -0,0 +1,66 @@
+// Do not use Record, it does not work recursively in TS
+export type Translation = string | {
+    [key: string]: Translation,
+};
+
+export type NamespaceResource = Record<string, Translation>;
+
+export type LanguageResource = Record<string, NamespaceResource>;
+
+export type Resources = Record<string, LanguageResource>;
+
+export type TranslationOptions = {
+    [key: string]: any,
+    lng?: string,
+    defaultValue?: string,
+    fallbackLng?: string,
+    ns?: string,
+    keySeparator?: string,
+    nsSeparator?: string,
+    middlewares?: MiddlewareSetup[],
+    interpolation?: InterpolationOptions,
+    context?: string,
+};
+
+export type PrivateOnlyTranslationOptions = {
+    language?: string,
+    useInterval?: boolean,
+    keyModifyingMiddlewares?: KeyModifyingMiddleware[],
+    valueModifyingMiddlewares?: ValueModifyingMiddleware[],
+};
+
+export type PrivateTranslationOptions = TranslationOptions & PrivateOnlyTranslationOptions;
+
+export type TranslationKey = string | string[];
+
+export interface Middleware {
+    priority: number,
+    name: string,
+    middleware: Function,
+}
+
+export interface KeyModifyingMiddleware extends Middleware {
+    middleware: (
+        key: string, namespace: NamespaceResource, options: PrivateTranslationOptions,
+    ) => string;
+}
+
+export interface ValueModifyingMiddleware extends Middleware {
+    middleware: (value: string, options: PrivateTranslationOptions,) => string;
+}
+
+export type Middlewares = {
+    keyModifying: KeyModifyingMiddleware[],
+    valueModifying: ValueModifyingMiddleware[],
+};
+
+export type MiddlewareSetup = () => Partial<Middlewares>;
+
+type FormatFunction = (value: any, format: string | undefined) => string;
+
+export type InterpolationOptions = {
+    format?: FormatFunction,
+    formatSeparator?: string,
+    prefix?: string,
+    suffix?: string,
+};

package/packages/i18n/src/utils.ts

@@ -0,0 +1,76 @@
+import { forEach, map } from '@24i/bigscreen-sdk/perf-utils/array';
+import {
+    KeyModifyingMiddleware,
+    Middleware,
+    MiddlewareSetup,
+    PrivateOnlyTranslationOptions,
+    PrivateTranslationOptions,
+    TranslationOptions,
+    ValueModifyingMiddleware,
+} from './types';
+
+const PRIVATE_OPTION_KEYS: (keyof PrivateOnlyTranslationOptions)[] = [
+    'language', 'useInterval', 'keyModifyingMiddlewares', 'valueModifyingMiddlewares',
+];
+
+export const publicOptionsOnly = (
+    privateOptions: PrivateTranslationOptions,
+): TranslationOptions => {
+    const publicOptions: TranslationOptions = {};
+    forEach(Object.keys(privateOptions), (optionName) => {
+        // @ts-ignore - Searching any string should be possible in array of strings
+        if (PRIVATE_OPTION_KEYS.indexOf(optionName) !== -1) return;
+        publicOptions[optionName] = privateOptions[optionName];
+    });
+    return publicOptions;
+};
+
+const containMiddleware = (middlewares: Middleware[], middleware: Middleware): boolean => {
+    const names = map(middlewares, ({ name }) => name);
+    return names.indexOf(middleware.name) !== -1;
+};
+
+export const addMiddlewaresByPriority = (
+    newMiddlewares: Middleware[], existingMiddlewares: Middleware[],
+) => {
+    forEach(newMiddlewares, (newMiddleware) => {
+        if (containMiddleware(existingMiddlewares, newMiddleware)) return;
+        const { priority } = newMiddleware;
+        const middlewaresLength = existingMiddlewares.length;
+        for (let i = 0; i < middlewaresLength; i++) {
+            if (existingMiddlewares[i].priority > priority) {
+                existingMiddlewares.splice(i, 0, newMiddleware);
+                return;
+            }
+        }
+        existingMiddlewares.push(newMiddleware);
+    });
+};
+
+export const setupMiddlewares = (
+    newMiddlewares: MiddlewareSetup[] = [],
+    keyModifyingMiddlewares: KeyModifyingMiddleware[],
+    valueModifyingMiddlewares: ValueModifyingMiddleware[],
+) => {
+    forEach(newMiddlewares, (middleware) => {
+        const { keyModifying, valueModifying } = middleware();
+        if (keyModifying) {
+            addMiddlewaresByPriority(keyModifying, keyModifyingMiddlewares);
+        }
+        if (valueModifying) {
+            addMiddlewaresByPriority(valueModifying, valueModifyingMiddlewares);
+        }
+    });
+};
+
+export const mergeMiddlewares = <T extends Middleware>(
+    middlewaresA: T[] = [],
+    middlewaresB: T[] = [],
+): T[] => {
+    if (middlewaresA.length === 0) return middlewaresB;
+    if (middlewaresB.length === 0) return middlewaresA;
+    const mergedMiddlewares: T[] = [];
+    addMiddlewaresByPriority(middlewaresA, mergedMiddlewares);
+    addMiddlewaresByPriority(middlewaresB, mergedMiddlewares);
+    return mergedMiddlewares;
+};

package/packages/icon/README.md

@@ -0,0 +1,107 @@
+---
+id: README
+title: Icon
+hide_title: true
+sidebar_label: Icon
+---
+
+# Icon
+Icon component provides a typesafe way for displaying icons defined in a spritemap. In SmartApps BIGscreen
+Template based projects, icons are handled automatically during build process. We currently support
+`svg` and `png` formats. All your icons are stored in `project_root/icons` directory and the build engine
+will process icons recursively from any sub-directory structure you will prepare. Icons are then
+converted into a spritemap and build engine will produce two main files:
+
+- `project_root/platformAssets/icons.json` - JSON object contains all icon names as object keys used for types
+- `project_root/platformAssets/runtime/icons.css` - CSS file with all generated icon styles (for you to import)
+
+Additional files:
+- `project_root/platformAssets/svg_icons.json` - JSON object containing only svg icon names (exists only if svg images are present)
+- `project_root/platformAssets/png_icons.json` - JSON object containing only png icon names with more detailed config for each icon
+generated from spritesmith plugin (exists only if png images are present)
+
+Icon names are generated in the following way:
+- file `featured scene.svg` will have icon name `featured-scene` and css class `icon-featured-scene`
+- file `home_scene.png` will have icon name `home_scene` and css class `icon-home_scene`
+
+## Props
+- `icon` - optional, icon name (`featured-scene` or `home_scene`)
+- `domRef` - optional, allows you to manage icons DOM
+
+## Usage
+In your project you should have a file similar to following
+```tsx
+// src/components/Icon/index.tsx
+import { Icon } from '@24i/bigscreen-sdk/icon';
+import * as Icons from '../../platformAssets/icons.json';
+
+class TypedIcon extends Icon<typeof Icons> {}
+
+export { TypedIcon as Icon };
+```
+
+Then you can do
+```tsx
+import { Icon } from '../components/Icon';
+
+class MyComponent {
+    ...
+    render () {
+        return (<Icon icon="my-symbol" />);
+    }
+}
+```
+
+Which will render
+```html
+<div class="icon icon-my-symbol"></div>
+```
+
+Component also has methods:
+- `setIcon` - change the current icon, can be either for different icon, or for focused state
+- `clearIcon` - clear the current icon, so the component will stay blank
+
+## "Coloring" svg icons
+For every SVG icon file name you put into the `maskList` array of rnv configuration (`svgIconsMaskList` in renative.json)
+a `mask-<icon-name>` variant is also generated in spritemap. This one uses css property `-webkit-mask` instead of `background`.
+This renders the icon in single color, but allows you to change it via `background-color` css property.
+
+You may want to use global style similar to this one when using svg icons:
+```scss
+.icon {
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: contain;
+    -webkit-mask-size: contain;
+    mask-size: contain;
+    -webkit-mask-repeat: no-repeat;
+    mask-repeat: no-repeat;
+    -webkit-mask-position: center;
+    mask-position: center;
+}
+```
+
+## Custom icon prefix
+When you have both icon types and they have same names, you can specify custom
+prefix for both png and svg icons in renative.json file in your project.
+- property `svgIconPrefix` for svg files, when prefix is `"svg-"`:
+  - file `featured scene.svg` will have icon name `svg-featured-scene` (`mask-svg-featured-scene` for mask)
+  and css class `icon-svg-featured-scene` (`icon-mask-svg-featured-scene`)
+- property `pngIconPrefix` for png files, when prefix is `"png-"`:
+  - file `home_scene.png` will have icon name `png-home_scene` and css class `icon-png-home_scene`.
+
+Prefix `icon-` in class names can't be changed.
+
+## Generating icon files for jest tests
+If you are using icon types in your tests, you will probably also need icon json files. You can use utility
+`generateIcons` from build engine as standalone functionality without need to run the whole build procedure.
+
+In those cases, put this code snippet into `jest-global-setup.js` file in your project.
+
+```js
+const { generateIcons } = require('./node_modules/@24i/bigscreen-sdk/rnv-build-engine/dist/src/scripts/utils/generateIcons');
+
+module.exports = async () => {
+    await generateIcons();
+};
+```

package/packages/icon/src/Icon.tsx

@@ -0,0 +1,49 @@
+import { createRef, Reference, Component } from '@24i/bigscreen-sdk/jsx';
+import { addClass } from '@24i/bigscreen-sdk/utils/addClass';
+import { removeClass } from '@24i/bigscreen-sdk/utils/removeClass';
+
+const ICON_PREFIX = 'icon-';
+
+type Props<SpritesJSON> = {
+    icon?: keyof SpritesJSON,
+    domRef?: Reference<HTMLDivElement>;
+};
+
+export class Icon<T> extends Component<Props<T>> {
+    ref: Reference<HTMLDivElement>;
+
+    currentIcon: keyof T | undefined;
+
+    constructor(props: Props<T>) {
+        super(props);
+        this.ref = props.domRef || createRef();
+        this.currentIcon = props.icon;
+    }
+
+    getClass(icon: keyof T): string {
+        return `${ICON_PREFIX}${icon as string}`;
+    }
+
+    setIcon(icon: keyof T) {
+        if (icon === this.currentIcon) return;
+        if (this.currentIcon) removeClass(this.ref, this.getClass(this.currentIcon));
+        addClass(this.ref, this.getClass(icon));
+        this.currentIcon = icon;
+    }
+
+    clearIcon() {
+        if (!this.currentIcon) return;
+        removeClass(this.ref, this.getClass(this.currentIcon));
+        this.currentIcon = undefined;
+    }
+
+    render() {
+        const { icon } = this.props;
+        return (
+            <div
+                ref={this.ref}
+                className={`icon ${icon ? this.getClass(icon) : ''}`}
+            />
+        );
+    }
+}

package/packages/icon/src/index.ts

@@ -0,0 +1 @@
+export { Icon } from './Icon';

package/packages/ime/README.md

@@ -0,0 +1,72 @@
+---
+id: README
+title: IME
+hide_title: true
+sidebar_label: IME
+---
+
+# Input Method Editor
+Input method editor (ime for short) is a package that connects input method (system/virtual keyboard) and input.
+
+## Usage
+From application perspective the only interaction you do with ime is setting the keyboard.
+Ideal place to do so is either in a scene component on `(re)activate` or if you have only
+one keyboard in the whole app in componentDidMount of the App component.
+If you have scene special keyboard you should clear it on `deactivate`
+```tsx
+class Scene extends Component {
+    keyboard = createRef<Keyboard>();
+
+    activate() { // or reactivate or both
+        ime.setKeyboard(this.keyboard.current);
+    }
+
+    deactivate() {
+        ime.clearKeyboard();
+    }
+
+    render() {
+        // ...
+        <Keyboard ref={this.keyboard} />
+        // ...
+    }
+}
+```
+
+## Interface - Input
+If you are preparing a custom Input you will be interested in `async ime.input(this.inputElement.current)`.
+
+This function returns a promise that is resolved when the keyboard is closed. You should also start listening on `caretpositionchange` to get new caret position. You can use this event to also update
+input value.
+```ts
+onInputEnter() {
+    this.startInput(); // Prepare visuals (caret, border, etc.)
+    ime.addEventListener('caretpositionchange', this.onCaretPositionChange);
+    await ime.input(this.inputElement.current);
+    ime.removeEventListener('caretpositionchange', this.onCaretPositionChange);
+    this.endInput(); // Clean visuals again
+}
+```
+
+## Interface - Keyboard
+If you are preparing custom Keyboard you need to implement `IKeyboard` interface exported by ime package.
+
+That currently is:
+```ts
+type CaretPositionChangeListener = (payload: number) => void;
+
+export interface IKeyboardEvents extends EventMapType {
+    'caretpositionchange': CaretPositionChangeListener,
+}
+
+interface IKeyboard extends IEvents<IKeyboardEvents> {
+    async input(inputElement: HTMLInputElement) => Promise<void>;
+}
+```
+
+Calling the input function should cause keyboard to appear and to take over the control. With each change keyboard should trigger `caretpositionchange`. (Ime relays `addEventListener` and `removeEventListener` between Input and Keyboard.)
+
+It is the keyboard's responsibility to edit input's value and caret position.
+
+Once the user finishes typing and hides the keyboard. It is also keyboard's responsibility to return the focus
+and to resolve the Promise so the Input code execution can continue.

package/packages/ime/src/IKeyboard.ts

@@ -0,0 +1,6 @@
+import { IEvents } from '@24i/bigscreen-sdk/events-manager';
+import { IKeyboardEvents } from './IKeyboardEvent';
+
+export interface IKeyboard extends IEvents<IKeyboardEvents> {
+    input(input: HTMLInputElement): Promise<any>
+}