@mycause/ui 1.2.6 → 1.2.7

package/donation/esm/components/icon/icon-button-group.js

@@ -0,0 +1,38 @@
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+import { useTheme } from '../../theme/theme.js';
+
+function IconButtonGroup(_ref) {
+  let {
+    children,
+    size,
+    isOutlinedOnFocus
+  } = _ref;
+  const theme = useTheme();
+  children = React.Children.map(children, child => /*#__PURE__*/React.cloneElement(child, {
+    size
+  }));
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "3389486541",
+      dynamic: [theme.color.foreground.primary]
+    }, ".icon-button-group.icon-button-group--outline-on-focus.__jsx-style-dynamic-selector:focus-within.__jsx-style-dynamic-selector::after{border-color:".concat(theme.color.foreground.primary, ";border-radius:4px;}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24tYnV0dG9uLWdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQjJCLEFBR2lELDBDQUN4QixrQkFDcEIiLCJmaWxlIjoiaWNvbi1idXR0b24tZ3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IGNsYXNzbmFtZXMgZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCB7IHVzZVRoZW1lIH0gZnJvbSBcIi4uLy4uL3RoZW1lL3RoZW1lXCI7XG5pbXBvcnQgY3NzIGZyb20gXCJzdHlsZWQtanN4L2Nzc1wiO1xuXG5pbnRlcmZhY2UgSWNvbkJ1dHRvbkdyb3VwUHJvcHMge1xuICBjaGlsZHJlbjogQXJyYXk8UmVhY3QuUmVhY3RFbGVtZW50PiB8IFJlYWN0LlJlYWN0RWxlbWVudDtcbiAgc2l6ZT86IHN0cmluZztcbiAgaXNPdXRsaW5lZE9uRm9jdXM/OiBib29sZWFuO1xufVxuXG5mdW5jdGlvbiBJY29uQnV0dG9uR3JvdXAoe1xuICBjaGlsZHJlbixcbiAgc2l6ZSxcbiAgaXNPdXRsaW5lZE9uRm9jdXMsXG59OiBJY29uQnV0dG9uR3JvdXBQcm9wcykge1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG5cbiAgY2hpbGRyZW4gPSBSZWFjdC5DaGlsZHJlbi5tYXAoY2hpbGRyZW4sIChjaGlsZDogUmVhY3QuUmVhY3RFbGVtZW50KSA9PlxuICAgIFJlYWN0LmNsb25lRWxlbWVudChjaGlsZCwgeyBzaXplIH0pXG4gICk7XG5cbiAgY29uc3Qgc2NvcGUgPSBjc3MucmVzb2x2ZWBcbiAgICAuaWNvbi1idXR0b24tZ3JvdXAuaWNvbi1idXR0b24tZ3JvdXAtLW91dGxpbmUtb24tZm9jdXM6Zm9jdXMtd2l0aGluOjphZnRlciB7XG4gICAgICBib3JkZXItY29sb3I6ICR7dGhlbWUuY29sb3IuZm9yZWdyb3VuZC5wcmltYXJ5fTtcbiAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgICB9XG4gIGA7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjbGFzc05hbWU9e2NsYXNzbmFtZXMoXG4gICAgICAgIFwiaWNvbi1idXR0b24tZ3JvdXBcIixcbiAgICAgICAge1xuICAgICAgICAgIFwiaWNvbi1idXR0b24tZ3JvdXAtLW91dGxpbmUtb24tZm9jdXNcIjogISFpc091dGxpbmVkT25Gb2N1cyxcbiAgICAgICAgfSxcbiAgICAgICAgc2NvcGUuY2xhc3NOYW1lXG4gICAgICApfVxuICAgID5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICAgIDxzdHlsZSBqc3g+e2BcbiAgICAgICAgLmljb24tYnV0dG9uLWdyb3VwIHtcbiAgICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICAgICAgICB9XG5cbiAgICAgICAgLmljb24tYnV0dG9uLWdyb3VwOjphZnRlciB7XG4gICAgICAgICAgY29udGVudDogXCJcIjtcbiAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgdG9wOiAwO1xuICAgICAgICAgIHJpZ2h0OiAwO1xuICAgICAgICAgIGJvdHRvbTogMDtcbiAgICAgICAgICBsZWZ0OiAwO1xuICAgICAgICAgIGJvcmRlcjogMXB4IHNvbGlkICM5ZTllOWU7XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogNHB4O1xuICAgICAgICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgICAgICB9XG5cbiAgICAgICAgLmljb24tYnV0dG9uLWdyb3VwOmhvdmVyOjphZnRlciB7XG4gICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgcmdiYSgwLCAwLCAwLCAwLjg3KTtcbiAgICAgICAgfVxuXG4gICAgICAgIC5pY29uLWJ1dHRvbi1ncm91cC5pY29uLWJ1dHRvbi1ncm91cC0tb3V0bGluZS1vbi1mb2N1czpmb2N1cy13aXRoaW46OmFmdGVyIHtcbiAgICAgICAgICBib3JkZXItd2lkdGg6IDJweDtcbiAgICAgICAgICBib3JkZXItc3R5bGU6IHNvbGlkO1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgICAgICAgfVxuICAgICAgYH08L3N0eWxlPlxuICAgICAge3Njb3BlLnN0eWxlc31cbiAgICA8L2Rpdj5cbiAgKTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgSWNvbkJ1dHRvbkdyb3VwO1xuIl19 */\n/*@ sourceURL=icon-button-group.tsx */")),
+    className: _JSXStyle.dynamic([["3389486541", [theme.color.foreground.primary]]])
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "jsx-3856654706" + " " + (classnames("icon-button-group", {
+      "icon-button-group--outline-on-focus": !!isOutlinedOnFocus
+    }, scope.className) || "")
+  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "3856654706"
+  }, ".icon-button-group.jsx-3856654706{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}.icon-button-group.jsx-3856654706::after{content:\"\";position:absolute;display:block;top:0;right:0;bottom:0;left:0;border:1px solid #9e9e9e;border-radius:4px;pointer-events:none;}.icon-button-group.jsx-3856654706:hover.jsx-3856654706::after{border:1px solid rgba(0,0,0,0.87);}.icon-button-group.icon-button-group--outline-on-focus.jsx-3856654706:focus-within.jsx-3856654706::after{border-width:2px;border-style:solid;border-radius:4px;}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24tYnV0dG9uLWdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF3Q2tCLEFBRzZCLEFBTVAsQUFhMEIsQUFJcEIsV0FoQkMsTUFpQkMsQ0F2Qk4sV0FPQyxLQVloQixFQUtvQixPQWhCWixNQUNFLEtBZ0JWLEdBZlcsU0FDRixPQUNrQixtQkFYTixNQVlELGtCQUNFLG9CQUN0Qix5QkFiQSIsImZpbGUiOiJpY29uLWJ1dHRvbi1ncm91cC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgY2xhc3NuYW1lcyBmcm9tIFwiY2xhc3NuYW1lc1wiO1xuaW1wb3J0IHsgdXNlVGhlbWUgfSBmcm9tIFwiLi4vLi4vdGhlbWUvdGhlbWVcIjtcbmltcG9ydCBjc3MgZnJvbSBcInN0eWxlZC1qc3gvY3NzXCI7XG5cbmludGVyZmFjZSBJY29uQnV0dG9uR3JvdXBQcm9wcyB7XG4gIGNoaWxkcmVuOiBBcnJheTxSZWFjdC5SZWFjdEVsZW1lbnQ+IHwgUmVhY3QuUmVhY3RFbGVtZW50O1xuICBzaXplPzogc3RyaW5nO1xuICBpc091dGxpbmVkT25Gb2N1cz86IGJvb2xlYW47XG59XG5cbmZ1bmN0aW9uIEljb25CdXR0b25Hcm91cCh7XG4gIGNoaWxkcmVuLFxuICBzaXplLFxuICBpc091dGxpbmVkT25Gb2N1cyxcbn06IEljb25CdXR0b25Hcm91cFByb3BzKSB7XG4gIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKTtcblxuICBjaGlsZHJlbiA9IFJlYWN0LkNoaWxkcmVuLm1hcChjaGlsZHJlbiwgKGNoaWxkOiBSZWFjdC5SZWFjdEVsZW1lbnQpID0+XG4gICAgUmVhY3QuY2xvbmVFbGVtZW50KGNoaWxkLCB7IHNpemUgfSlcbiAgKTtcblxuICBjb25zdCBzY29wZSA9IGNzcy5yZXNvbHZlYFxuICAgIC5pY29uLWJ1dHRvbi1ncm91cC5pY29uLWJ1dHRvbi1ncm91cC0tb3V0bGluZS1vbi1mb2N1czpmb2N1cy13aXRoaW46OmFmdGVyIHtcbiAgICAgIGJvcmRlci1jb2xvcjogJHt0aGVtZS5jb2xvci5mb3JlZ3JvdW5kLnByaW1hcnl9O1xuICAgICAgYm9yZGVyLXJhZGl1czogNHB4O1xuICAgIH1cbiAgYDtcblxuICByZXR1cm4gKFxuICAgIDxkaXZcbiAgICAgIGNsYXNzTmFtZT17Y2xhc3NuYW1lcyhcbiAgICAgICAgXCJpY29uLWJ1dHRvbi1ncm91cFwiLFxuICAgICAgICB7XG4gICAgICAgICAgXCJpY29uLWJ1dHRvbi1ncm91cC0tb3V0bGluZS1vbi1mb2N1c1wiOiAhIWlzT3V0bGluZWRPbkZvY3VzLFxuICAgICAgICB9LFxuICAgICAgICBzY29wZS5jbGFzc05hbWVcbiAgICAgICl9XG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgICAgPHN0eWxlIGpzeD57YFxuICAgICAgICAuaWNvbi1idXR0b24tZ3JvdXAge1xuICAgICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XG4gICAgICAgIH1cblxuICAgICAgICAuaWNvbi1idXR0b24tZ3JvdXA6OmFmdGVyIHtcbiAgICAgICAgICBjb250ZW50OiBcIlwiO1xuICAgICAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgICAgICBkaXNwbGF5OiBibG9jaztcbiAgICAgICAgICB0b3A6IDA7XG4gICAgICAgICAgcmlnaHQ6IDA7XG4gICAgICAgICAgYm90dG9tOiAwO1xuICAgICAgICAgIGxlZnQ6IDA7XG4gICAgICAgICAgYm9yZGVyOiAxcHggc29saWQgIzllOWU5ZTtcbiAgICAgICAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgICAgICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gICAgICAgIH1cblxuICAgICAgICAuaWNvbi1idXR0b24tZ3JvdXA6aG92ZXI6OmFmdGVyIHtcbiAgICAgICAgICBib3JkZXI6IDFweCBzb2xpZCByZ2JhKDAsIDAsIDAsIDAuODcpO1xuICAgICAgICB9XG5cbiAgICAgICAgLmljb24tYnV0dG9uLWdyb3VwLmljb24tYnV0dG9uLWdyb3VwLS1vdXRsaW5lLW9uLWZvY3VzOmZvY3VzLXdpdGhpbjo6YWZ0ZXIge1xuICAgICAgICAgIGJvcmRlci13aWR0aDogMnB4O1xuICAgICAgICAgIGJvcmRlci1zdHlsZTogc29saWQ7XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogNHB4O1xuICAgICAgICB9XG4gICAgICBgfTwvc3R5bGU+XG4gICAgICB7c2NvcGUuc3R5bGVzfVxuICAgIDwvZGl2PlxuICApO1xufVxuXG5leHBvcnQgZGVmYXVsdCBJY29uQnV0dG9uR3JvdXA7XG4iXX0= */\n/*@ sourceURL=icon-button-group.tsx */"), scope.styles);
+}
+IconButtonGroup.propTypes = {
+  children: _pt.oneOfType([_pt.any, _pt.element]).isRequired,
+  size: _pt.string,
+  isOutlinedOnFocus: _pt.bool
+};
+
+export { IconButtonGroup as default };

