@navinc/base-react-components
Version:
Nav's Pattern Library
62 lines • 2.79 kB
JavaScript
;
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.InteractiveIcon = exports.Icon = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = __importDefault(require("styled-components"));
const icons_1 = require("./icons");
const bifilter = (filter, arr) => {
const truthy = [];
const falsey = [];
arr.forEach((item) => {
if (filter(item)) {
truthy.push(item);
}
else {
falsey.push(item);
}
});
return [truthy, falsey];
};
const handlerRegExp = /^on[A-Z]/;
const partitionHandlerProps = (props) => {
const [handlers, nonHandlers] = bifilter(([propName]) => handlerRegExp.test(propName), Object.entries(props));
return [Object.fromEntries(handlers), Object.fromEntries(nonHandlers)];
};
const Icon = (_a) => {
var { name } = _a, props = __rest(_a, ["name"]);
const IconComponent = icons_1.iconsMap[name];
return IconComponent ? ((0, jsx_runtime_1.jsx)(IconComponent, Object.assign({ width: "24", height: "24", viewBox: "0 0 24 24", "data-testid": `icon:${name}` }, props))) : null;
};
exports.Icon = Icon;
const NoStyleButton = styled_components_1.default.button.withConfig({ displayName: "brc-sc-NoStyleButton", componentId: "brc-sc-wgddp1" }) `
background: none;
color: inherit;
border: none;
padding: 0;
font: inherit;
cursor: inherit;
outline: inherit;
line-height: 0;
`;
/** Pass all event handler props to a wrapper button to avoid rerendering the icon and causing flicker */
const InteractiveIconInternal = (props) => {
const [handlers, nonHandlers] = partitionHandlerProps(props);
return ((0, jsx_runtime_1.jsx)(NoStyleButton, Object.assign({}, handlers, { children: (0, jsx_runtime_1.jsx)(exports.Icon, Object.assign({}, nonHandlers)) })));
};
exports.InteractiveIcon = (0, styled_components_1.default)(InteractiveIconInternal).withConfig({ displayName: "brc-sc-InteractiveIcon", componentId: "brc-sc-p8eqir" }) ``;
exports.default = (0, styled_components_1.default)(exports.Icon).withConfig({ componentId: "brc-sc-14pb1u5" }) ``;
//# sourceMappingURL=icon.js.map