@instructure/ui-buttons 11.6.0 → 11.6.1-snapshot-129

package/lib/Button/v1/index.js

@@ -0,0 +1,128 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Button = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = require("react");
+var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
+var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
+var _emotion = require("@instructure/emotion");
+var _theme = _interopRequireDefault(require("./theme"));
+var _v = require("../../BaseButton/v1");
+var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+const _excluded = ["children", "type", "size", "as", "color", "focusColor", "display", "textAlign", "withBackground", "margin", "cursor", "href", "renderIcon"];
+var _dec, _class, _Button;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+/**
+---
+category: components
+---
+**/
+// needed for listing the available theme variables on docs page
+let Button = exports.Button = (_dec = (0, _emotion.withStyleLegacy)(null, _theme.default), _dec(_class = (_Button = class Button extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this._buttonComponent = null;
+    this.ref = null;
+    this.handleElementRef = el => {
+      const elementRef = this.props.elementRef;
+      this.ref = el;
+      if (typeof elementRef === 'function') {
+        elementRef(el);
+      }
+    };
+    this.handleButtonRef = component => {
+      this._buttonComponent = component;
+    };
+  }
+  get focused() {
+    return this._buttonComponent && this._buttonComponent.focused;
+  }
+  focus() {
+    this._buttonComponent && this._buttonComponent.focus();
+  }
+  render() {
+    const _this$props = this.props,
+      children = _this$props.children,
+      type = _this$props.type,
+      size = _this$props.size,
+      as = _this$props.as,
+      color = _this$props.color,
+      focusColor = _this$props.focusColor,
+      display = _this$props.display,
+      textAlign = _this$props.textAlign,
+      withBackground = _this$props.withBackground,
+      margin = _this$props.margin,
+      cursor = _this$props.cursor,
+      href = _this$props.href,
+      renderIcon = _this$props.renderIcon,
+      props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    const interaction = (0, _getInteraction.getInteraction)({
+      props
+    });
+    const themeOverride = this.props.themeOverride;
+    const buttonProps = {
+      ...(0, _passthroughProps.passthroughProps)(props),
+      type,
+      size,
+      elementRef: this.handleElementRef,
+      ref: this.handleButtonRef,
+      as,
+      color,
+      interaction,
+      focusColor,
+      display,
+      textAlign,
+      withBackground,
+      margin,
+      cursor,
+      href,
+      renderIcon,
+      themeOverride
+    };
+    return (0, _jsxRuntime.jsx)(_v.BaseButton, {
+      ...buttonProps,
+      "data-cid": "Button",
+      children: children
+    });
+  }
+}, _Button.displayName = "Button", _Button.componentId = 'Button', _Button.allowedProps = _props.allowedProps, _Button.defaultProps = {
+  type: 'button',
+  size: 'medium',
+  as: 'button',
+  // Leave interaction default undefined so that `disabled` and `readOnly` can also be supplied
+  interaction: void 0,
+  color: 'secondary',
+  display: 'inline-block',
+  textAlign: 'center',
+  withBackground: true,
+  margin: '0',
+  cursor: 'pointer'
+}, _Button)) || _class);
+var _default = exports.default = Button;

package/lib/Button/{theme.js → v1/theme.js}

@@ -10,4 +10,4 @@ Object.defineProperty(exports, "default", {
     return _theme.default;
   }
 });
-var _theme = _interopRequireDefault(require("../BaseButton/theme"));
+var _theme = _interopRequireDefault(require("../../BaseButton/v1/theme"));

package/lib/Button/{index.js → v2/index.js}

@@ -10,8 +10,7 @@ var _react = require("react");
 var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 var _emotion = require("@instructure/emotion");
-var _theme = _interopRequireDefault(require("./theme"));
-var _BaseButton = require("../BaseButton");
+var _v = require("../../BaseButton/v2");
 var _props = require("./props");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const _excluded = ["children", "type", "size", "as", "color", "focusColor", "display", "textAlign", "withBackground", "margin", "cursor", "href", "renderIcon"];
@@ -45,7 +44,7 @@ category: components
 ---
 **/
 // needed for listing the available theme variables on docs page