package/donation/esm/components/icon/icon-button.js

@@ -0,0 +1,52 @@
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _JSXStyle from 'styled-jsx/style';
+import React, { forwardRef, useState } from 'react';
+import classnames from 'classnames';
+import MDCIconButton from '@material/react-icon-button';
+import omit from 'lodash/omit';
+import { tapEvent } from '../../utils/tap-event.js';
+
+const _excluded = ["children", "size", "className", "pressed", "onBlur"];
+const IconButton = /*#__PURE__*/forwardRef(function IconButton(_ref, ref) {
+  let {
+      children,
+      size,
+      className,
+      pressed,
+      onBlur
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const [count, update] = useState(0);
+
+  // Handle blur to force a remount by changing key
+  const handleBlur = tapEvent(() => {
+    if (typeof pressed === "undefined") {
+      update(c => c + 1);
+    }
+  }, onBlur);
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "3629729252",
+      dynamic: [size || "", size || ""]
+    }, ".mdc-icon-button.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;}.toggle.__jsx-style-dynamic-selector{-webkit-transition:background-color 200ms ease;transition:background-color 200ms ease;}.toggle--active.__jsx-style-dynamic-selector{background-color:rgba(0,0,0,0.1);border-radius:4px;}.size.__jsx-style-dynamic-selector{width:".concat(size || "", ";height:").concat(size || "", ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24tYnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQzJCLEFBRzJCLEFBTW1CLEFBSUgsQUFLRCxpQ0FKakIsRUFLa0IsZ0JBSnRDLG9CQUtBLGVBVkEsZ0JBTnFCLDZGQUNJLG1HQUN6QiIsImZpbGUiOiJpY29uLWJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgZm9yd2FyZFJlZiwgdXNlU3RhdGUgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBjc3MgZnJvbSBcInN0eWxlZC1qc3gvY3NzXCI7XG5pbXBvcnQgY2xhc3NuYW1lcyBmcm9tIFwiY2xhc3NuYW1lc1wiO1xuaW1wb3J0IE1EQ0ljb25CdXR0b24sIHtcbiAgSWNvbkJ1dHRvblByb3BzIGFzIE1EQ0ljb25CdXR0b25Qcm9wcyxcbn0gZnJvbSBcIkBtYXRlcmlhbC9yZWFjdC1pY29uLWJ1dHRvblwiO1xuaW1wb3J0IG9taXQgZnJvbSBcImxvZGFzaC9vbWl0XCI7XG5pbXBvcnQgeyB0YXBFdmVudCB9IGZyb20gXCIuLi8uLi91dGlscy90YXAtZXZlbnRcIjtcbmltcG9ydCB7IEljb25Qcm9wcyB9IGZyb20gXCIuL2ljb25cIjtcblxuZXhwb3J0IHR5cGUgSWNvbkJ1dHRvblR5cGVzID0gSFRNTEJ1dHRvbkVsZW1lbnQgfCBIVE1MQW5jaG9yRWxlbWVudDtcblxuZXhwb3J0IGludGVyZmFjZSBJY29uQnV0dG9uUHJvcHNcbiAgZXh0ZW5kcyBPbWl0PE1EQ0ljb25CdXR0b25Qcm9wczxJY29uQnV0dG9uVHlwZXM+LCBcInJlZlwiIHwgXCJzaXplXCI+IHtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0RWxlbWVudDxJY29uUHJvcHM+O1xuICBwcmVzc2VkPzogYm9vbGVhbjtcbiAgc2l6ZT86IHN0cmluZztcbn1cblxuY29uc3QgSWNvbkJ1dHRvbiA9IGZvcndhcmRSZWYoZnVuY3Rpb24gSWNvbkJ1dHRvbihcbiAgeyBjaGlsZHJlbiwgc2l6ZSwgY2xhc3NOYW1lLCBwcmVzc2VkLCBvbkJsdXIsIC4uLnJlc3QgfTogSWNvbkJ1dHRvblByb3BzLFxuICByZWY6IFJlYWN0LlJlZjxJY29uQnV0dG9uVHlwZXM+XG4pIHtcbiAgY29uc3QgW2NvdW50LCB1cGRhdGVdID0gdXNlU3RhdGU8bnVtYmVyPigwKTtcblxuICAvLyBIYW5kbGUgYmx1ciB0byBmb3JjZSBhIHJlbW91bnQgYnkgY2hhbmdpbmcga2V5XG4gIGNvbnN0IGhhbmRsZUJsdXIgPSB0YXBFdmVudDxSZWFjdC5Gb2N1c0V2ZW50PEljb25CdXR0b25UeXBlcz4+KCgpID0+IHtcbiAgICBpZiAodHlwZW9mIHByZXNzZWQgPT09IFwidW5kZWZpbmVkXCIpIHtcbiAgICAgIHVwZGF0ZShjID0+IGMgKyAxKTtcbiAgICB9XG4gIH0sIG9uQmx1cik7XG5cbiAgY29uc3Qgc2NvcGUgPSBjc3MucmVzb2x2ZWBcbiAgICAubWRjLWljb24tYnV0dG9uIHtcbiAgICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIH1cblxuICAgIC50b2dnbGUge1xuICAgICAgdHJhbnNpdGlvbjogYmFja2dyb3VuZC1jb2xvciAyMDBtcyBlYXNlO1xuICAgIH1cblxuICAgIC50b2dnbGUtLWFjdGl2ZSB7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiByZ2JhKDAsIDAsIDAsIDAuMSk7XG4gICAgICBib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgfVxuXG4gICAgLnNpemUge1xuICAgICAgd2lkdGg6ICR7c2l6ZSB8fCBcIlwifTtcbiAgICAgIGhlaWdodDogJHtzaXplIHx8IFwiXCJ9O1xuICAgIH1cbiAgYDtcblxuICAvLyBSZW1vdmUgdW5zdXBwb3J0ZWQgcHJvcHMgbGlrZSBvblBvaW50ZXJFbnRlckNhcHR1cmUgYW5kIG9uUG9pbnRlckxlYXZlQ2FwdHVyZVxuICBjb25zdCBmaWx0ZXJlZFByb3BzID0gb21pdChcbiAgICB7XG4gICAgICBjbGFzc05hbWU6IGNsYXNzbmFtZXMoY2xhc3NOYW1lLCBzY29wZS5jbGFzc05hbWUsIHtcbiAgICAgICAgdG9nZ2xlOiB0eXBlb2YgcHJlc3NlZCAhPT0gXCJ1bmRlZmluZWRcIixcbiAgICAgICAgXCJ0b2dnbGUtLWFjdGl2ZVwiOiBwcmVzc2VkID09PSB0cnVlLFxuICAgICAgICBzaXplLFxuICAgICAgfSksXG4gICAgICByZWYsXG4gICAgICBvbkJsdXI6IGhhbmRsZUJsdXIsXG4gICAgICAuLi5yZXN0LCAvLyBTcHJlYWQgdGhlIHJlc3Qgb2YgdGhlIHByb3BzXG4gICAgfSxcbiAgICBbXCJvblBvaW50ZXJFbnRlckNhcHR1cmVcIiwgXCJvblBvaW50ZXJMZWF2ZUNhcHR1cmVcIl0gLy8gU3BlY2lmeSB0aGUgcHJvcHMgdG8gb21pdFxuICApO1xuXG4gIHJldHVybiAoXG4gICAgPE1EQ0ljb25CdXR0b25cbiAgICAgIGtleT17Y291bnR9XG4gICAgICB7Li4uKChmaWx0ZXJlZFByb3BzIGFzIHVua25vd24pIGFzIFJlYWN0LkNvbXBvbmVudFByb3BzPFxuICAgICAgICB0eXBlb2YgTURDSWNvbkJ1dHRvblxuICAgICAgPil9IC8vIFBhc3MgdGhlIGZpbHRlcmVkIHByb3BzXG4gICAgPlxuICAgICAge2NoaWxkcmVufVxuICAgICAge3Njb3BlLnN0eWxlc31cbiAgICA8L01EQ0ljb25CdXR0b24+XG4gICk7XG59KTtcblxuZXhwb3J0IGRlZmF1bHQgSWNvbkJ1dHRvbjtcbiJdfQ== */\n/*@ sourceURL=icon-button.tsx */")),
+    className: _JSXStyle.dynamic([["3629729252", [size || "", size || ""]]])
+  };
+
+  // Remove unsupported props like onPointerEnterCapture and onPointerLeaveCapture
+  const filteredProps = omit(_objectSpread2({
+    className: classnames(className, scope.className, {
+      toggle: typeof pressed !== "undefined",
+      "toggle--active": pressed === true,
+      size
+    }),
+    ref,
+    onBlur: handleBlur
+  }, rest), ["onPointerEnterCapture", "onPointerLeaveCapture"] // Specify the props to omit
+  );
+  return /*#__PURE__*/React.createElement(MDCIconButton, _extends({
+    key: count
+  }, filteredProps), children, scope.styles);
+});
+var IconButton$1 = IconButton;
+
+export { IconButton$1 as default };

