@papillonarts/components 0.6.0 → 0.8.0

package/build/primer/Button/Button.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Button = Button;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _hooks = require("@papillonarts/library/hooks");
+var _margin = _interopRequireDefault(require("@papillonarts/css/build/primer/utilities/margin.scss"));
+var _Button = require("./Button.prop");
+var _Button2 = _interopRequireDefault(require("./Button.scss"));
+var _Icon = require("../Icon");
+var _jsxRuntime = require("react/jsx-runtime");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function Button(_ref) {
+  var _ref$dataTest = _ref.dataTest,
+    dataTest = _ref$dataTest === void 0 ? _Button.defaultProps.dataTest : _ref$dataTest,
+    _ref$id = _ref.id,
+    id = _ref$id === void 0 ? _Button.defaultProps.id : _ref$id,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? _Button.defaultProps.className : _ref$className,
+    _ref$element = _ref.element,
+    element = _ref$element === void 0 ? _Button.defaultProps.element : _ref$element,
+    _ref$href = _ref.href,
+    href = _ref$href === void 0 ? _Button.defaultProps.href : _ref$href,
+    text = _ref.text,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? _Button.defaultProps.variant : _ref$variant,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? _Button.defaultProps.size : _ref$size,
+    _ref$state = _ref.state,
+    state = _ref$state === void 0 ? _Button.defaultProps.state : _ref$state,
+    _ref$icon = _ref.icon,
+    icon = _ref$icon === void 0 ? _Button.defaultProps.icon : _ref$icon,
+    _onClick = _ref.onClick,
+    _ref$inputType = _ref.inputType,
+    inputType = _ref$inputType === void 0 ? _Button.defaultProps.inputType : _ref$inputType,
+    _ref$autoFocus = _ref.autoFocus,
+    autoFocus = _ref$autoFocus === void 0 ? _Button.defaultProps.autoFocus : _ref$autoFocus;
+  var stateProps = state === _Button.buttonState.inactive ? _objectSpread({}, {
+    disabled: 'true',
+    'aria-disabled': 'true'
+  }) : null;
+  var fileInputRef = (0, _hooks.useRef)(null);
+  if (element === _Button.buttonElement.button) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", _objectSpread(_objectSpread({
+      "data-test": dataTest,
+      id: id,
+      className: (0, _classnames["default"])(className, _Button2["default"].btn, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, _Button2["default"]['btn-sm'], size === _Button.buttonSize.small), _Button2["default"]['btn-large'], size === _Button.buttonSize.large), _Button2["default"]['btn-primary'], variant === _Button.buttonVariant.primary), _Button2["default"]['btn-danger'], variant === _Button.buttonVariant.danger), _Button2["default"]['btn-outline'], variant === _Button.buttonVariant.outline), _Button2["default"]['btn-blue'], variant === _Button.buttonVariant.blue), _Button2["default"]['btn-orange'], variant === _Button.buttonVariant.orange), _Button2["default"]['button-inactive'], state === _Button.buttonState.inactive)),
+      type: "button",
+      autoFocus: autoFocus // eslint-disable-line
+      ,
+      onClick: function onClick() {
+        if (inputType === _Button.buttonInputType.file) {
+          fileInputRef.current.click();
+        }
+        if (!inputType) {
+          _onClick();
+        }
+      }
+    }, stateProps), {}, {
+      children: [(icon === null || icon === void 0 ? void 0 : icon.alignment) === _Button.iconAlignment.left && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+        className: _margin["default"]['mr-2'],
+        icon: icon.name,
+        size: _Icon.iconSize.small
+      }), text, (icon === null || icon === void 0 ? void 0 : icon.alignment) === _Button.iconAlignment.right && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+        className: _margin["default"]['ml-2'],
+        icon: icon.name,
+        size: _Icon.iconSize.small
+      }), inputType && inputType === _Button.buttonInputType.file && /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        onChange: function onChange() {
+          _onClick(fileInputRef.current.files);
+        },
+        ref: fileInputRef,
+        type: "file",
+        autoFocus: autoFocus // eslint-disable-line
+        ,
+        multiple: true,
+        style: {
+          display: 'none'
+        }
+      })]
+    }));
+  }
+  if (element === _Button.buttonElement.a) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("a", _objectSpread(_objectSpread({
+      className: (0, _classnames["default"])(className, _Button2["default"].btn),
+      href: href,
+      role: "button",
+      onClick: _onClick
+    }, stateProps), {}, {
+      children: text
+    }));
+  }
+}
+Button.propTypes = _Button.propTypes;

