How to use the @uifabric/foundation.getSlots function in @uifabric/foundation

To help you get started, we’ve selected a few @uifabric/foundation examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github OfficeDev / office-ui-fabric-react / packages / react-cards / src / components / Card / Card.view.tsx View on Github external
export const CardView: ICardComponent['view'] = props => {
  const Slots = getSlots(props, {
    root: Stack
  });

  const { children, styles, tokens, horizontal, onClick, onKeyDown, ...rest } = props;

  const nativeProps = getNativeProps>(rest, htmlElementProperties);

  // Get childrenGap and childrenMargin token values.
  const childrenGap = tokens && (tokens as ICardTokens).childrenGap;
  const childrenMargin = tokens && (tokens as ICardTokens).childrenMargin;
  const childrenCount = React.Children.count(children);

  /* The map function below takes the Card children and applies the correct margin and gap tokens to them, ensuring at the same time that
   * they are of type CardItem or CardSection. */
  const cardChildren: (React.ReactChild | null)[] = React.Children.map(
    children,
github OfficeDev / office-ui-fabric-react / packages / example-app-base / src / components / ExampleCard / ExampleCardComponent.tsx View on Github external
const ExampleCardComponentView: IExampleCardComponent['view'] = props => {
  if (!props.children) {
    return null;
  }

  const Slots = getSlots(props, {
    root: 'div'
  });

  return ;
};

@uifabric/foundation

Foundation library for building Fabric components.

MIT
Latest version published 2 years ago

Package Health Score

75 / 100
Full package analysis

Similar packages