package/donation/esm/components/icon/icon.js

@@ -0,0 +1,56 @@
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+import { useTheme, getColorToken } from '../../theme/theme.js';
+import MaterialIcon from './material-icon.js';
+
+const _excluded = ["icon", "iconSet", "color", "invert", "className", "size"];
+function Icon(_ref) {
+  let {
+      icon,
+      iconSet,
+      color = "neutral",
+      invert,
+      className,
+      size
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const theme = useTheme();
+  const foreground = getColorToken(theme, "foreground", color, {
+    invert
+  });
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "4279688611",
+      dynamic: [foreground, size, size, size]
+    }, ".icon.__jsx-style-dynamic-selector,.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon.__jsx-style-dynamic-selector{color:".concat(foreground, ";}svg.__jsx-style-dynamic-selector{width:24px;height:24px;fill:currentColor;}.icon--sized.__jsx-style-dynamic-selector{width:").concat(size, ";height:").concat(size, ";font-size:").concat(size, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCMkIsQUFLMEMsQUFJeEIsQUFNd0IsV0FMdkIsWUFDTSxZQUxwQixBQVVzQyxNQUp0Qyw4QkFLeUMsdUNBQ3pDIiwiZmlsZSI6Imljb24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IGNsYXNzbmFtZXMgZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBjc3MgZnJvbSBcInN0eWxlZC1qc3gvY3NzXCI7XG5pbXBvcnQgeyB1c2VUaGVtZSwgZ2V0Q29sb3JUb2tlbiwgQ29sb3JTcGVjaWZpZXIgfSBmcm9tIFwiLi4vLi4vdGhlbWUvdGhlbWVcIjtcbmltcG9ydCBNYXRlcmlhbEljb24sIHsgSWNvblNldCB9IGZyb20gXCIuL21hdGVyaWFsLWljb25cIjtcblxuZXhwb3J0IGludGVyZmFjZSBJY29uUHJvcHNcbiAgZXh0ZW5kcyBPbWl0PFJlYWN0LkhUTUxQcm9wczxIVE1MT3JTVkdFbGVtZW50PiwgXCJjb2xvclwiIHwgXCJzaXplXCI+IHtcbiAgaWNvbjogc3RyaW5nIHwgUmVhY3QuUmVhY3RFbGVtZW50PFJlYWN0LkhUTUxQcm9wczxIVE1MT3JTVkdFbGVtZW50Pj47XG4gIGljb25TZXQ/OiBJY29uU2V0O1xuICBjb2xvcj86IENvbG9yU3BlY2lmaWVyO1xuICBpbnZlcnQ/OiBib29sZWFuO1xuICBzaXplPzogc3RyaW5nO1xufVxuXG5mdW5jdGlvbiBJY29uKHtcbiAgaWNvbixcbiAgaWNvblNldCxcbiAgY29sb3IgPSBcIm5ldXRyYWxcIixcbiAgaW52ZXJ0LFxuICBjbGFzc05hbWUsXG4gIHNpemUsXG4gIC4uLnJlc3Rcbn06IEljb25Qcm9wcykge1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG4gIGNvbnN0IGZvcmVncm91bmQgPSBnZXRDb2xvclRva2VuKHRoZW1lLCBcImZvcmVncm91bmRcIiwgY29sb3IsIHsgaW52ZXJ0IH0pO1xuXG4gIGNvbnN0IHNjb3BlID0gY3NzLnJlc29sdmVgXG4gICAgLmljb24sXG4gICAgOmdsb2JhbCgubWRjLXRleHQtZmllbGQpOm5vdCgubWRjLXRleHQtZmllbGQtLWRpc2FibGVkKVxuICAgICAgLm1kYy10ZXh0LWZpZWxkX19pY29uIHtcbiAgICAgIGNvbG9yOiAke2ZvcmVncm91bmR9O1xuICAgIH1cblxuICAgIHN2ZyB7XG4gICAgICB3aWR0aDogMjRweDtcbiAgICAgIGhlaWdodDogMjRweDtcbiAgICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICB9XG5cbiAgICAuaWNvbi0tc2l6ZWQge1xuICAgICAgd2lkdGg6ICR7c2l6ZX07XG4gICAgICBoZWlnaHQ6ICR7c2l6ZX07XG4gICAgICBmb250LXNpemU6ICR7c2l6ZX07XG4gICAgfVxuICBgO1xuXG4gIGNvbnN0IHByb3BzID0ge1xuICAgIGNsYXNzTmFtZTogY2xhc3NuYW1lcyhcImljb25cIiwgY2xhc3NOYW1lLCBzY29wZS5jbGFzc05hbWUsIHtcbiAgICAgIHNpemVkOiAhIXNpemUsXG4gICAgfSksXG4gICAgLi4ucmVzdCxcbiAgfTtcblxuICBpZiAodHlwZW9mIGljb24gPT09IFwic3RyaW5nXCIpIHtcbiAgICByZXR1cm4gKFxuICAgICAgPD5cbiAgICAgICAgPE1hdGVyaWFsSWNvblxuICAgICAgICAgIGljb249e2ljb24gYXMgc3RyaW5nfVxuICAgICAgICAgIGljb25TZXQ9e2ljb25TZXR9XG4gICAgICAgICAgc2l6ZT17c2l6ZX1cbiAgICAgICAgICB7Li4ucHJvcHN9XG4gICAgICAgIC8+XG4gICAgICAgIHtzY29wZS5zdHlsZXN9XG4gICAgICA8Lz5cbiAgICApO1xuICB9XG5cbiAgY29uc3QgZWxlbSA9IGljb24gYXMgUmVhY3QuUmVhY3RFbGVtZW50O1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIHtSZWFjdC5jbG9uZUVsZW1lbnQoZWxlbSwge1xuICAgICAgICAuLi5wcm9wcyxcbiAgICAgICAgY2xhc3NOYW1lOiBjbGFzc25hbWVzKFxuICAgICAgICAgIGVsZW0ucHJvcHMuY2xhc3NOYW1lLFxuICAgICAgICAgIHByb3BzLmNsYXNzTmFtZSxcbiAgICAgICAgICBcInN2Zy1pY29uXCJcbiAgICAgICAgKSxcbiAgICAgIH0pfVxuICAgICAge3Njb3BlLnN0eWxlc31cbiAgICA8Lz5cbiAgKTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgSWNvbjtcbiJdfQ== */\n/*@ sourceURL=icon.tsx */")),
+    className: _JSXStyle.dynamic([["4279688611", [foreground, size, size, size]]])
+  };
+  const props = _objectSpread2({
+    className: classnames("icon", className, scope.className, {
+      sized: !!size
+    })
+  }, rest);
+  if (typeof icon === "string") {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MaterialIcon, _extends({
+      icon: icon,
+      iconSet: iconSet,
+      size: size
+    }, props)), scope.styles);
+  }
+  const elem = icon;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.cloneElement(elem, _objectSpread2(_objectSpread2({}, props), {}, {
+    className: classnames(elem.props.className, props.className, "svg-icon")
+  })), scope.styles);
+}
+Icon.propTypes = {
+  icon: _pt.oneOfType([_pt.string, _pt.element]).isRequired,
+  iconSet: _pt.any,
+  color: _pt.any,
+  invert: _pt.bool,
+  size: _pt.string
+};
+
+export { Icon as default };

