import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _extends from "@babel/runtime/helpers/esm/extends";
import * as LinkStories from './Link.stories.mdx';
import { generateChromaticStory, responsivePropsStoryLabel } from '../../chromatic/utils';
import React from 'react';
import Link, { LINK_ALIGN, LINK_SIZE, LINK_WEIGHT, LINK_TRANSFORM } from './Link';
export var ResponsiveProps = function ResponsiveProps(args) {
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('size', [LINK_SIZE.SMALL, LINK_SIZE.XXLARGE, null, LINK_SIZE.XXXLARGE])), /*#__PURE__*/React.createElement(Link, {
    href: "#",
    size: [LINK_SIZE.SMALL, LINK_SIZE.XXLARGE, null, LINK_SIZE.XXXLARGE]
  }, "Test"), /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('weight', [LINK_WEIGHT.BOLD, LINK_WEIGHT.REGULAR, null, LINK_WEIGHT.BOLD])), /*#__PURE__*/React.createElement(Link, {
    weight: [LINK_WEIGHT.BOLD, LINK_WEIGHT.REGULAR, null, LINK_WEIGHT.BOLD],
    href: "#"
  }, "Test"), /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('transform', [LINK_TRANSFORM.UPPERCASE, LINK_TRANSFORM.LOWERCASE, null, LINK_TRANSFORM.CAPITALIZE])), /*#__PURE__*/React.createElement(Link, {
    href: "#",
    transform: [LINK_TRANSFORM.UPPERCASE, LINK_TRANSFORM.LOWERCASE, null, LINK_TRANSFORM.CAPITALIZE]
  }, "Test"), /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('align', [LINK_ALIGN.JUSTIFY, null, LINK_ALIGN.CENTER, LINK_ALIGN.RIGHT])), /*#__PURE__*/React.createElement("div", {
    style: {
      width: 400
    }
  }, /*#__PURE__*/React.createElement(Link, _extends({
    href: "#",
    align: [LINK_ALIGN.JUSTIFY, null, LINK_ALIGN.CENTER, LINK_ALIGN.RIGHT]
  }, args), "Aliquip sit pariatur laboris in aliqua. Enim esse eu est nisi eiusmod minim deserunt ut cupidatat dolore velit deserunt nisi. Enim in anim aute non.")), /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('noWrap', [true, false, null, true])), /*#__PURE__*/React.createElement("div", {
    style: {
      border: '1px solid gray',
      width: '400px'
    }
  }, /*#__PURE__*/React.createElement(Link, {
    href: "#",
    noWrap: [true, false, null, true]
  }, "Aliquip sit pariatur laboris in aliqua. Enim esse eu est nisi eiusmod.")), /*#__PURE__*/React.createElement("h3", {
    className: "component__story-name"
  }, responsivePropsStoryLabel('breakWords', [true, false, null, true])), /*#__PURE__*/React.createElement("div", {
    style: {
      border: '1px solid gray',
      width: '400px'
    }
  }, /*#__PURE__*/React.createElement(Link, _extends({}, args, {
    breakWords: [true, false, null, true]
  }), "very-very-very-very-very-very-very-very-very-very-very-very-very-very-long-word")));
};
ResponsiveProps.parameters = {
  chromatic: {
    viewports: [680, 900, 1100, 1500]
  }
};

var _LinkStories$default = LinkStories.default,
    includeStories = _LinkStories$default.includeStories,
    meta = _objectWithoutProperties(_LinkStories$default, ["includeStories"]);

export var Default = generateChromaticStory(LinkStories, {
  storiesToHover: ['colors']
});
export default meta;