meticulous-ui 2.6.2 → 2.7.0

package/components/Toast/Toast.js

@@ -1,35 +1,35 @@
 import { jsxs as n, jsx as r } from "react/jsx-runtime";
 import { useState as f, useEffect as u } from "react";
-import { Logo as C } from "./helpers.js";
-import S from "../../colors/grey.js";
-import { COLOR_MAP as $, INFO as F, INFO_COLORS as L } from "./constants.js";
-import { ToastWrapper as N, Message as j, Title as w, Subtitle as x, CloseWrapper as I } from "./styles.js";
-const M = () => {
+import { Logo as S } from "./helpers.js";
+import $ from "../../colors/grey.js";
+import { COLOR_MAP as F, INFO as L, INFO_COLORS as N } from "./constants.js";
+import { ToastWrapper as j, Message as w, Title as x, Subtitle as I, CloseWrapper as M } from "./styles.js";
+const R = () => {
 }, m = (o, e, t) => () => {
   o(!0), setTimeout(() => {
     e(!1), t();
   }, 500);
-}, P = ({ type: o = F, visible: e = !0, duration: t = 5, onExpire: a = M, title: l, subtitle: i }) => {
-  const [d, s] = f(e), [p, c] = f(!1);
+}, b = ({ type: o = L, visible: e = !0, duration: t = 5, onExpire: a = R, title: l, subtitle: i, ...d }) => {
+  const [p, s] = f(e), [O, c] = f(!1);
   u(() => {
     s(e);
   }, [e]), u(() => {
-    const g = setTimeout(m(c, s, a), t * 1e3 - 500);
+    const C = setTimeout(m(c, s, a), t * 1e3 - 500);
     return () => {
-      clearTimeout(g);
+      clearTimeout(C);
     };
   }, [t, m]);
-  const { main: O, side: T, bg: h } = $[o] ?? L;
-  if (d)
-    return /* @__PURE__ */ n(N, { $bg: h, className: `${p ? "fade-out" : "fade-in"}`, children: [
-      /* @__PURE__ */ r(C, { type: o, $main: O, $side: T }),
-      /* @__PURE__ */ n(j, { children: [
-        /* @__PURE__ */ r(w, { children: l }),
-        i && /* @__PURE__ */ r(x, { children: i })
+  const { main: T, side: h, bg: g } = F[o] ?? N;
+  if (p)
+    return /* @__PURE__ */ n(j, { $bg: g, className: `${O ? "fade-out" : "fade-in"}`, ...d, children: [
+      /* @__PURE__ */ r(S, { type: o, $main: T, $side: h }),
+      /* @__PURE__ */ n(w, { children: [
+        /* @__PURE__ */ r(x, { children: l }),
+        i && /* @__PURE__ */ r(I, { children: i })
       ] }),
-      /* @__PURE__ */ r(I, { size: 20, color: S.m600, onClick: m(c, s, a) })
+      /* @__PURE__ */ r(M, { size: 20, color: $.m600, onClick: m(c, s, a) })
     ] });
 };
 export {
-  P as default
+  b as default
 };

package/components/Typography/Headings/H1.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h1`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h1`
   color: ${({ $color: o }) => o};
   font-size: 3.6rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/Typography/Headings/H2.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h2`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h2`
   color: ${({ $color: o }) => o};
   font-size: 3rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/Typography/Headings/H3.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h3`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h3`
   color: ${({ $color: o }) => o};
   font-size: 2.4rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/Typography/Headings/H4.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h4`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h4`
   color: ${({ $color: o }) => o};
   font-size: 1.8rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/Typography/Headings/H5.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h5`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h5`
   color: ${({ $color: o }) => o};
   font-size: 1.4rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/Typography/Headings/H6.js

@@ -1,9 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import e from "styled-components";
-const s = e.h6`
+import { jsx as e } from "react/jsx-runtime";
+import s from "styled-components";
+const m = s.h6`
   color: ${({ $color: o }) => o};
   font-size: 1.2rem;
-`, c = ({ color: o, children: r }) => /* @__PURE__ */ t(s, { $color: o, children: r });
+`, f = ({ color: o, children: r, ...t }) => /* @__PURE__ */ e(m, { $color: o, ...t, children: r });
 export {
-  c as default
+  f as default
 };

package/components/VideoPlayer/VideoPlayer.js

@@ -1,16 +1,16 @@
-import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
 import { useRef as t } from "react";
-import { VideoContainer as f, Video as p } from "./styles.js";
-import { useSpacebarToggle as c } from "./useSpacebarToggle.js";
-import h from "./components/Volumebar/Volumebar.js";
-import { useVolumeOverlay as V } from "./useVolumeOverlay.js";
-const $ = ({ link: s, thumbnail: i, width: m = "600", borderRadius: u = 8, height: l = "auto" }) => {
-  const o = t(null), e = t(null), { volume: n, showVolume: a } = V();
-  return c(o, e, a), /* @__PURE__ */ d(f, { ref: e, $width: m, $height: l, children: [
-    /* @__PURE__ */ r(p, { $borderRadius: u, ref: o, src: s, poster: i, controls: !0, children: "Your browser does not support the video tag." }),
-    /* @__PURE__ */ r(h, { volume: n })
+import { VideoContainer as p, Video as c } from "./styles.js";
+import { useSpacebarToggle as h } from "./useSpacebarToggle.js";
+import V from "./components/Volumebar/Volumebar.js";
+import { useVolumeOverlay as g } from "./useVolumeOverlay.js";
+const j = ({ link: s, thumbnail: i, width: m = "600", borderRadius: u = 8, height: l = "auto", ...n }) => {
+  const o = t(null), e = t(null), { volume: a, showVolume: d } = g();
+  return h(o, e, d), /* @__PURE__ */ f(p, { ref: e, $width: m, $height: l, ...n, children: [
+    /* @__PURE__ */ r(c, { $borderRadius: u, ref: o, src: s, poster: i, controls: !0, children: "Your browser does not support the video tag." }),
+    /* @__PURE__ */ r(V, { volume: a })
   ] });
 };
 export {
-  $ as default
+  j as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "meticulous-ui",
-  "version": "2.6.2",
+  "version": "2.7.0",
   "license": "MIT",
   "description": "A comprehensive React UI component library with a wide range of customizable components, icons, colors, and utilities for building modern web applications.",
   "main": "./index.js",