@factorearth/component-library 5.1.1 → 5.1.3-alpha.0

package/dist/Molecules/Form/Form.js

@@ -1,13 +1,13 @@
 import styled from "@emotion/styled";
 import React from "react";
-export const ContentContainer = styled.div `
-	display: flex;
-	padding: 24px;
-	flex-direction: column;
-	align-items: center;
-	gap: 8px;
-	align-self: stretch;
-	background-color: ${({ colors }) => colors.background.primary};
+export const ContentContainer = styled.div `
+	display: flex;
+	padding: 24px;
+	flex-direction: column;
+	align-items: center;
+	gap: 8px;
+	align-self: stretch;
+	background-color: ${({ colors }) => colors.background.primary};
 `;
 function Form(props) {
     const { children, colors } = props;

package/dist/Molecules/NavMenu/NavMenu.js

@@ -3,121 +3,121 @@ import { keyframes } from "@emotion/react";
 import React, { useState, useMemo, useRef } from "react";
 import { FiMenu, FiCloud, FiCloudOff, FiSun, FiMoon, FiChevronRight, FiX, } from "react-icons/fi";
 import Toggle from "../../Atoms/Toggle/Toggle";
-const slideInLeft = keyframes `
- 0% {
-    transform: translateX(-100%);
-    opacity: 0;
-  }
-  100% {
-    transform: translateX(0);
-    opacity: 1;
-  }
+const slideInLeft = keyframes `
+ 0% {
+    transform: translateX(-100%);
+    opacity: 0;
+  }
+  100% {
+    transform: translateX(0);
+    opacity: 1;
+  }
 `;
-const NavMenu = styled.div `
-	display: flex;
-	flex-direction: column;
-	background: ${({ colorPalette }) => colorPalette.background.primary};
-	width: 100vw;
+const NavMenu = styled.div `
+	display: flex;
+	flex-direction: column;
+	background: ${({ colorPalette }) => colorPalette.background.primary};
+	width: 100vw;
 `;
-const NavBarHeader = styled.div `
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	height: 88px;
-	border-width: 0 0 1px 0;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.background.secondary};
+const NavBarHeader = styled.div `
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	height: 88px;
+	border-width: 0 0 1px 0;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.background.secondary};
 `;
-const OnlineStatus = styled.div `
-	display: flex;
-	padding: 8px 12px;
-	justify-content: center;
-	align-items: center;
-	gap: 8px;
-	border-radius: 32px;
-	font-weight: 700;
-	border-width: 1px;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.buttonBackground.success};
-	color: ${({ colorPalette }) => colorPalette.buttonBackground.success};
-	background: #ebfaed;
+const OnlineStatus = styled.div `
+	display: flex;
+	padding: 8px 12px;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+	border-radius: 32px;
+	font-weight: 700;
+	border-width: 1px;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.buttonBackground.success};
+	color: ${({ colorPalette }) => colorPalette.buttonBackground.success};
+	background: #ebfaed;
 `;
-const OfflineStatus = styled.div `
-	display: flex;
-	padding: 8px 12px;
-	justify-content: center;
-	align-items: center;
-	gap: 8px;
-	border-radius: 32px;
-	font-weight: 700;
-	border-width: 1px;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.utils.icon};
-	color: ${({ colorPalette }) => colorPalette.utils.icon};
+const OfflineStatus = styled.div `
+	display: flex;
+	padding: 8px 12px;
+	justify-content: center;
+	align-items: center;
+	gap: 8px;
+	border-radius: 32px;
+	font-weight: 700;
+	border-width: 1px;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.utils.icon};
+	color: ${({ colorPalette }) => colorPalette.utils.icon};
 `;
-const NavMenuDropdown = styled.div `
-	width: 320px;
-	position: absolute;
-	top: 88px;
-	z-index: 1000;
-	box-shadow: 5px 5px 5px rgba(64, 64, 64, 0.2);
-	background: ${({ colorPalette }) => colorPalette.background.primary};
-	animation: ${slideInLeft} 0.5s ease-out forwards;
-	display: ${({ navOpen }) => (navOpen ? "flex" : "none")};
-	flex-direction: column;
-	&:focus {
-		outline: none;
-	}
+const NavMenuDropdown = styled.div `
+	width: 320px;
+	position: absolute;
+	top: 88px;
+	z-index: 1000;
+	box-shadow: 5px 5px 5px rgba(64, 64, 64, 0.2);
+	background: ${({ colorPalette }) => colorPalette.background.primary};
+	animation: ${slideInLeft} 0.5s ease-out forwards;
+	display: ${({ navOpen }) => (navOpen ? "flex" : "none")};
+	flex-direction: column;
+	&:focus {
+		outline: none;
+	}
 `;
-const MenuItems = styled.div `
-	align-items: flex-start;
-	align-self: stretch;
+const MenuItems = styled.div `
+	align-items: flex-start;
+	align-self: stretch;
 `;