package/donation/esm/components/icon/material-icon.js

@@ -0,0 +1,33 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+
+const _excluded = ["icon", "iconSet", "className", "size"];
+function MaterialIcon(_ref) {
+  let {
+      icon,
+      iconSet = "material-icons",
+      className,
+      size = "24px"
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "2372421414",
+      dynamic: [size]
+    }, "i.__jsx-style-dynamic-selector{font-size:".concat(size, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm1hdGVyaWFsLWljb24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9CMkIsQUFHOEMsdUNBQ3pDIiwiZmlsZSI6Im1hdGVyaWFsLWljb24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IGNsYXNzbmFtZXMgZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBjc3MgZnJvbSBcInN0eWxlZC1qc3gvY3NzXCI7XG5cbmV4cG9ydCB0eXBlIEljb25TZXQgPSBcIm1hdGVyaWFsLWljb25zXCIgfCBcIm1hdGVyaWFsLWljb25zLW91dGxpbmVkXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTWF0ZXJpYWxJY29uUHJvcHNcbiAgZXh0ZW5kcyBPbWl0PFJlYWN0LkhUTUxQcm9wczxIVE1MT3JTVkdFbGVtZW50PiwgXCJyZWZcIiB8IFwic2l6ZVwiPiB7XG4gIGljb246IHN0cmluZztcbiAgaWNvblNldD86IEljb25TZXQ7XG4gIHNpemU/OiBzdHJpbmc7XG59XG5cbmZ1bmN0aW9uIE1hdGVyaWFsSWNvbih7XG4gIGljb24sXG4gIGljb25TZXQgPSBcIm1hdGVyaWFsLWljb25zXCIsXG4gIGNsYXNzTmFtZSxcbiAgc2l6ZSA9IFwiMjRweFwiLFxuICAuLi5yZXN0XG59OiBNYXRlcmlhbEljb25Qcm9wcykge1xuICBjb25zdCBzY29wZSA9IGNzcy5yZXNvbHZlYFxuICAgIGkge1xuICAgICAgZm9udC1zaXplOiAke3NpemV9O1xuICAgIH1cbiAgYDtcblxuICByZXR1cm4gKFxuICAgIDxpIGNsYXNzTmFtZT17Y2xhc3NuYW1lcyhjbGFzc05hbWUsIGljb25TZXQsIHNjb3BlLmNsYXNzTmFtZSl9IHsuLi5yZXN0fT5cbiAgICAgIHtpY29ufVxuICAgICAge3Njb3BlLnN0eWxlc31cbiAgICA8L2k+XG4gICk7XG59XG5cbmV4cG9ydCBkZWZhdWx0IE1hdGVyaWFsSWNvbjtcbiJdfQ== */\n/*@ sourceURL=material-icon.tsx */")),
+    className: _JSXStyle.dynamic([["2372421414", [size]]])
+  };
+  return /*#__PURE__*/React.createElement("i", _extends({
+    className: classnames(className, iconSet, scope.className)
+  }, rest), icon, scope.styles);
+}
+MaterialIcon.propTypes = {
+  icon: _pt.string.isRequired,
+  iconSet: _pt.oneOf(["material-icons", "material-icons-outlined"]),
+  size: _pt.string
+};
+
+export { MaterialIcon as default };

