react-ionicons
Version:
A React SVG ionicon component
600 lines (590 loc) • 13 kB
JavaScript
// @flow
/* Trying to avoid the unknown-prop errors on styled components
by filtering by React's attribute whitelist.
*/
/* Logic copied from ReactDOMUnknownPropertyHook */
const reactProps = {
children: true,
dangerouslySetInnerHTML: true,
key: true,
ref: true,
autoFocus: true,
defaultValue: true,
valueLink: true,
defaultChecked: true,
checkedLink: true,
innerHTML: true,
suppressContentEditableWarning: true,
onFocusIn: true,
onFocusOut: true,
className: true,
/* List copied from https://facebook.github.io/react/docs/events.html */
onCopy: true,
onCut: true,
onPaste: true,
onCompositionEnd: true,
onCompositionStart: true,
onCompositionUpdate: true,
onKeyDown: true,
onKeyPress: true,
onKeyUp: true,
onFocus: true,
onBlur: true,
onChange: true,
onInput: true,
onSubmit: true,
onReset: true,
onClick: true,
onContextMenu: true,
onDoubleClick: true,
onDrag: true,
onDragEnd: true,
onDragEnter: true,
onDragExit: true,
onDragLeave: true,
onDragOver: true,
onDragStart: true,
onDrop: true,
onMouseDown: true,
onMouseEnter: true,
onMouseLeave: true,
onMouseMove: true,
onMouseOut: true,
onMouseOver: true,
onMouseUp: true,
onSelect: true,
onTouchCancel: true,
onTouchEnd: true,
onTouchMove: true,
onTouchStart: true,
onScroll: true,
onWheel: true,
onAbort: true,
onCanPlay: true,
onCanPlayThrough: true,
onDurationChange: true,
onEmptied: true,
onEncrypted: true,
onEnded: true,
onError: true,
onLoadedData: true,
onLoadedMetadata: true,
onLoadStart: true,
onPause: true,
onPlay: true,
onPlaying: true,
onProgress: true,
onRateChange: true,
onSeeked: true,
onSeeking: true,
onStalled: true,
onSuspend: true,
onTimeUpdate: true,
onVolumeChange: true,
onWaiting: true,
onLoad: true,
onAnimationStart: true,
onAnimationEnd: true,
onAnimationIteration: true,
onTransitionEnd: true,
onCopyCapture: true,
onCutCapture: true,
onPasteCapture: true,
onCompositionEndCapture: true,
onCompositionStartCapture: true,
onCompositionUpdateCapture: true,
onKeyDownCapture: true,
onKeyPressCapture: true,
onKeyUpCapture: true,
onFocusCapture: true,
onBlurCapture: true,
onChangeCapture: true,
onInputCapture: true,
onSubmitCapture: true,
onResetCapture: true,
onClickCapture: true,
onContextMenuCapture: true,
onDoubleClickCapture: true,
onDragCapture: true,
onDragEndCapture: true,
onDragEnterCapture: true,
onDragExitCapture: true,
onDragLeaveCapture: true,
onDragOverCapture: true,
onDragStartCapture: true,
onDropCapture: true,
onMouseDownCapture: true,
onMouseEnterCapture: true,
onMouseLeaveCapture: true,
onMouseMoveCapture: true,
onMouseOutCapture: true,
onMouseOverCapture: true,
onMouseUpCapture: true,
onSelectCapture: true,
onTouchCancelCapture: true,
onTouchEndCapture: true,
onTouchMoveCapture: true,
onTouchStartCapture: true,
onScrollCapture: true,
onWheelCapture: true,
onAbortCapture: true,
onCanPlayCapture: true,
onCanPlayThroughCapture: true,
onDurationChangeCapture: true,
onEmptiedCapture: true,
onEncryptedCapture: true,
onEndedCapture: true,
onErrorCapture: true,
onLoadedDataCapture: true,
onLoadedMetadataCapture: true,
onLoadStartCapture: true,
onPauseCapture: true,
onPlayCapture: true,
onPlayingCapture: true,
onProgressCapture: true,
onRateChangeCapture: true,
onSeekedCapture: true,
onSeekingCapture: true,
onStalledCapture: true,
onSuspendCapture: true,
onTimeUpdateCapture: true,
onVolumeChangeCapture: true,
onWaitingCapture: true,
onLoadCapture: true,
onAnimationStartCapture: true,
onAnimationEndCapture: true,
onAnimationIterationCapture: true,
onTransitionEndCapture: true,
}
/* From HTMLDOMPropertyConfig */
const htmlProps = {
/**
* Standard Properties
*/
accept: true,
acceptCharset: true,
accessKey: true,
action: true,
allowFullScreen: true,
allowTransparency: true,
alt: true,
// specifies target context for links with `preload` type
as: true,
async: true,
autoComplete: true,
// autoFocus is polyfilled/normalized by AutoFocusUtils
// autoFocus: true,
autoPlay: true,
capture: true,
cellPadding: true,
cellSpacing: true,
charSet: true,
challenge: true,
checked: true,
cite: true,
classID: true,
className: true,
cols: true,
colSpan: true,
content: true,
contentEditable: true,
contextMenu: true,
controls: true,
coords: true,
crossOrigin: true,
data: true, // For `<object />` acts as `src`.
dateTime: true,
default: true,
defer: true,
dir: true,
disabled: true,
download: true,
draggable: true,
encType: true,
form: true,
formAction: true,
formEncType: true,
formMethod: true,
formNoValidate: true,
formTarget: true,
frameBorder: true,
headers: true,
height: true,
hidden: true,
high: true,
href: true,
hrefLang: true,
htmlFor: true,
httpEquiv: true,
icon: true,
id: true,
inputMode: true,
integrity: true,
is: true,
keyParams: true,
keyType: true,
kind: true,
label: true,
lang: true,
list: true,
loop: true,
low: true,
manifest: true,
marginHeight: true,
marginWidth: true,
max: true,
maxLength: true,
media: true,
mediaGroup: true,
method: true,
min: true,
minLength: true,
// Caution; `option.selected` is not updated if `select.multiple` is
// disabled with `removeAttribute`.
multiple: true,
muted: true,
name: true,
nonce: true,
noValidate: true,
open: true,
optimum: true,
pattern: true,
placeholder: true,
playsInline: true,
poster: true,
preload: true,
profile: true,
radioGroup: true,
readOnly: true,
referrerPolicy: true,
rel: true,
required: true,
reversed: true,
role: true,
rows: true,
rowSpan: true,
sandbox: true,
scope: true,
scoped: true,
scrolling: true,
seamless: true,
selected: true,
shape: true,
size: true,
sizes: true,
span: true,
spellCheck: true,
src: true,
srcDoc: true,
srcLang: true,
srcSet: true,
start: true,
step: true,
style: true,
summary: true,
tabIndex: true,
target: true,
title: true,
// Setting .type throws on non-<input> tags
type: true,
useMap: true,
value: true,
width: true,
wmode: true,
wrap: true,
/**
* RDFa Properties
*/
about: true,
datatype: true,
inlist: true,
prefix: true,
// property is also supported for OpenGraph in meta tags.
property: true,
resource: true,
typeof: true,
vocab: true,
/**
* Non-standard Properties
*/
// autoCapitalize and autoCorrect are supported in Mobile Safari for
// keyboard hints.
autoCapitalize: true,
autoCorrect: true,
// autoSave allows WebKit/Blink to persist values of input fields on page reloads
autoSave: true,
// color is for Safari mask-icon link
color: true,
// itemProp, itemScope, itemType are for
// Microdata support. See http://schema.org/docs/gs.html
itemProp: true,
itemScope: true,
itemType: true,
// itemID and itemRef are for Microdata support as well but
// only specified in the WHATWG spec document. See
// https://html.spec.whatwg.org/multipage/microdata.html#microdata-dom-api
itemID: true,
itemRef: true,
// results show looking glass icon and recent searches on input
// search fields in WebKit/Blink
results: true,
// IE-only attribute that specifies security restrictions on an iframe
// as an alternative to the sandbox attribute on IE<10
security: true,
// IE-only attribute that controls focus behavior
unselectable: 0,
}
const svgProps = {
accentHeight: true,
accumulate: true,
additive: true,
alignmentBaseline: true,
allowReorder: true,
alphabetic: true,
amplitude: true,
arabicForm: true,
ascent: true,
attributeName: true,
attributeType: true,
autoReverse: true,
azimuth: true,
baseFrequency: true,
baseProfile: true,
baselineShift: true,
bbox: true,
begin: true,
bias: true,
by: true,
calcMode: true,
capHeight: true,
clip: true,
clipPath: true,
clipRule: true,
clipPathUnits: true,
colorInterpolation: true,
colorInterpolationFilters: true,
colorProfile: true,
colorRendering: true,
contentScriptType: true,
contentStyleType: true,
cursor: true,
cx: true,
cy: true,
d: true,
decelerate: true,
descent: true,
diffuseConstant: true,
direction: true,
display: true,
divisor: true,
dominantBaseline: true,
dur: true,
dx: true,
dy: true,
edgeMode: true,
elevation: true,
enableBackground: true,
end: true,
exponent: true,
externalResourcesRequired: true,
fill: true,
fillOpacity: true,
fillRule: true,
filter: true,
filterRes: true,
filterUnits: true,
floodColor: true,
floodOpacity: true,
focusable: true,
fontFamily: true,
fontSize: true,
fontSizeAdjust: true,
fontStretch: true,
fontStyle: true,
fontVariant: true,
fontWeight: true,
format: true,
from: true,
fx: true,
fy: true,
g1: true,
g2: true,
glyphName: true,
glyphOrientationHorizontal: true,
glyphOrientationVertical: true,
glyphRef: true,
gradientTransform: true,
gradientUnits: true,
hanging: true,
horizAdvX: true,
horizOriginX: true,
ideographic: true,
imageRendering: true,
in: true,
in2: true,
intercept: true,
k: true,
k1: true,
k2: true,
k3: true,
k4: true,
kernelMatrix: true,
kernelUnitLength: true,
kerning: true,
keyPoints: true,
keySplines: true,
keyTimes: true,
lengthAdjust: true,
letterSpacing: true,
lightingColor: true,
limitingConeAngle: true,
local: true,
markerEnd: true,
markerMid: true,
markerStart: true,
markerHeight: true,
markerUnits: true,
markerWidth: true,
mask: true,
maskContentUnits: true,
maskUnits: true,
mathematical: true,
mode: true,
numOctaves: true,
offset: true,
opacity: true,
operator: true,
order: true,
orient: true,
orientation: true,
origin: true,
overflow: true,
overlinePosition: true,
overlineThickness: true,
paintOrder: true,
panose1: true,
pathLength: true,
patternContentUnits: true,
patternTransform: true,
patternUnits: true,
pointerEvents: true,
points: true,
pointsAtX: true,
pointsAtY: true,
pointsAtZ: true,
preserveAlpha: true,
preserveAspectRatio: true,
primitiveUnits: true,
r: true,
radius: true,
refX: true,
refY: true,
renderingIntent: true,
repeatCount: true,
repeatDur: true,
requiredExtensions: true,
requiredFeatures: true,
restart: true,
result: true,
rotate: true,
rx: true,
ry: true,
scale: true,
seed: true,
shapeRendering: true,
slope: true,
spacing: true,
specularConstant: true,
specularExponent: true,
speed: true,
spreadMethod: true,
startOffset: true,
stdDeviation: true,
stemh: true,
stemv: true,
stitchTiles: true,
stopColor: true,
stopOpacity: true,
strikethroughPosition: true,
strikethroughThickness: true,
string: true,
stroke: true,
strokeDasharray: true,
strokeDashoffset: true,
strokeLinecap: true,
strokeLinejoin: true,
strokeMiterlimit: true,
strokeOpacity: true,
strokeWidth: true,
surfaceScale: true,
systemLanguage: true,
tableValues: true,
targetX: true,
targetY: true,
textAnchor: true,
textDecoration: true,
textRendering: true,
textLength: true,
to: true,
transform: true,
u1: true,
u2: true,
underlinePosition: true,
underlineThickness: true,
unicode: true,
unicodeBidi: true,
unicodeRange: true,
unitsPerEm: true,
vAlphabetic: true,
vHanging: true,
vIdeographic: true,
vMathematical: true,
values: true,
vectorEffect: true,
version: true,
vertAdvY: true,
vertOriginX: true,
vertOriginY: true,
viewBox: true,
viewTarget: true,
visibility: true,
widths: true,
wordSpacing: true,
writingMode: true,
x: true,
xHeight: true,
x1: true,
x2: true,
xChannelSelector: true,
xlinkActuate: true,
xlinkArcrole: true,
xlinkHref: true,
xlinkRole: true,
xlinkShow: true,
xlinkTitle: true,
xlinkType: true,
xmlBase: true,
xmlns: true,
xmlnsXlink: true,
xmlLang: true,
xmlSpace: true,
y: true,
y1: true,
y2: true,
yChannelSelector: true,
z: true,
zoomAndPan: true,
}
/* From DOMProperty */
const ATTRIBUTE_NAME_START_CHAR = ':A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD'
const ATTRIBUTE_NAME_CHAR = `${ATTRIBUTE_NAME_START_CHAR}\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040`
const isCustomAttribute = RegExp.prototype.test.bind(
new RegExp(`^(data|aria)-[${ATTRIBUTE_NAME_CHAR}]*$`),
)
const hasOwnProperty: (name: string) => boolean = {}.hasOwnProperty
export default (name: string) => (
hasOwnProperty.call(htmlProps, name) ||
hasOwnProperty.call(svgProps, name) ||
isCustomAttribute(name.toLowerCase()) ||
hasOwnProperty.call(reactProps, name)
)