@sikka/hawa 0.0.6 → 0.0.9

package/storybook-static/{vendors~main.30a2c5d7.iframe.bundle.js.LICENSE.txt → vendors~main.aa1d952a.iframe.bundle.js.LICENSE.txt}

@@ -41,21 +41,6 @@ object-assign
  * Released under the MIT License.
  */
 
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-
 /** @license MUI v5.4.4
  *
  * This source code is licensed under the MIT license found in the

package/storybook-static/vendors~main.aa1d952a.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vendors~main.aa1d952a.iframe.bundle.js","sources":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;A","sourceRoot":""}

package/src/stories/BlocksStories/UserAccount.stories.js

@@ -1,46 +0,0 @@
-import React from "react";
-import {
-  UserProfile
-} from "../../blocks/Account";
-import { defaultTheme, HawaProvider } from "../../themes/HawaProvider";
-
-export default {
-  title: "Blocks/UserProfile",
-  component: UserProfile,
-  argsTypes: {
-    viaGoogle: { control: "boolean" },
-    viaGithub: { control: "boolean" },
-    viaTwitter: { control: "boolean" },
-    viaFacebook: { control: "boolean" }
-  },
-  args: {}
-};
-
-const theme = {
-  ...defaultTheme,
-  paddings: 20
-};
-
-const UserProfileTemplate = (args) => {
-  return (
-    <HawaProvider theme={{ ...defaultTheme, ...theme }}>
-      <UserProfile {...args} />
-    </HawaProvider>
-  );
-};
-
-export const Success = UserProfileTemplate.bind({});
-Success.args = {
-  viaGoogle: true,
-  viaGithub: true,
-  viaTwitter: true,
-  viaFacebook: true
-};
-export const Failed = UserProfileTemplate.bind({});
-Failed.args = {
-  viaGoogle: true,
-  viaGithub: true,
-  viaTwitter: true,
-  viaFacebook: true
-};
-

package/src/stories/GlobalVariables.stories.js

@@ -1,44 +0,0 @@
-import React from "react";
-import PropTypes from "prop-types";
-
-export const GlobalVariables = (args) => {
-  //   const methods = useForm();
-  return <div>TESTING COMPONENT</div>;
-};
-export const AnotherComponent = (args) => {
-  //   const methods = useForm();
-  return <div>TESTING COMPONENT</div>;
-};
-AnotherComponent.propTypes = {
-  textLabel: PropTypes.string
-};
-export default {
-  title: "TestTitle",
-  component: [GlobalVariables, AnotherComponent],
-  argTypes: {
-    resize: {
-      description: "overwritten description",
-      table: {
-        type: {
-          summary: "something short"
-        },
-        defaultValue: { summary: "Hello" }
-      },
-      options: ["vertical", "horizontal", "both"],
-      control: { type: "select" }
-    },
-    label: {
-      description: "overwritten description",
-      table: {
-        type: {
-          summary: "something short",
-          detail: "something really really long"
-        },
-        defaultValue: { summary: "Hello" }
-      },
-      control: {
-        type: null
-      }
-    }
-  }
-};

package/src/stories/Introduction.stories.js

@@ -1,233 +0,0 @@
-import { Meta } from "@storybook/addon-docs";
-// import Code from "./assets/code-brackets.svg";
-// import Colors from "./assets/colors.svg";
-// import Comments from "./assets/comments.svg";
-// import Direction from "./assets/direction.svg";
-// import Flow from "./assets/flow.svg";
-// import Plugin from "./assets/plugin.svg";
-// import Repo from "./assets/repo.svg";
-// import StackAlt from "./assets/stackalt.svg";
-
-<Meta title="Example/Introduction" />;
-
-{
-  /* <style>
-{`
-  .subheading {
-    --mediumdark: '#999999';
-    font-weight: 900;
-    font-size: 13px;
-    color: #999;
-    letter-spacing: 6px;
-    line-height: 24px;
-    text-transform: uppercase;
-    margin-bottom: 12px;
-    margin-top: 40px;
-  }
-
-  .link-list {
-    display: grid;
-    grid-template-columns: 1fr;
-    grid-template-rows: 1fr 1fr;
-    row-gap: 10px;
-  }
-
-  @media (min-width: 620px) {
-    .link-list {
-      row-gap: 20px;
-      column-gap: 20px;
-      grid-template-columns: 1fr 1fr;
-    }
-  }
-
-  @media all and (-ms-high-contrast:none) {
-  .link-list {
-      display: -ms-grid;
-      -ms-grid-columns: 1fr 1fr;
-      -ms-grid-rows: 1fr 1fr;
-    }
-  }
-
-  .link-item {
-    display: block;
-    padding: 20px 30px 20px 15px;
-    border: 1px solid #00000010;
-    border-radius: 5px;
-    transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;
-    color: #333333;
-    display: flex;
-    align-items: flex-start;
-  }
-
-  .link-item:hover {
-    border-color: #1EA7FD50;
-    transform: translate3d(0, -3px, 0);
-    box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;
-  }
-
-  .link-item:active {
-    border-color: #1EA7FD;
-    transform: translate3d(0, 0, 0);
-  }
-
-  .link-item strong {
-    font-weight: 700;
-    display: block;
-    margin-bottom: 2px;
-  }
-  
-  .link-item img {
-    height: 40px;
-    width: 40px;
-    margin-right: 15px;
-    flex: none;
-  }
-
-  .link-item span {
-    font-size: 14px;
-    line-height: 20px;
-  }
-
-  .tip {
-    display: inline-block;
-    border-radius: 1em;
-    font-size: 11px;
-    line-height: 12px;
-    font-weight: 700;
-    background: #E7FDD8;
-    color: #66BF3C;
-    padding: 4px 12px;
-    margin-right: 10px;
-    vertical-align: top;
-  }
-
-  .tip-wrapper {
-    font-size: 13px;
-    line-height: 20px;
-    margin-top: 40px;
-    margin-bottom: 40px;
-  }
-
-  .tip-wrapper code {
-    font-size: 12px;
-    display: inline-block;
-  }
-
-  
-`}
-</style> */
-}
-
-// # Welcome to Storybook
-
-// Storybook helps you build UI components in isolation from your app's business logic, data, and context.
-// That makes it easy to develop hard - to - reach states.Save these UI states as ** stories ** to revisit during development, testing, or QA.
-
-// Browse example stories now by navigating to them in the sidebar.
-// View their code in the`src/stories` directory to learn how they work.
-// We recommend building UIs with a[** component - driven **](https://componentdriven.org) process starting with atomic components and ending with pages.
-
-<>
-  <div className="subheading">Configure</div>
-
-  <div className="link-list">
-    <a
-      className="link-item"
-      href="https://storybook.js.org/docs/react/addons/addon-types"
-      target="_blank"
-    >
-      {/* <img src={Plugin} alt="plugin" /> */}
-      <span>
-        <strong>Presets for popular tools</strong>
-        Easy setup for TypeScript, SCSS and more.
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://storybook.js.org/docs/react/configure/webpack"
-      target="_blank"
-    >
-      {/* <img src={StackAlt} alt="Build" /> */}
-      <span>
-        <strong>Build configuration</strong>
-        How to customize webpack and Babel
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://storybook.js.org/docs/react/configure/styling-and-css"
-      target="_blank"
-    >
-      {/* <img src={Colors} alt="colors" /> */}
-      <span>
-        <strong>Styling</strong>
-        How to load and configure CSS libraries
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://storybook.js.org/docs/react/get-started/setup#configure-storybook-for-your-stack"
-      target="_blank"
-    >
-      {/* <img src={Flow} alt="flow" /> */}
-      <span>
-        <strong>Data</strong>
-        Providers and mocking for data libraries
-      </span>
-    </a>
-  </div>
-
-  <div className="subheading">Learn</div>
-
-  <div className="link-list">
-    <a
-      className="link-item"
-      href="https://storybook.js.org/docs"
-      target="_blank"
-    >
-      {/* <img src={Repo} alt="repo" /> */}
-      <span>
-        <strong>Storybook documentation</strong>
-        Configure, customize, and extend
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://storybook.js.org/tutorials/"
-      target="_blank"
-    >
-      {/* <img src={Direction} alt="direction" /> */}
-      <span>
-        <strong>In-depth guides</strong>
-        Best practices from leading teams
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://github.com/storybookjs/storybook"
-      target="_blank"
-    >
-      {/* <img src={Code} alt="code" /> */}
-      <span>
-        <strong>GitHub project</strong>
-        View the source and add issues
-      </span>
-    </a>
-    <a
-      className="link-item"
-      href="https://discord.gg/storybook"
-      target="_blank"
-    >
-      {/* <img src={Comments} alt="comments" /> */}
-      <span>
-        <strong>Discord chat</strong>
-        Chat with maintainers and the community
-      </span>
-    </a>
-  </div>
-
-  <div className="tip-wrapper">
-    <span className="tip">Tip</span>Edit the Markdown in{" "}
-    <code>src/stories/Introduction.stories.mdx</code>
-  </div>
-</>;