package/donation/esm/components/layout/box.js

@@ -0,0 +1,104 @@
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+
+const _excluded = ["as", "ma", "mv", "mh", "mt", "mr", "mb", "ml", "pa", "pv", "ph", "pt", "pb", "pl", "pr", "className", "children"];
+function Box(_ref) {
+  let {
+      as = "div",
+      ma,
+      mv,
+      mh,
+      mt,
+      mr,
+      mb,
+      ml,
+      pa,
+      pv,
+      ph,
+      pt,
+      pb,
+      pl,
+      pr,
+      className,
+      children
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const margin = getSpacingStyles("margin", "m", {
+    ma,
+    mv,
+    mh,
+    mt,
+    mr,
+    mb,
+    ml
+  });
+  const padding = getSpacingStyles("padding", "p", {
+    pa,
+    pv,
+    ph,
+    pt,
+    pb,
+    pl,
+    pr
+  });
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "670825227",
+      dynamic: [margin, padding]
+    }, ".box.__jsx-style-dynamic-selector{".concat(margin, " ").concat(padding, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImJveC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0UyQixBQUtJLDBEQUFDIiwiZmlsZSI6ImJveC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgY24gZnJvbSBcImNsYXNzbmFtZXNcIjtcbmltcG9ydCBjc3MgZnJvbSBcInN0eWxlZC1qc3gvY3NzXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQm94UHJvcHMgZXh0ZW5kcyBSZWFjdC5IVE1MUHJvcHM8SFRNTEVsZW1lbnQ+IHtcbiAgYXM/OiBzdHJpbmc7XG4gIC8vIG1hcmdpbiBwcm9wc1xuICBtYT86IHN0cmluZyAvKiBhbGwgKi87XG4gIG12Pzogc3RyaW5nIC8qIHZlcnRpY2FsICovO1xuICBtaD86IHN0cmluZyAvKiBob3Jpem9udGFsICovO1xuICBtdD86IHN0cmluZyAvKiB0b3AgKi87XG4gIG1yPzogc3RyaW5nIC8qIHJpZ2h0ICovO1xuICBtYj86IHN0cmluZyAvKiBib3R0b20gKi87XG4gIG1sPzogc3RyaW5nIC8qIGxlZnQgKi87XG4gIC8vIHBhZGRpbmcgcHJvcHNcbiAgcGE/OiBzdHJpbmcgLyogYWxsICovO1xuICBwdj86IHN0cmluZyAvKiB2ZXJ0aWNhbCAqLztcbiAgcGg/OiBzdHJpbmcgLyogaG9yaXpvbnRhbCAqLztcbiAgcHQ/OiBzdHJpbmcgLyogdG9wICovO1xuICBwYj86IHN0cmluZyAvKiByaWdodCAqLztcbiAgcGw/OiBzdHJpbmcgLyogYm90dG9tICovO1xuICBwcj86IHN0cmluZyAvKiBsZWZ0ICovO1xuICBjaGlsZHJlbj86IFJlYWN0LlJlYWN0Tm9kZTtcbn1cblxuZnVuY3Rpb24gQm94KHtcbiAgYXMgPSBcImRpdlwiLFxuICBtYSxcbiAgbXYsXG4gIG1oLFxuICBtdCxcbiAgbXIsXG4gIG1iLFxuICBtbCxcbiAgcGEsXG4gIHB2LFxuICBwaCxcbiAgcHQsXG4gIHBiLFxuICBwbCxcbiAgcHIsXG4gIGNsYXNzTmFtZSxcbiAgY2hpbGRyZW4sXG4gIC4uLnJlc3Rcbn06IEJveFByb3BzKSB7XG4gIGNvbnN0IG1hcmdpbiA9IGdldFNwYWNpbmdTdHlsZXMoXCJtYXJnaW5cIiwgXCJtXCIsIHtcbiAgICBtYSxcbiAgICBtdixcbiAgICBtaCxcbiAgICBtdCxcbiAgICBtcixcbiAgICBtYixcbiAgICBtbCxcbiAgfSk7XG4gIGNvbnN0IHBhZGRpbmcgPSBnZXRTcGFjaW5nU3R5bGVzKFwicGFkZGluZ1wiLCBcInBcIiwge1xuICAgIHBhLFxuICAgIHB2LFxuICAgIHBoLFxuICAgIHB0LFxuICAgIHBiLFxuICAgIHBsLFxuICAgIHByLFxuICB9KTtcblxuICBjb25zdCBzY29wZSA9IGNzcy5yZXNvbHZlYFxuICAgIC5ib3gge1xuICAgICAgJHttYXJnaW59XG4gICAgICAke3BhZGRpbmd9XG4gICAgfVxuICBgO1xuXG4gIHJldHVybiBSZWFjdC5jcmVhdGVFbGVtZW50KFxuICAgIGFzLFxuICAgIHsgY2xhc3NOYW1lOiBjbihcImJveFwiLCBjbGFzc05hbWUsIHNjb3BlLmNsYXNzTmFtZSksIC4uLnJlc3QgfSxcbiAgICBjaGlsZHJlbixcbiAgICBzY29wZS5zdHlsZXNcbiAgKTtcbn1cblxuZXhwb3J0IGRlZmF1bHQgQm94O1xuXG5mdW5jdGlvbiBnZXRTcGFjaW5nU3R5bGVzKFxuICBhdHRyOiBzdHJpbmcsXG4gIHByZWZpeDogc3RyaW5nLFxuICBvYmo6IHsgW2tleTogc3RyaW5nXTogc3RyaW5nIHwgdW5kZWZpbmVkIH1cbik6IHN0cmluZyB7XG4gIGNvbnN0IHJlc3VsdCA9IFtdO1xuXG4gIGlmIChvYmpbcHJlZml4ICsgXCJhXCJdKSB7XG4gICAgcmVzdWx0LnB1c2goYCR7YXR0cn06ICR7b2JqW3ByZWZpeCArIFwiYVwiXX07YCk7XG4gIH1cblxuICBpZiAob2JqW3ByZWZpeCArIFwidlwiXSkge1xuICAgIHJlc3VsdC5wdXNoKGAke2F0dHJ9LXRvcDogJHtvYmpbcHJlZml4ICsgXCJ2XCJdfTtgKTtcbiAgICByZXN1bHQucHVzaChgJHthdHRyfS1ib3R0b206ICR7b2JqW3ByZWZpeCArIFwidlwiXX07YCk7XG4gIH1cblxuICBpZiAob2JqW3ByZWZpeCArIFwiaFwiXSkge1xuICAgIHJlc3VsdC5wdXNoKGAke2F0dHJ9LWxlZnQ6ICR7b2JqW3ByZWZpeCArIFwiaFwiXX07YCk7XG4gICAgcmVzdWx0LnB1c2goYCR7YXR0cn0tcmlnaHQ6ICR7b2JqW3ByZWZpeCArIFwiaFwiXX07YCk7XG4gIH1cblxuICBpZiAob2JqW3ByZWZpeCArIFwidFwiXSkge1xuICAgIHJlc3VsdC5wdXNoKGAke2F0dHJ9LXRvcDogJHtvYmpbcHJlZml4ICsgXCJ0XCJdfTtgKTtcbiAgfVxuXG4gIGlmIChvYmpbcHJlZml4ICsgXCJyXCJdKSB7XG4gICAgcmVzdWx0LnB1c2goYCR7YXR0cn0tcmlnaHQ6ICR7b2JqW3ByZWZpeCArIFwiclwiXX07YCk7XG4gIH1cblxuICBpZiAob2JqW3ByZWZpeCArIFwiYlwiXSkge1xuICAgIHJlc3VsdC5wdXNoKGAke2F0dHJ9LWJvdHRvbTogJHtvYmpbcHJlZml4ICsgXCJiXCJdfTtgKTtcbiAgfVxuXG4gIGlmIChvYmpbcHJlZml4ICsgXCJsXCJdKSB7XG4gICAgcmVzdWx0LnB1c2goYCR7YXR0cn0tbGVmdDogJHtvYmpbcHJlZml4ICsgXCJsXCJdfTtgKTtcbiAgfVxuXG4gIHJldHVybiByZXN1bHQuam9pbihcIlxcblwiKTtcbn1cbiJdfQ== */\n/*@ sourceURL=box.tsx */")),
+    className: _JSXStyle.dynamic([["670825227", [margin, padding]]])
+  };
+  return /*#__PURE__*/React.createElement(as, _objectSpread2({
+    className: classnames("box", className, scope.className)
+  }, rest), children, scope.styles);
+}
+Box.propTypes = {
+  as: _pt.string,
+  ma: _pt.string,
+  mv: _pt.string,
+  mh: _pt.string,
+  mt: _pt.string,
+  mr: _pt.string,
+  mb: _pt.string,
+  ml: _pt.string,
+  pa: _pt.string,
+  pv: _pt.string,
+  ph: _pt.string,
+  pt: _pt.string,
+  pb: _pt.string,
+  pl: _pt.string,
+  pr: _pt.string,
+  children: _pt.node
+};
+function getSpacingStyles(attr, prefix, obj) {
+  const result = [];
+  if (obj[prefix + "a"]) {
+    result.push("".concat(attr, ": ").concat(obj[prefix + "a"], ";"));
+  }
+  if (obj[prefix + "v"]) {
+    result.push("".concat(attr, "-top: ").concat(obj[prefix + "v"], ";"));
+    result.push("".concat(attr, "-bottom: ").concat(obj[prefix + "v"], ";"));
+  }
+  if (obj[prefix + "h"]) {
+    result.push("".concat(attr, "-left: ").concat(obj[prefix + "h"], ";"));
+    result.push("".concat(attr, "-right: ").concat(obj[prefix + "h"], ";"));
+  }
+  if (obj[prefix + "t"]) {
+    result.push("".concat(attr, "-top: ").concat(obj[prefix + "t"], ";"));
+  }
+  if (obj[prefix + "r"]) {
+    result.push("".concat(attr, "-right: ").concat(obj[prefix + "r"], ";"));
+  }
+  if (obj[prefix + "b"]) {
+    result.push("".concat(attr, "-bottom: ").concat(obj[prefix + "b"], ";"));
+  }
+  if (obj[prefix + "l"]) {
+    result.push("".concat(attr, "-left: ").concat(obj[prefix + "l"], ";"));
+  }
+  return result.join("\n");
+}
+
+export { Box as default };