-const MenuItem = styled.div `
-	display: flex;
-	padding: 8px 16px;
-	align-items: center;
-	color: ${({ colorPalette }) => colorPalette.text.tertiary};
-	font-weight: 700;
-	border-width: 0 0 1px 0;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.background.secondary};
-	width: 288px;
-	cursor: pointer;
+const MenuItem = styled.div `
+	display: flex;
+	padding: 8px 16px;
+	align-items: center;
+	color: ${({ colorPalette }) => colorPalette.text.tertiary};
+	font-weight: 700;
+	border-width: 0 0 1px 0;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.background.secondary};
+	width: 288px;
+	cursor: pointer;
 `;
-const Location = styled.div `
-	display: flex;
-	align-items: center;
-	gap: 10px;
-	flex: 1 0 0;
-	font-size: 16px;
-	line-height: 150%;
+const Location = styled.div `
+	display: flex;
+	align-items: center;
+	gap: 10px;
+	flex: 1 0 0;
+	font-size: 16px;
+	line-height: 150%;
 `;
-const Toggles = styled.div `
-	padding: 24px 0px;
+const Toggles = styled.div `
+	padding: 24px 0px;
 `;
-const AppInfo = styled.div `
-	padding: 16px;
-	width: 288px;
-	background: ${({ colorPalette }) => colorPalette.background.tertiary};
+const AppInfo = styled.div `
+	padding: 16px;
+	width: 288px;
+	background: ${({ colorPalette }) => colorPalette.background.tertiary};
 `;
-const LogoAndCopyRights = styled.div `
-	display: flex;
-	gap: 16px;
-	margin-bottom: 12px;
-	color: ${({ colorPalette }) => colorPalette.text.primary};
+const LogoAndCopyRights = styled.div `
+	display: flex;
+	gap: 16px;
+	margin-bottom: 12px;
+	color: ${({ colorPalette }) => colorPalette.text.primary};
 `;
-const CopyRights = styled.div `
-	font-size: 12px;
-	font-style: normal;
-	font-weight: 400;
-	line-height: 55%;
+const CopyRights = styled.div `
+	font-size: 12px;
+	font-style: normal;
+	font-weight: 400;
+	line-height: 55%;
 `;
