@sikka/hawa 0.0.33 → 0.0.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.0.33",
+  "version": "0.0.34",
   "description": "UI Kit",
   "main": "lib/index.js",
   "module": "es/index.es.js",

package/rollup.config.js

@@ -1,9 +1,9 @@
-import babel from "rollup-plugin-babel";
 import resolve from "@rollup/plugin-node-resolve";
+import commonjs from "@rollup/plugin-commonjs";
+import babel from "rollup-plugin-babel";
 import external from "rollup-plugin-peer-deps-external";
 import { terser } from "rollup-plugin-terser";
 import postcss from "rollup-plugin-postcss";
-import commonjs from "@rollup/plugin-commonjs";
 
 export default [
   {

package/src/blocks/Pricing/index.js

@@ -0,0 +1 @@
+export * from "./PricingPlans";

package/src/blocks/index.js

@@ -0,0 +1,4 @@
+export * from "./Account";
+export * from "./AuthForms";
+export * from "./Payment";
+export * from "./Pricing";

package/src/elements/HawaPopMenu.js

@@ -34,7 +34,7 @@ export const HawaPopMenu = (props) => {
       {props.menuItems.map((item) => (
         <MenuItem key={item.label} onClick={item.action}>
           {item.icon && <item.icon />}
-          <div style={{ width: 10 }} />
+          {item.icon && <div style={{ width: 10 }} />}
           <Typography textAlign="center">{item.label}</Typography>
         </MenuItem>
       ))}

package/src/index.js

@@ -1,5 +1,3 @@
-export * from "./blocks/Account";
-export * from "./blocks/AuthForms";
-export * from "./blocks/Payment";
+export * from "./blocks";
 export * from "./elements";
 export * from "./layout";

package/src/layout/HawaPageControls.js

@@ -0,0 +1,61 @@
+import { Button, Container, Stack } from "@mui/material";
+import React from "react";
+import PropTypes from "prop-types";
+import { HawaPopMenu } from "../elements/HawaPopMenu";
+import MenuIcon from "@mui/icons-material/Menu";
+
+export const HawaPageControls = (props) => {
+  const [anchorElUser, setAnchorElUser] = React.useState(null);
+  const handleOpenUserMenu = (event) => setAnchorElUser(event.currentTarget);
+
+  return (
+    <Container
+      variant="page-controls"
+      {...props}
+      //   maxWidth="sm"
+      style={{
+        display: "flex",
+        flexDirection: "row",
+        justifyContent: "space-between"
+      }}
+    >
+      <Button variant="layout" onClick={props.backAction}>
+        {props.backText}
+      </Button>
+      <Stack
+        direction="row"
+        spacing={1}
+        sx={{ display: { xs: "none", md: "flex" } }}
+      >
+        {props.actionButtons.map((d) => {
+          return <Button variant="layout">{d.label}</Button>;
+        })}
+      </Stack>
+      <Stack
+        direction="row"
+        spacing={1}
+        sx={{ display: { xs: "flex", md: "none" } }}
+      >
+        <Button variant="layout" onClick={handleOpenUserMenu}>
+          <MenuIcon />
+        </Button>
+        <HawaPopMenu
+          handleClose={(e) => setAnchorElUser(null)}
+          anchor={anchorElUser}
+          menuItems={props.actionButtons}
+        />
+      </Stack>
+    </Container>
+  );
+};
+
+HawaPageControls.propTypes = {
+  backText: PropTypes.string,
+  backAction: PropTypes.func,
+  actionButtons: PropTypes.arrayOf(
+    PropTypes.shape({
+      label: PropTypes.string,
+      action: PropTypes.func
+    })
+  )
+};

package/src/layout/index.js

@@ -2,3 +2,4 @@ export * from "./Box";
 export * from "./HawaAppLayout";
 export * from "./HawaDialog";
 export * from "./HawaAppBar";
+export * from "./HawaPageControls";

package/storybook-static/iframe.html

@@ -345,4 +345,4 @@
           
       
           
-            window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:src(?:[\\\\/](?!\\.)(?:(?:(?!(?:^|[\\\\/])\\.).)*?)[\\\\/]|[\\\\/]|$)(?!\\.)(?=.)[^\\\\/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./src","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:src(?:[\\\\/](?!\\.)(?:(?:(?!(?:^|[\\\\/])\\.).)*?)[\\\\/]|[\\\\/]|$)(?!\\.)(?=.)[^\\\\/]*?\\.stories\\.(js|jsx|ts|tsx))$"}];</script><script src="runtime~main.708d7ac1.iframe.bundle.js"></script><script src="vendors~main.a7262b49.iframe.bundle.js"></script><script src="main.2511f65a.iframe.bundle.js"></script></body></html>
+            window['STORIES'] = [{"titlePrefix":"","directory":"./src","files":"**/*.stories.mdx","importPathMatcher":"^\\.[\\\\/](?:src(?:[\\\\/](?!\\.)(?:(?:(?!(?:^|[\\\\/])\\.).)*?)[\\\\/]|[\\\\/]|$)(?!\\.)(?=.)[^\\\\/]*?\\.stories\\.mdx)$"},{"titlePrefix":"","directory":"./src","files":"**/*.stories.@(js|jsx|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:src(?:[\\\\/](?!\\.)(?:(?:(?!(?:^|[\\\\/])\\.).)*?)[\\\\/]|[\\\\/]|$)(?!\\.)(?=.)[^\\\\/]*?\\.stories\\.(js|jsx|ts|tsx))$"}];</script><script src="runtime~main.708d7ac1.iframe.bundle.js"></script><script src="vendors~main.a7262b49.iframe.bundle.js"></script><script src="main.e9b7f5c4.iframe.bundle.js"></script></body></html>