@sikka/hawa 0.0.12 → 0.0.15

package/src/ui/AdaptiveButton.js

@@ -1,131 +0,0 @@
-import React, { useState } from "react";
-import Button from "@mui/material/Button";
-import Tooltip from "@mui/material/Tooltip";
-import PropTypes from "prop-types";
-import { StyledTooltip } from "./StyledTooltip";
-import { getTextColor } from "../util";
-
-export const AdaptiveButton = (props) => {
-  const { showText } = props;
-
-  const [tooltip, setTooltip] = useState(false);
-  const [hovered, setHovered] = useState(false);
-  //full button
-  if (showText) {
-    return (
-      <Button
-        disableRipple
-        disabled={props.disabled}
-        aria-label={props.buttonLabel}
-        color={props.danger ? "secondary" : "primary"}
-        onClick={props.handleClick}
-        style={{
-          backgroundColor: theme.primaryColor,
-          // borderRadius: theme.borderRadius,
-          padding: theme.paddings,
-          color: getTextColor(theme.primaryColor)
-          // color: hovered
-          //   ? "#ffffff"
-          //   : props.danger
-          //   ? "#f50057"
-          //   : "var(--blue)"
-        }}
-      >
-        {props.icon}
-        {props.showText ? (
-          <span style={{ marginLeft: props.icon ? 5 : 0 }}>
-            {props.buttonLabel}
-          </span>
-        ) : null}
-      </Button>
-    );
-  } else if (props.buttonLabelOnly) {
-    return (
-      <>
-        <Tooltip
-          placement={screenSize.width > 400 ? "bottom-center" : "top-center"}
-          enterTouchDelay={100}
-          title={
-            props.hint ? (
-              props.hint
-            ) : (
-              <div>
-                <div
-                  style={{
-                    fontSize: 20,
-                    fontWeight: 800,
-                    padding: 10,
-                    paddingBottom: 5,
-                    textAlign: "center"
-                  }}
-                >
-                  {props.hintTitle}
-                </div>
-                <div
-                  style={{
-                    fontSize: 13,
-                    fontWeight: 100,
-                    padding: 10,
-                    textAlign: "center"
-                  }}
-                >
-                  {props.hintContent}
-                </div>
-              </div>
-            )
-          }
-        >
-          <Button
-            disabled={props.disabled}
-            size="small"
-            disableRipple
-            aria-label={props.buttonLabel}
-            onClick={props.handleClick}
-            color={props.danger ? "secondary" : "primary"}
-            style={{
-              padding: 10,
-              color: hovered
-                ? "#ffffff"
-                : props.danger
-                ? "#f50057"
-                : "var(--blue)"
-            }}
-          >
-            {props.buttonLabel}
-          </Button>
-        </Tooltip>
-      </>
-    );
-  } else {
-    //icon only
-    return (
-      <StyledTooltip hintTitle="Example" hintContent="More explaination here">
-        <Button
-          disabled={props.disabled}
-          size="small"
-          disableRipple
-          aria-label={props.buttonLabel}
-          onClick={props.handleClick}
-          color={props.danger ? "secondary" : "primary"}
-          style={{
-            padding: 10,
-            color: hovered
-              ? "#ffffff"
-              : props.danger
-              ? "#f50057"
-              : "var(--blue)"
-          }}
-        >
-          {props.icon}
-        </Button>
-      </StyledTooltip>
-    );
-  }
-};
-
-AdaptiveButton.propTypes = {
-  buttonLabel: PropTypes.string,
-  danger: PropTypes.bool,
-  disabled: PropTypes.bool,
-  showText: PropTypes.bool
-};

package/src/ui/HawaSettingsRow.js

@@ -1,45 +0,0 @@
-import React from "react";
-
-import PropTypes from "prop-types";
-import { Box } from "../layout";
-import Checkbox from "@mui/material/Checkbox";
-import TextField from "@mui/material/TextField";
-import { HawaTypography } from "./HawaTypography";
-export const HawaSettingsRow = (props) => {
-
-
-  return (
-    <Box noColor>
-      {props.settingsType === "checkbox" && (
-        <div style={{ ...settingsRowStyle }}>
-          <HawaTypography>Checkbox Label</HawaTypography> <Checkbox />
-        </div>
-      )}
-      {props.settingsType === "text" && (
-        <div style={{ ...settingsRowStyle }}>
-          Text Label{" "}
-          <TextField
-            InputProps={{
-              style: {
-                ...hawaTheme.inputFields[currentTheme],
-                // borderRadius: 0,
-                // padding: 0,
-                // backgroundColor: "white",
-                height: 40
-              }
-            }}
-            style={{
-              padding: 0
-            }}
-            placeholder="test"
-          />
-        </div>
-      )}
-    </Box>
-  );
-};
-
-HawaSettingsRow.propTypes = {
-  type: PropTypes.oneOf(["text", "number", "password"]),
-  helperText: PropTypes.string
-};

package/src/ui/HawaTextField.js