package/build/primer/Button/Button.prop.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.propTypes = exports.iconAlignment = exports.defaultProps = exports.buttonVariant = exports.buttonState = exports.buttonSize = exports.buttonInputType = exports.buttonElement = void 0;
+var _propTypes = require("prop-types");
+var _Icon = require("../Icon/Icon.prop");
+var buttonElement = exports.buttonElement = {
+  button: 'button',
+  a: 'a'
+};
+var buttonVariant = exports.buttonVariant = {
+  "default": 'default',
+  primary: 'primary',
+  danger: 'danger',
+  outline: 'outline',
+  blue: 'blue',
+  orange: 'orange'
+};
+var buttonSize = exports.buttonSize = {
+  small: 'small',
+  normal: 'normal',
+  large: 'large'
+};
+var buttonState = exports.buttonState = {
+  active: 'active',
+  inactive: 'inactive'
+};
+var iconAlignment = exports.iconAlignment = {
+  left: 'left',
+  right: 'right'
+};
+var buttonInputType = exports.buttonInputType = {
+  file: 'file'
+};
+var propTypes = exports.propTypes = {
+  dataTest: _propTypes.string,
+  id: _propTypes.string,
+  className: _propTypes.string,
+  element: (0, _propTypes.oneOf)(Object.keys(buttonElement)),
+  href: _propTypes.string,
+  text: _propTypes.string.isRequired,
+  variant: (0, _propTypes.oneOf)(Object.keys(buttonVariant)),
+  size: (0, _propTypes.oneOf)(Object.keys(buttonSize)),
+  state: (0, _propTypes.oneOf)(Object.keys(buttonState)),
+  icon: (0, _propTypes.shape)({
+    name: (0, _propTypes.oneOf)(Object.keys(_Icon.iconName)).isRequired,
+    alignment: (0, _propTypes.oneOf)(Object.keys(iconAlignment))
+  }),
+  onClick: _propTypes.func.isRequired,
+  inputType: (0, _propTypes.oneOf)(Object.keys(buttonInputType)),
+  autoFocus: _propTypes.bool
+};
+var defaultProps = exports.defaultProps = {
+  dataTest: null,
+  id: null,
+  className: null,
+  element: buttonElement.button,
+  href: null,
+  variant: buttonVariant["default"],
+  size: buttonSize.normal,
+  state: buttonState.active,
+  icon: null,
+  inputType: null,
+  autoFocus: false
+};

package/build/primer/Button/Button.scss