package/donation/esm/components/layout/flex.js

@@ -0,0 +1,70 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+import Box from './box.js';
+
+const _excluded = ["direction", "justify", "align", "reverse", "wrap", "center", "className", "children"];
+function Flex(_ref) {
+  let {
+      direction = "row",
+      justify = "start",
+      align = "start",
+      reverse = false,
+      wrap = false,
+      center,
+      className,
+      children
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  if (center) {
+    justify = "center";
+    align = "center";
+  }
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "3185106814",
+      dynamic: [getFlexDirection(direction, reverse), getFlexJustifyContent(justify), getFlexAlignItems(align), getFlexWrap(wrap)]
+    }, ".flex.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:".concat(getFlexDirection(direction, reverse), ";-ms-flex-direction:").concat(getFlexDirection(direction, reverse), ";flex-direction:").concat(getFlexDirection(direction, reverse), ";-webkit-box-pack:").concat(getFlexJustifyContent(justify), ";-webkit-justify-content:").concat(getFlexJustifyContent(justify), ";-ms-flex-pack:").concat(getFlexJustifyContent(justify), ";justify-content:").concat(getFlexJustifyContent(justify), ";-webkit-align-items:").concat(getFlexAlignItems(align), ";-webkit-box-align:").concat(getFlexAlignItems(align), ";-ms-flex-align:").concat(getFlexAlignItems(align), ";align-items:").concat(getFlexAlignItems(align), ";-webkit-flex-wrap:").concat(getFlexWrap(wrap), ";-ms-flex-wrap:").concat(getFlexWrap(wrap), ";flex-wrap:").concat(getFlexWrap(wrap), ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImZsZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBDMkIsQUFHb0IsMEVBQytCLGdKQUNDLDJMQUNKLHFMQUNGLGlJQUN6QyIsImZpbGUiOiJmbGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBjbGFzc25hbWVzIGZyb20gXCJjbGFzc25hbWVzXCI7XG5pbXBvcnQgY3NzIGZyb20gXCJzdHlsZWQtanN4L2Nzc1wiO1xuaW1wb3J0IEJveCwgeyBCb3hQcm9wcyB9IGZyb20gXCIuL2JveFwiO1xuXG50eXBlIERpcmVjdGlvbiA9IFwicm93XCIgfCBcImNvbHVtblwiO1xudHlwZSBKdXN0aWZ5ID1cbiAgfCBcImNlbnRlclwiXG4gIHwgXCJzdGFydFwiXG4gIHwgXCJlbmRcIlxuICB8IFwic3BhY2UtYmV0d2VlblwiXG4gIHwgXCJzcGFjZS1hcm91bmRcIlxuICB8IFwic3BhY2UtZXZlbmx5XCJcbiAgfCBcInN0cmV0Y2hcIjtcbnR5cGUgQWxpZ24gPSBcImNlbnRlclwiIHwgXCJzdGFydFwiIHwgXCJlbmRcIiB8IFwic3RyZXRjaFwiO1xuXG5leHBvcnQgaW50ZXJmYWNlIEZsZXhQcm9wcyBleHRlbmRzIE9taXQ8Qm94UHJvcHMsIFwid3JhcFwiPiB7XG4gIGRpcmVjdGlvbj86IERpcmVjdGlvbjtcbiAganVzdGlmeT86IEp1c3RpZnk7XG4gIGFsaWduPzogQWxpZ247XG4gIHJldmVyc2U/OiBib29sZWFuO1xuICB3cmFwPzogYm9vbGVhbjtcbiAgY2VudGVyPzogYm9vbGVhbjtcbiAgY2hpbGRyZW4/OiBSZWFjdC5SZWFjdE5vZGU7XG59XG5cbmZ1bmN0aW9uIEZsZXgoe1xuICBkaXJlY3Rpb24gPSBcInJvd1wiLFxuICBqdXN0aWZ5ID0gXCJzdGFydFwiLFxuICBhbGlnbiA9IFwic3RhcnRcIixcbiAgcmV2ZXJzZSA9IGZhbHNlLFxuICB3cmFwID0gZmFsc2UsXG4gIGNlbnRlcixcbiAgY2xhc3NOYW1lLFxuICBjaGlsZHJlbixcbiAgLi4ucmVzdFxufTogRmxleFByb3BzKSB7XG4gIGlmIChjZW50ZXIpIHtcbiAgICBqdXN0aWZ5ID0gXCJjZW50ZXJcIjtcbiAgICBhbGlnbiA9IFwiY2VudGVyXCI7XG4gIH1cblxuICBjb25zdCBzY29wZSA9IGNzcy5yZXNvbHZlYFxuICAgIC5mbGV4IHtcbiAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICBmbGV4LWRpcmVjdGlvbjogJHtnZXRGbGV4RGlyZWN0aW9uKGRpcmVjdGlvbiwgcmV2ZXJzZSl9O1xuICAgICAganVzdGlmeS1jb250ZW50OiAke2dldEZsZXhKdXN0aWZ5Q29udGVudChqdXN0aWZ5KX07XG4gICAgICBhbGlnbi1pdGVtczogJHtnZXRGbGV4QWxpZ25JdGVtcyhhbGlnbil9O1xuICAgICAgZmxleC13cmFwOiAke2dldEZsZXhXcmFwKHdyYXApfTtcbiAgICB9XG4gIGA7XG5cbiAgcmV0dXJuIChcbiAgICA8Qm94IGNsYXNzTmFtZT17Y2xhc3NuYW1lcyhcImZsZXhcIiwgY2xhc3NOYW1lLCBzY29wZS5jbGFzc05hbWUpfSB7Li4ucmVzdH0+XG4gICAgICB7Y2hpbGRyZW59XG4gICAgICB7c2NvcGUuc3R5bGVzfVxuICAgIDwvQm94PlxuICApO1xufVxuXG5leHBvcnQgZGVmYXVsdCBGbGV4O1xuXG5mdW5jdGlvbiBnZXRGbGV4RGlyZWN0aW9uKGRpcmVjdGlvbjogRGlyZWN0aW9uLCByZXZlcnNlOiBib29sZWFuKSB7XG4gIHJldHVybiByZXZlcnNlID8gZGlyZWN0aW9uICsgXCItcmV2ZXJzZVwiIDogZGlyZWN0aW9uO1xufVxuXG5mdW5jdGlvbiBnZXRGbGV4SnVzdGlmeUNvbnRlbnQoanVzdGlmeTogSnVzdGlmeSkge1xuICBzd2l0Y2ggKGp1c3RpZnkpIHtcbiAgICBjYXNlIFwic3RhcnRcIjpcbiAgICBjYXNlIFwiZW5kXCI6XG4gICAgICByZXR1cm4gXCJmbGV4LVwiICsganVzdGlmeTtcbiAgICBkZWZhdWx0OlxuICAgICAgcmV0dXJuIGp1c3RpZnk7XG4gIH1cbn1cblxuZnVuY3Rpb24gZ2V0RmxleEFsaWduSXRlbXMoYWxpZ246IEFsaWduKSB7XG4gIHN3aXRjaCAoYWxpZ24pIHtcbiAgICBjYXNlIFwic3RhcnRcIjpcbiAgICBjYXNlIFwiZW5kXCI6XG4gICAgICByZXR1cm4gXCJmbGV4LVwiICsgYWxpZ247XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiBhbGlnbjtcbiAgfVxufVxuXG5mdW5jdGlvbiBnZXRGbGV4V3JhcCh3cmFwOiBib29sZWFuKSB7XG4gIHJldHVybiB3cmFwID8gXCJ3cmFwXCIgOiBcIm5vd3JhcFwiO1xufVxuIl19 */\n/*@ sourceURL=flex.tsx */")),
+    className: _JSXStyle.dynamic([["3185106814", [getFlexDirection(direction, reverse), getFlexJustifyContent(justify), getFlexAlignItems(align), getFlexWrap(wrap)]]])
+  };
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    className: classnames("flex", className, scope.className)
+  }, rest), children, scope.styles);
+}
+Flex.propTypes = {
+  direction: _pt.oneOf(["row", "column"]),
+  justify: _pt.oneOf(["center", "start", "end", "space-between", "space-around", "space-evenly", "stretch"]),
+  align: _pt.oneOf(["center", "start", "end", "stretch"]),
+  reverse: _pt.bool,
+  wrap: _pt.bool,
+  center: _pt.bool,
+  children: _pt.node
+};
+function getFlexDirection(direction, reverse) {
+  return reverse ? direction + "-reverse" : direction;
+}
+function getFlexJustifyContent(justify) {
+  switch (justify) {
+    case "start":
+    case "end":
+      return "flex-" + justify;
+    default:
+      return justify;
+  }
+}
+function getFlexAlignItems(align) {
+  switch (align) {
+    case "start":
+    case "end":
+      return "flex-" + align;
+    default:
+      return align;
+  }
+}
+function getFlexWrap(wrap) {
+  return wrap ? "wrap" : "nowrap";
+}
+
+export { Flex as default };

