@fluentui/react-northstar/dist/es/components/Design/Design.js

A themable React component library.

import { useFluentContext } from '@fluentui/react-bindings';
import * as customPropTypes from '@fluentui/react-proptypes';
import * as React from 'react';
import * as PropTypes from 'prop-types';
/**
 * The Design component provides a theme safe subset of CSS for designing layouts.
 */ // eslint-disable-next-line @typescript-eslint/no-unused-vars
export var Design = /*#__PURE__*/function () {
  function Design(_ref) {
    var config = _ref.config,
      children = _ref.children;
    var context = useFluentContext();
    var getConfig = React.useCallback(function () {
      return config;
    }, [config]);

    // Heads Up! Keep in sync with renderComponent.tsx
    var styleParam = {
      displayName: Design.displayName,
      disableAnimations: context.disableAnimations,
      direction: context.rtl ? 'rtl' : 'ltr',
      sanitizeCss: context.performance.enableSanitizeCssPlugin
    };
    var className = context.renderer.renderRule(getConfig, styleParam);
    return children({
      className: className
    });
  }
  Design.displayName = 'Design';
  Design.propTypes = {
    children: PropTypes.func.isRequired,
    config: customPropTypes.design.isRequired
  };
  return Design;
}();
//# sourceMappingURL=Design.js.map