Repository URL to install this package:
|
Version:
4.0.76 ▾
|
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importDefault(require("react"));
const exotic_1 = require("exotic");
const Empty_1 = require("../../atoms/Empty");
const MaterialIcon_1 = require("../../atoms/MaterialIcon");
const deps_1 = require("../deps");
const styled_1 = require("./styled"); // NOTE: leaving this animated switch as is, everything else uses MaterialIcon
function defaultRenderSwitch(props) {
const {
isAnimated,
isSelected,
defaultLabel = 'ON',
toggleLabel = 'OFF',
defaultLabelDataQa,
toggleLabelDataQa
} = props;
const attributes = {
isSelected,
isAnimated
};
const switchLabelView = react_1.default.createElement(styled_1.SwitchLabel, {
"data-qa": isSelected === true ? defaultLabelDataQa : toggleLabelDataQa,
content: isSelected === true ? defaultLabel : toggleLabel
});
return react_1.default.createElement(styled_1.SwitchIconWrapper, {
isSelected: isSelected
}, react_1.default.createElement(styled_1.StyledSwitchIcon, Object.assign({}, attributes)), switchLabelView);
}
function defaultRenderCheckBox(props) {
const {
isSelected,
dataQa
} = props;
const breed = isSelected === true ? 'check_on' : 'check_off';
const attributes = {
type: breed,
isSelected: isSelected,
'data-qa': dataQa
};
return react_1.default.createElement(MaterialIcon_1.MaterialIcon, Object.assign({}, attributes));
}
function defaultRenderHeart(props) {
const {
isSelected,
dataQa
} = props;
const breed = isSelected ? 'favorite' : 'favorite_border';
const attributes = {
type: breed,
isSelected: isSelected,
'data-qa': dataQa
};
return react_1.default.createElement(MaterialIcon_1.MaterialIcon, Object.assign({}, attributes));
}
function defaultRenderRadio(props) {
const {
isSelected,
dataQa
} = props;
const breed = isSelected ? 'radio_on' : 'radio_off';
const attributes = {
type: breed,
isSelected: isSelected,
'data-qa': dataQa
};
return react_1.default.createElement(MaterialIcon_1.MaterialIcon, Object.assign({}, attributes));
} // NOTE: visually this is identical to the defaultRenderSwitch...
function defaultRenderToggle(props) {
const {
isSelected,
dataQa
} = props;
const breed = isSelected ? 'toggle_on' : 'toggle_off';
const attributes = {
type: breed,
isSelected: isSelected,
'data-qa': dataQa
};
return react_1.default.createElement(MaterialIcon_1.MaterialIcon, Object.assign({}, attributes));
}
function defaultRenderIcon(props) {
const {
iconType,
isSelected
} = props;
const dataQa = isSelected === true ? 'qa-facet-selected' : 'qa-facet';
const switchIconType = type => {
switch (type) {
case 'checkbox':
return defaultRenderCheckBox(Object.assign({}, props, {
dataQa
}));
case 'switch':
return defaultRenderSwitch(Object.assign({}, props, {
dataQa
}));
case 'toggle':
return defaultRenderToggle(Object.assign({}, props, {
dataQa
}));
case 'heart':
return defaultRenderHeart(Object.assign({}, props, {
dataQa
}));
case 'radio':
default:
return defaultRenderRadio(Object.assign({}, props, {
dataQa
}));
}
};
const iconView = switchIconType(iconType);
return react_1.default.createElement(styled_1.IconWrapper, null, iconView);
}
exports.defaultRenderIcon = defaultRenderIcon;
function defaultRenderBeforeLabel(props) {
return react_1.default.createElement(Empty_1.Empty, null);
}
exports.defaultRenderBeforeLabel = defaultRenderBeforeLabel;
function defaultRenderLabel(props) {
const {
label
} = props;
return exotic_1.isSafe(label) && react_1.default.createElement(styled_1.StyledLabel, null, label);
}
exports.defaultRenderLabel = defaultRenderLabel;
function defaultRenderAfterLabel(props) {
return react_1.default.createElement(Empty_1.Empty, null);
}
exports.defaultRenderAfterLabel = defaultRenderAfterLabel;
function defaultRenderBox(props, state) {
const {
renderIcon,
renderBeforeLabel,
renderLabel,
renderAfterLabel
} = props,
remainingProps = tslib_1.__rest(props, ["renderIcon", "renderBeforeLabel", "renderLabel", "renderAfterLabel"]);
return react_1.default.createElement(react_1.default.Fragment, null, exotic_1.isFunction(renderIcon) && renderIcon(Object.assign({}, remainingProps, {
isSelected: state.isSelected
})), react_1.default.createElement(styled_1.LabelWrapper, null, exotic_1.isFunction(renderBeforeLabel) && renderBeforeLabel(remainingProps), exotic_1.isFunction(renderLabel) && renderLabel(remainingProps), exotic_1.isFunction(renderAfterLabel) && renderAfterLabel(remainingProps)));
}
exports.defaultRenderBox = defaultRenderBox;
function defaultRenderWrapper(props, state) {
const {
children,
className,
onToggle
} = props;
const passThroughProps = Object.freeze({
className,
'data-qa': props['data-qa'],
'aria-pressed': state.isSelected ? 'true' : 'false',
role: 'button'
});
const handleClickEvent = event => {
if (exotic_1.isFunction(onToggle)) {
onToggle(event);
}
};
const handleKeyDownEvent = event => {
if (deps_1.isEnter(event)) {
handleClickEvent(event);
}
};
return react_1.default.createElement(styled_1.Wrapper, Object.assign({}, passThroughProps, {
onClick: handleClickEvent,
onKeyDown: handleKeyDownEvent,
tabIndex: 0
}), children);
}
exports.defaultRenderWrapper = defaultRenderWrapper; //# sourceMappingURL=renderProps.js.map