package/src/ui/ApplePayButton.js

@@ -1,93 +0,0 @@
-import React, { useContext } from "react";
-import { ThemeProvider } from "../themes/HawaProvider";
-import Button from "@mui/material/Button";
-import { styled, darken } from "@mui/material/styles";
-
-import GitHubIcon from "@mui/icons-material/GitHub";
-
-export const ApplePayButton = (props) => {
-  const theme = useContext(ThemeProvider);
-  let buttonStyle = {};
-
-  let currentTheme = Object.keys(theme.actionButton).find(
-    (themeName) => themeName.toLowerCase() === props.themeType?.toLowerCase()
-  );
-  if (currentTheme) {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      padding: 0,
-      marginTop: theme.actionButton[currentTheme].margin,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: theme.actionButton[currentTheme].borderRadius,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  } else {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      marginTop: theme.margins,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: 0,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  }
-
-  const StyledButton = styled(Button)(({ theme }) => {
-    return {
-      // "label + &": {
-      //   marginTop: theme.spacing(3)
-      // },
-
-      borderRadius: 4,
-      position: "relative",
-      border: "1px solid #ced4da",
-      fontSize: 16,
-      // width: "auto",
-      height: 50,
-      // padding: "10px 12px",
-      ...buttonStyle,
-      "&:focus": {
-        // boxShadow: `${alpha(theme.palette.primary.main, 0.25)} 0 0 0 0.2rem`,
-        borderColor: theme.palette.primary.main
-      }
-    };
-  });
-
-  return (
-    <StyledButton
-      //  style={buttonStyle}
-      onClick={props.handleClick}
-    >
-      <img
-        src="https://sikka-images.s3.ap-southeast-1.amazonaws.com/payments/apple-pay.png"
-        height={40}
-      />{" "}
-      <div style={{ width: 10 }} />
-      <p
-        style={{
-          color: "black",
-          fontSize: 14,
-          textAlign: "center",
-          letterSpacing: 0.4,
-          fontFamily: "Roboto",
-          fontWeight: 500
-        }}
-      >
-        {props.buttonText}
-      </p>
-    </StyledButton>
-  );
-};