package/donation/esm/components/layout/grid.js

@@ -0,0 +1,35 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+import Box from './box.js';
+
+const _excluded = ["columns", "rows", "gap", "className", "children"];
+function Grid(_ref) {
+  let {
+      columns = "auto",
+      rows = "auto",
+      gap = "0",
+      className,
+      children
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "859707976",
+      dynamic: [columns, rows, gap]
+    }, ".grid.__jsx-style-dynamic-selector{display:grid;grid-template-columns:".concat(columns, ";grid-template-rows:").concat(rows, ";grid-gap:").concat(gap, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImdyaWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1CMkIsQUFHb0IsYUFDc0MsbURBQ0gsZ0RBQ1Ysc0NBQ3hDIiwiZmlsZSI6ImdyaWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IGNuIGZyb20gXCJjbGFzc25hbWVzXCI7XG5pbXBvcnQgY3NzIGZyb20gXCJzdHlsZWQtanN4L2Nzc1wiO1xuaW1wb3J0IEJveCwgeyBCb3hQcm9wcyB9IGZyb20gXCIuL2JveFwiO1xuXG5pbnRlcmZhY2UgR3JpZFByb3BzIGV4dGVuZHMgT21pdDxCb3hQcm9wcywgXCJyb3dzXCIgfCBcInJlZlwiPiB7XG4gIGNvbHVtbnM/OiBzdHJpbmc7XG4gIHJvd3M/OiBzdHJpbmc7XG4gIGdhcD86IHN0cmluZztcbn1cblxuZnVuY3Rpb24gR3JpZCh7XG4gIGNvbHVtbnMgPSBcImF1dG9cIixcbiAgcm93cyA9IFwiYXV0b1wiLFxuICBnYXAgPSBcIjBcIixcbiAgY2xhc3NOYW1lLFxuICBjaGlsZHJlbixcbiAgLi4ucmVzdFxufTogR3JpZFByb3BzKSB7XG4gIGNvbnN0IHNjb3BlID0gY3NzLnJlc29sdmVgXG4gICAgLmdyaWQge1xuICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogJHtjb2x1bW5zfTtcbiAgICAgIGdyaWQtdGVtcGxhdGUtcm93czogJHtyb3dzfTtcbiAgICAgIGdyaWQtZ2FwOiAke2dhcH07XG4gICAgfVxuICBgO1xuXG4gIHJldHVybiAoXG4gICAgPEJveCBjbGFzc05hbWU9e2NuKFwiZ3JpZFwiLCBzY29wZS5jbGFzc05hbWUsIGNsYXNzTmFtZSl9IHsuLi5yZXN0fT5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICAgIHtzY29wZS5zdHlsZXN9XG4gICAgPC9Cb3g+XG4gICk7XG59XG5cbmV4cG9ydCBkZWZhdWx0IEdyaWQ7XG4iXX0= */\n/*@ sourceURL=grid.tsx */")),
+    className: _JSXStyle.dynamic([["859707976", [columns, rows, gap]]])
+  };
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    className: classnames("grid", scope.className, className)
+  }, rest), children, scope.styles);
+}
+Grid.propTypes = {
+  columns: _pt.string,
+  rows: _pt.string,
+  gap: _pt.string
+};
+
+export { Grid as default };

