How to use the bpk-component-input.withOpenEvents function in bpk-component-input

To help you get started, we’ve selected a few bpk-component-input examples, based on popular ways it is used in public projects.

github Skyscanner / backpack / packages / bpk-docs / src / pages / PopoversPage / PopoversPage.js View on Github external
import BpkInput, { withOpenEvents } from 'bpk-component-input';
import BpkRouterLink from 'bpk-component-router-link';
import popoverReadme from 'bpk-component-popover/README.md';

import * as ROUTES from '../../constants/routes';
import DocsPageBuilder from '../../components/DocsPageBuilder';
import DocsPageWrapper from '../../components/DocsPageWrapper';
import Paragraph from '../../components/Paragraph';
import IntroBlurb from '../../components/IntroBlurb';
import Code from '../../components/Code';

const loremIpsum = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer pulvinar leo in gravida varius.
Mauris eget euismod mi. Ut vulputate ex nec consequat sollicitudin. Pellentesque pulvinar ac dolor vel hendrerit.
Maecenas sed felis justo. Proin at tellus in urna molestie blandit. Duis posuere urna nec finibus imperdiet.`;

const EnhancedInput = withOpenEvents(BpkInput);

class PopoverContainer extends Component {
  constructor() {
    super();

    this.state = {
      isOpen: false,
    };
  }

  openPopover = () => {
    this.setState({
      isOpen: true,
    });
  };
github Skyscanner / backpack / packages / bpk-component-datepicker / src / BpkDatepicker.js View on Github external
*/

import BpkInput, { withOpenEvents } from 'bpk-component-input';
import BpkModal from 'bpk-component-modal';
import BpkPopover from 'bpk-component-popover';
import { cssModules } from 'bpk-react-utils';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import BpkBreakpoint, { BREAKPOINTS } from 'bpk-component-breakpoint';
import BpkCalendar, { CustomPropTypes } from 'bpk-component-calendar';

import STYLES from './BpkDatepicker.scss';

const getClassName = cssModules(STYLES);

const Input = withOpenEvents(BpkInput);

class BpkDatepicker extends Component {
  constructor(props) {
    super(props);

    this.state = {
      isOpen: props.isOpen,
    };
  }

  onOpen = () => {
    this.setState({
      isOpen: true,
    });
  };