@@ -1,160 +0,0 @@
-import React from "react";
-// import InputBase from "@mui/material/InputBase";
-// import Typography from "@mui/material/Typography";
-// import { styled } from "@mui/material/styles";
-// import PropTypes from "prop-types";
-// import { HawaInputLabel } from "./HawaInputLabel";
-// import { Controller, useFormContext } from "react-hook-form";
-import Input from "@mui/material/Input";
-import InputLabel from "@mui/material/InputLabel";
-
-export const HawaTextField = (props) => {
-  // const { control, register } = useFormContext();
-
-  // const currentTheme = Object.keys(hawaTheme.inputFields).find(
-  //   (tName) => tName.toLowerCase() === themeName?.toLowerCase()
-  // );
-  // let textFieldStyle = {};
-
-  // if (currentTheme) {
-  //   textFieldStyle = {
-  //     ...hawaTheme.inputFields[currentTheme],
-  //     margin: props.last ? 0 : hawaTheme.inputFields[currentTheme].margin,
-  //     marginTop: props.last
-  //       ? hawaTheme.inputFields[currentTheme].margin * 2
-  //       : 0,
-  //   };
-  // } else {
-  //   textFieldStyle = {
-  //     backgroundColor: "white"
-  //   };
-  // }
-
-  // const StyledTextField = styled(InputBase)(({ theme }) => {
-  //   return {
-  //     // "& .MuiInputBase-input": {
-  //     //   // border: "1px solid #ced4da",
-  //     //   fontSize: 16,
-  //     //   // padding: "10px 12px",
-  //     //   marginBottom: props.helperText ? 5 : 0,
-  //     //   // paddingLeft: 10,
-  //     //   // paddingRight: 10,
-  //     //   ...textFieldStyle
-  //     // },
-  //     // "& .MuiInputBase-root": {
-  //     //   border: "1px solid #ced4da",
-  //     //   fontSize: 16,
-  //     //   // width: "auto",
-  //     //   // padding: "10px 12px",
-  //     //   marginBottom: props.helperText ? 5 : 0,
-  //     //   // paddingLeft: 10,
-  //     //   // paddingRight: 10,
-
-  //     //   // ...textFieldStyle,
-  //     //   backgroundColor: "blue"
-  //     //   // "&:focus": {
-  //     //   //   borderColor: "red",
-  //     //   //   borderWidth: 1,
-  //     //   //   outline: "1px solid black",
-  //     //   //   backgroundColor: "red"
-  //     //   // }
-  //     //   // "& input:valid + fieldset": {
-  //     //   //   borderColor: "green",
-  //     //   //   borderWidth: 2
-  //     //   // },
-  //     //   // "& input:invalid + fieldset": {
-  //     //   //   borderColor: "red",
-  //     //   //   borderWidth: 2
-  //     //   // },
-  //     //   // "& input:valid:focus + fieldset": {
-  //     //   //   borderLeftWidth: 6,
-  //     //   //   padding: "4px !important" // override inline-style
-  //     //   // }
-  //     // },
-
-  //     // "&:hover": {
-  //     //   borderColor: "red",
-  //     //   borderWidth: 1,
-  //     //   outline: "1px solid black"
-  //     // },
-
-  //     // paddingLeft: 10,
-  //     // paddingRight: 10,
-  //     // border: "none"
-
-  //     // position: "relative",
-  //     // backgroundColor: "green"
-  //     ...textFieldStyle
-  //   };
-  // });
-
-  return (
-    <>
-      <InputLabel>{props.label}</InputLabel>
-      <Input disableUnderline {...props} />
-    </>
-    // <FormControl variant="hawa" style={{ marginTop: 10 }}>
-
-    // </FormControl>
-    // <TextField
-    //   fullWidth
-    //   type="text"
-    //   // inputProps={{
-    //   //   shrink: true
-    //   // }}
-    //   // InputProps={{
-    //   //   disableUnderline: true,
-    //   //   shrink: true
-    //   // }}
-    //   InputLabelProps={{
-    //     shrink: true
-    //   }}
-    //   {...props}
-    // />
-    // <Controller
-    //   render={({ field }) => (
-    //     <>
-    //       {props.inputLabel && <InputLabel label={props.inputLabel} />}
-
-    //       <TextField
-    //         fullWidth={true}
-    //         // helperText={props.helperText}
-    //         type={props.type ?? "text"}
-    //         // placeholder={props.placeholder}
-    //         // inputProps={
-    //         //   props.type === "number"
-    //         //     ? {
-    //         //         inputMode: "numeric",
-    //         //         min: "0",
-    //         //         max: "9999999",
-    //         //         step: "0.01"
-    //         //       }
-    //         //     : {}
-    //         // }
-
-    //         defaultValue={props.defaultValue && ""}
-    //         value={props.value && ""}
-    //         {...props}
-    //         // {...field}
-    //         {...register(props.name)}
-    //       />
-    //       <Typography
-    //         variant="caption"
-    //         style={{ margin: 5, marginBottom: 0, color: "red" }}
-    //       >
-    //         {props.helperText}
-    //       </Typography>
-    //     </>
-    //   )}
-    //   name={props.name}
-    //   rules={props.rules}
-    //   control={control}
-    //   shouldUnregister={props.shouldUnregister}
-    // />
-  );
-};
-
-// HawaTextField.propTypes = {
-//   type: PropTypes.oneOf(["text", "number", "password"]),
-//   helperText: PropTypes.string
-// };