-const Version = styled.div `
-	text-align: center;
-	font-size: 14px;
-	font-weight: 400;
-	color: ${({ colorPalette }) => colorPalette.text.primary};
+const Version = styled.div `
+	text-align: center;
+	font-size: 14px;
+	font-weight: 400;
+	color: ${({ colorPalette }) => colorPalette.text.primary};
 `;
 const NavBar = (props) => {
     const { colorPalette, locations, appInfo } = props;

package/dist/Molecules/TableHeader/TableHeader.js

@@ -1,20 +1,20 @@
 import React from "react";
 import styled from "@emotion/styled";
 import { SortDropdown } from "../../Atoms/SortDropdown/SortDropdown";
-const HeaderCell = styled.th `
-  display: flex;
-  height: 56px;
-  padding: 0px 8px;
-  align-items: center;
-  gap: 16px;
-  align-self: stretch;
-  color: ${({ colorPalette }) => colorPalette.text.primary};
-  align-items: center;
-  min-height: 40px;
-  font-size: 16px;
-  justify-content: space-between;
-  width: 100%;
-  display: flex;
+const HeaderCell = styled.th `
+  display: flex;
+  height: 56px;
+  padding: 0px 8px;
+  align-items: center;
+  gap: 16px;
+  align-self: stretch;
+  color: ${({ colorPalette }) => colorPalette.text.primary};
+  align-items: center;
+  min-height: 40px;
+  font-size: 16px;
+  justify-content: space-between;
+  width: 100%;
+  display: flex;
 `;
 export const TableHeader = (props) => {
     const { columns, colorPalette } = props;

package/dist/Molecules/TableRow/TableRow.js

@@ -1,33 +1,33 @@
 import React from "react";
 import styled from "@emotion/styled";
-const StyledTableRow = styled.tr `
-	display: flex;
-	border-width: 1px;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.border.secondary};
-	background: $ ${({ colorPalette }) => colorPalette.background.primary};
-	border-right: none;
-	border-left: none;
-	border-top: none;
+const StyledTableRow = styled.tr `
+	display: flex;
+	border-width: 1px;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.border.secondary};
+	background: $ ${({ colorPalette }) => colorPalette.background.primary};
+	border-right: none;
+	border-left: none;
+	border-top: none;
 `;
-export const TableCell = styled.td `
-	width: 100%;
-	min-height: 50px;
-	display: flex;
-	padding: 0px 8px;
-	justify-content: flex-start;
-	align-items: center;
-	align-self: stretch;
-	justify-content: start;
-	flex: 1;
-	font-size: 16px;
-	font-weight: 400;
-	word-break: break-word;
-    white-space: normal;
-    flex-wrap: wrap;
-	:hover: {
-		background: ${({ colorPalette }) => colorPalette.background.secondary};	
-	}
+export const TableCell = styled.td `
+	width: 100%;
+	min-height: 50px;
+	display: flex;
+	padding: 0px 8px;
+	justify-content: flex-start;
+	align-items: center;
+	align-self: stretch;
+	justify-content: start;
+	flex: 1;
+	font-size: 16px;
+	font-weight: 400;
+	word-break: break-word;
+    white-space: normal;
+    flex-wrap: wrap;
+	:hover: {
+		background: ${({ colorPalette }) => colorPalette.background.secondary};	
+	}
 `;
 export const TableRow = ({ index, colorPalette, rowData, columnConfig, }) => {
     const rows = Object.entries(rowData)

package/dist/Molecules/Thumbnail/Thumbnail.js

@@ -2,55 +2,55 @@ import React, { useState, useRef, useEffect, } from "react";
 import styled from "@emotion/styled";
 import { FiTrash2, FiEye, FiEyeOff, FiSettings } from "react-icons/fi";
 import { Button } from "../../Atoms/Buttons/Button";
-const Container = styled.div `
-	display: flex;
-	flex-direction: column;
-	align-items: end;
-	justify-content: start;
-	gap: 16px;
-	flex-shrink: 0;
-	${({ showImage }) => showImage && `height: 278px; width: 200px`}
+const Container = styled.div `
+	display: flex;
+	flex-direction: column;
+	align-items: end;
+	justify-content: start;
+	gap: 16px;
+	flex-shrink: 0;
+	${({ showImage }) => showImage && `height: 278px; width: 200px`}
 `;
-const InputArea = styled.div `
-	width: 150px;
-	height: 132px;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	background-color: ${({ colors }) => colors.background.tertiary};
-	border-style: solid;
-	border-width: 1px;
-	border-color: ${({ colors }) => colors.border.primary};
-	position: relative;
-	cursor: pointer;
-	overflow: hidden;
-	border-radius: 4px;
-	padding: 24px;
+const InputArea = styled.div `
+	width: 150px;
+	height: 132px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background-color: ${({ colors }) => colors.background.tertiary};
+	border-style: solid;
+	border-width: 1px;
+	border-color: ${({ colors }) => colors.border.primary};
+	position: relative;
+	cursor: pointer;
+	overflow: hidden;
+	border-radius: 4px;
+	padding: 24px;
 `;
-const SettingsArea = styled.div `
-	width: 168px;
-	height: 148px;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	background-color: ${({ colors }) => colors.background.secondary};
-	border-style: solid;
-	border-width: 1px;
-	border-color: ${({ colors }) => colors.border.primary};
-	cursor: pointer;
-	overflow: hidden;
-	border-radius: 4px;
-	gap: 16px;
-	padding: 16px;
+const SettingsArea = styled.div `
+	width: 168px;
+	height: 148px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background-color: ${({ colors }) => colors.background.secondary};
+	border-style: solid;
+	border-width: 1px;
+	border-color: ${({ colors }) => colors.border.primary};
+	cursor: pointer;
+	overflow: hidden;
+	border-radius: 4px;
+	gap: 16px;
+	padding: 16px;
 `;
-const PreviewImage = styled.img `
-	width: 100%;
-	height: 100%;
-	object-fit: cover;
-	position: absolute;
-	top: 0;
-	left: 0;
-	z-index: 1;
+const PreviewImage = styled.img `
+	width: 100%;
+	height: 100%;
+	object-fit: cover;
+	position: absolute;
+	top: 0;
+	left: 0;
+	z-index: 1;
 `;
 export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showImage, setShowImage, fieldInstance, s3Key, signedUrl, uploadButtonText, handleRemove, changed, handleChange, }) => {
     const [selectedImage, setSelectedImage] = useState(null);
@@ -65,6 +65,7 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
     useEffect(() => {
         if (inputRef && inputRef.current?.files?.[0]) {
             const file = inputRef.current?.files?.[0];
+            console.log(`the file in the useEffect: `, file);
             if (file) {
                 const imageUrl = URL.createObjectURL(file);
                 setSelectedImage(imageUrl);
@@ -79,6 +80,7 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
     }, [signedUrl, s3Key]);
     const handleImageUpload = (event) => {
         const file = event.target.files?.[0];
+        console.log(`the file in image upload: `, file);
         if (file) {
             const imageUrl = URL.createObjectURL(file);
             setSelectedImage(imageUrl);
@@ -111,12 +113,20 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
     const handleToggleSettings = () => {
         setShowSettings(!showSettings);
     };
+    const clearInput = () => {
+        if (inputRef.current) {
+            inputRef.current.value = "";
+        }
+        if (handleRemove) {
+            handleRemove();
+        }
+    };
     return (React.createElement(Container, { colors: colorPalette, showImage: showImage, showSettings: showSettings, key: `thumbnail_${fieldInstance.id}` },
         React.createElement("div", { style: { display: "flex" } },
             React.createElement(Button, { colorPalette: colorPalette, icon: !showImage ? React.createElement(FiEye, null) : React.createElement(FiEyeOff, null), variant: "outlined", onClick: handleToggleImage, "aria-label": !showImage ? "show-image" : "hide-image" }),
             showImage && selectedImage && (React.createElement(React.Fragment, null,
                 React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiSettings, null), variant: "outlined", style: { borderColor: "transparent" }, onClick: handleToggleSettings }),
-                handleRemove && (React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiTrash2, null), variant: "destructive", onClick: handleRemove }))))),
+                React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiTrash2, null), variant: "destructive", onClick: clearInput })))),
         showImage && !showSettings && (React.createElement(InputArea, { onDrop: handleDrop, onDragOver: handleDragOver, colors: colorPalette },
             selectedImage && (React.createElement(PreviewImage, { alt: s3Key || "Uploaded Image", src: selectedImage })),
             React.createElement(Button, { colorPalette: colorPalette, label: "Browse", variant: "filled", onClick: handleBrowseClick },

package/dist/Molecules/Thumbnail/Thumbnail.js.map

@@ -1 +1 @@
-{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../lib/Molecules/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../lib/Molecules/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"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"}

package/dist/Organisms/Card/Card.js

@@ -1,41 +1,41 @@
 import React, { forwardRef } from "react";
 import styled from "@emotion/styled";
-const CardContainer = styled.div `
-	padding: 24px;
-	border-width: 0.5px;
-	border-style: solid;
-	border-color: ${({ colorPalette }) => colorPalette.border.primary};
-	border-right: none;
-	border-left: none;
+const CardContainer = styled.div `
+	padding: 24px;
+	border-width: 0.5px;
+	border-style: solid;
+	border-color: ${({ colorPalette }) => colorPalette.border.primary};
+	border-right: none;
+	border-left: none;
 `;
-const FieldsXThumbnailSection = styled.section `
-	display: flex;
-	justify-content: space-between;
-	flex-direction: row-reverse;
-	@media (max-width: 600px) {
-		flex-direction: column;
-		align-items: flex-end;
-	}
-
-	:has(div > div > button[aria-label="show-image"]) {
-		flex-direction: column;
-	}
+const FieldsXThumbnailSection = styled.section `
+	display: flex;
+	justify-content: space-between;
+	flex-direction: row-reverse;
+	@media (max-width: 600px) {
+		flex-direction: column;
+		align-items: flex-end;
+	}
+
+	:has(div > div > button[aria-label="show-image"]) {
+		flex-direction: column;
+	}
 `;
-const ThumbnailSectionFields = styled.section `
-	padding: 16px 24px 0px 0px;
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	width: 100%;
-	@media (max-width: 600px) {
-		padding: 16px 0px 0px 24px;
-	}
+const ThumbnailSectionFields = styled.section `
+	padding: 16px 24px 0px 0px;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	width: 100%;
+	@media (max-width: 600px) {
+		padding: 16px 0px 0px 24px;
+	}
 `;
-const ButtonContainer = styled.div `
-	display: flex;
-	justify-content: flex-end;
-	gap: 24px;
-	padding-top: 24px;
+const ButtonContainer = styled.div `
+	display: flex;
+	justify-content: flex-end;
+	gap: 24px;
+	padding-top: 24px;
 `;
 export const Card = forwardRef((props, ref) => {
     const { colorPalette, thumbnail, thumbnailSectionFields, remainingFields, buttons, } = props;