@terraware/web-components 2.13.1-rc.2 → 2.13.1-rc.4

package/components/Navbar/NavItem.js

@@ -1,53 +1,49 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = NavItem;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _Icon = _interopRequireDefault(require("../Icon/Icon"));
 require("./styles.scss");
 function NavItem(props) {
-  var label = props.label,
-    icon = props.icon,
-    childrenProps = props.children,
-    selected = props.selected,
-    onClick = props.onClick,
-    id = props.id,
-    isFooter = props.isFooter,
-    href = props.href;
-  var children = href ? null : childrenProps;
-  var hasChildrenSelected = (0, _react.useCallback)(function () {
+  const {
+    label,
+    icon,
+    children: childrenProps,
+    selected,
+    onClick,
+    id,
+    isFooter,
+    href
+  } = props;
+  const children = href ? null : childrenProps;
+  const hasChildrenSelected = (0, _react.useCallback)(() => {
     if (children && children.props && children.props.children) {
-      var subChildren = children.props.children;
+      const subChildren = children.props.children;
       if (Array.isArray(subChildren)) {
-        return subChildren.some(function (subChild) {
-          return subChild.props && subChild.props.selected;
-        });
+        return subChildren.some(subChild => subChild.props && subChild.props.selected);
       }
       return subChildren.props && subChildren.props.selected;
     }
     return false;
   }, [children]);
-  _react.default.useEffect(function () {
+  _react.default.useEffect(() => {
     if (hasChildrenSelected()) {
       setOpen(true);
     }
   }, [children, hasChildrenSelected, selected]);
-  var _React$useState = _react.default.useState(hasChildrenSelected()),
-    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    open = _React$useState2[0],
-    setOpen = _React$useState2[1];
-  var onClickHandler = function onClickHandler() {
+  const [open, setOpen] = _react.default.useState(hasChildrenSelected());
+  const onClickHandler = () => {
     setOpen(!open || hasChildrenSelected());
     if (onClick) {
       onClick(!open);
     }
   };
-  var customLabel = typeof label !== 'string';
+  const customLabel = typeof label !== 'string';
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "\n        ".concat(customLabel ? '' : 'nav-item', "\n        ").concat(selected ? 'nav-item--selected' : '', "\n        ").concat(hasChildrenSelected() ? 'nav-item--children-selected' : '', "\n        ").concat(isFooter ? 'nav-item--footer' : '', "\n        ").concat(children ? 'nav-item--has-children' : '', "\n      ")
   }, /*#__PURE__*/_react.default.createElement("button", {

package/components/Navbar/NavSection.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import './styles.scss';
 export interface Props {
     title?: string;

package/components/Navbar/NavSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavSection.d.ts","sourceRoot":"","sources":["../../../src/components/Navbar/NavSection.tsx"],"names":[],"mappings":"AACA,OAAO,eAAe,CAAC;AAEvB,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAS5D"}
+{"version":3,"file":"NavSection.d.ts","sourceRoot":"","sources":["../../../src/components/Navbar/NavSection.tsx"],"names":[],"mappings":";AACA,OAAO,eAAe,CAAC;AAEvB,MAAM,WAAW,KAAK;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAS5D"}

package/components/Navbar/NavSection.js

@@ -8,9 +8,10 @@ exports.default = NavSection;
 var _react = _interopRequireDefault(require("react"));
 require("./styles.scss");
 function NavSection(props) {
-  var title = props.title,
-    _props$separator = props.separator,
-    separator = _props$separator === void 0 ? true : _props$separator;
+  const {
+    title,
+    separator = true
+  } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "nav-section"
   }, separator && /*#__PURE__*/_react.default.createElement("div", {

package/components/Navbar/Navbar.js

@@ -10,39 +10,38 @@ var _react = _interopRequireDefault(require("react"));
 require("./styles.scss");
 var _Icon = _interopRequireDefault(require("../Icon/Icon"));
 var _utils = require("../../utils");
-var useStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    icon: {
-      fill: theme.palette.TwClrIcnSecondary,
-      marginRight: '16px',
-      marginBottom: '8px'
-    },
-    closeButton: {
-      background: 'none',
-      border: 'none',
-      cursor: 'pointer'
-    },
-    navBarTop: {
-      display: 'flex',
-      justifyContent: 'start'
-    }
-  };
-});
+const useStyles = (0, _styles.makeStyles)(theme => ({
+  icon: {
+    fill: theme.palette.TwClrIcnSecondary,
+    marginRight: '16px',
+    marginBottom: '8px'
+  },
+  closeButton: {
+    background: 'none',
+    border: 'none',
+    cursor: 'pointer'
+  },
+  navBarTop: {
+    display: 'flex',
+    justifyContent: 'start'
+  }
+}));
 function Navbar(props) {
-  var children = props.children,
-    setShowNavBar = props.setShowNavBar,
-    backgroundTransparent = props.backgroundTransparent;
-  var _useDeviceInfo = (0, _utils.useDeviceInfo)(),
-    isDesktop = _useDeviceInfo.isDesktop;
-  var classes = useStyles();
+  const {
+    children,
+    setShowNavBar,
+    backgroundTransparent
+  } = props;
+  const {
+    isDesktop
+  } = (0, _utils.useDeviceInfo)();
+  const classes = useStyles();
   return /*#__PURE__*/_react.default.createElement("div", {
     className: 'navbar' + (backgroundTransparent ? ' transparent' : '')
   }, !isDesktop && /*#__PURE__*/_react.default.createElement("div", {
     className: classes.navBarTop
   }, /*#__PURE__*/_react.default.createElement("button", {
-    onClick: function onClick() {
-      return setShowNavBar(false);
-    },
+    onClick: () => setShowNavBar(false),
     className: classes.closeButton
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     name: "close",

package/components/Navbar/SubNavbar.js

@@ -8,7 +8,9 @@ exports.default = SubNavbar;
 var _react = _interopRequireDefault(require("react"));
 require("./styles.scss");
 function SubNavbar(props) {
-  var children = props.children;
+  const {
+    children
+  } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "subnavbar"
   }, children);

package/components/Note.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface Props {
     children: string;
 }

package/components/Note.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../src/components/Note.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,KAAK;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAQ7D"}
+{"version":3,"file":"Note.d.ts","sourceRoot":"","sources":["../../src/components/Note.tsx"],"names":[],"mappings":";AAaA,MAAM,WAAW,KAAK;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CAQ7D"}

package/components/Note.js

@@ -8,19 +8,19 @@ exports.default = Note;
 var _material = require("@mui/material");
 var _styles = require("@mui/styles");
 var _react = _interopRequireDefault(require("react"));
-var useStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    note: {
-      borderRadius: 8,
-      backgroundColor: theme.palette.neutral[200],
-      marginBottom: theme.spacing(3),
-      padding: theme.spacing(2)
-    }
-  };
-});
+const useStyles = (0, _styles.makeStyles)(theme => ({
+  note: {
+    borderRadius: 8,
+    backgroundColor: theme.palette.neutral[200],
+    marginBottom: theme.spacing(3),
+    padding: theme.spacing(2)
+  }
+}));
 function Note(_ref) {
-  var children = _ref.children;
-  var classes = useStyles();
+  let {
+    children
+  } = _ref;
+  const classes = useStyles();
   return /*#__PURE__*/_react.default.createElement(_material.Box, {
     className: classes.note
   }, /*#__PURE__*/_react.default.createElement(_material.Typography, {

package/components/PageForm/index.js

@@ -6,50 +6,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = PageForm;
-var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/regeneratorRuntime"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _material = require("@mui/material");
-var _useDeviceInfo2 = _interopRequireDefault(require("../../utils/useDeviceInfo"));
+var _useDeviceInfo = _interopRequireDefault(require("../../utils/useDeviceInfo"));
 var _FormBottomBar = _interopRequireDefault(require("../FormBottomBar"));
 var _BusySpinner = _interopRequireDefault(require("../BusySpinner"));
-var _excluded = ["children", "className", "hideEdit", "onSave"];
 function PageForm(props) {
-  var children = props.children,
-    className = props.className,
-    hideEdit = props.hideEdit,
-    onSave = props.onSave,
-    bottomBarProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var theme = (0, _material.useTheme)();
-  var _useDeviceInfo = (0, _useDeviceInfo2.default)(),
-    isMobile = _useDeviceInfo.isMobile;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    processing = _useState2[0],
-    setProcessing = _useState2[1];
-  var handleSave = /*#__PURE__*/function () {
-    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
-      return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            setProcessing(true);
-            _context.next = 3;
-            return onSave();
-          case 3:
-            // <-- we want all onSaves to be async
-            setProcessing(false);
-          case 4:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }));
-    return function handleSave() {
-      return _ref.apply(this, arguments);
-    };
-  }();
+  const {
+    children,
+    className,
+    hideEdit,
+    onSave,
+    ...bottomBarProps
+  } = props;
+  const theme = (0, _material.useTheme)();
+  const {
+    isMobile
+  } = (0, _useDeviceInfo.default)();
+  const [processing, setProcessing] = (0, _react.useState)(false);
+  const handleSave = async () => {
+    setProcessing(true);
+    await onSave(); // <-- we want all onSaves to be async
+    setProcessing(false);
+  };
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, processing && /*#__PURE__*/_react.default.createElement(_BusySpinner.default, {
     withSkrim: true
   }), /*#__PURE__*/_react.default.createElement(_material.Box, {

package/components/PhotoChooser/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type PhotoChooserErrorType = {
     title: string;
     text: string;

package/components/PhotoChooser/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PhotoChooser/index.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAyBF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAC1C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE,qBAAqB,CAAC;IAC9B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CA6G1E"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PhotoChooser/index.tsx"],"names":[],"mappings":";AASA,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAyBF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAChC,eAAe,EAAE,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAC1C,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE,qBAAqB,CAAC;IAC9B,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,GAAG,CAAC,OAAO,CA6G1E"}

package/components/PhotoChooser/index.js

@@ -1,13 +1,11 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = PhotoChooser;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _material = require("@mui/material");
 var _styles = require("@mui/styles");
@@ -15,77 +13,68 @@ var _utils = require("../../utils");
 var _ErrorBox = _interopRequireDefault(require("../ErrorBox/ErrorBox"));
 var _Button = _interopRequireDefault(require("../Button/Button"));
 var _FileChooser = _interopRequireDefault(require("../FileChooser"));
-var useStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    removePhoto: {
-      position: 'absolute',
-      top: -10,
-      right: -10,
-      backgroundColor: theme.palette.TwClrBgDanger
-    },
-    error: {
-      width: 'auto',
-      marginBottom: theme.spacing(2),
-      '&.mobile': {
-        width: 'auto'
-      }
-    },
-    thumbnail: {
-      margin: 'auto auto',
-      objectFit: 'contain',
-      display: 'flex',
-      maxWidth: '120px',
-      maxHeight: '120px'
+const useStyles = (0, _styles.makeStyles)(theme => ({
+  removePhoto: {
+    position: 'absolute',
+    top: -10,
+    right: -10,
+    backgroundColor: theme.palette.TwClrBgDanger
+  },
+  error: {
+    width: 'auto',
+    marginBottom: theme.spacing(2),
+    '&.mobile': {
+      width: 'auto'
     }
-  };
-});
+  },
+  thumbnail: {
+    margin: 'auto auto',
+    objectFit: 'contain',
+    display: 'flex',
+    maxWidth: '120px',
+    maxHeight: '120px'
+  }
+}));
 function PhotoChooser(props) {
-  var title = props.title,
-    description = props.description,
-    onPhotosChanged = props.onPhotosChanged,
-    multipleSelection = props.multipleSelection,
-    error = props.error,
-    selectedFile = props.selectedFile,
-    uploadText = props.uploadText,
-    uploadMobileDescription = props.uploadMobileDescription,
-    uploadDescription = props.uploadDescription,
-    photoSelectedText = props.photoSelectedText,
-    chooseFileText = props.chooseFileText,
-    replaceFileText = props.replaceFileText,
-    maxPhotos = props.maxPhotos;
-  var _useDeviceInfo = (0, _utils.useDeviceInfo)(),
-    isMobile = _useDeviceInfo.isMobile;
-  var classes = useStyles();
-  var _useState = (0, _react.useState)([]),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    files = _useState2[0],
-    setFiles = _useState2[1];
-  var _useState3 = (0, _react.useState)([]),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    filesData = _useState4[0],
-    setFilesData = _useState4[1];
-  var divRef = (0, _react.useRef)(null);
-  var theme = (0, _material.useTheme)();
-  var removeFileAtIndex = function removeFileAtIndex(index) {
-    var filesList = (0, _toConsumableArray2.default)(files);
+  const {
+    title,
+    description,
+    onPhotosChanged,
+    multipleSelection,
+    error,
+    selectedFile,
+    uploadText,
+    uploadMobileDescription,
+    uploadDescription,
+    photoSelectedText,
+    chooseFileText,
+    replaceFileText,
+    maxPhotos
+  } = props;
+  const {
+    isMobile
+  } = (0, _utils.useDeviceInfo)();
+  const classes = useStyles();
+  const [files, setFiles] = (0, _react.useState)([]);
+  const [filesData, setFilesData] = (0, _react.useState)([]);
+  const divRef = (0, _react.useRef)(null);
+  const theme = (0, _material.useTheme)();
+  const removeFileAtIndex = index => {
+    const filesList = [...files];
     filesList.splice(index, 1);
     setFiles(filesList);
   };
-  var onChoosingFiles = function onChoosingFiles() {
+  const onChoosingFiles = () => {
     var _divRef$current;
     (_divRef$current = divRef.current) === null || _divRef$current === void 0 ? void 0 : _divRef$current.focus();
   };
-  (0, _react.useEffect)(function () {
-    var filesDataList = files.map(function (file) {
-      return URL.createObjectURL(file);
-    });
+  (0, _react.useEffect)(() => {
+    const filesDataList = files.map(file => URL.createObjectURL(file));
     setFilesData(filesDataList);
     onPhotosChanged(files);
-    return function () {
+    return () => {
       // we need to clean this up to avoid a memory leak
-      filesDataList.forEach(function (fileData) {
-        return URL.revokeObjectURL(fileData);
-      });
+      filesDataList.forEach(fileData => URL.revokeObjectURL(fileData));
     };
   }, [files]);
   return /*#__PURE__*/_react.default.createElement(_material.Box, {
@@ -104,11 +93,9 @@ function PhotoChooser(props) {
     fontWeight: 400,
     marginTop: theme.spacing(1),
     marginBottom: theme.spacing(2)
-  }, Array.isArray(description) ? description.map(function (txt, i) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      key: i
-    }, txt);
-  }) : description), error && /*#__PURE__*/_react.default.createElement(_ErrorBox.default, {
+  }, Array.isArray(description) ? description.map((txt, i) => /*#__PURE__*/_react.default.createElement("div", {
+    key: i
+  }, txt)) : description), error && /*#__PURE__*/_react.default.createElement(_ErrorBox.default, {
     title: error.title,
     text: error.text,
     className: classes.error
@@ -117,7 +104,7 @@ function PhotoChooser(props) {
     flexDirection: "row",
     flexWrap: "wrap",
     marginBottom: theme.spacing(2)
-  }, filesData.map(function (fileData, index) {
+  }, filesData.map((fileData, index) => {
     var _files$index;
     return /*#__PURE__*/_react.default.createElement(_material.Box, {
       key: index,
@@ -129,9 +116,7 @@ function PhotoChooser(props) {
       border: "1px solid ".concat(theme.palette.TwClrBrdrTertiary)
     }, /*#__PURE__*/_react.default.createElement(_Button.default, {
       icon: "iconTrashCan",
-      onClick: function onClick() {
-        return removeFileAtIndex(index);
-      },
+      onClick: () => removeFileAtIndex(index),
       size: "small",
       className: classes.removePhoto
     }), /*#__PURE__*/_react.default.createElement("img", {

package/components/Pill/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import './styles.scss';
 type PillProps<IdType> = {
     id: IdType;

package/components/Pill/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pill/index.tsx"],"names":[],"mappings":"AAGA,OAAO,eAAe,CAAC;AAEvB,KAAK,SAAS,CAAC,MAAM,IAAI;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CA+B1E"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Pill/index.tsx"],"names":[],"mappings":";AAGA,OAAO,eAAe,CAAC;AAEvB,KAAK,SAAS,CAAC,MAAM,IAAI;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,SAAS,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CA+B1E"}

package/components/Pill/index.js

@@ -10,18 +10,20 @@ var _react = _interopRequireDefault(require("react"));
 var _Icon = _interopRequireDefault(require("../Icon/Icon"));
 require("./styles.scss");
 function Pill(props) {
-  var id = props.id,
-    label = props.label,
-    value = props.value,
-    _onClick = props.onClick,
-    onRemove = props.onRemove,
-    className = props.className;
+  const {
+    id,
+    label,
+    value,
+    onClick,
+    onRemove,
+    className
+  } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "pill ".concat(className !== null && className !== void 0 ? className : ''),
-    onClick: function onClick(ev) {
+    onClick: ev => {
       ev.stopPropagation();
-      if (_onClick) {
-        _onClick(id);
+      if (onClick) {
+        onClick(id);
       }
     }
   }, label && /*#__PURE__*/_react.default.createElement("p", {
@@ -29,7 +31,7 @@ function Pill(props) {
   }, label, ":"), /*#__PURE__*/_react.default.createElement("p", {
     className: "value".concat(label ? '' : ' value--no-label')
   }, value), onRemove ? /*#__PURE__*/_react.default.createElement(_material.IconButton, {
-    onClick: function onClick(ev) {
+    onClick: ev => {
       ev.stopPropagation();
       onRemove(id);
     },

package/components/PillList/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import './styles.scss';
 export type PillListItem<IdType> = {
     id: IdType;

package/components/PillList/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PillList/index.tsx"],"names":[],"mappings":"AAEA,OAAO,eAAe,CAAC;AAEvB,MAAM,MAAM,YAAY,CAAC,MAAM,IAAI;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,MAAM,IAAI;IAClC,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,MAAM,EAAE,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAkBlF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PillList/index.tsx"],"names":[],"mappings":";AAEA,OAAO,eAAe,CAAC;AAEvB,MAAM,MAAM,YAAY,CAAC,MAAM,IAAI;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,MAAM,IAAI;IAClC,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,MAAM,EAAE,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,OAAO,CAkBlF"}

package/components/PillList/index.js

@@ -9,21 +9,21 @@ var _react = _interopRequireDefault(require("react"));
 var _Pill = _interopRequireDefault(require("../Pill"));
 require("./styles.scss");
 function PillList(props) {
-  var data = props.data,
-    onClick = props.onClick,
-    onRemove = props.onRemove,
-    className = props.className;
+  const {
+    data,
+    onClick,
+    onRemove,
+    className
+  } = props;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "pill-list"
-  }, data.map(function (item, index) {
-    return /*#__PURE__*/_react.default.createElement(_Pill.default, {
-      key: index,
-      id: item.id,
-      label: item.label,
-      value: item.value,
-      onClick: item.onClick || onClick,
-      onRemove: item.onRemove || onRemove,
-      className: item.className || className
-    });
-  }));
+  }, data.map((item, index) => /*#__PURE__*/_react.default.createElement(_Pill.default, {
+    key: index,
+    id: item.id,
+    label: item.label,
+    value: item.value,
+    onClick: item.onClick || onClick,
+    onRemove: item.onRemove || onRemove,
+    className: item.className || className
+  })));
 }