How to use the terra-breakpoints.large function in terra-breakpoints

To help you get started, we’ve selected a few terra-breakpoints 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 cerner / terra-core / packages / terra-responsive-element / src / ResponsiveElement.jsx View on Github external
const activeBreakpoint = activeBreakpointForSize(width);
    if (onChange && activeBreakpoint !== this.breakpoint) {
      onChange(activeBreakpoint);
    }

    this.breakpoint = activeBreakpoint;

    // Only update the state if an uncontrolled component exists.
    if (tiny || small || medium || large || huge || enormous) {
      let element;
      if (width >= breakpoints.enormous && enormous) {
        element = 'enormous';
      } else if (width >= breakpoints.huge && huge) {
        element = 'huge';
      } else if (width >= breakpoints.large && large) {
        element = 'large';
      } else if (width >= breakpoints.medium && medium) {
        element = 'medium';
      } else if (width >= breakpoints.small && small) {
        element = 'small';
      } else {
        element = 'tiny';
      }

      if (this.state.element !== element) {
        this.setState({ element });
      }
    }
  }

terra-breakpoints

Contains components and utilities related to Terra's supported responsive breakpoints

Apache-2.0
Latest version published 7 months ago

Package Health Score

57 / 100
Full package analysis