@@ -0,0 +1,358 @@
+@import '@papillonarts/css/build/primer/support/variables/typography.scss';
+@import '@papillonarts/css/build/primer/support/variables/misc.scss';
+@import '@papillonarts/css/build/primer/support/variables/layout.scss';
+@import '@papillonarts/css/build/primer/support/mixins/misc.scss';
+
+// stylelint-disable custom-property-pattern
+// stylelint-disable no-descending-specificity
+// stylelint-disable selector-max-type, no-duplicate-selectors
+
+// Base button styles
+.btn {
+  position: relative;
+  display: inline-block;
+  // stylelint-disable-next-line primer/spacing
+  padding: 5px var(--base-size-16);
+  // stylelint-disable-next-line primer/typography
+  font-size: $body-font-size;
+  // stylelint-disable-next-line primer/typography
+  font-weight: $font-weight-semibold;
+  // stylelint-disable-next-line primer/typography
+  line-height: 20px; // Specifically not inherit our `<body>` default
+  white-space: nowrap;
+  vertical-align: middle;
+  cursor: pointer;
+  user-select: none;
+  // stylelint-disable-next-line primer/borders
+  border: $border-width $border-style;
+  // stylelint-disable-next-line primer/borders
+  border-radius: $border-radius;
+  appearance: none; // Corrects inability to style clickable `input` types in iOS.
+
+  &:hover {
+    text-decoration: none;
+  }
+
+  &:disabled,
+  &.disabled,
+  &[aria-disabled='true'] {
+    cursor: default;
+  }
+
+  i {
+    font-style: normal;
+    // stylelint-disable-next-line primer/typography
+    font-weight: $font-weight-semibold;
+    opacity: 0.75;
+  }
+
+  .octicon {
+    margin-right: var(--base-size-4);
+    color: var(--fgColor-muted, var(--color-fg-muted));
+    vertical-align: text-bottom;
+
+    &:only-child {
+      margin-right: 0;
+    }
+  }
+
+  .Counter {
+    // stylelint-disable-next-line primer/spacing
+    margin-left: 2px;
+    color: inherit;
+    text-shadow: none;
+    vertical-align: top;
+    background-color: var(--buttonCounter-default-bgColor-rest, var(--color-btn-counter-bg));
+  }
+
+  .dropdown-caret {
+    margin-left: var(--base-size-4);
+    opacity: 0.8;
+  }
+}
+
+// Default button
+
+.btn {
+  color: var(--button-default-fgColor-rest, var(--color-btn-text));
+  background-color: var(--button-default-bgColor-rest, var(--color-btn-bg));
+  border-color: var(--button-default-borderColor-rest, var(--color-btn-border));
+  box-shadow:
+    var(--button-default-shadow-resting, var(--color-btn-shadow)), var(--button-default-shadow-inset, var(--color-btn-inset-shadow));
+  transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
+  transition-property: color, background-color, box-shadow, border-color;
+
+  &:hover,
+  &.hover,
+  [open] > & {
+    background-color: var(--button-default-bgColor-hover, var(--color-btn-hover-bg));
+    border-color: var(--button-default-borderColor-hover, var(--color-btn-hover-border));
+    transition-duration: 0.1s;
+  }
+
+  &:active {
+    background-color: var(--button-default-bgColor-active, var(--color-btn-active-bg));
+    border-color: var(--button-default-borderColor-active, var(--color-btn-active-border));
+    transition: none;
+  }
+
+  &.selected,
+  &[aria-selected='true'] {
+    background-color: var(--button-default-bgColor-selected, var(--color-btn-selected-bg));
+    box-shadow: var(--shadow-inset, var(--color-primer-shadow-inset));
+  }
+
+  &:disabled,
+  &.disabled,
+  &[aria-disabled='true'] {
+    color: var(--fgColor-disabled, var(--color-primer-fg-disabled));
+    background-color: var(--button-default-bgColor-disabled, var(--color-btn-bg));
+    border-color: var(--button-default-borderColor-disabled, var(--color-btn-border));
+
+    .octicon {
+      color: var(--fgColor-disabled, var(--color-primer-fg-disabled));
+    }
+  }
+}
+
+// Primary button
+
+.btn-primary {
+  color: var(--button-primary-fgColor-rest, var(--color-btn-primary-text));
+  background-color: var(--button-primary-bgColor-rest, var(--color-btn-primary-bg));
+  border-color: var(--button-primary-borderColor-rest, var(--color-btn-primary-border));
+  box-shadow: var(--shadow-resting-small, var(--color-btn-primary-shadow)), var(--shadow-highlight, var(--color-btn-primary-inset-shadow));
+
+  &:hover,
+  &.hover,
+  [open] > & {
+    background-color: var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg));
+    border-color: var(--button-primary-borderColor-hover, var(--color-btn-primary-hover-border));
+  }
+
+  // fallback :focus state
+  &:focus {
+    @include focusOutlineOnEmphasis;
+
+    // remove fallback :focus if :focus-visible is supported
+    &:not(:focus-visible) {
+      outline: solid 1px transparent;
+      box-shadow: none;
+    }
+  }
+
+  // default focus state
+  &:focus-visible {
+    @include focusOutlineOnEmphasis;
+  }
+
+  &:active,
+  &.selected,
+  &[aria-selected='true'] {
+    background-color: var(--button-primary-bgColor-active, var(--color-btn-primary-selected-bg));
+    box-shadow: var(--button-primary-shadow-selected, var(--color-btn-primary-selected-shadow));
+  }
+
+  &:disabled,
+  &.disabled,
+  &[aria-disabled='true'] {
+    color: var(--button-primary-fgColor-disabled, var(--color-btn-primary-disabled-text));
+    background-color: var(--button-primary-bgColor-disabled, var(--color-btn-primary-disabled-bg));
+    border-color: var(--button-primary-borderColor-disabled, var(--color-btn-primary-disabled-border));
+
+    .octicon {
+      color: var(--button-primary-fgColor-disabled, var(--color-btn-primary-disabled-text));
+    }
+  }
+
+  .Counter {
+    color: inherit;
+    background-color: var(--buttonCounter-primary-bgColor-rest, var(--color-btn-primary-counter-bg));
+  }
+
+  .octicon {
+    color: var(--button-primary-iconColor-rest, var(--color-btn-primary-icon));
+  }
+}
+
+// ensure links styled as button primary gets proper focus style
+// stylelint-disable-next-line selector-no-qualifying-type
+a.btn-primary {
+  // fallback :focus state
+  &:focus {
+    @include focusOutlineOnEmphasis;
+
+    // remove fallback :focus if :focus-visible is supported
+    &:not(:focus-visible) {
+      outline: solid 1px transparent;
+      box-shadow: none;
+    }
+  }
+
+  // default focus state
+  &:focus-visible {
+    @include focusOutlineOnEmphasis;
+  }
+}
+
+// Outline button
+
+.btn-outline {
+  color: var(--button-outline-fgColor-rest, var(--color-btn-outline-text));
+
+  &:hover,
+  [open] > & {
+    color: var(--button-outline-fgColor-hover, var(--color-btn-outline-hover-text));
+    background-color: var(--button-outline-bgColor-hover, var(--color-btn-outline-hover-bg));
+    border-color: var(--button-outline-borderColor-hover, var(--color-btn-outline-hover-border));
+    box-shadow:
+      var(--shadow-resting-small, var(--color-btn-outline-hover-shadow)),
+      var(--shadow-highlight, var(--color-btn-outline-hover-inset-shadow));
+
+    .Counter {
+      background-color: var(--buttonCounter-outline-bgColor-hover, var(--color-btn-outline-hover-counter-bg));
+    }
+
+    .octicon {
+      color: inherit;
+    }
+  }
+
+  &:active,
+  &.selected,
+  &[aria-selected='true'] {
+    color: var(--button-outline-fgColor-active, var(--color-btn-outline-selected-text));
+    background-color: var(--button-outline-bgColor-active, var(--color-btn-outline-selected-bg));
+    border-color: var(--button-outline-borderColor-active, var(--color-btn-outline-selected-border));
+    box-shadow: var(--button-outline-shadow-selected, var(--color-btn-outline-selected-shadow));
+
+    // fallback :focus state
+    &:focus {
+      @include focusOutlineOnEmphasis;
+
+      // remove fallback :focus if :focus-visible is supported
+      &:not(:focus-visible) {
+        outline: solid 1px transparent;
+        box-shadow: none;
+      }
+    }
+
+    // default focus state
+    &:focus-visible {
+      @include focusOutlineOnEmphasis;
+    }
+  }
+
+  &:disabled,
+  &.disabled,
+  &[aria-disabled='true'] {
+    color: var(--button-outline-fgColor-disabled, var(--color-btn-outline-disabled-text));
+    background-color: var(--button-outline-bgColor-disabled, var(--color-btn-outline-disabled-bg));
+    border-color: var(--button-default-borderColor-rest, var(--color-btn-border));
+    box-shadow: none;
+
+    .Counter {
+      background-color: var(--buttonCounter-outline-bgColor-disabled, var(--color-btn-outline-disabled-counter-bg));
+    }
+  }
+
+  .Counter {
+    color: inherit;
+    background-color: var(--buttonCounter-outline-bgColor-rest, var(--color-btn-outline-counter-bg));
+  }
+}
+
+// Danger button
+
+.btn-danger {
+  color: var(--button-danger-fgColor-rest, var(--color-btn-danger-text));
+
+  .octicon {
+    color: var(--button-danger-iconColor-rest, var(--color-btn-danger-icon));
+  }
+
+  &:hover,
+  [open] > & {
+    color: var(--button-danger-fgColor-hover, var(--color-btn-danger-hover-text));
+    background-color: var(--button-danger-bgColor-hover, var(--color-btn-danger-hover-bg));
+    border-color: var(--button-danger-borderColor-hover, var(--color-btn-danger-hover-border));
+    box-shadow:
+      var(--shadow-resting-small, var(--color-btn-danger-hover-shadow)), var(--shadow-highlight, var(--color-btn-danger-hover-inset-shadow));
+
+    .Counter {
+      background-color: var(--buttonCounter-danger-bgColor-hover, var(--color-btn-danger-hover-counter-bg));
+    }
+
+    .octicon {
+      color: var(--button-danger-iconColor-hover, var(--color-btn-danger-hover-icon));
+    }
+  }
+
+  &:active,
+  &.selected,
+  &[aria-selected='true'] {
+    color: var(--button-danger-fgColor-active, var(--color-btn-danger-selected-text));
+    background-color: var(--button-danger-bgColor-active, var(--color-btn-danger-selected-bg));
+    border-color: var(--button-danger-borderColor-active, var(--color-btn-danger-selected-border));
+    box-shadow: var(--button-danger-shadow-selected, var(--color-btn-danger-selected-shadow));
+  }
+
+  &:disabled,
+  &.disabled,
+  &[aria-disabled='true'] {
+    color: var(--button-danger-fgColor-disabled, var(--color-btn-danger-disabled-text));
+    background-color: var(--button-danger-bgColor-disabled, var(--color-btn-danger-disabled-bg));
+    border-color: var(--button-default-borderColor-rest, var(--color-btn-border));
+    box-shadow: none;
+
+    .Counter {
+      background-color: var(--buttonCounter-danger-bgColor-disabled, var(--color-btn-danger-disabled-counter-bg));
+    }
+
+    .octicon {
+      color: var(--button-danger-fgColor-disabled, var(--color-btn-danger-disabled-text));
+    }
+  }
+
+  .Counter {
+    color: inherit;
+    background-color: var(--buttonCounter-danger-bgColor-rest, var(--color-btn-danger-counter-bg));
+  }
+}
+
+// Sizes
+//
+// Tweak `line-height` to make them smaller.
+.btn-sm {
+  // stylelint-disable-next-line primer/spacing
+  padding: 3px 12px;
+  // stylelint-disable-next-line primer/typography
+  font-size: $font-size-small;
+  // stylelint-disable-next-line primer/typography
+  line-height: 20px;
+
+  .octicon {
+    vertical-align: text-top;
+  }
+}
+
+// Large button adds more padding around text. Use font-size utils to increase font-size.. e.g, <p class="text-gamma"><button class="btn btn-large btn-primary" type="button">Big green button</button></p>
+.btn-large {
+  // stylelint-disable-next-line primer/spacing
+  padding: $em-spacer-6 1.5em;
+  font-size: inherit;
+  // stylelint-disable-next-line primer/typography
+  line-height: $lh-default;
+
+  // stylelint-disable-next-line primer/borders
+  border-radius: 0.5em;
+}
+
+// Full-width button
+//
+// These buttons expand to the full width of their parent container
+.btn-block {
+  display: block;
+  width: 100%;
+  text-align: center;
+}

