@yakad/ui 1.3.99 → 1.3.101

package/dist/AppBar/AppBar.js

@@ -1,5 +1,4 @@
 "use client";
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -11,21 +10,16 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AppBar = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-const AppBar_module_css_1 = __importDefault(require("./AppBar.module.css"));
-exports.AppBar = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useEffect, useState } from "react";
+import classNames from "classnames";
+import boxingStyles from "../boxing.module.css";
+import styles from "./AppBar.module.css";
+export const AppBar = forwardRef((_a, ref) => {
     var { align, overflow = "shrink", position = "initial", size, blur, className, children } = _a, restProps = __rest(_a, ["align", "overflow", "position", "size", "blur", "className", "children"]);
-    const [show, setShow] = (0, react_1.useState)(true);
-    const [lastScrollY, setLastScrollY] = (0, react_1.useState)(0);
-    (0, react_1.useEffect)(() => {
+    const [show, setShow] = useState(true);
+    const [lastScrollY, setLastScrollY] = useState(0);
+    useEffect(() => {
         if (position !== "scroll")
             return;
         const handleScroll = () => {
@@ -43,9 +37,9 @@ exports.AppBar = (0, react_1.forwardRef)((_a, ref) => {
         window.addEventListener("scroll", handleScroll);
         return () => window.removeEventListener("scroll", handleScroll);
     }, [lastScrollY, position]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexRowBox, { [boxing_module_css_1.default[align]]: align }, boxing_module_css_1.default[overflow], AppBar_module_css_1.default.header, {
-        [AppBar_module_css_1.default.sticky]: position === "sticky" || position === "scroll",
-    }, { [AppBar_module_css_1.default.hidden]: position === "scroll" && !show }, { [AppBar_module_css_1.default[size]]: size }, { [AppBar_module_css_1.default.blur]: blur }, className);
-    return ((0, jsx_runtime_1.jsx)("header", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexRowBox, { [boxingStyles[align]]: align }, boxingStyles[overflow], styles.header, {
+        [styles.sticky]: position === "sticky" || position === "scroll",
+    }, { [styles.hidden]: position === "scroll" && !show }, { [styles[size]]: size }, { [styles.blur]: blur }, className);
+    return (_jsx("header", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.AppBar.displayName = "AppBar";
+AppBar.displayName = "AppBar";

package/dist/Button/Button.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,23 +9,18 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const __1 = require("..");
-const Button_module_css_1 = __importDefault(require("./Button.module.css"));
-exports.Button = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import { LoadingIcon } from "..";
+import styles from "./Button.module.css";
+export const Button = forwardRef((_a, ref) => {
     var { size = "medium", variant = "text", borderstyle = "rounded", icon, iconposition = "start", loadingposition = "auto", loadingvariant, className, children } = _a, restProps = __rest(_a, ["size", "variant", "borderstyle", "icon", "iconposition", "loadingposition", "loadingvariant", "className", "children"]);
     const childrenFirst = Boolean(iconposition === "end");
     const isLoadingPositionCenter = Boolean(!icon || loadingposition === "center");
-    const joinedClassNames = (0, classnames_1.default)(Button_module_css_1.default.button, Button_module_css_1.default[variant], { [Button_module_css_1.default.loading]: loadingvariant }, { [Button_module_css_1.default.loadingPositionCenter]: isLoadingPositionCenter }, Button_module_css_1.default[size], Button_module_css_1.default[borderstyle], { [Button_module_css_1.default.iconButton]: !children && icon }, className);
-    return ((0, jsx_runtime_1.jsxs)("button", Object.assign({ ref: ref, className: joinedClassNames }, restProps, { children: [childrenFirst && children, loadingvariant && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Button_module_css_1.default.displayOnDisabled, {
-                    [Button_module_css_1.default.positionCenter]: isLoadingPositionCenter,
-                }), children: (0, jsx_runtime_1.jsx)(__1.LoadingIcon, { size: size, variant: loadingvariant }) })), icon, !childrenFirst && children] })));
+    const joinedClassNames = classNames(styles.button, styles[variant], { [styles.loading]: loadingvariant }, { [styles.loadingPositionCenter]: isLoadingPositionCenter }, styles[size], styles[borderstyle], { [styles.iconButton]: !children && icon }, className);
+    return (_jsxs("button", Object.assign({ ref: ref, className: joinedClassNames }, restProps, { children: [childrenFirst && children, loadingvariant && (_jsx("div", { className: classNames(styles.displayOnDisabled, {
+                    [styles.positionCenter]: isLoadingPositionCenter,
+                }), children: _jsx(LoadingIcon, { size: size, variant: loadingvariant }) })), icon, !childrenFirst && children] })));
 });
-exports.Button.displayName = "Button";
+Button.displayName = "Button";

package/dist/Card/Card.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-const Card_module_css_1 = __importDefault(require("./Card.module.css"));
-exports.Card = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import boxingStyles from "../boxing.module.css";
+import styles from "./Card.module.css";
+export const Card = forwardRef((_a, ref) => {
     var { align, blur, className, children } = _a, restProps = __rest(_a, ["align", "blur", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexColumnBox, { [boxing_module_css_1.default[align]]: align }, "fullWidthLover", Card_module_css_1.default.card, { [Card_module_css_1.default.blur]: blur }, className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexColumnBox, { [boxingStyles[align]]: align }, "fullWidthLover", styles.card, { [styles.blur]: blur }, className);
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.Card.displayName = "Card";
+Card.displayName = "Card";

package/dist/CheckBox/CheckBox.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CheckBox = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const symbols_1 = require("@yakad/symbols");
-const CheckBox_module_css_1 = __importDefault(require("./CheckBox.module.css"));
-exports.CheckBox = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import { Symbol } from "@yakad/symbols";
+import styles from "./CheckBox.module.css";
+export const CheckBox = forwardRef((_a, ref) => {
     var { label, className, style } = _a, restProps = __rest(_a, ["label", "className", "style"]);
-    const joinedClassNames = (0, classnames_1.default)(label && "fullWidthLover", CheckBox_module_css_1.default.label, { [CheckBox_module_css_1.default.labeled]: label }, { [CheckBox_module_css_1.default.disabled]: restProps.disabled }, className);
-    return ((0, jsx_runtime_1.jsxs)("label", { className: joinedClassNames, style: style, children: [label, (0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, restProps, { className: CheckBox_module_css_1.default.input, type: "checkbox" })), (0, jsx_runtime_1.jsxs)("div", { className: CheckBox_module_css_1.default.symbolContainer, children: [(0, jsx_runtime_1.jsx)(symbols_1.Symbol, { className: CheckBox_module_css_1.default.symbolChecked, icon: "check_box" }), (0, jsx_runtime_1.jsx)(symbols_1.Symbol, { className: CheckBox_module_css_1.default.symbolUnChecked, icon: "check_box_outline_blank" })] })] }));
+    const joinedClassNames = classNames(label && "fullWidthLover", styles.label, { [styles.labeled]: label }, { [styles.disabled]: restProps.disabled }, className);
+    return (_jsxs("label", { className: joinedClassNames, style: style, children: [label, _jsx("input", Object.assign({ ref: ref }, restProps, { className: styles.input, type: "checkbox" })), _jsxs("div", { className: styles.symbolContainer, children: [_jsx(Symbol, { className: styles.symbolChecked, icon: "check_box" }), _jsx(Symbol, { className: styles.symbolUnChecked, icon: "check_box_outline_blank" })] })] }));
 });
-exports.CheckBox.displayName = "CheckBox";
+CheckBox.displayName = "CheckBox";

package/dist/ClickOutsideListener/ClickOutsideListener.js

@@ -1,5 +1,4 @@
 "use client";
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -11,14 +10,12 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ClickOutsideListener = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const ClickOutsideListener = (_a) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+export const ClickOutsideListener = (_a) => {
     var { onclickoutside, children } = _a, restProps = __rest(_a, ["onclickoutside", "children"]);
-    const ref = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
+    const ref = useRef(null);
+    useEffect(() => {
         const handleOutSideClick = (event) => {
             if (ref.current && !ref.current.contains(event.target))
                 onclickoutside === null || onclickoutside === void 0 ? void 0 : onclickoutside();
@@ -27,6 +24,5 @@ const ClickOutsideListener = (_a) => {
         // CleanUp When element unmount
         return () => document.removeEventListener("click", handleOutSideClick, true);
     }, [onclickoutside]);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { children: children })));
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { children: children })));
 };
-exports.ClickOutsideListener = ClickOutsideListener;

package/dist/CodeBox/CodeBox.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,20 +9,15 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CodeBox = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const symbols_1 = require("@yakad/symbols");
-const __1 = require("..");
-const CodeBox_module_css_1 = __importDefault(require("./CodeBox.module.css"));
-exports.CodeBox = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import { Symbol } from "@yakad/symbols";
+import { Button, Card } from "..";
+import styles from "./CodeBox.module.css";
+export const CodeBox = forwardRef((_a, ref) => {
     var { copybutton, className, children } = _a, restProps = __rest(_a, ["copybutton", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)("fullWidthLover", CodeBox_module_css_1.default.ZZZZZZZZZZ, className);
-    return ((0, jsx_runtime_1.jsxs)(__1.Card, Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: [(0, jsx_runtime_1.jsx)("pre", { children: children }), copybutton && (0, jsx_runtime_1.jsx)(__1.Button, { icon: (0, jsx_runtime_1.jsx)(symbols_1.Symbol, { icon: "copy_all" }) })] })));
+    const joinedClassNames = classNames("fullWidthLover", styles.ZZZZZZZZZZ, className);
+    return (_jsxs(Card, Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: [_jsx("pre", { children: children }), copybutton && _jsx(Button, { icon: _jsx(Symbol, { icon: "copy_all" }) })] })));
 });
-exports.CodeBox.displayName = "CodeBox";
+CodeBox.displayName = "CodeBox";

package/dist/CodeField/CodeField.js

@@ -1,5 +1,4 @@
 "use client";
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -11,15 +10,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CodeField = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const CodeField_module_css_1 = __importDefault(require("./CodeField.module.css"));
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./CodeField.module.css";
 function isInputFilled(event, inputLength) {
     const targetInputElement = event.target;
     removeUnNumberChars(targetInputElement);
@@ -36,13 +30,13 @@ function sliceOverLength(inputElement, inputLength) {
 function removeUnNumberChars(inputElement) {
     inputElement.value = inputElement.value.replace(/[^0-9]+/, "");
 }
-exports.CodeField = (0, react_1.forwardRef)((_a, ref) => {
+export const CodeField = forwardRef((_a, ref) => {
     var { length = 6, onfilled, autoComplete, pattern, onInput, className, style } = _a, restProps = __rest(_a, ["length", "onfilled", "autoComplete", "pattern", "onInput", "className", "style"]);
-    const joinedClassNames = (0, classnames_1.default)("fullWidthLover", CodeField_module_css_1.default.input, className);
+    const joinedClassNames = classNames("fullWidthLover", styles.input, className);
     const joinedStyles = Object.assign(Object.assign({}, style), { width: `calc(1.5ch * ${length})` });
-    return ((0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles, type: "number", minLength: length, maxLength: length, autoComplete: autoComplete || "off", pattern: pattern || "[0-9]", onInput: (event) => {
+    return (_jsx("input", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles, type: "number", minLength: length, maxLength: length, autoComplete: autoComplete || "off", pattern: pattern || "[0-9]", onInput: (event) => {
             isInputFilled(event, length) && onfilled;
             onInput;
         } })));
 });
-exports.CodeField.displayName = "CodeField";
+CodeField.displayName = "CodeField";

package/dist/Container/Container.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Container = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-const Container_module_css_1 = __importDefault(require("./Container.module.css"));
-exports.Container = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import boxingStyles from "../boxing.module.css";
+import styles from "./Container.module.css";
+export const Container = forwardRef((_a, ref) => {
     var { size = "xl", align, className, children } = _a, restProps = __rest(_a, ["size", "align", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexColumnBox, { [boxing_module_css_1.default[align]]: align }, Container_module_css_1.default.container, Container_module_css_1.default[size], className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexColumnBox, { [boxingStyles[align]]: align }, styles.container, styles[size], className);
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.Container.displayName = "Container";
+Container.displayName = "Container";

package/dist/Display/Display.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,18 +9,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Display = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const Display_module_css_1 = __importDefault(require("./Display.module.css"));
-exports.Display = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./Display.module.css";
+export const Display = forwardRef((_a, ref) => {
     var { minWidth, maxWidth, className, children } = _a, restProps = __rest(_a, ["minWidth", "maxWidth", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)("fullWidthLover", { [Display_module_css_1.default[`${minWidth}MinWidth`]]: minWidth }, { [Display_module_css_1.default[`${maxWidth}MaxWidth`]]: maxWidth }, className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames("fullWidthLover", { [styles[`${minWidth}MinWidth`]]: minWidth }, { [styles[`${maxWidth}MaxWidth`]]: maxWidth }, className);
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.Display.displayName = "Display";
+Display.displayName = "Display";

package/dist/Footer/Footer.js

@@ -1,5 +1,4 @@
 "use client";
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -11,21 +10,16 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Footer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-const Footer_module_css_1 = __importDefault(require("./Footer.module.css"));
-exports.Footer = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, useState, useEffect } from "react";
+import classNames from "classnames";
+import boxingStyles from "../boxing.module.css";
+import styles from "./Footer.module.css";
+export const Footer = forwardRef((_a, ref) => {
     var { align, overflow = "shrink", position = "initial", size, blur, className, children } = _a, restProps = __rest(_a, ["align", "overflow", "position", "size", "blur", "className", "children"]);
-    const [show, setShow] = (0, react_1.useState)(true);
-    const [lastScrollY, setLastScrollY] = (0, react_1.useState)(0);
-    (0, react_1.useEffect)(() => {
+    const [show, setShow] = useState(true);
+    const [lastScrollY, setLastScrollY] = useState(0);
+    useEffect(() => {
         if (position !== "scroll")
             return;
         const handleScroll = () => {
@@ -43,7 +37,7 @@ exports.Footer = (0, react_1.forwardRef)((_a, ref) => {
         window.addEventListener("scroll", handleScroll);
         return () => window.removeEventListener("scroll", handleScroll);
     }, [lastScrollY, position]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexRowBox, { [boxing_module_css_1.default[align]]: align }, boxing_module_css_1.default[overflow], Footer_module_css_1.default.footer, { [Footer_module_css_1.default.sticky]: position === "sticky" || position === "scroll" }, { [Footer_module_css_1.default.hidden]: position === "scroll" && !show }, { [Footer_module_css_1.default[size]]: size }, { [Footer_module_css_1.default.blur]: blur }, className);
-    return ((0, jsx_runtime_1.jsx)("footer", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexRowBox, { [boxingStyles[align]]: align }, boxingStyles[overflow], styles.footer, { [styles.sticky]: position === "sticky" || position === "scroll" }, { [styles.hidden]: position === "scroll" && !show }, { [styles[size]]: size }, { [styles.blur]: blur }, className);
+    return (_jsx("footer", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.Footer.displayName = "Footer";
+Footer.displayName = "Footer";

package/dist/Form/Form.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Form = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const Form_module_css_1 = __importDefault(require("./Form.module.css"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-exports.Form = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./Form.module.css";
+import boxingStyles from "../boxing.module.css";
+export const Form = forwardRef((_a, ref) => {
     var { align, className, children } = _a, restProps = __rest(_a, ["align", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexColumnBox, { [boxing_module_css_1.default[align]]: align }, "fullWidthLover", Form_module_css_1.default.form, className);
-    return ((0, jsx_runtime_1.jsx)("form", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexColumnBox, { [boxingStyles[align]]: align }, "fullWidthLover", styles.form, className);
+    return (_jsx("form", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.Form.displayName = "Form";
+Form.displayName = "Form";

package/dist/GridContainer/GridContainer.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GridContainer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const GridContainer_module_css_1 = __importDefault(require("./GridContainer.module.css"));
-exports.GridContainer = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./GridContainer.module.css";
+export const GridContainer = forwardRef((_a, ref) => {
     var { gap = 1.5, columns = 12, className, style, children } = _a, restProps = __rest(_a, ["gap", "columns", "className", "style", "children"]);
-    const joinedClassNames = (0, classnames_1.default)(GridContainer_module_css_1.default.gridcontainer, GridContainer_module_css_1.default[`gridColumns${columns}`], className);
+    const joinedClassNames = classNames(styles.gridcontainer, styles[`gridColumns${columns}`], className);
     const joinedStyles = Object.assign(Object.assign({}, style), { columnGap: (style === null || style === void 0 ? void 0 : style.columnGap) || `${gap}rem`, rowGap: (style === null || style === void 0 ? void 0 : style.rowGap) || `${gap}rem` });
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles, children: children })));
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles, children: children })));
 });
-exports.GridContainer.displayName = "GridContainer";
+GridContainer.displayName = "GridContainer";

package/dist/GridItem/GridItem.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GridItem = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const boxing_module_css_1 = __importDefault(require("../boxing.module.css"));
-const GridItem_module_css_1 = __importDefault(require("./GridItem.module.css"));
-exports.GridItem = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import boxingStyles from "../boxing.module.css";
+import styles from "./GridItem.module.css";
+export const GridItem = forwardRef((_a, ref) => {
     var { align, xs, sm, md, lg, xl, className, children } = _a, restProps = __rest(_a, ["align", "xs", "sm", "md", "lg", "xl", "className", "children"]);
-    const joinedClassNames = (0, classnames_1.default)(boxing_module_css_1.default.flexColumnBox, { [boxing_module_css_1.default[align]]: align }, GridItem_module_css_1.default.gridItem, { [GridItem_module_css_1.default[`xs${xs}`]]: xs }, { [GridItem_module_css_1.default[`sm${sm}`]]: sm }, { [GridItem_module_css_1.default[`md${md}`]]: md }, { [GridItem_module_css_1.default[`lg${lg}`]]: lg }, { [GridItem_module_css_1.default[`xl${xl}`]]: xl }, className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
+    const joinedClassNames = classNames(boxingStyles.flexColumnBox, { [boxingStyles[align]]: align }, styles.gridItem, { [styles[`xs${xs}`]]: xs }, { [styles[`sm${sm}`]]: sm }, { [styles[`md${md}`]]: md }, { [styles[`lg${lg}`]]: lg }, { [styles[`xl${xl}`]]: xl }, className);
+    return (_jsx("div", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, children: children })));
 });
-exports.GridItem.displayName = "GridItem";
+GridItem.displayName = "GridItem";

package/dist/Hr/Hr.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hr = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const Hr_module_css_1 = __importDefault(require("./Hr.module.css"));
-exports.Hr = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./Hr.module.css";
+export const Hr = forwardRef((_a, ref) => {
     var { variant, height, marginx, className, style } = _a, restProps = __rest(_a, ["variant", "height", "marginx", "className", "style"]);
-    const joinedClassNames = (0, classnames_1.default)(Hr_module_css_1.default.hr, variant && Hr_module_css_1.default[variant], className);
+    const joinedClassNames = classNames(styles.hr, variant && styles[variant], className);
     const joinedStyles = Object.assign(Object.assign({}, style), { borderTopWidth: height ? `${height}rem` : style === null || style === void 0 ? void 0 : style.borderTopWidth, marginTop: marginx ? `${marginx}rem` : style === null || style === void 0 ? void 0 : style.marginTop, marginBottom: marginx ? `${marginx}rem` : style === null || style === void 0 ? void 0 : style.marginBottom });
-    return ((0, jsx_runtime_1.jsx)("hr", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles })));
+    return (_jsx("hr", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, style: joinedStyles })));
 });
-exports.Hr.displayName = "Hr";
+Hr.displayName = "Hr";

package/dist/InputField/InputField.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,18 +9,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InputField = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const InputField_module_css_1 = __importDefault(require("./InputField.module.css"));
-exports.InputField = (0, react_1.forwardRef)((_a, ref) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import classNames from "classnames";
+import styles from "./InputField.module.css";
+export const InputField = forwardRef((_a, ref) => {
     var { variant = "outlined", boxsize = "normal", placeholder, className } = _a, restProps = __rest(_a, ["variant", "boxsize", "placeholder", "className"]);
-    const joinedClassNames = (0, classnames_1.default)(InputField_module_css_1.default.input, InputField_module_css_1.default[variant], InputField_module_css_1.default[boxsize], placeholder && InputField_module_css_1.default.havePlaceHolder, className);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)("fullWidthLover", InputField_module_css_1.default.div), children: [(0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, placeholder: " " })), placeholder && ((0, jsx_runtime_1.jsx)("label", { className: InputField_module_css_1.default.label, children: placeholder }))] }));
+    const joinedClassNames = classNames(styles.input, styles[variant], styles[boxsize], placeholder && styles.havePlaceHolder, className);
+    return (_jsxs("div", { className: classNames("fullWidthLover", styles.div), children: [_jsx("input", Object.assign({ ref: ref }, restProps, { className: joinedClassNames, placeholder: " " })), placeholder && (_jsx("label", { className: styles.label, children: placeholder }))] }));
 });
-exports.InputField.displayName = "InputField";
+InputField.displayName = "InputField";