@24i/bigscreen-sdk 1.0.30-alpha.2517 → 1.0.30

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@24i/bigscreen-sdk",
-    "version": "1.0.30-alpha.2517",
+    "version": "1.0.30",
     "description": "SmartApps BIGscreen SDK monorepo",
     "main": "index.js",
     "scripts": {

package/packages/keyboard/src/WhitelabelKeyboard/Keyboard.scss

@@ -23,6 +23,10 @@
         padding-bottom: $keyboard-padding-bottom;
         height: 100%;
         width: 100%;
+
+        &.wide .key.key-space {
+            width: $key-space-wide-width;
+        }
     }
 
     .keys-container {

package/packages/keyboard/src/WhitelabelKeyboard/Keyboard.tsx

@@ -208,6 +208,7 @@ export class Keyboard extends KeyboardBase<Layouts, Props> {
 
     renderKeyboard(layout: JSX.Element[]) {
         const { texts, shouldHideOnBackdropClick, languageLayout } = this.props;
+        const layoutClassName = languageLayout?.className || '';
         const isSpecialLayout = this.renderedLayout === 'special';
         const isNormalLayout = this.renderedLayout === 'normal';
         return (
@@ -216,7 +217,7 @@ export class Keyboard extends KeyboardBase<Layouts, Props> {
                     onClick={() => this.onCancel()}
                     enableOnClick={shouldHideOnBackdropClick}
                 />
-                <div className="keyboard-wrapper">
+                <div className={`keyboard-wrapper ${layoutClassName}`}>
                     <div className="keys-container side-bar layout-selector">
                         <div className="key-row first-row">
                             <div className="key key-wide key-empty">&nbsp;</div>

package/packages/keyboard/src/WhitelabelKeyboard/_sizes.1080.scss

@@ -26,6 +26,7 @@ $icon-mask-size: 40px;
 $key-with-icon-padding: 17px 22px;
 
 $key-space-width: 528px;
+$key-space-wide-width: 609px;
 
 $focus-shadow-1: 0 1px 3px 0;
 $focus-shadow-2: 0 20px 32px 0;

package/packages/keyboard/src/WhitelabelKeyboard/_sizes.scss

@@ -26,6 +26,7 @@ $icon-mask-size: 27px;
 $key-with-icon-padding: 11px 15px;
 
 $key-space-width: 348px;
+$key-space-wide-width: 406px;
 
 $focus-shadow-1: 0 1px 2px 0;
 $focus-shadow-2: 0 13px 21px 0;

package/packages/keyboard/src/WhitelabelKeyboard/layouts/index.ts

@@ -1,3 +1,8 @@
 export { hebrew } from './hebrew';
+export { korean } from './korean';
 export { latin } from './latin';
+export { russian } from './russian';
 export { special } from './special';
+export { tibetan } from './tibetan';
+export { turkish } from './turkish';
+export { urdu } from './urdu';

package/packages/keyboard/src/WhitelabelKeyboard/layouts/korean.ts

@@ -0,0 +1,26 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMatrixCell } from '../../types';
+
+const keyboardLayout = [
+    ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
+    ['ᄀ', 'ᄂ', 'ᄃ', 'ᄅ', 'ᄆ', 'ᄇ', 'ᄉ', 'ᄋ', 'ᄌ', 'ᄎ'],
+    ['ᄏ', 'ᄐ', 'ᄑ', 'ᄒ', 'ᅡ', 'ᅣ', 'ᅥ', 'ᅧ', 'ᅩ', 'ᅭ'],
+    ['ᅮ', 'ᅲ', 'ᅳ', 'ᅵ', '?', ',', '.', '@', '-', '_'],
+];
+
+/* eslint-disable max-len */
+const makeFocusStrings = (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => [
+    ['', '', '', ...layout[0], '', 'backspace', 'backspace'],
+    ['abc', 'abc', ...layout[1], 'clear', 'clear'],
+    ['special', 'special', ...layout[2], 'left', 'right'],
+    ['', '', ...layout[3], '', ''],
+    [
+        ...(hasLanguageLayout ? ['language', 'language'] : ['', '']),
+        'shift', 'shift', 'space', 'space', 'space', 'space', 'space', 'space', 'domain', 'domain', 'continue', 'continue'],
+];
+
+export const korean = {
+    keyText: 'ᄀᄂᄃ',
+    layout: keyboardLayout,
+    makeFocusStrings,
+};

package/packages/keyboard/src/WhitelabelKeyboard/layouts/russian.ts

@@ -0,0 +1,27 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMatrixCell } from '../../types';
+
+const keyboardLayout = [
+    ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '.'],
+    ['a', 'б', 'в', 'г', 'д', 'е', 'ё', 'ж', 'з', 'и', 'й'],
+    ['к', 'л', 'м', 'н', 'о', 'п', 'р', 'с', 'т', 'у', 'ф'],
+    ['х', 'ц', 'ч', 'ш', 'щ', 'ъ', 'ы', 'ь', 'э', 'ю', 'я'],
+];
+
+/* eslint-disable max-len */
+const makeFocusStrings = (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => [
+    ['', '', ...layout[0], 'backspace', 'backspace'],
+    ['abc', 'abc', ...layout[1], 'clear', 'clear'],
+    ['special', 'special', ...layout[2], 'left', 'right'],
+    ['', '', ...layout[3], '', ''],
+    [
+        ...(hasLanguageLayout ? ['language', 'language'] : ['', '']),
+        'shift', 'shift', 'space', 'space', 'space', 'space', 'space', 'space', 'space', 'domain', 'domain', 'continue', 'continue'],
+];
+
+export const russian = {
+    className: 'wide',
+    keyText: 'абв',
+    layout: keyboardLayout,
+    makeFocusStrings,
+};

package/packages/keyboard/src/WhitelabelKeyboard/layouts/tibetan.ts

@@ -0,0 +1,26 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMatrixCell } from '../../types';
+
+const keyboardLayout = [
+    ['༡', '༢', '༣', '༤', '༥', '༦', '༧', '༨', '༩', '༠'],
+    ['ཀ', 'ཁ', 'ག ', 'ང ', 'ཅ ', 'ཆ', 'ཇ', 'ཉ', 'ཏ', 'ཐ'],
+    ['ད', 'ན', 'པ', 'ཕ', 'བ', 'མ', 'ཙ', 'ཚ', 'ཛ', 'ཝ'],
+    ['ཝ', 'ཟ', 'འ', 'ཡ', 'ར', 'ལ', 'ཤ', 'ས', 'ཧ', 'ཨ'],
+];
+
+/* eslint-disable max-len */
+const makeFocusStrings = (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => [
+    ['', '', '', ...layout[0], '', 'backspace', 'backspace'],
+    ['abc', 'abc', ...layout[1], 'clear', 'clear'],
+    ['special', 'special', ...layout[2], 'left', 'right'],
+    ['', '', ...layout[3], '', ''],
+    [
+        ...(hasLanguageLayout ? ['language', 'language'] : ['', '']),
+        'shift', 'shift', 'space', 'space', 'space', 'space', 'space', 'space', 'domain', 'domain', 'continue', 'continue'],
+];
+
+export const tibetan = {
+    keyText: 'ཀཁག',
+    layout: keyboardLayout,
+    makeFocusStrings,
+};

package/packages/keyboard/src/WhitelabelKeyboard/layouts/turkish.ts

@@ -0,0 +1,26 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMatrixCell } from '../../types';
+
+const keyboardLayout = [
+    ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
+    ['a', 'b', 'c', 'ç', 'd', 'e', 'f', 'g', 'ğ', 'h'],
+    ['ı', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'ö', 'p'],
+    ['r', 's', 'ş', 't', 'u', 'ü', 'v', 'y', 'z', '.'],
+];
+
+/* eslint-disable max-len */
+const makeFocusStrings = (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => [
+    ['', '', ...layout[0], 'backspace', 'backspace'],
+    ['abc', 'abc', ...layout[1], 'clear', 'clear'],
+    ['special', 'special', ...layout[2], 'left', 'right'],
+    ['', '', ...layout[3], '', ''],
+    [
+        ...(hasLanguageLayout ? ['language', 'language'] : ['', '']),
+        'shift', 'shift', 'space', 'space', 'space', 'space', 'space', 'space', 'domain', 'domain', 'continue', 'continue'],
+];
+
+export const turkish = {
+    keyText: 'Abc',
+    layout: keyboardLayout,
+    makeFocusStrings,
+};

package/packages/keyboard/src/WhitelabelKeyboard/layouts/urdu.ts

@@ -0,0 +1,26 @@
+/* eslint-disable no-magic-numbers */
+import { KeyMatrixCell } from '../../types';
+
+const keyboardLayout = [
+    ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
+    ['الف', 'ب', 'س', 'ڈ', 'ای', 'ایف', 'جی', 'ح', 'آئی', 'ج'],
+    ['ک', 'ل', 'م', 'ن', 'او', 'پ', 'کیو', 'ر', 'ایس', 'ٹ'],
+    ['یو', 'وی', 'ڈبلیو', 'ایکس', 'یے', 'ز', 'ڈاٹ', 'ایٹ', '-', '_'],
+];
+
+/* eslint-disable max-len */
+const makeFocusStrings = (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => [
+    ['', '', ...layout[0], 'backspace', 'backspace'],
+    ['abc', 'abc', ...layout[1], 'clear', 'clear'],
+    ['special', 'special', ...layout[2], 'left', 'right'],
+    ['', '', ...layout[3], '', ''],
+    [
+        ...(hasLanguageLayout ? ['language', 'language'] : ['', '']),
+        'shift', 'shift', 'space', 'space', 'space', 'space', 'space', 'space', 'domain', 'domain', 'continue', 'continue'],
+];
+
+export const urdu = {
+    keyText: 'دوبارہ سے',
+    layout: keyboardLayout,
+    makeFocusStrings,
+};

package/packages/keyboard/src/WhitelabelKeyboard/types.ts

@@ -13,6 +13,7 @@ export type KeyTexts = {
 };
 
 export type LanguageLayout = {
+    className? : string,
     keyText: KeyTexts['toNormalLayout'],
     layout: KeyMatrixCell[][],
     makeFocusStrings: (layout: KeyMatrixCell[][], hasLanguageLayout: boolean) => KeyMatrixCell[][],