feat(rn,ui) introduce react-native-paper
This commit is contained in:
parent
d69d4dd91a
commit
07eb19b98a
|
@ -0,0 +1,9 @@
|
|||
module.exports = {
|
||||
presets: [ 'module:metro-react-native-babel-preset' ],
|
||||
env: {
|
||||
production: {
|
||||
plugins: [ 'react-native-paper/babel' ]
|
||||
}
|
||||
},
|
||||
plugins: [ 'optional-require' ]
|
||||
};
|
|
@ -450,20 +450,22 @@
|
|||
}
|
||||
},
|
||||
"@babel/core": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.5.5.tgz",
|
||||
"integrity": "sha512-i4qoSr2KTtce0DmkuuQBV4AuQgGPUcPXMr9L5MyYAtk06z068lQ10a4O009fe5OB/DfNV+h+qqT7ddNV8UnRjg==",
|
||||
"version": "7.9.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/core/-/core-7.9.0.tgz",
|
||||
"integrity": "sha512-kWc7L0fw1xwvI0zi8OKVBuxRVefwGOrKSQMvrQ3dW+bIIavBY3/NpXmpjMy7bQnLgwgzWQZ8TlM57YHpHNHz4w==",
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.5.5",
|
||||
"@babel/generator": "^7.5.5",
|
||||
"@babel/helpers": "^7.5.5",
|
||||
"@babel/parser": "^7.5.5",
|
||||
"@babel/template": "^7.4.4",
|
||||
"@babel/traverse": "^7.5.5",
|
||||
"@babel/types": "^7.5.5",
|
||||
"convert-source-map": "^1.1.0",
|
||||
"@babel/code-frame": "^7.8.3",
|
||||
"@babel/generator": "^7.9.0",
|
||||
"@babel/helper-module-transforms": "^7.9.0",
|
||||
"@babel/helpers": "^7.9.0",
|
||||
"@babel/parser": "^7.9.0",
|
||||
"@babel/template": "^7.8.6",
|
||||
"@babel/traverse": "^7.9.0",
|
||||
"@babel/types": "^7.9.0",
|
||||
"convert-source-map": "^1.7.0",
|
||||
"debug": "^4.1.0",
|
||||
"json5": "^2.1.0",
|
||||
"gensync": "^1.0.0-beta.1",
|
||||
"json5": "^2.1.2",
|
||||
"lodash": "^4.17.13",
|
||||
"resolve": "^1.3.2",
|
||||
"semver": "^5.4.1",
|
||||
|
@ -471,88 +473,188 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@babel/code-frame": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.5.5.tgz",
|
||||
"integrity": "sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw==",
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.13.tgz",
|
||||
"integrity": "sha512-HV1Cm0Q3ZrpCR93tkWOYiuYIgLxZXZFVG2VgK+MBWjUqZTundupbfx2aXarXuw5Ko5aMcjtJgbSs4vUGBS5v6g==",
|
||||
"requires": {
|
||||
"@babel/highlight": "^7.0.0"
|
||||
"@babel/highlight": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/generator": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.5.5.tgz",
|
||||
"integrity": "sha512-ETI/4vyTSxTzGnU2c49XHv2zhExkv9JHLTwDAFz85kmcwuShvYG2H08FwgIguQf4JC75CBnXAUM5PqeF4fj0nQ==",
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.14.1.tgz",
|
||||
"integrity": "sha512-TMGhsXMXCP/O1WtQmZjpEYDhCYC9vFhayWZPJSZCGkPJgUqX0rF0wwtrYvnzVxIjcF80tkUertXVk5cwqi5cAQ==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.5.5",
|
||||
"@babel/types": "^7.14.1",
|
||||
"jsesc": "^2.5.1",
|
||||
"lodash": "^4.17.13",
|
||||
"source-map": "^0.5.0",
|
||||
"trim-right": "^1.0.1"
|
||||
"source-map": "^0.5.0"
|
||||
}
|
||||
},
|
||||
"@babel/helper-function-name": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.12.13.tgz",
|
||||
"integrity": "sha512-TZvmPn0UOqmvi5G4vvw0qZTpVptGkB1GL61R6lKvrSdIxGm5Pky7Q3fpKiIkQCAtRCBUwB0PaThlx9vebCDSwA==",
|
||||
"requires": {
|
||||
"@babel/helper-get-function-arity": "^7.12.13",
|
||||
"@babel/template": "^7.12.13",
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-get-function-arity": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.12.13.tgz",
|
||||
"integrity": "sha512-DjEVzQNz5LICkzN0REdpD5prGoidvbdYk1BVgRUOINaWJP2t6avB27X1guXK1kXNrX0WMfsrm1A/ZBthYuIMQg==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-member-expression-to-functions": {
|
||||
"version": "7.13.12",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.13.12.tgz",
|
||||
"integrity": "sha512-48ql1CLL59aKbU94Y88Xgb2VFy7a95ykGRbJJaaVv+LX5U8wFpLfiGXJJGUozsmA1oEh/o5Bp60Voq7ACyA/Sw==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.13.12"
|
||||
}
|
||||
},
|
||||
"@babel/helper-module-imports": {
|
||||
"version": "7.13.12",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.13.12.tgz",
|
||||
"integrity": "sha512-4cVvR2/1B693IuOvSI20xqqa/+bl7lqAMR59R4iu39R9aOX8/JoYY1sFaNvUMyMBGnHdwvJgUrzNLoUZxXypxA==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.13.12"
|
||||
}
|
||||
},
|
||||
"@babel/helper-module-transforms": {
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.14.0.tgz",
|
||||
"integrity": "sha512-L40t9bxIuGOfpIGA3HNkJhU9qYrf4y5A5LUSw7rGMSn+pcG8dfJ0g6Zval6YJGd2nEjI7oP00fRdnhLKndx6bw==",
|
||||
"requires": {
|
||||
"@babel/helper-module-imports": "^7.13.12",
|
||||
"@babel/helper-replace-supers": "^7.13.12",
|
||||
"@babel/helper-simple-access": "^7.13.12",
|
||||
"@babel/helper-split-export-declaration": "^7.12.13",
|
||||
"@babel/helper-validator-identifier": "^7.14.0",
|
||||
"@babel/template": "^7.12.13",
|
||||
"@babel/traverse": "^7.14.0",
|
||||
"@babel/types": "^7.14.0"
|
||||
}
|
||||
},
|
||||
"@babel/helper-optimise-call-expression": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.12.13.tgz",
|
||||
"integrity": "sha512-BdWQhoVJkp6nVjB7nkFWcn43dkprYauqtk++Py2eaf/GRDFm5BxRqEIZCiHlZUGAVmtwKcsVL1dC68WmzeFmiA==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-replace-supers": {
|
||||
"version": "7.13.12",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.13.12.tgz",
|
||||
"integrity": "sha512-Gz1eiX+4yDO8mT+heB94aLVNCL+rbuT2xy4YfyNqu8F+OI6vMvJK891qGBTqL9Uc8wxEvRW92Id6G7sDen3fFw==",
|
||||
"requires": {
|
||||
"@babel/helper-member-expression-to-functions": "^7.13.12",
|
||||
"@babel/helper-optimise-call-expression": "^7.12.13",
|
||||
"@babel/traverse": "^7.13.0",
|
||||
"@babel/types": "^7.13.12"
|
||||
}
|
||||
},
|
||||
"@babel/helper-simple-access": {
|
||||
"version": "7.13.12",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.13.12.tgz",
|
||||
"integrity": "sha512-7FEjbrx5SL9cWvXioDbnlYTppcZGuCY6ow3/D5vMggb2Ywgu4dMrpTJX0JdQAIcRRUElOIxF3yEooa9gUb9ZbA==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.13.12"
|
||||
}
|
||||
},
|
||||
"@babel/helper-split-export-declaration": {
|
||||
"version": "7.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.4.4.tgz",
|
||||
"integrity": "sha512-Ro/XkzLf3JFITkW6b+hNxzZ1n5OQ80NvIUdmHspih1XAhtN3vPTuUFT4eQnela+2MaZ5ulH+iyP513KJrxbN7Q==",
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.12.13.tgz",
|
||||
"integrity": "sha512-tCJDltF83htUtXx5NLcaDqRmknv652ZWCHyoTETf1CXYJdPC7nohZohjUgieXhv0hTJdRf2FjDueFehdNucpzg==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.4.4"
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-validator-identifier": {
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.0.tgz",
|
||||
"integrity": "sha512-V3ts7zMSu5lfiwWDVWzRDGIN+lnCEUdaXgtVHJgLb1rGaA6jMrtB9EmE7L18foXJIE8Un/A/h6NJfGQp/e1J4A=="
|
||||
},
|
||||
"@babel/highlight": {
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.14.0.tgz",
|
||||
"integrity": "sha512-YSCOwxvTYEIMSGaBQb5kDDsCopDdiUGsqpatp3fOlI4+2HQSkTmEVWnVuySdAC5EWCqSWWTv0ib63RjR7dTBdg==",
|
||||
"requires": {
|
||||
"@babel/helper-validator-identifier": "^7.14.0",
|
||||
"chalk": "^2.0.0",
|
||||
"js-tokens": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"@babel/parser": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.5.5.tgz",
|
||||
"integrity": "sha512-E5BN68cqR7dhKan1SfqgPGhQ178bkVKpXTPEXnFJBrEt8/DKRZlybmy+IgYLTeN7tp1R5Ccmbm2rBk17sHYU3g=="
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.1.tgz",
|
||||
"integrity": "sha512-muUGEKu8E/ftMTPlNp+mc6zL3E9zKWmF5sDHZ5MSsoTP9Wyz64AhEf9kD08xYJ7w6Hdcu8H550ircnPyWSIF0Q=="
|
||||
},
|
||||
"@babel/template": {
|
||||
"version": "7.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.4.4.tgz",
|
||||
"integrity": "sha512-CiGzLN9KgAvgZsnivND7rkA+AeJ9JB0ciPOD4U59GKbQP2iQl+olF1l76kJOupqidozfZ32ghwBEJDhnk9MEcw==",
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.12.13.tgz",
|
||||
"integrity": "sha512-/7xxiGA57xMo/P2GVvdEumr8ONhFOhfgq2ihK3h1e6THqzTAkHbkXgB0xI9yeTfIUoH3+oAeHhqm/I43OTbbjA==",
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.0.0",
|
||||
"@babel/parser": "^7.4.4",
|
||||
"@babel/types": "^7.4.4"
|
||||
"@babel/code-frame": "^7.12.13",
|
||||
"@babel/parser": "^7.12.13",
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/traverse": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.5.5.tgz",
|
||||
"integrity": "sha512-MqB0782whsfffYfSjH4TM+LMjrJnhCNEDMDIjeTpl+ASaUvxcjoiVCo/sM1GhS1pHOXYfWVCYneLjMckuUxDaQ==",
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.14.0.tgz",
|
||||
"integrity": "sha512-dZ/a371EE5XNhTHomvtuLTUyx6UEoJmYX+DT5zBCQN3McHemsuIaKKYqsc/fs26BEkHs/lBZy0J571LP5z9kQA==",
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.5.5",
|
||||
"@babel/generator": "^7.5.5",
|
||||
"@babel/helper-function-name": "^7.1.0",
|
||||
"@babel/helper-split-export-declaration": "^7.4.4",
|
||||
"@babel/parser": "^7.5.5",
|
||||
"@babel/types": "^7.5.5",
|
||||
"@babel/code-frame": "^7.12.13",
|
||||
"@babel/generator": "^7.14.0",
|
||||
"@babel/helper-function-name": "^7.12.13",
|
||||
"@babel/helper-split-export-declaration": "^7.12.13",
|
||||
"@babel/parser": "^7.14.0",
|
||||
"@babel/types": "^7.14.0",
|
||||
"debug": "^4.1.0",
|
||||
"globals": "^11.1.0",
|
||||
"lodash": "^4.17.13"
|
||||
"globals": "^11.1.0"
|
||||
}
|
||||
},
|
||||
"@babel/types": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.5.5.tgz",
|
||||
"integrity": "sha512-s63F9nJioLqOlW3UkyMd+BYhXt44YuaFm/VV0VwuteqjYwRrObkU7ra9pY4wAJR3oXi8hJrMcrcJdO/HH33vtw==",
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.14.1.tgz",
|
||||
"integrity": "sha512-S13Qe85fzLs3gYRUnrpyeIrBJIMYv33qSTg1qoBwiG6nPKwUWAD9odSzWhEedpwOIzSEI6gbdQIWEMiCI42iBA==",
|
||||
"requires": {
|
||||
"esutils": "^2.0.2",
|
||||
"lodash": "^4.17.13",
|
||||
"@babel/helper-validator-identifier": "^7.14.0",
|
||||
"to-fast-properties": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"debug": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
|
||||
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
|
||||
"convert-source-map": {
|
||||
"version": "1.7.0",
|
||||
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.7.0.tgz",
|
||||
"integrity": "sha512-4FJkXzKXEDB1snCFZlLP4gpC3JILicCpGbzG9f9G7tGqGCzETQ2hWPrcinA9oU4wtf2biUaEH5065UnMeR33oA==",
|
||||
"requires": {
|
||||
"ms": "^2.1.1"
|
||||
"safe-buffer": "~5.1.1"
|
||||
}
|
||||
},
|
||||
"json5": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/json5/-/json5-2.1.0.tgz",
|
||||
"integrity": "sha512-8Mh9h6xViijj36g7Dxi+Y4S6hNGV96vcJZr/SrlHh1LR/pEn/8j/+qIBbs44YKl69Lrfctp4QD+AdWLTMqEZAQ==",
|
||||
"debug": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
|
||||
"integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
|
||||
"requires": {
|
||||
"minimist": "^1.2.0"
|
||||
"ms": "2.1.2"
|
||||
}
|
||||
},
|
||||
"js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
|
||||
},
|
||||
"json5": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
|
||||
"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
|
||||
"requires": {
|
||||
"minimist": "^1.2.5"
|
||||
}
|
||||
},
|
||||
"ms": {
|
||||
|
@ -901,94 +1003,126 @@
|
|||
}
|
||||
},
|
||||
"@babel/helpers": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.5.5.tgz",
|
||||
"integrity": "sha512-nRq2BUhxZFnfEn/ciJuhklHvFOqjJUD5wpx+1bxUF2axL9C+v4DE/dmp5sT2dKnpOs4orZWzpAZqlCy8QqE/7g==",
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.14.0.tgz",
|
||||
"integrity": "sha512-+ufuXprtQ1D1iZTO/K9+EBRn+qPWMJjZSw/S0KlFrxCw4tkrzv9grgpDHkY9MeQTjTY8i2sp7Jep8DfU6tN9Mg==",
|
||||
"requires": {
|
||||
"@babel/template": "^7.4.4",
|
||||
"@babel/traverse": "^7.5.5",
|
||||
"@babel/types": "^7.5.5"
|
||||
"@babel/template": "^7.12.13",
|
||||
"@babel/traverse": "^7.14.0",
|
||||
"@babel/types": "^7.14.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/generator": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.5.5.tgz",
|
||||
"integrity": "sha512-ETI/4vyTSxTzGnU2c49XHv2zhExkv9JHLTwDAFz85kmcwuShvYG2H08FwgIguQf4JC75CBnXAUM5PqeF4fj0nQ==",
|
||||
"@babel/code-frame": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.13.tgz",
|
||||
"integrity": "sha512-HV1Cm0Q3ZrpCR93tkWOYiuYIgLxZXZFVG2VgK+MBWjUqZTundupbfx2aXarXuw5Ko5aMcjtJgbSs4vUGBS5v6g==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.5.5",
|
||||
"@babel/highlight": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/generator": {
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.14.1.tgz",
|
||||
"integrity": "sha512-TMGhsXMXCP/O1WtQmZjpEYDhCYC9vFhayWZPJSZCGkPJgUqX0rF0wwtrYvnzVxIjcF80tkUertXVk5cwqi5cAQ==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.14.1",
|
||||
"jsesc": "^2.5.1",
|
||||
"lodash": "^4.17.13",
|
||||
"source-map": "^0.5.0",
|
||||
"trim-right": "^1.0.1"
|
||||
"source-map": "^0.5.0"
|
||||
}
|
||||
},
|
||||
"@babel/helper-function-name": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.12.13.tgz",
|
||||
"integrity": "sha512-TZvmPn0UOqmvi5G4vvw0qZTpVptGkB1GL61R6lKvrSdIxGm5Pky7Q3fpKiIkQCAtRCBUwB0PaThlx9vebCDSwA==",
|
||||
"requires": {
|
||||
"@babel/helper-get-function-arity": "^7.12.13",
|
||||
"@babel/template": "^7.12.13",
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-get-function-arity": {
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-get-function-arity/-/helper-get-function-arity-7.12.13.tgz",
|
||||
"integrity": "sha512-DjEVzQNz5LICkzN0REdpD5prGoidvbdYk1BVgRUOINaWJP2t6avB27X1guXK1kXNrX0WMfsrm1A/ZBthYuIMQg==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-split-export-declaration": {
|
||||
"version": "7.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.4.4.tgz",
|
||||
"integrity": "sha512-Ro/XkzLf3JFITkW6b+hNxzZ1n5OQ80NvIUdmHspih1XAhtN3vPTuUFT4eQnela+2MaZ5ulH+iyP513KJrxbN7Q==",
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.12.13.tgz",
|
||||
"integrity": "sha512-tCJDltF83htUtXx5NLcaDqRmknv652ZWCHyoTETf1CXYJdPC7nohZohjUgieXhv0hTJdRf2FjDueFehdNucpzg==",
|
||||
"requires": {
|
||||
"@babel/types": "^7.4.4"
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/helper-validator-identifier": {
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.0.tgz",
|
||||
"integrity": "sha512-V3ts7zMSu5lfiwWDVWzRDGIN+lnCEUdaXgtVHJgLb1rGaA6jMrtB9EmE7L18foXJIE8Un/A/h6NJfGQp/e1J4A=="
|
||||
},
|
||||
"@babel/highlight": {
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.14.0.tgz",
|
||||
"integrity": "sha512-YSCOwxvTYEIMSGaBQb5kDDsCopDdiUGsqpatp3fOlI4+2HQSkTmEVWnVuySdAC5EWCqSWWTv0ib63RjR7dTBdg==",
|
||||
"requires": {
|
||||
"@babel/helper-validator-identifier": "^7.14.0",
|
||||
"chalk": "^2.0.0",
|
||||
"js-tokens": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"@babel/parser": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.5.5.tgz",
|
||||
"integrity": "sha512-E5BN68cqR7dhKan1SfqgPGhQ178bkVKpXTPEXnFJBrEt8/DKRZlybmy+IgYLTeN7tp1R5Ccmbm2rBk17sHYU3g=="
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.14.1.tgz",
|
||||
"integrity": "sha512-muUGEKu8E/ftMTPlNp+mc6zL3E9zKWmF5sDHZ5MSsoTP9Wyz64AhEf9kD08xYJ7w6Hdcu8H550ircnPyWSIF0Q=="
|
||||
},
|
||||
"@babel/template": {
|
||||
"version": "7.4.4",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.4.4.tgz",
|
||||
"integrity": "sha512-CiGzLN9KgAvgZsnivND7rkA+AeJ9JB0ciPOD4U59GKbQP2iQl+olF1l76kJOupqidozfZ32ghwBEJDhnk9MEcw==",
|
||||
"version": "7.12.13",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.12.13.tgz",
|
||||
"integrity": "sha512-/7xxiGA57xMo/P2GVvdEumr8ONhFOhfgq2ihK3h1e6THqzTAkHbkXgB0xI9yeTfIUoH3+oAeHhqm/I43OTbbjA==",
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.0.0",
|
||||
"@babel/parser": "^7.4.4",
|
||||
"@babel/types": "^7.4.4"
|
||||
"@babel/code-frame": "^7.12.13",
|
||||
"@babel/parser": "^7.12.13",
|
||||
"@babel/types": "^7.12.13"
|
||||
}
|
||||
},
|
||||
"@babel/traverse": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.5.5.tgz",
|
||||
"integrity": "sha512-MqB0782whsfffYfSjH4TM+LMjrJnhCNEDMDIjeTpl+ASaUvxcjoiVCo/sM1GhS1pHOXYfWVCYneLjMckuUxDaQ==",
|
||||
"version": "7.14.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.14.0.tgz",
|
||||
"integrity": "sha512-dZ/a371EE5XNhTHomvtuLTUyx6UEoJmYX+DT5zBCQN3McHemsuIaKKYqsc/fs26BEkHs/lBZy0J571LP5z9kQA==",
|
||||
"requires": {
|
||||
"@babel/code-frame": "^7.5.5",
|
||||
"@babel/generator": "^7.5.5",
|
||||
"@babel/helper-function-name": "^7.1.0",
|
||||
"@babel/helper-split-export-declaration": "^7.4.4",
|
||||
"@babel/parser": "^7.5.5",
|
||||
"@babel/types": "^7.5.5",
|
||||
"@babel/code-frame": "^7.12.13",
|
||||
"@babel/generator": "^7.14.0",
|
||||
"@babel/helper-function-name": "^7.12.13",
|
||||
"@babel/helper-split-export-declaration": "^7.12.13",
|
||||
"@babel/parser": "^7.14.0",
|
||||
"@babel/types": "^7.14.0",
|
||||
"debug": "^4.1.0",
|
||||
"globals": "^11.1.0",
|
||||
"lodash": "^4.17.13"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/code-frame": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.5.5.tgz",
|
||||
"integrity": "sha512-27d4lZoomVyo51VegxI20xZPuSHusqbQag/ztrBC7wegWoQ1nLREPVSKSW8byhTlzTKyNE4ifaTA6lCp7JjpFw==",
|
||||
"requires": {
|
||||
"@babel/highlight": "^7.0.0"
|
||||
}
|
||||
}
|
||||
"globals": "^11.1.0"
|
||||
}
|
||||
},
|
||||
"@babel/types": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.5.5.tgz",
|
||||
"integrity": "sha512-s63F9nJioLqOlW3UkyMd+BYhXt44YuaFm/VV0VwuteqjYwRrObkU7ra9pY4wAJR3oXi8hJrMcrcJdO/HH33vtw==",
|
||||
"version": "7.14.1",
|
||||
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.14.1.tgz",
|
||||
"integrity": "sha512-S13Qe85fzLs3gYRUnrpyeIrBJIMYv33qSTg1qoBwiG6nPKwUWAD9odSzWhEedpwOIzSEI6gbdQIWEMiCI42iBA==",
|
||||
"requires": {
|
||||
"esutils": "^2.0.2",
|
||||
"lodash": "^4.17.13",
|
||||
"@babel/helper-validator-identifier": "^7.14.0",
|
||||
"to-fast-properties": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"debug": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
|
||||
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
|
||||
"integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
|
||||
"requires": {
|
||||
"ms": "^2.1.1"
|
||||
"ms": "2.1.2"
|
||||
}
|
||||
},
|
||||
"js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
|
||||
},
|
||||
"ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
|
@ -1851,18 +1985,11 @@
|
|||
}
|
||||
},
|
||||
"@babel/runtime": {
|
||||
"version": "7.5.5",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.5.5.tgz",
|
||||
"integrity": "sha512-28QvEGyQyNkB0/m2B4FU7IEZGK2NUrcMtT6BZEFALTguLk+AUT6ofsHtPk5QyjAdUkpMJ+/Em+quwz4HOt30AQ==",
|
||||
"version": "7.9.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.9.0.tgz",
|
||||
"integrity": "sha512-cTIudHnzuWLS56ik4DnRnqqNf8MkdUzV4iFFI1h7Jo9xvrpQROYaAnaSd2mHLQAzzZAPfATynX5ord6YlNYNMA==",
|
||||
"requires": {
|
||||
"regenerator-runtime": "^0.13.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"regenerator-runtime": {
|
||||
"version": "0.13.3",
|
||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.3.tgz",
|
||||
"integrity": "sha512-naKIZz2GQ8JWh///G7L3X6LaQUAMp2lvb1rvwwsURe/VXwD6VMfr+/1NuNw3ag8v2kY1aQ/go5SNn79O9JU7yw=="
|
||||
}
|
||||
"regenerator-runtime": "^0.13.4"
|
||||
}
|
||||
},
|
||||
"@babel/template": {
|
||||
|
@ -1938,6 +2065,15 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"@callstack/react-theme-provider": {
|
||||
"version": "3.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@callstack/react-theme-provider/-/react-theme-provider-3.0.6.tgz",
|
||||
"integrity": "sha512-wwKMXfmklfogpalNZT0W+jh76BIquiYUiQHOaPmt/PCyCEP/E6rP+e7Uie6mBZrfkea9WJYJ+mus6r+45JAEhg==",
|
||||
"requires": {
|
||||
"deepmerge": "^3.2.0",
|
||||
"hoist-non-react-statics": "^3.3.0"
|
||||
}
|
||||
},
|
||||
"@cnakazawa/watch": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz",
|
||||
|
@ -5277,6 +5413,39 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"babel-plugin-optional-require": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-optional-require/-/babel-plugin-optional-require-0.3.1.tgz",
|
||||
"integrity": "sha512-qL9pdz6fgMjO3NZ1igO8BEJrWooLgkuhJ2yc4ligr3lMvEq7tzFZuz3JWSa6P05khrvTz1USf0POkxAjlFnkLw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-builtin-module": "^2.0.0",
|
||||
"resolve-from": "^4.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"builtin-modules": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-2.0.0.tgz",
|
||||
"integrity": "sha512-3U5kUA5VPsRUA3nofm/BXX7GVHKfxz0hOBAPxXrIvHzlDRkQVqEn6yi8QJegxl4LzOHLdvb7XF5dVawa/VVYBg==",
|
||||
"dev": true
|
||||
},
|
||||
"is-builtin-module": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-builtin-module/-/is-builtin-module-2.0.0.tgz",
|
||||
"integrity": "sha512-G2jLHphOywpgrL/AaJKWDXpdpGR9X4V1PCkB+EwG5Z28z8EukgdWnAUFAS2wdBtIpwHhHBIiq0NBOWEbSXN0Rg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"builtin-modules": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"resolve-from": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
|
||||
"integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"babel-plugin-syntax-jsx": {
|
||||
"version": "6.18.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
|
||||
|
@ -12803,6 +12972,11 @@
|
|||
"is-wsl": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"optional-require": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/optional-require/-/optional-require-1.0.3.tgz",
|
||||
"integrity": "sha512-RV2Zp2MY2aeYK5G+B/Sps8lW5NHAzE5QClbFP15j+PWmP+T9PxlJXBOOLoSAdgwFvS4t0aMR4vpedMkbHfh0nA=="
|
||||
},
|
||||
"optionator": {
|
||||
"version": "0.8.2",
|
||||
"resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz",
|
||||
|
@ -14789,11 +14963,26 @@
|
|||
"resolved": "https://registry.npmjs.org/react-native-immersive/-/react-native-immersive-2.0.0.tgz",
|
||||
"integrity": "sha512-9TL05nTHN/x9sN1wbUlBoGyzH4NCuZ/7WEEUp5CvOoKuUABvdYosov0O0SAMbm/5J913RRoy98VB6tGNi9lRSw=="
|
||||
},
|
||||
"react-native-iphone-x-helper": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.3.1.tgz",
|
||||
"integrity": "sha512-HOf0jzRnq2/aFUcdCJ9w9JGzN3gdEg0zFE4FyYlp4jtidqU03D5X7ZegGKfT1EWteR0gPBGp9ye5T5FvSWi9Yg=="
|
||||
},
|
||||
"react-native-keep-awake": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/react-native-keep-awake/-/react-native-keep-awake-4.0.0.tgz",
|
||||
"integrity": "sha512-0Fotox+eLXQooeibVs3P60yASYUWjtRw9MZNmbuHt5UZQrgUrAKsE4jm7gTr4tPU1m1RkwGzcgUFpcOkh/ec7g=="
|
||||
},
|
||||
"react-native-paper": {
|
||||
"version": "4.8.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-paper/-/react-native-paper-4.8.1.tgz",
|
||||
"integrity": "sha512-WgmqrDdcrr0ZbuiLCwMpmOMhl1n8uIvNulxsl2oCGtD8oeMkPJKHf4G/ONR+iNrSXcFbJek+uDRSmcGA5kDfUA==",
|
||||
"requires": {
|
||||
"@callstack/react-theme-provider": "^3.0.5",
|
||||
"color": "^3.1.2",
|
||||
"react-native-iphone-x-helper": "^1.3.1"
|
||||
}
|
||||
},
|
||||
"react-native-sound": {
|
||||
"version": "github:jitsi/react-native-sound#3fe5480fce935e888d5089d94a191c7c7e3aa190",
|
||||
"from": "github:jitsi/react-native-sound#3fe5480fce935e888d5089d94a191c7c7e3aa190"
|
||||
|
|
|
@ -60,6 +60,7 @@
|
|||
"moment": "2.29.1",
|
||||
"moment-duration-format": "2.2.2",
|
||||
"olm": "https://packages.matrix.org/npm/olm/olm-3.2.1.tgz",
|
||||
"optional-require": "1.0.3",
|
||||
"pixelmatch": "5.1.0",
|
||||
"promise.allsettled": "1.0.4",
|
||||
"punycode": "2.1.1",
|
||||
|
@ -77,6 +78,7 @@
|
|||
"react-native-device-info": "8.0.0",
|
||||
"react-native-immersive": "2.0.0",
|
||||
"react-native-keep-awake": "4.0.0",
|
||||
"react-native-paper": "4.8.1",
|
||||
"react-native-sound": "github:jitsi/react-native-sound#3fe5480fce935e888d5089d94a191c7c7e3aa190",
|
||||
"react-native-splash-screen": "3.2.0",
|
||||
"react-native-svg": "12.1.0",
|
||||
|
@ -102,7 +104,7 @@
|
|||
"zxcvbn": "4.4.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.5.5",
|
||||
"@babel/core": "7.9.0",
|
||||
"@babel/plugin-proposal-class-properties": "7.1.0",
|
||||
"@babel/plugin-proposal-export-default-from": "7.0.0",
|
||||
"@babel/plugin-proposal-export-namespace-from": "7.0.0",
|
||||
|
@ -112,9 +114,10 @@
|
|||
"@babel/preset-env": "7.1.0",
|
||||
"@babel/preset-flow": "7.0.0",
|
||||
"@babel/preset-react": "7.0.0",
|
||||
"@babel/runtime": "7.5.5",
|
||||
"@babel/runtime": "7.9.0",
|
||||
"babel-eslint": "10.0.1",
|
||||
"babel-loader": "8.0.4",
|
||||
"babel-plugin-optional-require": "0.3.1",
|
||||
"circular-dependency-plugin": "5.2.0",
|
||||
"clean-css-cli": "4.3.0",
|
||||
"css-loader": "3.6.0",
|
||||
|
|
|
@ -11,6 +11,7 @@ import { getFeatureFlag } from '../../base/flags/functions';
|
|||
import { Platform } from '../../base/react';
|
||||
import { DimensionsDetector, clientResized } from '../../base/responsive-ui';
|
||||
import { updateSettings } from '../../base/settings';
|
||||
import JitsiThemePaperProvider from '../../base/ui/components/JitsiThemeProvider.native';
|
||||
import logger from '../logger';
|
||||
|
||||
import { AbstractApp } from './AbstractApp';
|
||||
|
@ -127,10 +128,12 @@ export class App extends AbstractApp {
|
|||
*/
|
||||
_createMainElement(component, props) {
|
||||
return (
|
||||
<DimensionsDetector
|
||||
onDimensionsChanged = { this._onDimensionsChanged }>
|
||||
{ super._createMainElement(component, props) }
|
||||
</DimensionsDetector>
|
||||
<JitsiThemePaperProvider>
|
||||
<DimensionsDetector
|
||||
onDimensionsChanged = { this._onDimensionsChanged }>
|
||||
{ super._createMainElement(component, props) }
|
||||
</DimensionsDetector>
|
||||
</JitsiThemePaperProvider>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
// @flow
|
||||
|
||||
// Default color pallete
|
||||
// Default color palette
|
||||
export const colors = {
|
||||
error03: '#7A141F',
|
||||
error04: '#A21B29',
|
||||
|
@ -157,6 +157,15 @@ export const colorMap = {
|
|||
// Disabled background for high-contrast input fields
|
||||
field02Disabled: 'surface06',
|
||||
|
||||
// Background for section header
|
||||
section01: 'surface10',
|
||||
|
||||
// Active color for section header
|
||||
section01Active: 'primary04',
|
||||
|
||||
// Inactive color for section header
|
||||
section01Inactive: 'surface01',
|
||||
|
||||
// Borders
|
||||
// Border for the input fields in hover state
|
||||
border01: 'surface08',
|
||||
|
@ -184,7 +193,7 @@ export const colorMap = {
|
|||
// Color for positive messages applied to icons & borders
|
||||
success01: 'success05',
|
||||
|
||||
// Color for positive messages applied tobackgrounds
|
||||
// Color for positive messages applied to backgrounds
|
||||
success02: 'success05',
|
||||
|
||||
// Color for warning messages applied to icons, borders & backgrounds
|
||||
|
|
|
@ -0,0 +1,13 @@
|
|||
// @flow
|
||||
|
||||
import { font, colors, colorMap, spacing, shape, typography } from '../Tokens';
|
||||
import { createNativeTheme } from '../functions.native';
|
||||
|
||||
export default createNativeTheme({
|
||||
font,
|
||||
colors,
|
||||
colorMap,
|
||||
spacing,
|
||||
shape,
|
||||
typography
|
||||
});
|
|
@ -0,0 +1,24 @@
|
|||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import { Provider as PaperProvider } from 'react-native-paper';
|
||||
|
||||
import BaseTheme from './BaseTheme.native';
|
||||
|
||||
type Props = {
|
||||
|
||||
/**
|
||||
* The children of the component.
|
||||
*/
|
||||
children: React.ChildrenArray<any>
|
||||
}
|
||||
|
||||
/**
|
||||
* The theme provider for the mobile app.
|
||||
*
|
||||
* @param {Object} props - The props of the component.
|
||||
* @returns {React.ReactNode}
|
||||
*/
|
||||
export default function JitsiThemePaperProvider(props: Props) {
|
||||
return <PaperProvider theme = { BaseTheme }>{ props.children }</PaperProvider>;
|
||||
}
|
|
@ -0,0 +1,24 @@
|
|||
// @flow
|
||||
|
||||
import { DefaultTheme } from 'react-native-paper';
|
||||
|
||||
import { createColorTokens } from './utils';
|
||||
|
||||
/**
|
||||
* Creates a React Native Paper theme based on local UI tokens.
|
||||
*
|
||||
* @param {Object} arg - The ui tokens.
|
||||
* @returns {Object}
|
||||
*/
|
||||
export function createNativeTheme({ font, colors, colorMap, shape, spacing, typography }: Object) {
|
||||
return {
|
||||
...DefaultTheme,
|
||||
palette: createColorTokens(colorMap, colors),
|
||||
shape,
|
||||
spacing,
|
||||
typography: {
|
||||
font,
|
||||
...typography
|
||||
}
|
||||
};
|
||||
}
|
|
@ -2,19 +2,7 @@
|
|||
|
||||
import { createMuiTheme } from '@material-ui/core/styles';
|
||||
|
||||
/**
|
||||
* Creates the color tokens based on the color theme and the association map.
|
||||
* If a key is not fonund in the association map it defaults to the current value.
|
||||
*
|
||||
* @param {Object} colorMap - A map between the token name and the actual color value.
|
||||
* @param {Object} colors - An object containing all the theme colors.
|
||||
* @returns {Object}
|
||||
*/
|
||||
function createColorTokens(colorMap: Object, colors: Object): Object {
|
||||
return Object.entries(colorMap)
|
||||
.reduce((result, [ token, value ]) =>
|
||||
Object.assign(result, { [token]: colors[value] || value }), {});
|
||||
}
|
||||
import { createColorTokens } from './utils';
|
||||
|
||||
/**
|
||||
* Creates a MUI theme based on local UI tokens.
|
|
@ -0,0 +1,15 @@
|
|||
// @flow
|
||||
|
||||
/**
|
||||
* Creates the color tokens based on the color theme and the association map.
|
||||
* If a key is not found in the association map it defaults to the current value.
|
||||
*
|
||||
* @param {Object} colorMap - A map between the token name and the actual color value.
|
||||
* @param {Object} colors - An object containing all the theme colors.
|
||||
* @returns {Object}
|
||||
*/
|
||||
export function createColorTokens(colorMap: Object, colors: Object): Object {
|
||||
return Object.entries(colorMap)
|
||||
.reduce((result, [ token, value ]) =>
|
||||
Object.assign(result, { [token]: colors[value] || value }), {});
|
||||
}
|
|
@ -0,0 +1,87 @@
|
|||
// @flow
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import { List } from 'react-native-paper';
|
||||
|
||||
import { translate } from '../../../base/i18n';
|
||||
import { Icon, IconArrowDown, IconArrowUp } from '../../../base/icons';
|
||||
|
||||
import styles from './styles';
|
||||
|
||||
/**
|
||||
* The type of the React {@code Component} props of {@link FormSectionAccordion}
|
||||
*/
|
||||
type Props = {
|
||||
|
||||
/**
|
||||
* Is the section an accordion or not.
|
||||
*/
|
||||
accordion: boolean,
|
||||
|
||||
/**
|
||||
* The children to be displayed within this Link.
|
||||
*/
|
||||
children: React$Node,
|
||||
|
||||
/**
|
||||
* Whether the accordion is expandable.
|
||||
*/
|
||||
expandable: boolean,
|
||||
|
||||
/**
|
||||
* The i18n key of the text label of the section.
|
||||
*/
|
||||
label: string,
|
||||
|
||||
/**
|
||||
* An external style object passed to the component.
|
||||
*/
|
||||
style: Object,
|
||||
|
||||
/**
|
||||
* Invoked to obtain translated strings.
|
||||
*/
|
||||
t: Function
|
||||
}
|
||||
|
||||
/**
|
||||
* Section accordion on settings form.
|
||||
*
|
||||
* @returns {React$Element<any>}
|
||||
*/
|
||||
function FormSectionAccordion({ accordion, children, expandable, label, style, t }: Props) {
|
||||
const [ expandSection, setExpandSection ] = useState(false);
|
||||
|
||||
/**
|
||||
* Press handler for expanding form section.
|
||||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
function onPress() {
|
||||
setExpandSection(!expandSection);
|
||||
}
|
||||
|
||||
return (
|
||||
<List.Accordion
|
||||
expanded = { expandSection || !expandable }
|
||||
onPress = { onPress }
|
||||
/* eslint-disable-next-line react/jsx-no-bind */
|
||||
right = { props =>
|
||||
accordion && <Icon
|
||||
{ ...props }
|
||||
src = { expandSection ? IconArrowUp : IconArrowDown }
|
||||
style = { expandSection ? styles.sectionOpen : styles.sectionClose } /> }
|
||||
style = { [
|
||||
styles.formSectionTitle,
|
||||
style
|
||||
] }
|
||||
title = { t(label) }
|
||||
titleStyle = {
|
||||
expandSection || !expandable
|
||||
? styles.formSectionTitleActive : styles.formSectionTitleInActive }>
|
||||
{ children }
|
||||
</List.Accordion>
|
||||
);
|
||||
}
|
||||
|
||||
export default translate(FormSectionAccordion);
|
|
@ -1,60 +0,0 @@
|
|||
// @flow
|
||||
|
||||
import React, { Component } from 'react';
|
||||
import { Text, View } from 'react-native';
|
||||
|
||||
import { translate } from '../../../base/i18n';
|
||||
|
||||
import styles from './styles';
|
||||
|
||||
/**
|
||||
* The type of the React {@code Component} props of {@link FormSectionHeader}
|
||||
*/
|
||||
type Props = {
|
||||
|
||||
/**
|
||||
* The i18n key of the text label of the section.
|
||||
*/
|
||||
label: string,
|
||||
|
||||
/**
|
||||
* An external style object passed to the component.
|
||||
*/
|
||||
style: Object,
|
||||
|
||||
/**
|
||||
* Invoked to obtain translated strings.
|
||||
*/
|
||||
t: Function
|
||||
}
|
||||
|
||||
/**
|
||||
* Implements a React {@code Component} which renders a section header on a
|
||||
* form.
|
||||
*/
|
||||
class FormSectionHeader extends Component<Props> {
|
||||
/**
|
||||
* Implements React's {@link Component#render()}.
|
||||
*
|
||||
* @inheritdoc
|
||||
* @override
|
||||
* @returns {ReactElement}
|
||||
*/
|
||||
render() {
|
||||
const { label, style, t } = this.props;
|
||||
|
||||
return (
|
||||
<View
|
||||
style = { [
|
||||
styles.formSectionTitle,
|
||||
style
|
||||
] } >
|
||||
<Text>
|
||||
{ t(label) }
|
||||
</Text>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default translate(FormSectionHeader);
|
|
@ -1,7 +1,8 @@
|
|||
// @flow
|
||||
|
||||
import React from 'react';
|
||||
import { Alert, NativeModules, ScrollView, Switch, Text, TextInput } from 'react-native';
|
||||
import { Alert, NativeModules, ScrollView, Text } from 'react-native';
|
||||
import { Divider, Switch, TextInput, withTheme } from 'react-native-paper';
|
||||
|
||||
import { translate } from '../../../base/i18n';
|
||||
import { JitsiModal } from '../../../base/modal';
|
||||
|
@ -15,7 +16,8 @@ import {
|
|||
} from '../AbstractSettingsView';
|
||||
|
||||
import FormRow from './FormRow';
|
||||
import FormSectionHeader from './FormSectionHeader';
|
||||
import FormSectionAccordion from './FormSectionAccordion';
|
||||
import styles, { THUMB_COLOR } from './styles';
|
||||
|
||||
/**
|
||||
* Application information module.
|
||||
|
@ -54,11 +56,6 @@ type State = {
|
|||
*/
|
||||
serverURL: string,
|
||||
|
||||
/**
|
||||
* Whether to show advanced settings or not.
|
||||
*/
|
||||
showAdvanced: boolean,
|
||||
|
||||
/**
|
||||
* State variable for the start with audio muted switch.
|
||||
*/
|
||||
|
@ -67,7 +64,7 @@ type State = {
|
|||
/**
|
||||
* State variable for the start with video muted switch.
|
||||
*/
|
||||
startWithVideoMuted: boolean,
|
||||
startWithVideoMuted: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -81,7 +78,12 @@ type Props = AbstractProps & {
|
|||
*
|
||||
* @protected
|
||||
*/
|
||||
_serverURLChangeEnabled: boolean
|
||||
_serverURLChangeEnabled: boolean,
|
||||
|
||||
/**
|
||||
* Theme used for styles.
|
||||
*/
|
||||
theme: Object
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -117,7 +119,6 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
displayName,
|
||||
email,
|
||||
serverURL,
|
||||
showAdvanced: false,
|
||||
startWithAudioMuted,
|
||||
startWithVideoMuted
|
||||
};
|
||||
|
@ -128,7 +129,6 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
this._onDisableCallIntegration = this._onDisableCallIntegration.bind(this);
|
||||
this._onDisableCrashReporting = this._onDisableCrashReporting.bind(this);
|
||||
this._onDisableP2P = this._onDisableP2P.bind(this);
|
||||
this._onShowAdvanced = this._onShowAdvanced.bind(this);
|
||||
this._setURLFieldReference = this._setURLFieldReference.bind(this);
|
||||
this._showURLAlert = this._showURLAlert.bind(this);
|
||||
}
|
||||
|
@ -140,7 +140,17 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
* @returns {ReactElement}
|
||||
*/
|
||||
render() {
|
||||
const { displayName, email, serverURL, startWithAudioMuted, startWithVideoMuted } = this.state;
|
||||
const {
|
||||
disableCallIntegration,
|
||||
disableCrashReporting,
|
||||
disableP2P,
|
||||
displayName,
|
||||
email,
|
||||
serverURL,
|
||||
startWithAudioMuted,
|
||||
startWithVideoMuted
|
||||
} = this.state;
|
||||
const { palette } = this.props.theme;
|
||||
|
||||
return (
|
||||
<JitsiModal
|
||||
|
@ -150,71 +160,130 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
modalId = { SETTINGS_VIEW_ID }
|
||||
onClose = { this._onClose }>
|
||||
<ScrollView>
|
||||
<FormSectionHeader
|
||||
label = 'settingsView.profileSection' />
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.displayName'
|
||||
layout = 'column'>
|
||||
<FormSectionAccordion
|
||||
accordion = { false }
|
||||
expandable = { false }
|
||||
label = 'settingsView.profileSection'>
|
||||
<TextInput
|
||||
autoCorrect = { false }
|
||||
label = { this.props.t('settingsView.displayName') }
|
||||
mode = 'outlined'
|
||||
onChangeText = { this._onChangeDisplayName }
|
||||
placeholder = 'John Doe'
|
||||
style = { styles.textInputContainer }
|
||||
textContentType = { 'name' } // iOS only
|
||||
theme = {{
|
||||
colors: {
|
||||
primary: palette.action01Active,
|
||||
underlineColor: 'transparent'
|
||||
}
|
||||
}}
|
||||
value = { displayName } />
|
||||
</FormRow>
|
||||
<FormRow
|
||||
label = 'settingsView.email'
|
||||
layout = 'column'>
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<TextInput
|
||||
autoCapitalize = 'none'
|
||||
autoCorrect = { false }
|
||||
keyboardType = { 'email-address' }
|
||||
label = { this.props.t('settingsView.email') }
|
||||
mode = 'outlined'
|
||||
onChangeText = { this._onChangeEmail }
|
||||
placeholder = 'email@example.com'
|
||||
style = { styles.textInputContainer }
|
||||
textContentType = { 'emailAddress' } // iOS only
|
||||
theme = {{
|
||||
colors: {
|
||||
primary: palette.action01Active,
|
||||
underlineColor: 'transparent'
|
||||
}
|
||||
}}
|
||||
value = { email } />
|
||||
</FormRow>
|
||||
<FormSectionHeader
|
||||
label = 'settingsView.conferenceSection' />
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.serverURL'
|
||||
layout = 'column'>
|
||||
</FormSectionAccordion>
|
||||
<FormSectionAccordion
|
||||
accordion = { false }
|
||||
expandable = { false }
|
||||
label = 'settingsView.conferenceSection'>
|
||||
<TextInput
|
||||
autoCapitalize = 'none'
|
||||
autoCorrect = { false }
|
||||
editable = { this.props._serverURLChangeEnabled }
|
||||
keyboardType = { 'url' }
|
||||
label = { this.props.t('settingsView.serverURL') }
|
||||
mode = 'outlined'
|
||||
onBlur = { this._onBlurServerURL }
|
||||
onChangeText = { this._onChangeServerURL }
|
||||
placeholder = { this.props._serverURL }
|
||||
style = { styles.textInputContainer }
|
||||
textContentType = { 'URL' } // iOS only
|
||||
theme = {{
|
||||
colors: {
|
||||
primary: palette.action01Active,
|
||||
underlineColor: 'transparent'
|
||||
}
|
||||
}}
|
||||
value = { serverURL } />
|
||||
</FormRow>
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.startWithAudioMuted'>
|
||||
<Switch
|
||||
onValueChange = { this._onStartAudioMutedChange }
|
||||
value = { startWithAudioMuted } />
|
||||
</FormRow>
|
||||
<FormRow label = 'settingsView.startWithVideoMuted'>
|
||||
<Switch
|
||||
onValueChange = { this._onStartVideoMutedChange }
|
||||
value = { startWithVideoMuted } />
|
||||
</FormRow>
|
||||
<FormSectionHeader
|
||||
label = 'settingsView.buildInfoSection' />
|
||||
<FormRow
|
||||
label = 'settingsView.version'>
|
||||
<Text>
|
||||
{`${AppInfo.version} build ${AppInfo.buildNumber}`}
|
||||
</Text>
|
||||
</FormRow>
|
||||
<FormSectionHeader
|
||||
label = 'settingsView.advanced' />
|
||||
{this._renderAdvancedSettings()}
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<FormRow
|
||||
label = 'settingsView.startWithAudioMuted'>
|
||||
<Switch
|
||||
onValueChange = { this._onStartAudioMutedChange }
|
||||
thumbColor = { THUMB_COLOR }
|
||||
trackColor = {{ true: palette.action01Active }}
|
||||
value = { startWithAudioMuted } />
|
||||
</FormRow>
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<FormRow label = 'settingsView.startWithVideoMuted'>
|
||||
<Switch
|
||||
onValueChange = { this._onStartVideoMutedChange }
|
||||
thumbColor = { THUMB_COLOR }
|
||||
trackColor = {{ true: palette.action01Active }}
|
||||
value = { startWithVideoMuted } />
|
||||
</FormRow>
|
||||
</FormSectionAccordion>
|
||||
<FormSectionAccordion
|
||||
accordion = { false }
|
||||
expandable = { false }
|
||||
label = 'settingsView.buildInfoSection'>
|
||||
<FormRow
|
||||
label = 'settingsView.version'>
|
||||
<Text>
|
||||
{`${AppInfo.version} build ${AppInfo.buildNumber}`}
|
||||
</Text>
|
||||
</FormRow>
|
||||
</FormSectionAccordion>
|
||||
<FormSectionAccordion
|
||||
accordion = { true }
|
||||
expandable = { true }
|
||||
label = 'settingsView.advanced'>
|
||||
<FormRow
|
||||
label = 'settingsView.disableCallIntegration'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableCallIntegration }
|
||||
thumbColor = { THUMB_COLOR }
|
||||
trackColor = {{ true: palette.action01Active }}
|
||||
value = { disableCallIntegration } />
|
||||
</FormRow>
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
<FormRow
|
||||
label = 'settingsView.disableP2P'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableP2P }
|
||||
thumbColor = { THUMB_COLOR }
|
||||
trackColor = {{ true: palette.action01Active }}
|
||||
value = { disableP2P } />
|
||||
</FormRow>
|
||||
<Divider style = { styles.fieldSeparator } />
|
||||
{AppInfo.GOOGLE_SERVICES_ENABLED && (
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.disableCrashReporting'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableCrashReporting }
|
||||
thumbColor = { THUMB_COLOR }
|
||||
trackColor = {{ true: palette.action01Active }}
|
||||
value = { disableCrashReporting } />
|
||||
</FormRow>
|
||||
)}
|
||||
</FormSectionAccordion>
|
||||
</ScrollView>
|
||||
</JitsiModal>
|
||||
);
|
||||
|
@ -337,22 +406,9 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
* @returns {boolean} - True if the modal can be closed.
|
||||
*/
|
||||
_onClose() {
|
||||
this.setState({ showAdvanced: false });
|
||||
|
||||
return this._processServerURL(true /* hideOnSuccess */);
|
||||
}
|
||||
|
||||
_onShowAdvanced: () => void;
|
||||
|
||||
/**
|
||||
* Handles the advanced settings button.
|
||||
*
|
||||
* @returns {void}
|
||||
*/
|
||||
_onShowAdvanced() {
|
||||
this.setState({ showAdvanced: !this.state.showAdvanced });
|
||||
}
|
||||
|
||||
/**
|
||||
* Callback to update the start with audio muted value.
|
||||
*
|
||||
|
@ -403,56 +459,6 @@ class SettingsView extends AbstractSettingsView<Props, State> {
|
|||
return hideOnSuccess;
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders the advanced settings options.
|
||||
*
|
||||
* @private
|
||||
* @returns {React$Element}
|
||||
*/
|
||||
_renderAdvancedSettings() {
|
||||
const { disableCallIntegration, disableP2P, disableCrashReporting, showAdvanced } = this.state;
|
||||
|
||||
if (!showAdvanced) {
|
||||
return (
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.showAdvanced'>
|
||||
<Switch
|
||||
onValueChange = { this._onShowAdvanced }
|
||||
value = { showAdvanced } />
|
||||
</FormRow>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.disableCallIntegration'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableCallIntegration }
|
||||
value = { disableCallIntegration } />
|
||||
</FormRow>
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.disableP2P'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableP2P }
|
||||
value = { disableP2P } />
|
||||
</FormRow>
|
||||
{AppInfo.GOOGLE_SERVICES_ENABLED && (
|
||||
<FormRow
|
||||
fieldSeparator = { true }
|
||||
label = 'settingsView.disableCrashReporting'>
|
||||
<Switch
|
||||
onValueChange = { this._onDisableCrashReporting }
|
||||
value = { disableCrashReporting } />
|
||||
</FormRow>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
_setURLFieldReference: (React$ElementRef<*> | null) => void;
|
||||
|
||||
/**
|
||||
|
@ -538,4 +544,4 @@ function _mapStateToProps(state) {
|
|||
};
|
||||
}
|
||||
|
||||
export default translate(connect(_mapStateToProps)(SettingsView));
|
||||
export default translate(connect(_mapStateToProps)(withTheme(SettingsView)));
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import { ColorPalette } from '../../../base/styles';
|
||||
|
||||
import BaseTheme from '../../../base/ui/components/BaseTheme.native';
|
||||
export const ANDROID_UNDERLINE_COLOR = 'transparent';
|
||||
export const PLACEHOLDER_COLOR = ColorPalette.lightGrey;
|
||||
export const PLACEHOLDER_COLOR = BaseTheme.palette.action02Focus;
|
||||
export const THUMB_COLOR = BaseTheme.palette.field02;
|
||||
|
||||
const TEXT_SIZE = 17;
|
||||
const TEXT_SIZE = 14;
|
||||
|
||||
/**
|
||||
* The styles of the native components of the feature {@code settings}.
|
||||
|
@ -15,7 +15,7 @@ export default {
|
|||
fieldContainer: {
|
||||
alignItems: 'center',
|
||||
flexDirection: 'row',
|
||||
minHeight: 65,
|
||||
minHeight: 56,
|
||||
paddingHorizontal: 8
|
||||
},
|
||||
|
||||
|
@ -24,8 +24,7 @@ export default {
|
|||
*/
|
||||
fieldContainerColumn: {
|
||||
alignItems: 'flex-start',
|
||||
flexDirection: 'column',
|
||||
paddingVertical: 3
|
||||
flexDirection: 'column'
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -34,7 +33,7 @@ export default {
|
|||
fieldLabelContainer: {
|
||||
alignItems: 'center',
|
||||
flexDirection: 'row',
|
||||
marginRight: 5
|
||||
paddingLeft: 8
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -67,29 +66,61 @@ export default {
|
|||
alignItems: 'center',
|
||||
flex: 1,
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'flex-end'
|
||||
justifyContent: 'flex-end',
|
||||
paddingRight: 8
|
||||
},
|
||||
|
||||
/**
|
||||
* Style for the form section separator titles.
|
||||
*/
|
||||
formSectionTitle: {
|
||||
backgroundColor: 'rgba(0, 0, 0, 0.1)',
|
||||
padding: 5
|
||||
backgroundColor: BaseTheme.palette.section01,
|
||||
paddingBottom: 0,
|
||||
paddingTop: 0
|
||||
},
|
||||
|
||||
formSectionTitleActive: {
|
||||
color: BaseTheme.palette.section01Active
|
||||
},
|
||||
|
||||
formSectionTitleInActive: {
|
||||
color: BaseTheme.palette.section01Inactive
|
||||
},
|
||||
|
||||
sectionClose: {
|
||||
color: BaseTheme.palette.section01Inactive,
|
||||
fontSize: 14
|
||||
},
|
||||
|
||||
sectionOpen: {
|
||||
color: BaseTheme.palette.section01Active,
|
||||
fontSize: 14
|
||||
},
|
||||
|
||||
/**
|
||||
* Global {@code Text} color for the components.
|
||||
*/
|
||||
text: {
|
||||
color: ColorPalette.black
|
||||
color: BaseTheme.palette.field01
|
||||
},
|
||||
|
||||
/**
|
||||
* Text input container style.
|
||||
*/
|
||||
textInputContainer: {
|
||||
flex: 1,
|
||||
height: 40,
|
||||
paddingBottom: 8,
|
||||
paddingTop: 2,
|
||||
paddingLeft: 16,
|
||||
paddingRight: 16
|
||||
},
|
||||
|
||||
/**
|
||||
* Standard text input field style.
|
||||
*/
|
||||
textInputField: {
|
||||
color: ColorPalette.black,
|
||||
color: BaseTheme.palette.field01,
|
||||
flex: 1,
|
||||
fontSize: TEXT_SIZE,
|
||||
textAlign: 'right'
|
||||
|
|
|
@ -77,6 +77,9 @@ const config = {
|
|||
],
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
// Avoid loading babel.config.js, since we only use it for React Native.
|
||||
configFile: false,
|
||||
|
||||
// XXX The require.resolve bellow solves failures to locate the
|
||||
// presets when lib-jitsi-meet, for example, is npm linked in
|
||||
// jitsi-meet.
|
||||
|
|
Loading…
Reference in New Issue