package/donation/esm/components/layout/stack.js

@@ -0,0 +1,37 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import _pt from 'prop-types';
+import _JSXStyle from 'styled-jsx/style';
+import React from 'react';
+import classnames from 'classnames';
+import Flex from './flex.js';
+
+const _excluded = ["gap", "direction", "reverse", "className", "children"];
+function Stack(_ref) {
+  let {
+      gap = "1rem",
+      direction = "row",
+      reverse = false,
+      className,
+      children
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const scope = {
+    styles: /*#__PURE__*/React.createElement(_JSXStyle, {
+      id: "656990919",
+      dynamic: [gap, gap, gap, gap]
+    }, ".stack-row.__jsx-style-dynamic-selector:not(.stack-reverse)>*:not(:last-child){margin-right:".concat(gap, ";}.stack-row.stack-reverse.__jsx-style-dynamic-selector>*:not(:last-child){margin-left:").concat(gap, ";}.stack-column.__jsx-style-dynamic-selector:not(.stack-reverse)>*:not(:last-child){margin-bottom:").concat(gap, ";}.stack-column.stack-everse.__jsx-style-dynamic-selector>*:not(:last-child){margin-top:").concat(gap, ";}\n/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0YWNrLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQjJCLEFBR2lELEFBSUQsQUFJRSxBQUlILHdDQUMxQyxDQVJBLENBSkEsQ0FRQSIsImZpbGUiOiJzdGFjay50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgY2xhc3NuYW1lcyBmcm9tIFwiY2xhc3NuYW1lc1wiO1xuaW1wb3J0IEZsZXgsIHsgRmxleFByb3BzIH0gZnJvbSBcIi4vZmxleFwiO1xuaW1wb3J0IGNzcyBmcm9tIFwic3R5bGVkLWpzeC9jc3NcIjtcblxuaW50ZXJmYWNlIFN0YWNrUHJvcHMgZXh0ZW5kcyBGbGV4UHJvcHMge1xuICBob3Jpem9udGFsPzogYm9vbGVhbjtcbiAgdmVydGljYWw/OiBib29sZWFuO1xuICBnYXA/OiBzdHJpbmc7XG59XG5cbmZ1bmN0aW9uIFN0YWNrKHtcbiAgZ2FwID0gXCIxcmVtXCIsXG4gIGRpcmVjdGlvbiA9IFwicm93XCIsXG4gIHJldmVyc2UgPSBmYWxzZSxcbiAgY2xhc3NOYW1lLFxuICBjaGlsZHJlbixcbiAgLi4ucmVzdFxufTogU3RhY2tQcm9wcykge1xuICBjb25zdCBzY29wZSA9IGNzcy5yZXNvbHZlYFxuICAgIC5zdGFjay1yb3c6bm90KC5zdGFjay1yZXZlcnNlKSA+IDpnbG9iYWwoKjpub3QoOmxhc3QtY2hpbGQpKSB7XG4gICAgICBtYXJnaW4tcmlnaHQ6ICR7Z2FwfTtcbiAgICB9XG5cbiAgICAuc3RhY2stcm93LnN0YWNrLXJldmVyc2UgPiA6Z2xvYmFsKCo6bm90KDpsYXN0LWNoaWxkKSkge1xuICAgICAgbWFyZ2luLWxlZnQ6ICR7Z2FwfTtcbiAgICB9XG5cbiAgICAuc3RhY2stY29sdW1uOm5vdCguc3RhY2stcmV2ZXJzZSkgPiA6Z2xvYmFsKCo6bm90KDpsYXN0LWNoaWxkKSkge1xuICAgICAgbWFyZ2luLWJvdHRvbTogJHtnYXB9O1xuICAgIH1cblxuICAgIC5zdGFjay1jb2x1bW4uc3RhY2stZXZlcnNlID4gOmdsb2JhbCgqOm5vdCg6bGFzdC1jaGlsZCkpIHtcbiAgICAgIG1hcmdpbi10b3A6ICR7Z2FwfTtcbiAgICB9XG4gIGA7XG5cbiAgcmV0dXJuIChcbiAgICA8RmxleFxuICAgICAgY2xhc3NOYW1lPXtjbGFzc25hbWVzKFxuICAgICAgICBcInN0YWNrXCIsXG4gICAgICAgIGBzdGFjay0ke2RpcmVjdGlvbn1gLFxuICAgICAgICByZXZlcnNlICYmIFwic3RhY2stcmV2ZXJzZVwiLFxuICAgICAgICBjbGFzc05hbWUsXG4gICAgICAgIHNjb3BlLmNsYXNzTmFtZVxuICAgICAgKX1cbiAgICAgIHJldmVyc2U9e3JldmVyc2V9XG4gICAgICBkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgIHsuLi5yZXN0fVxuICAgID5cbiAgICAgIHtjaGlsZHJlbn1cbiAgICAgIHtzY29wZS5zdHlsZXN9XG4gICAgPC9GbGV4PlxuICApO1xufVxuXG5leHBvcnQgZGVmYXVsdCBTdGFjaztcbiJdfQ== */\n/*@ sourceURL=stack.tsx */")),
+    className: _JSXStyle.dynamic([["656990919", [gap, gap, gap, gap]]])
+  };
+  return /*#__PURE__*/React.createElement(Flex, _extends({
+    className: classnames("stack", "stack-".concat(direction), reverse && "stack-reverse", className, scope.className),
+    reverse: reverse,
+    direction: direction
+  }, rest), children, scope.styles);
+}
+Stack.propTypes = {
+  horizontal: _pt.bool,
+  vertical: _pt.bool,
+  gap: _pt.string
+};
+
+export { Stack as default };