import _styled from "styled-components";
import React from 'react';
import styled, { css } from 'styled-components';
import { FLOATING_BOX_SCHEME } from '../../primitives/FloatingBox';
import { Popover } from '.';
var StyledContent = styled.pre.withConfig({
  displayName: "Popoverstories__StyledContent",
  componentId: "sc-1urm00z-0"
})(["padding:1rem;"]);
export default {
  component: Popover,
  title: 'Popover',
  parameters: {
    actions: {
      argTypesRegex: '^on.*'
    }
  },
  args: {
    content: /*#__PURE__*/React.createElement(StyledContent, null, "This is some arbitrary JSX")
  }
};
var Template = function Template(args) {
  return /*#__PURE__*/React.createElement(Popover, args, /*#__PURE__*/React.createElement(_StyledDiv, null, args.isClick ? 'Click on me' : 'Hover on me'));
};
export var Default = Template.bind({});
export var Dark = Template.bind({});
Dark.storyName = 'Dark';
Dark.args = {
  scheme: FLOATING_BOX_SCHEME.DARK
};
export var ClickToActivate = Template.bind({});
ClickToActivate.storyName = 'Click to activate';
ClickToActivate.args = {
  isClick: true
};
export var Open = Template.bind({});
Open.args = {
  isVisible: true
};
var _StyledDiv = styled("div").withConfig({
  displayName: "Popoverstories___StyledDiv",
  componentId: "sc-1urm00z-1"
})(["display:inline-block;padding:1rem;background-color:#c9c9c9;"]);