package/src/ui/GithubButton.js

@@ -1,90 +0,0 @@
-import React, { useContext } from "react";
-import { ThemeProvider } from "../themes/HawaProvider";
-import Button from "@mui/material/Button";
-import { styled, darken } from "@mui/material/styles";
-
-import GitHubIcon from "@mui/icons-material/GitHub";
-
-export const GithubButton = (props) => {
-  const theme = useContext(ThemeProvider);
-  let buttonStyle = {};
-
-  let currentTheme = Object.keys(theme.actionButton).find(
-    (themeName) => themeName.toLowerCase() === props.themeType?.toLowerCase()
-  );
-  if (currentTheme) {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      padding: 0,
-      marginTop: theme.actionButton[currentTheme].margin,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: theme.actionButton[currentTheme].borderRadius,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  } else {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      marginTop: theme.margins,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: 0,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  }
-
-  const StyledButton = styled(Button)(({ theme }) => {
-    return {
-      // "label + &": {
-      //   marginTop: theme.spacing(3)
-      // },
-
-      borderRadius: 4,
-      position: "relative",
-      border: "1px solid #ced4da",
-      fontSize: 16,
-      // width: "auto",
-      height: 50,
-      // padding: "10px 12px",
-      ...buttonStyle,
-      "&:focus": {
-        // boxShadow: `${alpha(theme.palette.primary.main, 0.25)} 0 0 0 0.2rem`,
-        borderColor: theme.palette.primary.main
-      }
-    };
-  });
-
-  return (
-    <StyledButton
-      //  style={buttonStyle}
-      onClick={props.handleClick}
-    >
-      <GitHubIcon />
-      <div style={{ width: 10 }} />
-      <p
-        style={{
-          color: "black",
-          fontSize: 14,
-          textAlign: "center",
-          letterSpacing: 0.4,
-          fontFamily: "Roboto",
-          fontWeight: 500
-        }}
-      >
-        {props.buttonText}
-      </p>
-    </StyledButton>
-  );
-};

