react-native-web-internals
Version:
React Native for Web
111 lines (110 loc) • 8.53 kB
JavaScript
import StyleSheet from "../../StyleSheet/index";
import AccessibilityUtil from "../AccessibilityUtil/index";
const emptyObject = {}, hasOwnProperty = Object.prototype.hasOwnProperty, isArray = Array.isArray, uppercasePattern = /[A-Z]/g;
function toHyphenLower(match) {
return "-" + match.toLowerCase();
}
function hyphenateString(str) {
return str.replace(uppercasePattern, toHyphenLower);
}
function processIDRefList(idRefList) {
return isArray(idRefList) ? idRefList.join(" ") : idRefList;
}
const pointerEventsStyles = StyleSheet.create({
auto: {
pointerEvents: "auto"
},
"box-none": {
pointerEvents: "box-none"
},
"box-only": {
pointerEvents: "box-only"
},
none: {
pointerEvents: "none"
}
}), createDOMProps = (elementType, props, options) => {
props || (props = emptyObject);
const {
accessibilityActiveDescendant,
accessibilityAtomic,
accessibilityAutoComplete,
accessibilityBusy,
accessibilityChecked,
accessibilityColumnCount,
accessibilityColumnIndex,
accessibilityColumnSpan,
accessibilityControls,
accessibilityCurrent,
accessibilityDescribedBy,
accessibilityDetails,
accessibilityDisabled,
accessibilityErrorMessage,
accessibilityExpanded,
accessibilityFlowTo,
accessibilityHasPopup,
accessibilityHidden,
accessibilityInvalid,
accessibilityKeyShortcuts,
accessibilityLabel,
accessibilityLabelledBy,
accessibilityLevel,
accessibilityLiveRegion,
accessibilityModal,
accessibilityMultiline,
accessibilityMultiSelectable,
accessibilityOrientation,
accessibilityOwns,
accessibilityPlaceholder,
accessibilityPosInSet,
accessibilityPressed,
accessibilityReadOnly,
accessibilityRequired,
/* eslint-disable */
accessibilityRole,
/* eslint-enable */
accessibilityRoleDescription,
accessibilityRowCount,
accessibilityRowIndex,
accessibilityRowSpan,
accessibilitySelected,
accessibilitySetSize,
accessibilitySort,
accessibilityValueMax,
accessibilityValueMin,
accessibilityValueNow,
accessibilityValueText,
dataSet,
focusable,
nativeID,
pointerEvents,
style,
testID,
id,
// Rest
...domProps
} = props, disabled = accessibilityDisabled, role = AccessibilityUtil.propsToAriaRole(props);
accessibilityActiveDescendant != null && (domProps["aria-activedescendant"] = accessibilityActiveDescendant), accessibilityAtomic != null && (domProps["aria-atomic"] = accessibilityAtomic), accessibilityAutoComplete != null && (domProps["aria-autocomplete"] = accessibilityAutoComplete), accessibilityBusy != null && (domProps["aria-busy"] = accessibilityBusy), accessibilityChecked != null && (domProps["aria-checked"] = accessibilityChecked), accessibilityColumnCount != null && (domProps["aria-colcount"] = accessibilityColumnCount), accessibilityColumnIndex != null && (domProps["aria-colindex"] = accessibilityColumnIndex), accessibilityColumnSpan != null && (domProps["aria-colspan"] = accessibilityColumnSpan), accessibilityControls != null && (domProps["aria-controls"] = processIDRefList(accessibilityControls)), accessibilityCurrent != null && (domProps["aria-current"] = accessibilityCurrent), accessibilityDescribedBy != null && (domProps["aria-describedby"] = processIDRefList(accessibilityDescribedBy)), accessibilityDetails != null && (domProps["aria-details"] = accessibilityDetails), disabled === !0 && (domProps["aria-disabled"] = !0, (elementType === "button" || elementType === "form" || elementType === "input" || elementType === "select" || elementType === "textarea") && (domProps.disabled = !0)), accessibilityErrorMessage != null && (domProps["aria-errormessage"] = accessibilityErrorMessage), accessibilityExpanded != null && (domProps["aria-expanded"] = accessibilityExpanded), accessibilityFlowTo != null && (domProps["aria-flowto"] = processIDRefList(accessibilityFlowTo)), accessibilityHasPopup != null && (domProps["aria-haspopup"] = accessibilityHasPopup), accessibilityHidden === !0 && (domProps["aria-hidden"] = accessibilityHidden), accessibilityInvalid != null && (domProps["aria-invalid"] = accessibilityInvalid), accessibilityKeyShortcuts != null && Array.isArray(accessibilityKeyShortcuts) && (domProps["aria-keyshortcuts"] = accessibilityKeyShortcuts.join(" ")), accessibilityLabel != null && (domProps["aria-label"] = accessibilityLabel), accessibilityLabelledBy != null && (domProps["aria-labelledby"] = processIDRefList(accessibilityLabelledBy)), accessibilityLevel != null && (domProps["aria-level"] = accessibilityLevel), accessibilityLiveRegion != null && (domProps["aria-live"] = accessibilityLiveRegion === "none" ? "off" : accessibilityLiveRegion), accessibilityModal != null && (domProps["aria-modal"] = accessibilityModal), accessibilityMultiline != null && (domProps["aria-multiline"] = accessibilityMultiline), accessibilityMultiSelectable != null && (domProps["aria-multiselectable"] = accessibilityMultiSelectable), accessibilityOrientation != null && (domProps["aria-orientation"] = accessibilityOrientation), accessibilityOwns != null && (domProps["aria-owns"] = processIDRefList(accessibilityOwns)), accessibilityPlaceholder != null && (domProps["aria-placeholder"] = accessibilityPlaceholder), accessibilityPosInSet != null && (domProps["aria-posinset"] = accessibilityPosInSet), accessibilityPressed != null && (domProps["aria-pressed"] = accessibilityPressed), accessibilityReadOnly != null && (domProps["aria-readonly"] = accessibilityReadOnly, (elementType === "input" || elementType === "select" || elementType === "textarea") && (domProps.readOnly = !0)), accessibilityRequired != null && (domProps["aria-required"] = accessibilityRequired, (elementType === "input" || elementType === "select" || elementType === "textarea") && (domProps.required = !0)), role != null && (domProps.role = role === "none" ? "presentation" : role), accessibilityRoleDescription != null && (domProps["aria-roledescription"] = accessibilityRoleDescription), accessibilityRowCount != null && (domProps["aria-rowcount"] = accessibilityRowCount), accessibilityRowIndex != null && (domProps["aria-rowindex"] = accessibilityRowIndex), accessibilityRowSpan != null && (domProps["aria-rowspan"] = accessibilityRowSpan), accessibilitySelected != null && (domProps["aria-selected"] = accessibilitySelected), accessibilitySetSize != null && (domProps["aria-setsize"] = accessibilitySetSize), accessibilitySort != null && (domProps["aria-sort"] = accessibilitySort), accessibilityValueMax != null && (domProps["aria-valuemax"] = accessibilityValueMax), accessibilityValueMin != null && (domProps["aria-valuemin"] = accessibilityValueMin), accessibilityValueNow != null && (domProps["aria-valuenow"] = accessibilityValueNow), accessibilityValueText != null && (domProps["aria-valuetext"] = accessibilityValueText);
const tmgCN = dataSet ? dataSet.className : void 0, tmgID = dataSet ? dataSet.id : void 0;
if (dataSet != null) {
for (const dataProp in dataSet)
if (!(dataProp === "className" || dataProp === "id") && hasOwnProperty.call(dataSet, dataProp)) {
const dataName = hyphenateString(dataProp), dataValue = dataSet[dataProp];
dataValue != null && (domProps[`data-${dataName}`] = dataValue);
}
}
focusable === !1 && (domProps.tabIndex = "-1"), // These native elements are keyboard focusable by default
elementType === "a" || elementType === "button" || elementType === "input" || elementType === "select" || elementType === "textarea" ? (focusable === !1 || accessibilityDisabled === !0) && (domProps.tabIndex = "-1") : /* These roles are made keyboard focusable by default */ role === "button" || role === "checkbox" || role === "link" || role === "radio" || role === "textbox" || role === "switch" ? focusable !== !1 && (domProps.tabIndex = "0") : focusable === !0 && (domProps.tabIndex = "0");
const [className, inlineStyle] = StyleSheet(
[style, pointerEvents && pointerEventsStyles[pointerEvents]],
{ writingDirection: options ? options.writingDirection : "ltr" }
);
className && (domProps.className = className), tmgCN && (domProps.className = tmgCN), inlineStyle && (domProps.style = inlineStyle);
const _id = tmgID || id || nativeID;
return _id && (domProps.id = _id), testID != null && (domProps["data-testid"] = testID), domProps;
};
var createDOMProps_default = createDOMProps;
export {
createDOMProps_default as default
};
//# sourceMappingURL=index.js.map