@uifabric/experiments
Version:
Experimental React components for building experiences for Microsoft 365.
45 lines • 3.25 kB
JavaScript
define(["require", "exports", "tslib", "react", "office-ui-fabric-react", "office-ui-fabric-react/lib/PersonaPresence", "../Foundation"], function (require, exports, tslib_1, React, office_ui_fabric_react_1, PersonaPresence_1, Foundation_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
// TODO: All contents of this file should be moved to each respective component as they are converted to use slots.
// TODO: createFactory should no longer have to be explicitly called with component options containing defaultProp.
// (Consider adding a defaultProp option to styled so that createFactory can be internalized similar
// to createComponent)
// TODO: displayName will also be covered by createComponent argument.
// TODO: These components will also have to be modified not to generate rendered output if their props don't call for it
// to eliminate the wrapper functions below.
// Generally to avoid a bunch of "if slot prop exists" checks in parent components, components should
// make sure they have content to render based on their props. For example here, if Icon has no iconName,
// it has no rendered content and returns null. This prevents Button.view from having to check to
// see if its icon Slot is defined.
// These wrappers will temporarily add a layer to the hierarchy (identified with displayName) until their functionality
// can be absorbed into their respective OUFR components.
exports.FontIcon = function (props) {
return props.iconName ? React.createElement(office_ui_fabric_react_1.FontIcon, tslib_1.__assign({}, props)) : null;
};
exports.FontIcon.displayName = 'FontIcon';
var fontIconFactory = Foundation_1.createFactory(exports.FontIcon, { defaultProp: 'iconName' });
exports.FontIcon.create = fontIconFactory;
exports.Icon = function (props) {
return props.iconName ? React.createElement(office_ui_fabric_react_1.Icon, tslib_1.__assign({}, props)) : null;
};
exports.Icon.displayName = 'Icon';
var iconFactory = Foundation_1.createFactory(exports.Icon, { defaultProp: 'iconName' });
exports.Icon.create = iconFactory;
exports.Label = function (props) {
return React.Children.count(props.children) > 0 ? React.createElement(office_ui_fabric_react_1.Label, tslib_1.__assign({}, props)) : null;
};
exports.Label.displayName = 'Label';
var labelFactory = Foundation_1.createFactory(exports.Label);
exports.Label.create = labelFactory;
exports.PersonaPresence =
// TODO: This is a bug in PersonaPresence that needs to be fixed. 'presence' prop comment mentions that it
// won't render if presence is undefined, but it does render. Check for undefined here for now.
function (props) { return (props.presence !== undefined ? React.createElement(PersonaPresence_1.PersonaPresence, tslib_1.__assign({}, props)) : null); };
exports.PersonaPresence.displayName = 'PersonaPresence';
var personaPresenceFactory = Foundation_1.createFactory(exports.PersonaPresence, {
defaultProp: 'presence',
});
exports.PersonaPresence.create = personaPresenceFactory;
});
//# sourceMappingURL=factoryComponents.js.map