package/src/ui/GoogleButton.js

@@ -1,82 +0,0 @@
-import React, { useContext } from "react";
-import { ThemeProvider } from "../themes/HawaProvider";
-import { styled, darken } from "@mui/material/styles";
-import Button from "@mui/material/Button";
-
-export const GoogleButton = (props) => {
-  const theme = useContext(ThemeProvider);
-  let buttonStyle = {};
-
-  let currentTheme = Object.keys(theme.actionButton).find(
-    (themeName) => themeName.toLowerCase() === props.themeType?.toLowerCase()
-  );
-  if (currentTheme) {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      marginTop: theme.layout[currentTheme].margin,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: theme.layout[currentTheme].borderRadius,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  } else {
-    buttonStyle = {
-      cursor: "pointer",
-      display: "flex",
-      flexDirection: "row",
-      alignItems: "center",
-      justifyContent: "center",
-      marginTop: theme.margins,
-      border: props.outlined ? "2px solid black" : "none",
-      borderRadius: 0,
-      backgroundColor: "white",
-      "&:hover": {
-        backgroundColor: darken("#ffffff", 0.1)
-      }
-    };
-  }
-  const StyledButton = styled(Button)(({ theme }) => {
-    return {
-      // "label + &": {
-      //   marginTop: theme.spacing(3)
-      // },
-
-      borderRadius: 4,
-      position: "relative",
-      border: "1px solid #ced4da",
-      fontSize: 16,
-      // width: "auto",
-      height: 50,
-      // padding: "10px 12px",
-      ...buttonStyle,
-      "&:focus": {
-        // boxShadow: `${alpha(theme.palette.primary.main, 0.25)} 0 0 0 0.2rem`,
-        borderColor: theme.palette.primary.main
-      }
-    };
-  });
-  return (
-    <StyledButton onClick={props.handleClick}>
-      <img src="https://upload.wikimedia.org/wikipedia/commons/5/53/Google_%22G%22_Logo.svg" />
-      <div style={{ width: 10 }} />
-      <p
-        style={{
-          color: "black",
-          fontSize: 14,
-          textAlign: "center",
-          letterSpacing: 0.4,
-          fontFamily: "Roboto",
-          fontWeight: 500
-        }}
-      >
-        {props.buttonText}
-      </p>
-    </StyledButton>
-  );
-};