@yakad/ui 1.3.48 → 1.3.50

package/dist/appBar/appBar.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 export interface AppBarProps extends React.HTMLAttributes<HTMLDivElement> {
-    position?: "initial" | "sticky" | "autohide";
+    position?: "initial" | "sticky" | "scroll";
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
     align?: "start" | "center" | "end";
     blur?: boolean;
     children?: React.ReactNode;

package/dist/appBar/appBar.js

@@ -13,11 +13,11 @@ import React, { forwardRef, useEffect, useState } from "react";
 import classNames from "classnames";
 import styles from "./appBar.module.css";
 export const AppBar = forwardRef((_a, ref) => {
-    var { position = "initial", align, blur, className, children } = _a, restProps = __rest(_a, ["position", "align", "blur", "className", "children"]);
+    var { position = "initial", size, align, blur, className, children } = _a, restProps = __rest(_a, ["position", "size", "align", "blur", "className", "children"]);
     const [show, setShow] = useState(true);
     const [lastScrollY, setLastScrollY] = useState(0);
     useEffect(() => {
-        if (position !== "autohide")
+        if (position !== "scroll")
             return;
         const handleScroll = () => {
             const currentScrollY = window.scrollY;
@@ -35,11 +35,8 @@ export const AppBar = forwardRef((_a, ref) => {
         return () => window.removeEventListener("scroll", handleScroll);
     }, [lastScrollY, position]);
     const joinedClassNames = classNames(styles.header, {
-        [styles.sticky]: position === "sticky" || position === "autohide",
-        [styles.hidden]: position === "autohide" && !show,
-        [styles[align]]: align,
-        [styles.blur]: blur,
-    }, className);
+        [styles.sticky]: position === "sticky",
+    }, { [styles.hidden]: position === "scroll" && !show }, { [styles[size]]: size }, { [styles[align]]: align }, { [styles.blur]: blur }, className);
     return (React.createElement("header", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
 //# sourceMappingURL=appBar.js.map

package/dist/appBar/appBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"appBar.js","sourceRoot":"","sources":["../../src/appBar/appBar.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AASzC,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC5B,CACI,EAOC,EACD,GAAG,EACL,EAAE;QATA,EACI,QAAQ,GAAG,SAAS,EACpB,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,OAEX,EADM,SAAS,cANhB,sDAOC,CADe;IAIhB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,QAAQ,KAAK,UAAU;YAAE,OAAO;QAEpC,MAAM,YAAY,GAAG,GAAG,EAAE;YACtB,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,CAAC;YAEtC,IAAI,cAAc,GAAG,WAAW,IAAI,cAAc,GAAG,EAAE,EAAE,CAAC;gBACtD,cAAc;gBACd,OAAO,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;iBAAM,CAAC;gBACJ,YAAY;gBACZ,OAAO,CAAC,IAAI,CAAC,CAAC;YAClB,CAAC;YAED,cAAc,CAAC,cAAc,CAAC,CAAC;QACnC,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAChD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE5B,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,MAAM,EACb;QACI,CAAC,MAAM,CAAC,MAAM,CAAC,EACX,QAAQ,KAAK,QAAQ,IAAI,QAAQ,KAAK,UAAU;QACpD,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,UAAU,IAAI,CAAC,IAAI;QACjD,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK;QAChC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI;KACtB,EACD,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,8CAAQ,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACvD,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC,CACJ,CAAC"}
+{"version":3,"file":"appBar.js","sourceRoot":"","sources":["../../src/appBar/appBar.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAUzC,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC5B,CACI,EAQC,EACD,GAAG,EACL,EAAE;QAVA,EACI,QAAQ,GAAG,SAAS,EACpB,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,OAEX,EADM,SAAS,cAPhB,8DAQC,CADe;IAIhB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,QAAQ,KAAK,QAAQ;YAAE,OAAO;QAElC,MAAM,YAAY,GAAG,GAAG,EAAE;YACtB,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,CAAC;YAEtC,IAAI,cAAc,GAAG,WAAW,IAAI,cAAc,GAAG,EAAE,EAAE,CAAC;gBACtD,cAAc;gBACd,OAAO,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;iBAAM,CAAC;gBACJ,YAAY;gBACZ,OAAO,CAAC,IAAI,CAAC,CAAC;YAClB,CAAC;YAED,cAAc,CAAC,cAAc,CAAC,CAAC;QACnC,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAChD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE5B,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,MAAM,EACb;QACI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,QAAQ;KACzC,EACD,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,EACnD,EAAE,CAAC,MAAM,CAAC,IAAc,CAAC,CAAC,EAAE,IAAI,EAAE,EAClC,EAAE,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK,EAAE,EACpC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,EACvB,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,8CAAQ,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACvD,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC,CACJ,CAAC"}

package/dist/appBar/appBar.module.css

@@ -2,21 +2,44 @@
     display: flex;
     flex-direction: row;
     align-items: center;
-    box-sizing: border-box;
+    flex-wrap: wrap;
     width: 100%;
-    height: 6rem;
-    padding: 0 2rem;
-    border-bottom: 0.1rem solid #7d7d7d40;
+    min-height: 6rem;
+    padding-left: 2rem;
+    padding-right: 2rem;
+    box-shadow: 0 0.1rem 0 0 rgb(var(--onSurfaceColor, 28 27 31) / 0.1);
     gap: 1rem;
+    box-sizing: border-box;
+    z-index: 2;
     background: rgb(var(--surfaceContainerColor, 243 237 247));
     color: rgb(var(--onSurfaceColor, 28 27 31));
     fill: rgb(var(--onSurfaceColor, 28 27 31));
     transition: transform 0.3s ease;
     will-change: transform;
-    z-index: 2;
     user-select: none;
 }
 
+.xs {
+    padding-left: max(2rem, calc(50% - 44.4rem / 2));
+    padding-right: max(2rem, calc(50% - 44.4rem / 2));
+}
+.sm {
+    padding-left: max(2rem, calc(50% - 60rem / 2));
+    padding-right: max(2rem, calc(50% - 60rem / 2));
+}
+.md {
+    padding-left: max(2rem, calc(50% - 90rem / 2));
+    padding-right: max(2rem, calc(50% - 90rem / 2));
+}
+.lg {
+    padding-left: max(2rem, calc(50% - 120rem / 2));
+    padding-right: max(2rem, calc(50% - 120rem / 2));
+}
+.xl {
+    padding-left: max(2rem, calc(50% - 150rem / 2));
+    padding-right: max(2rem, calc(50% - 150rem / 2));
+}
+
 .start {
     justify-content: flex-start;
 }
@@ -27,16 +50,15 @@
     justify-content: flex-end;
 }
 
-.header.sticky {
+.sticky {
     position: sticky;
     top: 0;
 }
-
-.header.hidden {
+.hidden {
     transform: translateY(-100%);
 }
 
-.header.blur {
+.blur {
     background-color: color-mix(
         in srgb,
         rgb(var(--surfaceContainerColor, 243 237 247)) 90%,

package/dist/container/container.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 export interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
-    align?: "start" | "center" | "end";
     size?: "xs" | "sm" | "md" | "lg" | "xl";
+    align?: "start" | "center" | "end";
     children?: React.ReactNode;
 }
 export declare const Container: React.ForwardRefExoticComponent<ContainerProps & React.RefAttributes<HTMLDivElement>>;

package/dist/container/container.js

@@ -13,8 +13,8 @@ import React, { forwardRef } from "react";
 import classNames from "classnames";
 import styles from "./container.module.css";
 export const Container = forwardRef((_a, ref) => {
-    var { align, size = "xl", className, children } = _a, restProps = __rest(_a, ["align", "size", "className", "children"]);
-    const joinedClassNames = classNames(styles.container, { [styles[align]]: align }, styles[size], className);
+    var { size = "xl", align, className, children } = _a, restProps = __rest(_a, ["size", "align", "className", "children"]);
+    const joinedClassNames = classNames(styles.container, styles[size], { [styles[align]]: align }, className);
     return (React.createElement("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
 //# sourceMappingURL=container.js.map

package/dist/container/container.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/container/container.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAQ5C,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CAC/B,CAAC,EAAyD,EAAE,GAAG,EAAE,EAAE;QAAlE,EAAE,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,SAAS,EAAE,QAAQ,OAAgB,EAAX,SAAS,cAAvD,0CAAyD,CAAF;IACpD,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,SAAS,EAChB,EAAE,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK,EAAE,EACpC,MAAM,CAAC,IAAI,CAAC,EACZ,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,2CAAK,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACpD,QAAQ,CACP,CACT,CAAC;AACN,CAAC,CACJ,CAAC"}
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../src/container/container.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,wBAAwB,CAAC;AAQ5C,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CAC/B,CAAC,EAAyD,EAAE,GAAG,EAAE,EAAE;QAAlE,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,OAAgB,EAAX,SAAS,cAAvD,0CAAyD,CAAF;IACpD,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,SAAS,EAChB,MAAM,CAAC,IAAI,CAAC,EACZ,EAAE,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK,EAAE,EACpC,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,2CAAK,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACpD,QAAQ,CACP,CACT,CAAC;AACN,CAAC,CACJ,CAAC"}

package/dist/container/container.module.css

@@ -1,24 +1,25 @@
-div.container {
+.container {
     width: 100%;
     padding: 2rem;
+    gap: 2rem;
     margin-right: auto;
     margin-left: auto;
     box-sizing: border-box;
 }
 
-div.container.xs {
+.container.xs {
     max-width: 44.4rem;
 }
-div.container.sm {
+.container.sm {
     max-width: 60rem;
 }
-div.container.md {
+.container.md {
     max-width: 90rem;
 }
-div.container.lg {
+.container.lg {
     max-width: 120rem;
 }
-div.container.xl {
+.container.xl {
     max-width: 150rem;
 }
 

package/dist/footer/footer.d.ts

@@ -1,7 +1,8 @@
 import React from "react";
 export interface FooterProps extends React.HTMLAttributes<HTMLDivElement> {
+    position?: "initial" | "sticky" | "scroll";
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
     align?: "start" | "center" | "end";
-    position?: "initial" | "sticky";
     blur?: boolean;
     children?: React.ReactNode;
 }

package/dist/footer/footer.js

@@ -9,12 +9,32 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { forwardRef } from "react";
+import React, { forwardRef, useState, useEffect } from "react";
 import classNames from "classnames";
 import styles from "./footer.module.css";
 export const Footer = forwardRef((_a, ref) => {
-    var { position = "initial", align, blur, className, children } = _a, restProps = __rest(_a, ["position", "align", "blur", "className", "children"]);
-    const joinedClassNames = classNames(styles.footer, { [styles.sticky]: position === "sticky" }, { [styles[align]]: align }, { [styles.blur]: blur }, className);
+    var { position = "initial", size, align, blur, className, children } = _a, restProps = __rest(_a, ["position", "size", "align", "blur", "className", "children"]);
+    const [show, setShow] = useState(true);
+    const [lastScrollY, setLastScrollY] = useState(0);
+    useEffect(() => {
+        if (position !== "scroll")
+            return;
+        const handleScroll = () => {
+            const currentScrollY = window.scrollY;
+            if (currentScrollY > lastScrollY && currentScrollY > 50) {
+                // Scroll down
+                setShow(false);
+            }
+            else {
+                // Scroll up
+                setShow(true);
+            }
+            setLastScrollY(currentScrollY);
+        };
+        window.addEventListener("scroll", handleScroll);
+        return () => window.removeEventListener("scroll", handleScroll);
+    }, [lastScrollY, position]);
+    const joinedClassNames = classNames(styles.footer, { [styles.sticky]: position === "sticky" }, { [styles.hidden]: position === "scroll" && !show }, { [styles[size]]: size }, { [styles[align]]: align }, { [styles.blur]: blur }, className);
     return (React.createElement("footer", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
 //# sourceMappingURL=footer.js.map

package/dist/footer/footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../src/footer/footer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AASzC,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC5B,CACI,EAOC,EACD,GAAG,EACL,EAAE;QATA,EACI,QAAQ,GAAG,SAAS,EACpB,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,OAEX,EADM,SAAS,cANhB,sDAOC,CADe;IAIhB,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,MAAM,EACb,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,QAAQ,EAAE,EAC1C,EAAE,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK,EAAE,EACpC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,EACvB,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,8CAAQ,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACvD,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC,CACJ,CAAC"}
+{"version":3,"file":"footer.js","sourceRoot":"","sources":["../../src/footer/footer.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,MAAM,MAAM,qBAAqB,CAAC;AAUzC,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC5B,CACI,EAQC,EACD,GAAG,EACL,EAAE;QAVA,EACI,QAAQ,GAAG,SAAS,EACpB,IAAI,EACJ,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,OAEX,EADM,SAAS,cAPhB,8DAQC,CADe;IAIhB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,QAAQ,KAAK,QAAQ;YAAE,OAAO;QAElC,MAAM,YAAY,GAAG,GAAG,EAAE;YACtB,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,CAAC;YAEtC,IAAI,cAAc,GAAG,WAAW,IAAI,cAAc,GAAG,EAAE,EAAE,CAAC;gBACtD,cAAc;gBACd,OAAO,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;iBAAM,CAAC;gBACJ,YAAY;gBACZ,OAAO,CAAC,IAAI,CAAC,CAAC;YAClB,CAAC;YAED,cAAc,CAAC,cAAc,CAAC,CAAC;QACnC,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAChD,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;IAE5B,MAAM,gBAAgB,GAAG,UAAU,CAC/B,MAAM,CAAC,MAAM,EACb,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,QAAQ,EAAE,EAC1C,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,EACnD,EAAE,CAAC,MAAM,CAAC,IAAc,CAAC,CAAC,EAAE,IAAI,EAAE,EAClC,EAAE,CAAC,MAAM,CAAC,KAAe,CAAC,CAAC,EAAE,KAAK,EAAE,EACpC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,EACvB,SAAS,CACZ,CAAC;IAEF,OAAO,CACH,8CAAQ,GAAG,EAAE,GAAG,IAAM,SAAS,IAAE,SAAS,EAAE,gBAAgB,KACvD,QAAQ,CACJ,CACZ,CAAC;AACN,CAAC,CACJ,CAAC"}

package/dist/footer/footer.module.css

@@ -1,17 +1,42 @@
 .footer {
     display: flex;
-    box-sizing: border-box;
     flex-direction: row;
     align-items: center;
     flex-wrap: wrap;
     width: 100%;
     min-height: 6rem;
-    padding: 0.5rem 2rem;
+    padding-left: 2rem;
+    padding-right: 2rem;
     gap: 1rem;
+    box-sizing: border-box;
     z-index: 1;
     background: rgb(var(--surfaceContainerColor, 243 237 247));
     color: rgb(var(--onSurfaceColor, 28 27 31));
     fill: rgb(var(--onSurfaceColor, 28 27 31));
+    transition: transform 0.3s ease;
+    will-change: transform;
+    user-select: none;
+}
+
+.xs {
+    padding-left: max(2rem, calc(50% - 44.4rem / 2));
+    padding-right: max(2rem, calc(50% - 44.4rem / 2));
+}
+.sm {
+    padding-left: max(2rem, calc(50% - 60rem / 2));
+    padding-right: max(2rem, calc(50% - 60rem / 2));
+}
+.md {
+    padding-left: max(2rem, calc(50% - 90rem / 2));
+    padding-right: max(2rem, calc(50% - 90rem / 2));
+}
+.lg {
+    padding-left: max(2rem, calc(50% - 120rem / 2));
+    padding-right: max(2rem, calc(50% - 120rem / 2));
+}
+.xl {
+    padding-left: max(2rem, calc(50% - 150rem / 2));
+    padding-right: max(2rem, calc(50% - 150rem / 2));
 }
 
 .start {
@@ -24,12 +49,15 @@
     justify-content: flex-end;
 }
 
-.footer.sticky {
+.sticky {
     position: sticky;
     bottom: 0;
 }
+.hidden {
+    transform: translateY(100%);
+}
 
-.footer.blur {
+.blur {
     background-color: color-mix(
         in srgb,
         rgb(var(--surfaceContainerColor, 243 237 247)) 90%,

package/dist/stack/stack.module.css

@@ -1,7 +1,7 @@
 .stack {
     display: flex;
     flex-direction: column;
-    gap: 1rem;
+    gap: 2rem;
     box-sizing: border-box;
 }
 

package/dist/text/text.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-type TextVariant = "heading1" | "heading2" | "heading3" | "heading4" | "heading5" | "heading6" | "body1" | "body2" | "body3" | "caption" | "span";
+type TextVariant = "heading1" | "heading2" | "heading3" | "heading4" | "heading5" | "heading6" | "body1" | "body2" | "body3" | "body4" | "body5" | "body6" | "caption" | "span";
 export interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
     variant?: TextVariant;
     children?: React.ReactNode;
@@ -20,4 +20,9 @@ export interface SpanProps extends React.HTMLAttributes<HTMLSpanElement> {
     children?: React.ReactNode;
 }
 export declare const Span: React.ForwardRefExoticComponent<SpanProps & React.RefAttributes<HTMLSpanElement>>;
+export interface TextProps extends React.HTMLAttributes<HTMLDivElement> {
+    variant?: TextVariant;
+    children?: React.ReactNode;
+}
+export declare const Text: React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/text/text.js

@@ -43,7 +43,7 @@ export const H6 = forwardRef((_a, ref) => {
     return (React.createElement("h6", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
 export const P = forwardRef((_a, ref) => {
-    var { variant = "body2", className, children } = _a, restProps = __rest(_a, ["variant", "className", "children"]);
+    var { variant = "body5", className, children } = _a, restProps = __rest(_a, ["variant", "className", "children"]);
     const joinedClassNames = classNames(styles.text, styles[variant], className);
     return (React.createElement("p", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
@@ -52,4 +52,9 @@ export const Span = forwardRef((_a, ref) => {
     const joinedClassNames = classNames(styles.text, styles[variant], className);
     return (React.createElement("span", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
 });
+export const Text = forwardRef((_a, ref) => {
+    var { variant = "body5", className, children } = _a, restProps = __rest(_a, ["variant", "className", "children"]);
+    const joinedClassNames = classNames(styles[variant], className);
+    return (React.createElement("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames }), children));
+});
 //# sourceMappingURL=text.js.map

package/dist/text/text.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.js","sourceRoot":"","sources":["../../src/text/text.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"text.js","sourceRoot":"","sources":["../../src/text/text.tsx"],"names":[],"mappings":"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"}

package/dist/text/text.module.css

@@ -33,23 +33,38 @@
     line-height: 2.2rem;
 }
 .body1 {
+    font-size: 3rem;
+    font-weight: 400;
+    line-height: 3.8rem;
+}
+.body2 {
+    font-size: 2.4rem;
+    font-weight: 400;
+    line-height: 3rem;
+}
+.body3 {
+    font-size: 2rem;
+    font-weight: 400;
+    line-height: 2.4rem;
+}
+.body4 {
     font-size: 1.8rem;
     font-weight: 400;
     line-height: 2.4rem;
 }
-.body2 {
+.body5 {
     font-size: 1.6rem;
     font-weight: 400;
     line-height: 2.2rem;
 }
-.body3 {
+.body6 {
     font-size: 1.4rem;
     font-weight: 400;
     line-height: 2rem;
 }
 .caption {
     font-size: 1.2rem;
-    font-weight: 300;
+    font-weight: 400;
     line-height: 1.6rem;
 }
 .span {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@yakad/ui",
-    "version": "1.3.48",
+    "version": "1.3.50",
     "private": false,
     "author": "Natiq",
     "description": "UI components for NextJS/React",