@nithish_atum/atum 1.0.3 → 1.0.5

package/dist/index.mjs

@@ -1232,26 +1232,631 @@ var Textarea = ({
   return /* @__PURE__ */ jsx20(StyledTextarea, { $size: size, $state: state, ...rest });
 };
 var Textarea_default = Textarea;
+
+// src/components/Menus/CenterMenu.tsx
+import styled21, { css as css16 } from "styled-components";
+import { jsx as jsx21, jsxs as jsxs9 } from "react/jsx-runtime";
+var baseStyle9 = css16`
+  padding: 0.2em 0em 0.2em 0em;
+  cursor: pointer;
+  font-weight: 600;
+  transistion: all 900ms;
+  display: flex;
+  width: 100%;
+  justify-content: center;
+  align-items: center;
+  gap: 3%;
+  background-color: rgb(71, 91, 248);
+`;
+var StyledMenu = styled21.div`
+  ${baseStyle9}
+`;
+var CenterMenu = ({
+  menuItems = ["SampleMenu_1", "SampleMenu_2", "SampleMenu_3"],
+  logo,
+  alt = "logo",
+  href = "#",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsxs9(StyledMenu, { ...rest, children: [
+    /* @__PURE__ */ jsx21("a", { href, children: /* @__PURE__ */ jsx21(
+      "img",
+      {
+        src: logo,
+        alt,
+        width: "48px",
+        height: "48px",
+        style: {
+          mixBlendMode: "multiply",
+          objectFit: "contain"
+        }
+      }
+    ) }),
+    menuItems.map((x, i) => {
+      return /* @__PURE__ */ jsx21("div", { children: x }, i);
+    })
+  ] });
+};
+var CenterMenu_default = CenterMenu;
+
+// src/components/Layouts/Row.tsx
+import styled22, { css as css17 } from "styled-components";
+import { jsx as jsx22 } from "react/jsx-runtime";
+var baseStyle10 = css17`
+  display: flex;
+  flex-direction: row;
+`;
+var justifyStyles3 = {
+  center: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: center;
+  `,
+  start: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: start;
+  `,
+  end: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: end;
+  `,
+  FStart: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: flex-start;
+  `,
+  FEnd: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: flex-end;
+  `,
+  left: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: left;
+  `,
+  right: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: right;
+  `,
+  between: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: space-between;
+  `,
+  around: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: space-around;
+  `,
+  even: css17`
+    height: inherit;
+    width: inherit;
+    justify-content: space-evenly;
+  `
+};
+var gapStyles4 = {
+  xs: css17`
+    gap: 1em;
+  `,
+  sm: css17`
+    gap: 3em;
+  `,
+  md: css17`
+    gap: 5em;
+  `,
+  lg: css17`
+    gap: 7em;
+  `
+};
+var CustomDiv3 = styled22.div`
+  ${baseStyle10}
+  ${({ $justify, $gap }) => css17`
+    ${justifyStyles3[$justify]}
+    ${gapStyles4[$gap]}
+  `}
+`;
+var Row = ({
+  justify = "center",
+  gap = "xs",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx22(CustomDiv3, { $justify: justify, $gap: gap, ...rest, children });
+};
+var Row_default = Row;
+
+// src/components/Menus/HorizantalMenu.tsx
+import styled23, { css as css18 } from "styled-components";
+import { jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
+var baseStyle11 = css18`
+  padding: 1em 0em 1em 0em;
+  cursor: pointer;
+  font-weight: 600;
+  transistion: all 900ms;
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  background-color:rgb(71, 91, 248);
+`;
+var StyledMenu2 = styled23.div`
+  ${baseStyle11}
+`;
+var HorizantalMenu = ({
+  menuItems = ["SampleMenu_1", "SampleMenu_2", "SampleMenu_3"],
+  logo,
+  alt = "logo",
+  href = "#",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsxs10(StyledMenu2, { ...rest, children: [
+    /* @__PURE__ */ jsx23("a", { href, children: /* @__PURE__ */ jsx23(
+      "img",
+      {
+        src: logo,
+        alt,
+        width: "36px",
+        height: "36px",
+        style: {
+          mixBlendMode: "multiply",
+          objectFit: "contain"
+        }
+      }
+    ) }),
+    /* @__PURE__ */ jsx23(Row_default, { justify: "FEnd", children: menuItems.map((x, i) => {
+      return /* @__PURE__ */ jsx23("div", { children: x }, i);
+    }) })
+  ] });
+};
+var HorizantalMenu_default = HorizantalMenu;
+
+// src/components/Layouts/Center.tsx
+import styled24, { css as css19 } from "styled-components";
+import { jsx as jsx24 } from "react/jsx-runtime";
+var baseStyle12 = css19`
+  display: flex;
+  height: inherit;
+  width: inherit;
+  justify-content: center;
+  align-items: center;
+`;
+var CustomDiv4 = styled24.div`
+  ${baseStyle12}
+`;
+var Center = ({
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx24(CustomDiv4, { ...rest, children });
+};
+var Center_default = Center;
+
+// src/components/Layouts/Col.tsx
+import styled25, { css as css20 } from "styled-components";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var baseStyle13 = css20`
+  display: flex;
+  flex-direction: column;
+`;
+var justifyStyles4 = {
+  center: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: center;
+  `,
+  start: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: start;
+  `,
+  end: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: end;
+  `,
+  FStart: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: flex-start;
+  `,
+  FEnd: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: flex-end;
+  `,
+  left: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: left;
+  `,
+  right: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: right;
+  `,
+  between: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: space-between;
+  `,
+  around: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: space-around;
+  `,
+  even: css20`
+    height: inherit;
+    width: inherit;
+    justify-content: space-evenly;
+  `
+};
+var gapStyles5 = {
+  xs: css20`
+    gap: 1em;
+  `,
+  sm: css20`
+    gap: 3em;
+  `,
+  md: css20`
+    gap: 5em;
+  `,
+  lg: css20`
+    gap: 7em;
+  `
+};
+var CustomDiv5 = styled25.div`
+  ${baseStyle13}
+  ${({ $justify, $gap }) => css20`
+    ${justifyStyles4[$justify]}
+    ${gapStyles5[$gap]}
+  `}
+`;
+var Col = ({
+  justify = "center",
+  gap = "xs",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx25(CustomDiv5, { $justify: justify, $gap: gap, ...rest, children });
+};
+var Col_default = Col;
+
+// src/components/Layouts/Container.tsx
+import styled26, { css as css21 } from "styled-components";
+import { jsx as jsx26 } from "react/jsx-runtime";
+var baseStyle14 = css21`
+  padding: 1em;
+`;
+var sizeStyles4 = {
+  xs: css21`
+    max-width: 576px;
+    width: 100%;
+    display: flex;
+    margin-left: auto;
+    margin-right: auto;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+  `,
+  sm: css21`
+    max-width: 688px;
+    width: 100%;
+      display: flex;
+    margin-left: auto;
+    margin-right: auto;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+  `,
+  md: css21`
+    max-width: 768px;
+    width: 100%;
+      display: flex;
+    margin-left: auto;
+    margin-right: auto;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+  `,
+  lg: css21`
+    max-width: 100%;
+    width: 100%;
+    display: flex;
+    padding: 0px;
+    margin-left: auto;
+    margin-right: auto;
+    align-items: center;
+    justify-content: center;
+    height: 100vh;
+  `
+};
+var flexStyles = {
+  row: css21`
+     width: inherit;
+    display: flex;
+    flex-direction: row;
+  `,
+  col: css21`
+     width: inherit;
+    display: flex;
+    flex-direction: column;
+  `
+};
+var gapStyles6 = {
+  xs: css21`
+    gap: 1em;
+  `,
+  sm: css21`
+    gap: 3em;
+  `,
+  md: css21`
+    gap: 5em;
+  `,
+  lg: css21`
+    gap: 7em;
+  `
+};
+var CustomDiv6 = styled26.div`
+  ${baseStyle14}
+  ${({ $size, $flex, $gap }) => css21`
+    ${sizeStyles4[$size]}
+    ${flexStyles[$flex]}
+    ${gapStyles6[$gap]}
+  `}
+`;
+var Container = ({
+  size = "lg",
+  flex = "row",
+  gap = "xs",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx26(CustomDiv6, { $size: size, $flex: flex, $gap: gap, ...rest, children });
+};
+var Container_default = Container;
+
+// src/components/Layouts/Grid.tsx
+import styled27, { css as css22 } from "styled-components";
+import { jsx as jsx27 } from "react/jsx-runtime";
+var baseStyle15 = css22`
+  display: grid;
+  width: 100%;
+`;
+var gapStyles7 = {
+  xs: css22`
+    gap: 0.5rem;
+  `,
+  sm: css22`
+    gap: 1rem;
+  `,
+  md: css22`
+    gap: 2rem;
+  `,
+  lg: css22`
+    gap: 3rem;
+  `
+};
+var StyledGrid = styled27.div`
+  ${baseStyle15}
+
+  ${({ $columns }) => css22`
+    grid-template-columns: repeat(${$columns}, minmax(0, 1fr));
+  `}
+
+  ${({ $rows }) => $rows && css22`
+      grid-template-rows: repeat(${$rows}, 1fr);
+    `}
+
+  ${({ $gap }) => gapStyles7[$gap]}
+`;
+var Grid2 = ({
+  columns = 12,
+  rows,
+  gap = "sm",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx27(
+    StyledGrid,
+    {
+      $columns: columns,
+      $rows: rows,
+      $gap: gap,
+      ...rest,
+      children
+    }
+  );
+};
+var Grid_default = Grid2;
+
+// src/components/Layouts/Stack.tsx
+import styled28, { css as css23 } from "styled-components";
+import { jsx as jsx28 } from "react/jsx-runtime";
+var baseStyle16 = css23`
+  display: flex;
+  width: 100%;
+`;
+var directionStyles = {
+  vertical: css23`
+    flex-direction: column;
+  `,
+  horizontal: css23`
+    flex-direction: row;
+  `
+};
+var gapStyles8 = {
+  xs: css23`
+    gap: 0.5rem;
+  `,
+  sm: css23`
+    gap: 1rem;
+  `,
+  md: css23`
+    gap: 2rem;
+  `,
+  lg: css23`
+    gap: 3rem;
+  `
+};
+var StyledStack = styled28.div`
+  ${baseStyle16}
+  ${({ $direction }) => directionStyles[$direction]}
+  ${({ $gap }) => gapStyles8[$gap]}
+`;
+var Stack = ({
+  direction = "vertical",
+  gap = "sm",
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx28(StyledStack, { $direction: direction, $gap: gap, ...rest, children });
+};
+var Stack_default = Stack;
+
+// src/components/Notification/NotificationProvider.tsx
+import {
+  createContext,
+  useContext,
+  useState as useState3,
+  useEffect as useEffect6
+} from "react";
+import { createPortal as createPortal5 } from "react-dom";
+import styled29 from "styled-components";
+
+// src/components/Notification/toast.ts
+var notifyRef = null;
+var registerToast = (fn) => {
+  notifyRef = fn;
+};
+var toast = {
+  success(message, duration) {
+    notifyRef?.({ type: "success", message, duration });
+  },
+  error(message, duration) {
+    notifyRef?.({ type: "error", message, duration });
+  },
+  info(message, duration) {
+    notifyRef?.({ type: "info", message, duration });
+  },
+  warning(message, duration) {
+    notifyRef?.({ type: "warning", message, duration });
+  }
+};
+
+// src/components/Notification/NotificationProvider.tsx
+import { jsx as jsx29, jsxs as jsxs11 } from "react/jsx-runtime";
+var NotificationContext = createContext(null);
+var useNotification = () => {
+  const ctx = useContext(NotificationContext);
+  if (!ctx) {
+    throw new Error("useNotification must be used inside NotificationProvider");
+  }
+  return ctx;
+};
+var Container2 = styled29.div`
+  position: fixed;
+  top: 1rem;
+  right: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  z-index: 2000;
+`;
+var Item2 = styled29.div`
+  min-width: 280px;
+  padding: 0.75rem 1rem;
+  border-radius: 8px;
+  background: #fff;
+  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
+  border-left: 4px solid
+    ${({ $type }) => ({
+  success: "#2e7d32",
+  error: "#d32f2f",
+  info: "#0288d1",
+  warning: "#ed6c02"
+})[$type]};
+`;
+var Title = styled29.div`
+  font-weight: 600;
+  margin-bottom: 0.25rem;
+`;
+var Message = styled29.div`
+  font-size: 0.875rem;
+  line-height: 1.4;
+`;
+var NotificationProvider = ({ children }) => {
+  const [items, setItems] = useState3([]);
+  const notify = (notice) => {
+    const id = crypto.randomUUID();
+    const item = { ...notice, id };
+    setItems((prev) => [...prev, item]);
+    if (notice.duration !== 0) {
+      setTimeout(() => {
+        setItems((prev) => prev.filter((n) => n.id !== id));
+      }, notice.duration ?? 3e3);
+    }
+  };
+  useEffect6(() => {
+    registerToast(notify);
+  }, []);
+  return /* @__PURE__ */ jsxs11(NotificationContext.Provider, { value: { notify }, children: [
+    children,
+    createPortal5(
+      /* @__PURE__ */ jsx29(Container2, { children: items.map((n) => /* @__PURE__ */ jsxs11(Item2, { $type: n.type, children: [
+        n.title && /* @__PURE__ */ jsx29(Title, { children: n.title }),
+        /* @__PURE__ */ jsx29(Message, { children: n.message })
+      ] }, n.id)) }),
+      document.body
+    )
+  ] });
+};
+
+// src/components/Notification/useToast.ts
+var useToast = () => {
+  const { notify } = useNotification();
+  return {
+    success: (message, duration) => notify({ type: "success", message, duration }),
+    error: (message, duration) => notify({ type: "error", message, duration }),
+    info: (message, duration) => notify({ type: "info", message, duration }),
+    warning: (message, duration) => notify({ type: "warning", message, duration })
+  };
+};
 export {
   Box_default as Box,
   Button_default as Button,
   Card_default as Card,
+  Center_default as Center,
+  CenterMenu_default as CenterMenu,
   Checkbox_default as Checkbox,
+  Col_default as Col,
+  Container_default as Container,
   DatePicker_default as DatePicker,
   Divider_default as Divider,
   Drawer_default as Drawer,
   Flex_default as Flex,
   Form_default as Form,
   FormControl_default as FormControl,
+  Grid_default as Grid,
   Heading_default as Heading,
+  HorizantalMenu_default as HorizantalMenu,
   Input_default as Input,
   Link_default as Link,
   Modal_default as Modal,
+  NotificationProvider,
   Paragraph_default as Paragraph,
   Radio_default as Radio,
+  Row_default as Row,
   Select_default as Select,
+  Stack_default as Stack,
   Switch_default as Switch,
   Text_default as Text,
-  Textarea_default as Textarea
+  Textarea_default as Textarea,
+  toast,
+  useToast
 };
 //# sourceMappingURL=index.mjs.map