-let Button = exports.Button = (_dec = (0, _emotion.withStyle)(null, _theme.default), _dec(_class = (_Button = class Button extends _react.Component {
+let Button = exports.Button = (_dec = (0, _emotion.withStyle)(null, 'BaseButton'), _dec(_class = (_Button = class Button extends _react.Component {
   constructor(...args) {
     super(...args);
     this._buttonComponent = null;
@@ -106,7 +105,7 @@ let Button = exports.Button = (_dec = (0, _emotion.withStyle)(null, _theme.defau
       renderIcon,
       themeOverride
     };
-    return (0, _jsxRuntime.jsx)(_BaseButton.BaseButton, {
+    return (0, _jsxRuntime.jsx)(_v.BaseButton, {
       ...buttonProps,
       "data-cid": "Button",
       children: children

package/lib/Button/v2/props.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.allowedProps = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const allowedProps = exports.allowedProps = ['as', 'children', 'color', 'cursor', 'display', 'elementRef', 'focusColor', 'href', 'interaction', 'margin', 'renderIcon', 'size', 'textAlign', 'type', 'withBackground', 'onClick'];

package/lib/CloseButton/{index.js → v1/index.js}

@@ -7,14 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.CloseButton = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = require("react");
-var _IconXSolid = require("@instructure/ui-icons/lib/IconXSolid.js");
+var _IconXSolid = require("@instructure/ui-icons/lib/generated/IconXSolid.js");
 var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
 var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _BaseButton = require("../BaseButton");
+var _v = require("../../BaseButton/v1");
 var _props = require("./props");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const _excluded = ["screenReaderLabel", "elementRef", "size", "onClick", "margin", "placement", "offset", "type", "as", "href", "cursor", "tabIndex", "styles"];
@@ -47,7 +47,7 @@ var _dec, _class, _CloseButton;
 category: components
 ---
 **/
-let CloseButton = exports.CloseButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_CloseButton = class CloseButton extends _react.Component {
+let CloseButton = exports.CloseButton = (_dec = (0, _emotion.withStyleLegacy)(_styles.default, _theme.default), _dec(_class = (_CloseButton = class CloseButton extends _react.Component {
   constructor(...args) {
     super(...args);
     this.ref = null;
@@ -97,7 +97,7 @@ let CloseButton = exports.CloseButton = (_dec = (0, _emotion.withStyle)(_styles.
       ref: el => {
         this.ref = el;
       },
-      children: (0, _jsxRuntime.jsx)(_BaseButton.BaseButton, {
+      children: (0, _jsxRuntime.jsx)(_v.BaseButton, {
         renderIcon: _IconXSolid.IconXSolid,
         elementRef: this.handleRef,
         interaction: this.interaction,

package/lib/CloseButton/v2/index.js

@@ -0,0 +1,136 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.CloseButton = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = require("react");
+var _uiIcons = require("@instructure/ui-icons");
+var _ScreenReaderContent = require("@instructure/ui-a11y-content/lib/ScreenReaderContent");
+var _getInteraction = require("@instructure/ui-react-utils/lib/getInteraction.js");
+var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
+var _emotion = require("@instructure/emotion");
+var _styles = _interopRequireDefault(require("./styles"));
+var _v = require("../../BaseButton/v2");
+var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+const _excluded = ["screenReaderLabel", "elementRef", "size", "onClick", "margin", "placement", "offset", "type", "as", "href", "cursor", "tabIndex", "styles"];
+var _dec, _class, _CloseButton;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+/**
+---
+category: components
+---
+**/
+let CloseButton = exports.CloseButton = (_dec = (0, _emotion.withStyle)(_styles.default, 'BaseButton'), _dec(_class = (_CloseButton = class CloseButton extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this.ref = null;
+    this.handleRef = el => {
+      const elementRef = this.props.elementRef;
+      if (typeof elementRef === 'function') {
+        elementRef(el);
+      }
+    };
+  }
+  componentDidMount() {
+    var _this$props$makeStyle, _this$props;
+    (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props);
+  }
+  componentDidUpdate() {
+    var _this$props$makeStyle2, _this$props2;
+    (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2);
+  }
+  get interaction() {
+    return (0, _getInteraction.getInteraction)({
+      props: this.props
+    });
+  }
+  get color() {
+    const color = this.props.color;
+    return color === 'primary' ? 'secondary' : color;
+  }
+  render() {
+    const _this$props3 = this.props,
+      screenReaderLabel = _this$props3.screenReaderLabel,
+      elementRef = _this$props3.elementRef,
+      size = _this$props3.size,
+      onClick = _this$props3.onClick,
+      margin = _this$props3.margin,
+      placement = _this$props3.placement,
+      offset = _this$props3.offset,
+      type = _this$props3.type,
+      as = _this$props3.as,
+      href = _this$props3.href,
+      cursor = _this$props3.cursor,
+      tabIndex = _this$props3.tabIndex,
+      styles = _this$props3.styles,
+      props = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
+    const themeOverride = this.props.themeOverride;
+    return (0, _jsxRuntime.jsx)("span", {
+      ...(0, _passthroughProps.passthroughProps)(props),
+      css: styles === null || styles === void 0 ? void 0 : styles.closeButton,
+      ref: el => {
+        this.ref = el;
+      },
+      children: (0, _jsxRuntime.jsx)(_v.BaseButton, {
+        renderIcon: _uiIcons.XInstUIIcon,
+        elementRef: this.handleRef,
+        interaction: this.interaction,
+        type: type,
+        ...(this.color ? {
+          color: this.color
+        } : {}),
+        size: size,
+        onClick: onClick,
+        margin: margin,
+        withBorder: false,
+        withBackground: false,
+        as: as,
+        href: href,
+        cursor: cursor,
+        tabIndex: tabIndex,
+        themeOverride: themeOverride,
+        "data-cid": "CloseButton",
+        children: (0, _jsxRuntime.jsx)(_ScreenReaderContent.ScreenReaderContent, {
+          children: screenReaderLabel
+        })
+      })
+    });
+  }
+}, _CloseButton.displayName = "CloseButton", _CloseButton.componentId = 'CloseButton', _CloseButton.allowedProps = _props.allowedProps, _CloseButton.defaultProps = {
+  // Leave interaction default undefined so that `disabled` and `readOnly` can also be supplied
+  interaction: void 0,
+  type: 'button',
+  placement: 'static',
+  offset: 'x-small',
+  size: 'small',
+  margin: '0',
+  as: 'button',
+  cursor: 'pointer'
+}, _CloseButton)) || _class);
+var _default = exports.default = CloseButton;

package/lib/CloseButton/v2/props.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.allowedProps = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const allowedProps = exports.allowedProps = ['as', 'color', 'cursor', 'elementRef', 'href', 'interaction', 'margin', 'offset', 'onClick', 'placement', 'screenReaderLabel', 'size', 'tabIndex', 'type'];

package/lib/CloseButton/v2/styles.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+/**
+ * ---
+ * private: true
+ * ---
+ * Generates the style object from the theme and provided additional information
+ * @param  {Object} _componentTheme The theme variable object.
+ * @param  {Object} props the props of the component, the style is applied to
+ * @param  {Object} sharedTokens the shared design tokens
+ * @return {Object} The final style object, which will be used in the component
+ */
+const generateStyle = (_componentTheme, props, sharedTokens) => {
+  const placement = props.placement,
+    offset = props.offset;
+  const offsetValueMap = {
+    none: 0,
+    'x-small': sharedTokens.spacing.general.spaceXs,
+    small: sharedTokens.spacing.general.spaceSm,
+    medium: sharedTokens.spacing.general.spaceMd
+  };
+  const getOffsetStyle = () => {
+    const offsetValue = offsetValueMap[offset];
+    return {
+      ...(offsetValue !== 0 && {
+        top: offsetValue
+      }),
+      insetInlineStart: placement === 'start' ? offsetValue : 'auto',
+      insetInlineEnd: placement === 'end' ? offsetValue : 'auto'
+    };
+  };
+  return {
+    closeButton: {
+      label: 'closeButton',
+      zIndex: 1,
+      display: 'inline-block',
+      ...(placement === 'static' ? {
+        position: 'static'
+      } : {
+        position: 'absolute',
+        ...getOffsetStyle()
+      })
+    }
+  };
+};
+var _default = exports.default = generateStyle;

package/lib/CondensedButton/{index.js → v1/index.js}

@@ -10,7 +10,7 @@ var _react = require("react");
 var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
 var _emotion = require("@instructure/emotion");
 var _theme = _interopRequireDefault(require("./theme"));
-var _BaseButton = require("../BaseButton");
+var _v = require("../../BaseButton/v1");
 var _props = require("./props");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const _excluded = ["children", "type", "size", "elementRef", "as", "interaction", "color", "margin", "cursor", "href", "renderIcon", "display"];
@@ -44,7 +44,7 @@ category: components
 ---
 **/
 // needed for listing the available theme variables on docs page
-let CondensedButton = exports.CondensedButton = (_dec = (0, _emotion.withStyle)(null, _theme.default), _dec(_class = (_CondensedButton = class CondensedButton extends _react.Component {
+let CondensedButton = exports.CondensedButton = (_dec = (0, _emotion.withStyleLegacy)(null, _theme.default), _dec(_class = (_CondensedButton = class CondensedButton extends _react.Component {
   constructor(...args) {
     super(...args);
     this._baseButton = null;
@@ -79,7 +79,7 @@ let CondensedButton = exports.CondensedButton = (_dec = (0, _emotion.withStyle)(
       display = _this$props.display,
       props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
     const themeOverride = this.props.themeOverride;
-    return (0, _jsxRuntime.jsx)(_BaseButton.BaseButton, {
+    return (0, _jsxRuntime.jsx)(_v.BaseButton, {
       ...(0, _passthroughProps.passthroughProps)(props),
       isCondensed: true,
       display: display,

package/lib/CondensedButton/{theme.js → v1/theme.js}

@@ -10,4 +10,4 @@ Object.defineProperty(exports, "default", {
     return _theme.default;
   }
 });
-var _theme = _interopRequireDefault(require("../BaseButton/theme"));
+var _theme = _interopRequireDefault(require("../../BaseButton/v1/theme"));

package/lib/CondensedButton/v2/index.js

@@ -0,0 +1,116 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.CondensedButton = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = require("react");
+var _passthroughProps = require("@instructure/ui-react-utils/lib/passthroughProps.js");
+var _emotion = require("@instructure/emotion");
+var _v = require("../../BaseButton/v2");
+var _props = require("./props");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+const _excluded = ["children", "type", "size", "elementRef", "as", "interaction", "color", "margin", "cursor", "href", "renderIcon", "display"];
+var _dec, _class, _CondensedButton;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+/**
+---
+category: components
+---
+**/
+// needed for listing the available theme variables on docs page
+let CondensedButton = exports.CondensedButton = (_dec = (0, _emotion.withStyle)(null, 'BaseButton'), _dec(_class = (_CondensedButton = class CondensedButton extends _react.Component {
+  constructor(...args) {
+    super(...args);
+    this._baseButton = null;
+    this.ref = null;
+    this.handleRef = el => {
+      const elementRef = this.props.elementRef;
+      this.ref = el;
+      if (typeof elementRef === 'function') {
+        elementRef(el);
+      }
+    };
+  }
+  get focused() {
+    return this._baseButton && this._baseButton.focused;
+  }
+  focus() {
+    this._baseButton && this._baseButton.focus();
+  }
+  render() {
+    const _this$props = this.props,
+      children = _this$props.children,
+      type = _this$props.type,
+      size = _this$props.size,
+      elementRef = _this$props.elementRef,
+      as = _this$props.as,
+      interaction = _this$props.interaction,
+      color = _this$props.color,
+      margin = _this$props.margin,
+      cursor = _this$props.cursor,
+      href = _this$props.href,
+      renderIcon = _this$props.renderIcon,
+      display = _this$props.display,
+      props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    const themeOverride = this.props.themeOverride;
+    return (0, _jsxRuntime.jsx)(_v.BaseButton, {
+      ...(0, _passthroughProps.passthroughProps)(props),
+      isCondensed: true,
+      display: display,
+      withBackground: false,
+      withBorder: false,
+      type: type,
+      size: size,
+      elementRef: this.handleRef,
+      as: as,
+      interaction: interaction,
+      color: color,
+      margin: margin,
+      cursor: cursor,
+      href: href,
+      renderIcon: renderIcon,
+      themeOverride: themeOverride,
+      ref: component => {
+        this._baseButton = component;
+      },
+      "data-cid": "CondensedButton",
+      children: children
+    });
+  }
+}, _CondensedButton.displayName = "CondensedButton", _CondensedButton.componentId = 'CondensedButton', _CondensedButton.allowedProps = _props.allowedProps, _CondensedButton.defaultProps = {
+  type: 'button',
+  size: 'medium',
+  as: 'button',
+  // Leave interaction default undefined so that `disabled` and `readOnly` can also be supplied
+  interaction: void 0,
+  color: 'primary',
+  margin: '0',
+  cursor: 'pointer',
+  display: 'inline-block'
+}, _CondensedButton)) || _class);
+var _default = exports.default = CondensedButton;

package/lib/CondensedButton/v2/props.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.allowedProps = void 0;
+/*
+ * The MIT License (MIT)
+ *
+ * Copyright (c) 2015 - present Instructure, Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+const allowedProps = exports.allowedProps = ['as', 'children', 'color', 'cursor', 'elementRef', 'href', 'interaction', 'margin', 'renderIcon', 'size', 'type', 'onClick', 'display'];