package/build/primer/Button/ButtonGroup.scss

@@ -0,0 +1,109 @@
+@import '@papillonarts/css/build/primer/support/variables/layout.scss';
+@import '@papillonarts/css/build/primer/support/variables/misc.scss';
+
+// stylelint-disable no-descending-specificity
+
+// Button group
+//
+// A button group is a series of buttons laid out next to each other, all part
+// of one visual button, but separated by rules to be separate.
+
+.BtnGroup {
+  display: inline-block;
+  vertical-align: middle;
+
+  @include clearfix();
+
+  // Proper spacing for multiple button groups (a la, gollum editor)
+  + .BtnGroup,
+  + .btn {
+    margin-left: var(--base-size-4);
+  }
+}
+
+.BtnGroup-item {
+  position: relative;
+  float: left;
+  border-right-width: 0;
+  border-radius: 0;
+
+  &:first-child {
+    // stylelint-disable-next-line primer/borders
+    border-top-left-radius: $border-radius;
+    // stylelint-disable-next-line primer/borders
+    border-bottom-left-radius: $border-radius;
+  }
+
+  &:last-child {
+    // stylelint-disable-next-line primer/borders
+    border-right-width: $border-width;
+    // stylelint-disable-next-line primer/borders
+    border-top-right-radius: $border-radius;
+    // stylelint-disable-next-line primer/borders
+    border-bottom-right-radius: $border-radius;
+  }
+
+  &.selected,
+  &[aria-selected='true'],
+  &:focus,
+  &:active,
+  &:hover {
+    // stylelint-disable-next-line primer/borders
+    border-right-width: $border-width;
+
+    + .BtnGroup-item,
+    + .BtnGroup-parent .BtnGroup-item {
+      border-left-width: 0;
+    }
+  }
+}
+
+.BtnGroup-parent {
+  float: left;
+
+  &:first-child .BtnGroup-item {
+    // stylelint-disable-next-line primer/borders
+    border-top-left-radius: $border-radius;
+    // stylelint-disable-next-line primer/borders
+    border-bottom-left-radius: $border-radius;
+  }
+
+  &:last-child .BtnGroup-item {
+    // stylelint-disable-next-line primer/borders
+    border-right-width: $border-width;
+    // stylelint-disable-next-line primer/borders
+    border-top-right-radius: $border-radius;
+    // stylelint-disable-next-line primer/borders
+    border-bottom-right-radius: $border-radius;
+  }
+
+  .BtnGroup-item {
+    border-right-width: 0;
+    border-radius: 0;
+  }
+
+  &.selected,
+  &[aria-selected='true'],
+  &:focus,
+  &:active,
+  &:hover {
+    .BtnGroup-item {
+      // stylelint-disable-next-line primer/borders
+      border-right-width: $border-width;
+    }
+
+    + .BtnGroup-item,
+    + .BtnGroup-parent .BtnGroup-item {
+      border-left-width: 0;
+    }
+  }
+}
+
+// ensure that the focus ring sits above the adjacent buttons
+.BtnGroup-item,
+.BtnGroup-parent {
+  &:focus,
+  &:active {
+    z-index: 1;
+  }
+}

package/build/primer/Button/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Button", {
+  enumerable: true,
+  get: function get() {
+    return _Button.Button;
+  }
+});
+Object.defineProperty(exports, "buttonElement", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.buttonElement;
+  }
+});
+Object.defineProperty(exports, "buttonInputType", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.buttonInputType;
+  }
+});
+Object.defineProperty(exports, "buttonSize", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.buttonSize;
+  }
+});
+Object.defineProperty(exports, "buttonState", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.buttonState;
+  }
+});
+Object.defineProperty(exports, "buttonVariant", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.buttonVariant;
+  }
+});
+Object.defineProperty(exports, "iconAlignment", {
+  enumerable: true,
+  get: function get() {
+    return _Button2.iconAlignment;
+  }
+});
+var _Button = require("./Button");
+var _Button2 = require("./Button.prop");