@cloudflare/component-card 5.0.64 → 6.0.0

package/es/Card.js

@@ -2,26 +2,32 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = ({
-  theme
-}) => ({
-  my: 3,
-  padding: 0,
-  backgroundColor: theme.colors.background,
-  border: `1px solid ${theme.colors.gray[7]}`,
-  borderRadius: theme.radii[2]
-});
+var styles = _ref => {
+  var {
+    theme
+  } = _ref;
+  return {
+    my: 3,
+    padding: 0,
+    backgroundColor: theme.colors.background,
+    border: "1px solid ".concat(theme.colors.gray[7]),
+    borderRadius: theme.radii[2]
+  };
+};
 
-const Card = ({
-  id,
-  className,
-  testId,
-  children
-}) => /*#__PURE__*/React.createElement("div", {
-  id: id,
-  className: className,
-  "data-testid": testId
-}, children);
+var Card = _ref2 => {
+  var {
+    id,
+    className,
+    testId,
+    children
+  } = _ref2;
+  return /*#__PURE__*/React.createElement("div", {
+    id: id,
+    className: className,
+    "data-testid": testId
+  }, children);
+};
 
 Card.propTypes = {
   className: PropTypes.string,

package/es/CardBlock.js

@@ -2,15 +2,18 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = ({
-  theme
-}) => ({
-  p: 3,
-  borderTop: `1px solid ${theme.colors.gray[7]}`,
-  '&:first-child': {
-    borderTop: 0
-  }
-});
+var styles = _ref => {
+  var {
+    theme
+  } = _ref;
+  return {
+    p: 3,
+    borderTop: "1px solid ".concat(theme.colors.gray[7]),
+    '&:first-child': {
+      borderTop: 0
+    }
+  };
+};
 
 class CardBlock extends React.Component {
   render() {

package/es/CardContent.js

@@ -2,19 +2,22 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = () => ({
+var styles = () => ({
   p: [3, 3, 4],
   tablet: {
     display: 'table-cell'
   }
 });
 
-const CardContent = ({
-  className,
-  children
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, children);
+var CardContent = _ref => {
+  var {
+    className,
+    children
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, children);
+};
 
 CardContent.propTypes = {
   className: PropTypes.string,

package/es/CardControl.js

@@ -2,37 +2,43 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = ({
-  theme,
-  wide
-}) => ({
-  position: 'relative',
-  padding: wide ? 0 : 4,
-  border: `0 solid ${theme.colors.gray[7]}`,
-  borderTopWidth: '1px',
-  backgroundColor: theme.colors.gray[9],
-  textAlign: wide ? 'inherit' : 'center',
-  mobile: {
-    borderTopWidth: '1px'
-  },
-  tablet: {
-    width: '40%',
-    borderLeftWidth: '1px',
-    borderTopWidth: 0,
-    verticalAlign: 'middle',
-    display: 'table-cell'
-  },
-  desktop: {
-    width: '30%'
-  }
-});
+var styles = _ref => {
+  var {
+    theme,
+    wide
+  } = _ref;
+  return {
+    position: 'relative',
+    padding: wide ? 0 : 4,
+    border: "0 solid ".concat(theme.colors.gray[7]),
+    borderTopWidth: '1px',
+    backgroundColor: theme.colors.gray[9],
+    textAlign: wide ? 'inherit' : 'center',
+    mobile: {
+      borderTopWidth: '1px'
+    },
+    tablet: {
+      width: '40%',
+      borderLeftWidth: '1px',
+      borderTopWidth: 0,
+      verticalAlign: 'middle',
+      display: 'table-cell'
+    },
+    desktop: {
+      width: '30%'
+    }
+  };
+};
 
-const CardControl = ({
-  className,
-  children
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, children);
+var CardControl = _ref2 => {
+  var {
+    className,
+    children
+  } = _ref2;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, children);
+};
 
 CardControl.propTypes = {
   className: PropTypes.string,

package/es/CardDrawer.js

@@ -1,12 +1,15 @@
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
-const CardDrawer = createStyledComponent(({
-  theme,
-  isActive
-}) => ({
-  borderTop: isActive ? `1px solid ${theme.colors.gray[7]}` : 'initial',
-  padding: isActive ? 3 : 'initial'
-}), 'div', ['role', 'aria-labelledby']);
+var CardDrawer = createStyledComponent(_ref => {
+  var {
+    theme,
+    isActive
+  } = _ref;
+  return {
+    borderTop: isActive ? "1px solid ".concat(theme.colors.gray[7]) : 'initial',
+    padding: isActive ? 3 : 'initial'
+  };
+}, 'div', ['role', 'aria-labelledby']);
 CardDrawer.propTypes = {
   id: PropTypes.string.isRequired,
   key: PropTypes.string.isRequired,

package/es/CardDrawers.js

@@ -1,4 +1,6 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var _excluded = ["id", "name", "content", "drawerComponent", "onClick", "href", "ariaLabel"];
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
@@ -12,7 +14,7 @@ import CardToolbarDrawerTrigger from './CardToolbarDrawerTrigger';
 import CardPropTypes from './CardPropTypes';
 import CardDrawer from './CardDrawer';
 import CardToolbarLink from './CardToolbarLink';
-let UNIQUE_ID = 0;
+var UNIQUE_ID = 0;
 
 class CardDrawers extends React.Component {
   constructor(props) {
@@ -38,38 +40,43 @@ class CardDrawers extends React.Component {
   }
 
   runToggleFunctions(id, isOpen) {
-    const toggleFunctions = this.toggleFunctions[id];
+    var toggleFunctions = this.toggleFunctions[id];
     toggleFunctions && toggleFunctions.every(fn => fn(isOpen));
   }
 
   handleLinkClick(id) {
     this.props.onClick && this.props.onClick(id);
-    this.setState(({
-      active
-    }) => ({
-      active: active === id ? null : id
-    }), () => this.runToggleFunctions(id, this.state.active === id));
+    this.setState(_ref => {
+      var {
+        active
+      } = _ref;
+      return {
+        active: active === id ? null : id
+      };
+    }, () => this.runToggleFunctions(id, this.state.active === id));
   }
 
   render() {
-    const active = this.props.hasOwnProperty('active') ? this.props.active : this.state.active;
-    const triggers = [];
-    const drawers = [];
-    this.props.drawers.forEach((_ref) => {
-      let drawerIdProps = _ref.id,
-          name = _ref.name,
-          content = _ref.content,
-          drawerComponent = _ref.drawerComponent,
-          onClick = _ref.onClick,
-          href = _ref.href,
-          ariaLabel = _ref.ariaLabel,
-          rest = _objectWithoutProperties(_ref, ["id", "name", "content", "drawerComponent", "onClick", "href", "ariaLabel"]);
+    var active = this.props.hasOwnProperty('active') ? this.props.active : this.state.active;
+    var triggers = [];
+    var drawers = [];
+    this.props.drawers.forEach(_ref2 => {
+      var {
+        id: drawerIdProps,
+        name,
+        content,
+        drawerComponent,
+        onClick,
+        href,
+        ariaLabel
+      } = _ref2,
+          rest = _objectWithoutProperties(_ref2, _excluded);
 
       // The component used for the drawer can be overridden
-      const Drawer = drawerComponent || CardDrawer;
-      const triggerId = `trigger-${this._cardId}-${drawerIdProps}`;
-      const drawerId = `drawer-${this._cardId}-${drawerIdProps}`;
-      const isActive = drawerId === active;
+      var Drawer = drawerComponent || CardDrawer;
+      var triggerId = "trigger-".concat(this._cardId, "-").concat(drawerIdProps);
+      var drawerId = "drawer-".concat(this._cardId, "-").concat(drawerIdProps);
+      var isActive = drawerId === active;
       onClick && this.addToggleFunction(drawerId, onClick);
 
       if (!content && !href) {

package/es/CardFooter.js

@@ -2,19 +2,22 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = () => ({
+var styles = () => ({
   fontSize: 1,
   color: 'gray.2',
   lineHeight: 1.25,
   mt: 3
 });
 
-const Footer = ({
-  className,
-  children
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, children);
+var Footer = _ref => {
+  var {
+    className,
+    children
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, children);
+};
 
 Footer.propTypes = {
   className: PropTypes.string,

package/es/CardMessages.js

@@ -2,19 +2,22 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = () => ({
+var styles = () => ({
   pt: 2
 });
 
-const CardMessages = ({
-  className,
-  messages
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, messages.map((message, index) => /*#__PURE__*/React.createElement("div", {
-  key: index,
-  role: "alert"
-}, message.content)));
+var CardMessages = _ref => {
+  var {
+    className,
+    messages
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, messages.map((message, index) => /*#__PURE__*/React.createElement("div", {
+    key: index,
+    role: "alert"
+  }, message.content)));
+};
 
 CardMessages.propTypes = {
   className: PropTypes.string,

package/es/CardPropTypes.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-const cardDrawer = PropTypes.shape({
+var cardDrawer = PropTypes.shape({
   id: PropTypes.string.isRequired,
   name: PropTypes.node.isRequired,
   content: PropTypes.any.isRequired,
@@ -12,7 +12,7 @@ const cardDrawer = PropTypes.shape({
   // closed (false).
   onClick: PropTypes.func
 });
-const cardDrawers = PropTypes.arrayOf(cardDrawer);
+var cardDrawers = PropTypes.arrayOf(cardDrawer);
 export default {
   cardDrawer,
   cardDrawers

package/es/CardSection.js

@@ -2,26 +2,32 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createStyledComponent } from '@cloudflare/style-container';
 
-const styles = ({
-  theme,
-  status
-}) => ({
-  display: 'table',
-  tableLayout: 'fixed',
-  width: '100%',
-  borderTop: `1px solid ${theme.colors.gray[7]}`,
-  borderLeft: status === 'error' ? `3px solid ${theme.colors.red[3]}` : 'initial',
-  '&:first-child': {
-    borderTop: 'initial'
-  }
-});
+var styles = _ref => {
+  var {
+    theme,
+    status
+  } = _ref;
+  return {
+    display: 'table',
+    tableLayout: 'fixed',
+    width: '100%',
+    borderTop: "1px solid ".concat(theme.colors.gray[7]),
+    borderLeft: status === 'error' ? "3px solid ".concat(theme.colors.red[3]) : 'initial',
+    '&:first-child': {
+      borderTop: 'initial'
+    }
+  };
+};
 
-const CardSection = ({
-  className,
-  children
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, children);
+var CardSection = _ref2 => {
+  var {
+    className,
+    children
+  } = _ref2;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, children);
+};
 
 CardSection.propTypes = {
   className: PropTypes.string,

package/es/CardToolbar.js

@@ -2,32 +2,38 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { createComponent, createStyledComponent } from '@cloudflare/style-container';
 
-const styles = ({
-  theme
-}) => ({
-  borderTop: `1px solid ${theme.colors.gray[7]}`,
-  '&:first-child': {
-    borderTop: 'initial'
-  },
-  '&::after': {
-    content: "''",
-    display: 'table',
-    clear: 'both'
-  }
-});
+var styles = _ref => {
+  var {
+    theme
+  } = _ref;
+  return {
+    borderTop: "1px solid ".concat(theme.colors.gray[7]),
+    '&:first-child': {
+      borderTop: 'initial'
+    },
+    '&::after': {
+      content: "''",
+      display: 'table',
+      clear: 'both'
+    }
+  };
+};
 
-const Triggers = createComponent(() => ({
+var Triggers = createComponent(() => ({
   float: 'right',
   position: 'relative'
 }), 'div');
 
-const CardToolbar = ({
-  className,
-  controls,
-  triggers
-}) => /*#__PURE__*/React.createElement("div", {
-  className: className
-}, /*#__PURE__*/React.createElement("div", null, controls), /*#__PURE__*/React.createElement(Triggers, null, triggers));
+var CardToolbar = _ref2 => {
+  var {
+    className,
+    controls,
+    triggers
+  } = _ref2;
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React.createElement("div", null, controls), /*#__PURE__*/React.createElement(Triggers, null, triggers));
+};
 
 CardToolbar.propTypes = {
   className: PropTypes.string,

package/es/CardToolbarDrawerTrigger.js

@@ -15,13 +15,14 @@ class CardToolbarDrawerTrigger extends React.Component {
   }
 
   render() {
-    const _this$props = this.props,
-          id = _this$props.id,
-          children = _this$props.children,
-          isActive = _this$props.isActive,
-          ariaControls = _this$props.ariaControls,
-          ariaExpanded = _this$props.ariaExpanded,
-          ariaLabel = _this$props.ariaLabel;
+    var {
+      id,
+      children,
+      isActive,
+      ariaControls,
+      ariaExpanded,
+      ariaLabel
+    } = this.props;
     return /*#__PURE__*/React.createElement(TextButton, {
       id: id,
       onClick: this.handleClick,

package/es/CardToolbarLink.js

@@ -2,11 +2,12 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { Link } from '@cloudflare/component-link';
 import { createComponent } from '@cloudflare/style-container';
-const CardToolbarLink = createComponent({}, ({
-  id,
-  href,
-  children
-}) => {
+var CardToolbarLink = createComponent({}, _ref => {
+  var {
+    id,
+    href,
+    children
+  } = _ref;
   return /*#__PURE__*/React.createElement(Link, {
     px: 3,
     py: 2,

package/lib/CardBlock.js

@@ -1,6 +1,6 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -19,17 +19,21 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
-function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
 var styles = function styles(_ref) {
   var theme = _ref.theme;
@@ -45,10 +49,12 @@ var styles = function styles(_ref) {
 var CardBlock = /*#__PURE__*/function (_React$Component) {
   _inherits(CardBlock, _React$Component);
 
+  var _super = _createSuper(CardBlock);
+
   function CardBlock() {
     _classCallCheck(this, CardBlock);
 
-    return _possibleConstructorReturn(this, _getPrototypeOf(CardBlock).apply(this, arguments));
+    return _super.apply(this, arguments);
   }
 
   _createClass(CardBlock, [{