mirror of
https://github.com/zhigang1992/react-native-web.git
synced 2026-04-24 04:25:27 +08:00
Use 'fbjs' instead of separate packages
This commit is contained in:
@@ -16,8 +16,7 @@
|
||||
"test:watch": "npm run test:unit -- --no-single-run"
|
||||
},
|
||||
"dependencies": {
|
||||
"exenv": "^1.2.0",
|
||||
"invariant": "^2.2.0",
|
||||
"fbjs": "^0.7.2",
|
||||
"inline-style-prefixer": "^0.6.7",
|
||||
"lodash.debounce": "^3.1.1",
|
||||
"react-tappable": "^0.7.1",
|
||||
@@ -28,6 +27,7 @@
|
||||
"babel-core": "^6.3.13",
|
||||
"babel-eslint": "^4.1.6",
|
||||
"babel-loader": "^6.2.0",
|
||||
"babel-plugin-transform-decorators-legacy": "^1.3.4",
|
||||
"babel-preset-es2015": "^6.3.13",
|
||||
"babel-preset-react": "^6.3.13",
|
||||
"babel-preset-stage-1": "^6.3.13",
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
*/
|
||||
|
||||
import { Component } from 'react'
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
import ReactDOM from 'react-dom'
|
||||
import renderApplication, { prerenderApplication } from './renderApplication'
|
||||
|
||||
@@ -65,7 +65,7 @@ export default class AppRegistry {
|
||||
}
|
||||
|
||||
static runApplication(appKey: string, appParameters?: Object): void {
|
||||
const isDevelopment = process.env.NODE_ENV === 'development'
|
||||
const isDevelopment = process.env.NODE_ENV !== 'production'
|
||||
const params = { ...appParameters }
|
||||
params.rootTag = `#${params.rootTag.id}`
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
* @flow
|
||||
*/
|
||||
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
import React, { Component } from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import ReactDOMServer from 'react-dom/server'
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
|
||||
const listeners = {}
|
||||
const eventTypes = [ 'change' ]
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
* @flow
|
||||
*/
|
||||
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
|
||||
const dimensions = {
|
||||
screen: {
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
* @flow
|
||||
*/
|
||||
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
|
||||
const connection = window.navigator.connection || window.navigator.mozConnection || window.navigator.webkitConnection
|
||||
const eventTypes = [ 'change' ]
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { canUseDOM } from 'exenv'
|
||||
import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment'
|
||||
|
||||
const Platform = {
|
||||
OS: 'web',
|
||||
|
||||
@@ -10,7 +10,7 @@ import { PropTypes } from 'react'
|
||||
import ImageStylePropTypes from '../../components/Image/ImageStylePropTypes'
|
||||
import TextStylePropTypes from '../../components/Text/TextStylePropTypes'
|
||||
import ViewStylePropTypes from '../../components/View/ViewStylePropTypes'
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
|
||||
export default class StyleSheetValidation {
|
||||
static validateStyleProp(prop, style, caller) {
|
||||
|
||||
@@ -9,8 +9,8 @@
|
||||
* @flow
|
||||
*/
|
||||
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
import ReactPropTypeLocationNames from 'react/lib/ReactPropTypeLocationNames'
|
||||
import invariant from 'invariant'
|
||||
|
||||
export default function createStrictShapeTypeChecker(shapeTypes) {
|
||||
function checkType(isRequired, props, propName, componentName, location?) {
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
*
|
||||
* @flow
|
||||
*/
|
||||
import invariant from 'invariant'
|
||||
import invariant from 'fbjs/lib/invariant'
|
||||
import expandStyle from './expandStyle'
|
||||
|
||||
export default function flattenStyle(style): ?Object {
|
||||
|
||||
352
src/apis/StyleSheet/normalizeColor.js
Normal file
352
src/apis/StyleSheet/normalizeColor.js
Normal file
@@ -0,0 +1,352 @@
|
||||
/* eslint-disable */
|
||||
/**
|
||||
* Copyright (c) 2015-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*
|
||||
* @providesModule normalizeColor
|
||||
* @flow
|
||||
*/
|
||||
/* eslint no-bitwise: 0 */
|
||||
'use strict';
|
||||
|
||||
function normalizeColor(color: string | number): ?number {
|
||||
var match;
|
||||
|
||||
if (typeof color === 'number') {
|
||||
if (color >>> 0 === color && color >= 0 && color <= 0xffffffff) {
|
||||
return color;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
// Ordered based on occurrences on Facebook codebase
|
||||
if ((match = matchers.hex6.exec(color))) {
|
||||
return parseInt(match[1] + 'ff', 16) >>> 0;
|
||||
}
|
||||
|
||||
if (names.hasOwnProperty(color)) {
|
||||
return names[color];
|
||||
}
|
||||
|
||||
if ((match = matchers.rgb.exec(color))) {
|
||||
return (
|
||||
parse255(match[1]) << 24 | // r
|
||||
parse255(match[2]) << 16 | // g
|
||||
parse255(match[3]) << 8 | // b
|
||||
0x000000ff // a
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
if ((match = matchers.rgba.exec(color))) {
|
||||
return (
|
||||
parse255(match[1]) << 24 | // r
|
||||
parse255(match[2]) << 16 | // g
|
||||
parse255(match[3]) << 8 | // b
|
||||
parse1(match[4]) // a
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
if ((match = matchers.hex3.exec(color))) {
|
||||
return parseInt(
|
||||
match[1] + match[1] + // r
|
||||
match[2] + match[2] + // g
|
||||
match[3] + match[3] + // b
|
||||
'ff', // a
|
||||
16
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
// https://drafts.csswg.org/css-color-4/#hex-notation
|
||||
if ((match = matchers.hex8.exec(color))) {
|
||||
return parseInt(match[1], 16) >>> 0;
|
||||
}
|
||||
|
||||
if ((match = matchers.hex4.exec(color))) {
|
||||
return parseInt(
|
||||
match[1] + match[1] + // r
|
||||
match[2] + match[2] + // g
|
||||
match[3] + match[3] + // b
|
||||
match[4] + match[4], // a
|
||||
16
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
if ((match = matchers.hsl.exec(color))) {
|
||||
return (
|
||||
hslToRgb(
|
||||
parse360(match[1]), // h
|
||||
parsePercentage(match[2]), // s
|
||||
parsePercentage(match[3]) // l
|
||||
) |
|
||||
0x000000ff // a
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
if ((match = matchers.hsla.exec(color))) {
|
||||
return (
|
||||
hslToRgb(
|
||||
parse360(match[1]), // h
|
||||
parsePercentage(match[2]), // s
|
||||
parsePercentage(match[3]) // l
|
||||
) |
|
||||
parse1(match[4]) // a
|
||||
) >>> 0;
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function hue2rgb(p: number, q: number, t: number): number {
|
||||
if (t < 0) {
|
||||
t += 1;
|
||||
}
|
||||
if (t > 1) {
|
||||
t -= 1;
|
||||
}
|
||||
if (t < 1 / 6) {
|
||||
return p + (q - p) * 6 * t;
|
||||
}
|
||||
if (t < 1 / 2) {
|
||||
return q;
|
||||
}
|
||||
if (t < 2 / 3) {
|
||||
return p + (q - p) * (2 / 3 - t) * 6;
|
||||
}
|
||||
return p;
|
||||
}
|
||||
|
||||
function hslToRgb(h: number, s: number, l: number): number {
|
||||
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
||||
var p = 2 * l - q;
|
||||
var r = hue2rgb(p, q, h + 1 / 3);
|
||||
var g = hue2rgb(p, q, h);
|
||||
var b = hue2rgb(p, q, h - 1 / 3);
|
||||
|
||||
return (
|
||||
Math.round(r * 255) << 24 |
|
||||
Math.round(g * 255) << 16 |
|
||||
Math.round(b * 255) << 8
|
||||
);
|
||||
}
|
||||
|
||||
// var INTEGER = '[-+]?\\d+';
|
||||
var NUMBER = '[-+]?\\d*\\.?\\d+';
|
||||
var PERCENTAGE = NUMBER + '%';
|
||||
|
||||
function call(...args) {
|
||||
return '\\(\\s*(' + args.join(')\\s*,\\s*(') + ')\\s*\\)';
|
||||
}
|
||||
|
||||
var matchers = {
|
||||
rgb: new RegExp('rgb' + call(NUMBER, NUMBER, NUMBER)),
|
||||
rgba: new RegExp('rgba' + call(NUMBER, NUMBER, NUMBER, NUMBER)),
|
||||
hsl: new RegExp('hsl' + call(NUMBER, PERCENTAGE, PERCENTAGE)),
|
||||
hsla: new RegExp('hsla' + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER)),
|
||||
hex3: /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
||||
hex4: /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
||||
hex6: /^#([0-9a-fA-F]{6})$/,
|
||||
hex8: /^#([0-9a-fA-F]{8})$/,
|
||||
};
|
||||
|
||||
function parse255(str: string): number {
|
||||
var int = parseInt(str, 10);
|
||||
if (int < 0) {
|
||||
return 0;
|
||||
}
|
||||
if (int > 255) {
|
||||
return 255;
|
||||
}
|
||||
return int;
|
||||
}
|
||||
|
||||
function parse360(str: string): number {
|
||||
var int = parseFloat(str);
|
||||
return (((int % 360) + 360) % 360) / 360;
|
||||
}
|
||||
|
||||
function parse1(str: string): number {
|
||||
var num = parseFloat(str);
|
||||
if (num < 0) {
|
||||
return 0;
|
||||
}
|
||||
if (num > 1) {
|
||||
return 255;
|
||||
}
|
||||
return Math.round(num * 255);
|
||||
}
|
||||
|
||||
function parsePercentage(str: string): number {
|
||||
// parseFloat conveniently ignores the final %
|
||||
var int = parseFloat(str, 10);
|
||||
if (int < 0) {
|
||||
return 0;
|
||||
}
|
||||
if (int > 100) {
|
||||
return 1;
|
||||
}
|
||||
return int / 100;
|
||||
}
|
||||
|
||||
var names = {
|
||||
/* @edit start */
|
||||
inherit: 'inherit',
|
||||
/* @edit end */
|
||||
transparent: 0x00000000,
|
||||
|
||||
// http://www.w3.org/TR/css3-color/#svg-color
|
||||
aliceblue: 0xf0f8ffff,
|
||||
antiquewhite: 0xfaebd7ff,
|
||||
aqua: 0x00ffffff,
|
||||
aquamarine: 0x7fffd4ff,
|
||||
azure: 0xf0ffffff,
|
||||
beige: 0xf5f5dcff,
|
||||
bisque: 0xffe4c4ff,
|
||||
black: 0x000000ff,
|
||||
blanchedalmond: 0xffebcdff,
|
||||
blue: 0x0000ffff,
|
||||
blueviolet: 0x8a2be2ff,
|
||||
brown: 0xa52a2aff,
|
||||
burlywood: 0xdeb887ff,
|
||||
burntsienna: 0xea7e5dff,
|
||||
cadetblue: 0x5f9ea0ff,
|
||||
chartreuse: 0x7fff00ff,
|
||||
chocolate: 0xd2691eff,
|
||||
coral: 0xff7f50ff,
|
||||
cornflowerblue: 0x6495edff,
|
||||
cornsilk: 0xfff8dcff,
|
||||
crimson: 0xdc143cff,
|
||||
cyan: 0x00ffffff,
|
||||
darkblue: 0x00008bff,
|
||||
darkcyan: 0x008b8bff,
|
||||
darkgoldenrod: 0xb8860bff,
|
||||
darkgray: 0xa9a9a9ff,
|
||||
darkgreen: 0x006400ff,
|
||||
darkgrey: 0xa9a9a9ff,
|
||||
darkkhaki: 0xbdb76bff,
|
||||
darkmagenta: 0x8b008bff,
|
||||
darkolivegreen: 0x556b2fff,
|
||||
darkorange: 0xff8c00ff,
|
||||
darkorchid: 0x9932ccff,
|
||||
darkred: 0x8b0000ff,
|
||||
darksalmon: 0xe9967aff,
|
||||
darkseagreen: 0x8fbc8fff,
|
||||
darkslateblue: 0x483d8bff,
|
||||
darkslategray: 0x2f4f4fff,
|
||||
darkslategrey: 0x2f4f4fff,
|
||||
darkturquoise: 0x00ced1ff,
|
||||
darkviolet: 0x9400d3ff,
|
||||
deeppink: 0xff1493ff,
|
||||
deepskyblue: 0x00bfffff,
|
||||
dimgray: 0x696969ff,
|
||||
dimgrey: 0x696969ff,
|
||||
dodgerblue: 0x1e90ffff,
|
||||
firebrick: 0xb22222ff,
|
||||
floralwhite: 0xfffaf0ff,
|
||||
forestgreen: 0x228b22ff,
|
||||
fuchsia: 0xff00ffff,
|
||||
gainsboro: 0xdcdcdcff,
|
||||
ghostwhite: 0xf8f8ffff,
|
||||
gold: 0xffd700ff,
|
||||
goldenrod: 0xdaa520ff,
|
||||
gray: 0x808080ff,
|
||||
green: 0x008000ff,
|
||||
greenyellow: 0xadff2fff,
|
||||
grey: 0x808080ff,
|
||||
honeydew: 0xf0fff0ff,
|
||||
hotpink: 0xff69b4ff,
|
||||
indianred: 0xcd5c5cff,
|
||||
indigo: 0x4b0082ff,
|
||||
ivory: 0xfffff0ff,
|
||||
khaki: 0xf0e68cff,
|
||||
lavender: 0xe6e6faff,
|
||||
lavenderblush: 0xfff0f5ff,
|
||||
lawngreen: 0x7cfc00ff,
|
||||
lemonchiffon: 0xfffacdff,
|
||||
lightblue: 0xadd8e6ff,
|
||||
lightcoral: 0xf08080ff,
|
||||
lightcyan: 0xe0ffffff,
|
||||
lightgoldenrodyellow: 0xfafad2ff,
|
||||
lightgray: 0xd3d3d3ff,
|
||||
lightgreen: 0x90ee90ff,
|
||||
lightgrey: 0xd3d3d3ff,
|
||||
lightpink: 0xffb6c1ff,
|
||||
lightsalmon: 0xffa07aff,
|
||||
lightseagreen: 0x20b2aaff,
|
||||
lightskyblue: 0x87cefaff,
|
||||
lightslategray: 0x778899ff,
|
||||
lightslategrey: 0x778899ff,
|
||||
lightsteelblue: 0xb0c4deff,
|
||||
lightyellow: 0xffffe0ff,
|
||||
lime: 0x00ff00ff,
|
||||
limegreen: 0x32cd32ff,
|
||||
linen: 0xfaf0e6ff,
|
||||
magenta: 0xff00ffff,
|
||||
maroon: 0x800000ff,
|
||||
mediumaquamarine: 0x66cdaaff,
|
||||
mediumblue: 0x0000cdff,
|
||||
mediumorchid: 0xba55d3ff,
|
||||
mediumpurple: 0x9370dbff,
|
||||
mediumseagreen: 0x3cb371ff,
|
||||
mediumslateblue: 0x7b68eeff,
|
||||
mediumspringgreen: 0x00fa9aff,
|
||||
mediumturquoise: 0x48d1ccff,
|
||||
mediumvioletred: 0xc71585ff,
|
||||
midnightblue: 0x191970ff,
|
||||
mintcream: 0xf5fffaff,
|
||||
mistyrose: 0xffe4e1ff,
|
||||
moccasin: 0xffe4b5ff,
|
||||
navajowhite: 0xffdeadff,
|
||||
navy: 0x000080ff,
|
||||
oldlace: 0xfdf5e6ff,
|
||||
olive: 0x808000ff,
|
||||
olivedrab: 0x6b8e23ff,
|
||||
orange: 0xffa500ff,
|
||||
orangered: 0xff4500ff,
|
||||
orchid: 0xda70d6ff,
|
||||
palegoldenrod: 0xeee8aaff,
|
||||
palegreen: 0x98fb98ff,
|
||||
paleturquoise: 0xafeeeeff,
|
||||
palevioletred: 0xdb7093ff,
|
||||
papayawhip: 0xffefd5ff,
|
||||
peachpuff: 0xffdab9ff,
|
||||
peru: 0xcd853fff,
|
||||
pink: 0xffc0cbff,
|
||||
plum: 0xdda0ddff,
|
||||
powderblue: 0xb0e0e6ff,
|
||||
purple: 0x800080ff,
|
||||
rebeccapurple: 0x663399ff,
|
||||
red: 0xff0000ff,
|
||||
rosybrown: 0xbc8f8fff,
|
||||
royalblue: 0x4169e1ff,
|
||||
saddlebrown: 0x8b4513ff,
|
||||
salmon: 0xfa8072ff,
|
||||
sandybrown: 0xf4a460ff,
|
||||
seagreen: 0x2e8b57ff,
|
||||
seashell: 0xfff5eeff,
|
||||
sienna: 0xa0522dff,
|
||||
silver: 0xc0c0c0ff,
|
||||
skyblue: 0x87ceebff,
|
||||
slateblue: 0x6a5acdff,
|
||||
slategray: 0x708090ff,
|
||||
slategrey: 0x708090ff,
|
||||
snow: 0xfffafaff,
|
||||
springgreen: 0x00ff7fff,
|
||||
steelblue: 0x4682b4ff,
|
||||
tan: 0xd2b48cff,
|
||||
teal: 0x008080ff,
|
||||
thistle: 0xd8bfd8ff,
|
||||
tomato: 0xff6347ff,
|
||||
turquoise: 0x40e0d0ff,
|
||||
violet: 0xee82eeff,
|
||||
wheat: 0xf5deb3ff,
|
||||
white: 0xffffffff,
|
||||
whitesmoke: 0xf5f5f5ff,
|
||||
yellow: 0xffff00ff,
|
||||
yellowgreen: 0x9acd32ff,
|
||||
};
|
||||
|
||||
module.exports = normalizeColor;
|
||||
@@ -1,9 +1,9 @@
|
||||
import CSSPropertyOperations from 'react/lib/CSSPropertyOperations'
|
||||
|
||||
const measureAll = (node, callback, relativeToNativeNode) => {
|
||||
const { height, left, top, width } = node.getBoundingClientRect()
|
||||
const relativeNode = relativeToNativeNode || node.parentNode
|
||||
const relativeRect = relativeNode.getBoundingClientRect()
|
||||
const { height, left, top, width } = node.getBoundingClientRect()
|
||||
const x = left - relativeRect.left
|
||||
const y = top - relativeRect.top
|
||||
callback(x, y, width, height, left, top)
|
||||
|
||||
Reference in New Issue
Block a user