@terraware/web-components 4.2.26-rc.0 → 4.3.0

package/components/ErrorBox/ErrorBox.js

@@ -1,11 +1,12 @@
-import React from 'react';
+import 'react';
 import { Box } from '@mui/material';
-import useDeviceInfo from '../../utils/useDeviceInfo';
-import Button from '../Button/Button';
-import Icon from '../Icon/Icon';
+import useDeviceInfo from '../../utils/useDeviceInfo.js';
+import Button from '../Button/Button.js';
+import Icon from '../Icon/Icon.js';
 import './styles.scss';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function ErrorBox(props) {
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function ErrorBox(props) {
   const {
     text,
     onClick,
@@ -17,27 +18,27 @@ export default function ErrorBox(props) {
   const {
     isMobile
   } = useDeviceInfo();
-  return /*#__PURE__*/_jsxs(Box, {
+  return /*#__PURE__*/jsxs(Box, {
     className: `error-box ${className} ${isMobile ? 'mobile' : ''}`,
     sx: sx,
-    children: [/*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/jsxs("div", {
       className: "error-box--container",
-      children: [/*#__PURE__*/_jsx(Icon, {
+      children: [/*#__PURE__*/jsx(Icon, {
         name: "error",
         className: "error-icon",
         size: "large"
-      }), /*#__PURE__*/_jsxs("div", {
-        children: [title && /*#__PURE__*/_jsx("h1", {
+      }), /*#__PURE__*/jsxs("div", {
+        children: [title && /*#__PURE__*/jsx("h1", {
           className: "error-title",
           children: title
-        }), /*#__PURE__*/_jsx("p", {
+        }), /*#__PURE__*/jsx("p", {
           className: "error-text",
           children: text
         })]
       })]
-    }), buttonText && onClick && /*#__PURE__*/_jsx("div", {
+    }), buttonText && onClick && /*#__PURE__*/jsx("div", {
       className: "button-container",
-      children: /*#__PURE__*/_jsx(Button, {
+      children: /*#__PURE__*/jsx(Button, {
         label: buttonText,
         priority: "secondary",
         type: "passive",
@@ -45,4 +46,6 @@ export default function ErrorBox(props) {
       })
     })]
   });
-}
+}
+
+export { ErrorBox as default };

package/components/FileChooser/index.js

@@ -1,10 +1,13 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { Box, Link, Typography, useTheme } from '@mui/material';
-import { useDeviceInfo } from '../../utils';
-import Button from '../Button/Button';
-import Icon from '../Icon/Icon';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export default function FileChooser(props) {
+import { useRef, useState, useEffect } from 'react';
+import { useTheme, Box, Typography, Link } from '@mui/material';
+import 'lodash';
+import 'luxon';
+import useDeviceInfo from '../../utils/useDeviceInfo.js';
+import Button from '../Button/Button.js';
+import Icon from '../Icon/Icon.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function FileChooser(props) {
   const {
     acceptFileType,
     chooseFileText,
@@ -62,7 +65,7 @@ export default function FileChooser(props) {
       addFiles(event.currentTarget.files);
     }
   };
-  return /*#__PURE__*/_jsxs(Box, {
+  return /*#__PURE__*/jsxs(Box, {
     onDrop: dropHandler,
     onDragOver: enableDropping,
     border: `1px dashed ${theme.palette.TwClrBrdrTertiary}`,
@@ -74,26 +77,26 @@ export default function FileChooser(props) {
     sx: {
       background: theme.palette.TwClrBg
     },
-    children: [iconName && /*#__PURE__*/_jsx(Icon, {
+    children: [iconName && /*#__PURE__*/jsx(Icon, {
       name: iconName,
       size: "xlarge",
       style: {
         height: '120px',
         width: '120px'
       }
-    }), /*#__PURE__*/_jsx(Typography, {
+    }), /*#__PURE__*/jsx(Typography, {
       color: theme.palette.TwClrTxt,
       fontSize: 14,
       fontWeight: 600,
       margin: theme.spacing(0, 0, 1),
       children: !editing && ((files || []).length > 0 && !multipleSelection ? files?.[0].name : uploadText)
-    }), /*#__PURE__*/_jsx(Typography, {
+    }), /*#__PURE__*/jsx(Typography, {
       color: theme.palette.TwClrTxt,
       fontSize: 12,
       fontWeight: 400,
       margin: 0,
       children: (editing || (files || []).length > 0) && !multipleSelection ? fileSelectedText : isMobile && uploadMobileDescription ? uploadMobileDescription : uploadDescription
-    }), /*#__PURE__*/_jsx("input", {
+    }), /*#__PURE__*/jsx("input", {
       type: "file",
       ref: inputRef,
       onChange: onFileChosen,
@@ -103,7 +106,7 @@ export default function FileChooser(props) {
       style: {
         display: 'none'
       }
-    }), /*#__PURE__*/_jsx(Button, {
+    }), /*#__PURE__*/jsx(Button, {
       onClick: onChooseFileHandler,
       disabled: maxFiles !== undefined ? (files || []).length >= maxFiles : false,
       label: !multipleSelection && ((files || []).length === 1 || editing) ? replaceFileText : chooseFileText,
@@ -112,7 +115,7 @@ export default function FileChooser(props) {
       sx: {
         marginTop: theme.spacing(3)
       }
-    }), template && /*#__PURE__*/_jsx(Link, {
+    }), template && /*#__PURE__*/jsx(Link, {
       href: template.url,
       target: "_blank",
       sx: {
@@ -130,4 +133,6 @@ export default function FileChooser(props) {
       children: template.text
     })]
   });
-}
+}
+
+export { FileChooser as default };

package/components/FormBottomBar/index.js

@@ -1,10 +1,11 @@
-import React from 'react';
-import { AppBar, Box, useTheme } from '@mui/material';
-import useDeviceInfo from '../../utils/useDeviceInfo';
-import Button from '../Button/Button';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import 'react';
+import { useTheme, AppBar, Box } from '@mui/material';
+import useDeviceInfo from '../../utils/useDeviceInfo.js';
+import Button from '../Button/Button.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
 const defaultDesktopOffset = '200px';
-export default function FormBottomBar({
+function FormBottomBar({
   cancelID,
   saveID,
   onCancel,
@@ -20,7 +21,7 @@ export default function FormBottomBar({
     isDesktop
   } = useDeviceInfo();
   const theme = useTheme();
-  return /*#__PURE__*/_jsxs(AppBar, {
+  return /*#__PURE__*/jsxs(AppBar, {
     position: "fixed",
     color: "primary",
     style: {
@@ -42,7 +43,7 @@ export default function FormBottomBar({
       width: isDesktop ? `calc(100% - ${desktopOffset || defaultDesktopOffset})` : '100%',
       zIndex: 1000
     },
-    children: [/*#__PURE__*/_jsx(Button, {
+    children: [/*#__PURE__*/jsx(Button, {
       id: cancelID || 'cancelBottomBar',
       size: "medium",
       label: cancelButtonText,
@@ -53,12 +54,12 @@ export default function FormBottomBar({
         marginTop: isMobile ? theme.spacing(1) : 'auto',
         marginRight: theme.spacing(1)
       }
-    }), /*#__PURE__*/_jsxs(Box, {
+    }), /*#__PURE__*/jsxs(Box, {
       sx: {
         display: 'flex',
         flexDirection: isMobile ? 'column-reverse' : 'row'
       },
-      children: [additionalRightButtons && additionalRightButtons.map(btn => /*#__PURE__*/_jsx(Button, {
+      children: [additionalRightButtons && additionalRightButtons.map(btn => /*#__PURE__*/jsx(Button, {
         id: btn.id,
         priority: btn.buttonPriority,
         type: btn.buttonType,
@@ -69,7 +70,7 @@ export default function FormBottomBar({
         style: {
           marginTop: isMobile ? theme.spacing(1) : 'auto'
         }
-      }, btn.id)), /*#__PURE__*/_jsx(Button, {
+      }, btn.id)), /*#__PURE__*/jsx(Button, {
         id: saveID || 'saveBottomBar',
         size: "medium",
         label: saveButtonText,
@@ -81,4 +82,6 @@ export default function FormBottomBar({
       })]
     })]
   });
-}
+}
+
+export { FormBottomBar as default };

package/components/Icon/Icon.js

@@ -1,8 +1,9 @@
-import React from 'react';
-import icons from './icons';
+import 'react';
+import icons from './icons/index.js';
 import './styles.scss';
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function Icon({
+import { jsx } from 'react/jsx-runtime';
+
+function Icon({
   size = 'small',
   name,
   className,
@@ -10,9 +11,11 @@ export default function Icon({
   style
 }) {
   const SVGComponent = icons[name];
-  return /*#__PURE__*/_jsx(SVGComponent, {
+  return /*#__PURE__*/jsx(SVGComponent, {
     className: `tw-icon tw-icon--${size} ${className ?? ''}`,
     fill: fillColor,
     style: style
   });
-}
+}
+
+export { Icon as default };