@bouku/core 0.2.2 → 0.2.4

package/dist/components/button/_.d.ts

@@ -10,3 +10,4 @@
 export { default as Button } from "./normal";
 export { default as CopyButton } from "./copy";
 export { default as FileUploader } from "./upload";
+export { default as Actions } from "./actions";

package/dist/components/button/_.js

@@ -12,11 +12,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FileUploader = exports.CopyButton = exports.Button = void 0;
+exports.Actions = exports.FileUploader = exports.CopyButton = exports.Button = void 0;
 var normal_1 = require("./normal");
 Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
 var copy_1 = require("./copy");
 Object.defineProperty(exports, "CopyButton", { enumerable: true, get: function () { return __importDefault(copy_1).default; } });
 var upload_1 = require("./upload");
 Object.defineProperty(exports, "FileUploader", { enumerable: true, get: function () { return __importDefault(upload_1).default; } });
+var actions_1 = require("./actions");
+Object.defineProperty(exports, "Actions", { enumerable: true, get: function () { return __importDefault(actions_1).default; } });
 // 

package/dist/components/button/actions.d.ts

@@ -0,0 +1,14 @@
+import { type ButtonProps } from "./normal";
+type Props = {
+    style?: string;
+    size?: ButtonProps["size"];
+    items: Item[];
+};
+type Item = {
+    variant?: ButtonProps["variant"];
+    icon?: React.ReactNode;
+    action?: () => void;
+    children?: React.ReactNode;
+};
+declare const Actions: ({ style, size, items }: Props) => import("react").JSX.Element;
+export default Actions;

package/dist/components/button/actions.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const flex_1 = require("../container/flex");
+const normal_1 = require("./normal");
+const utils_1 = require("../../utils");
+const Actions = ({ style, size = "md", items }) => ((0, jsx_runtime_1.jsx)(flex_1.RowBox, { style: (0, utils_1.cn)("gap-2 items-center", style), children: items.map(({ variant, icon, action, children }, i) => ((0, jsx_runtime_1.jsx)(normal_1.Button, { size: size, variant: variant, icon: icon, action: action, children: children }, i))) }));
+exports.default = Actions;

package/dist/components/container/_.d.ts

@@ -1,5 +1,5 @@
 export { default as AbsoluteBox } from "./absolute";
 export { default as FadeBox } from "./fade";
-export { default as Rnd } from "./rnd";
+export { default as RnD } from "./rnd";
 export { default as ScrollBox } from "./scroll";
 export * from "./flex";

package/dist/components/container/_.js

@@ -17,13 +17,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ScrollBox = exports.Rnd = exports.FadeBox = exports.AbsoluteBox = void 0;
+exports.ScrollBox = exports.RnD = exports.FadeBox = exports.AbsoluteBox = void 0;
 var absolute_1 = require("./absolute");
 Object.defineProperty(exports, "AbsoluteBox", { enumerable: true, get: function () { return __importDefault(absolute_1).default; } });
 var fade_1 = require("./fade");
 Object.defineProperty(exports, "FadeBox", { enumerable: true, get: function () { return __importDefault(fade_1).default; } });
 var rnd_1 = require("./rnd");
-Object.defineProperty(exports, "Rnd", { enumerable: true, get: function () { return __importDefault(rnd_1).default; } });
+Object.defineProperty(exports, "RnD", { enumerable: true, get: function () { return __importDefault(rnd_1).default; } });
 var scroll_1 = require("./scroll");
 Object.defineProperty(exports, "ScrollBox", { enumerable: true, get: function () { return __importDefault(scroll_1).default; } });
 __exportStar(require("./flex"), exports);

package/dist/utils/hooks/state.d.ts

@@ -1,4 +1,9 @@
-export declare function useValue<T>(getValue: () => Promise<T>): T | null;
+interface GetValueOptions<T> {
+    fetcher: () => Promise<T>;
+    callback?: () => void;
+    interval?: number;
+}
+export declare function useValue<T>({ fetcher, callback, interval }: GetValueOptions<T>): readonly [T | null | undefined, boolean];
 export declare function useList<T extends {
     id?: string;
 }>(initial?: T[]): {

package/dist/utils/hooks/state.js

@@ -4,13 +4,42 @@ exports.useValue = useValue;
 exports.useList = useList;
 exports.useMap = useMap;
 const react_1 = require("react");
-function useValue(getValue) {
-    const [value, setValue] = (0, react_1.useState)(null);
+function useValue({ fetcher, callback, interval }) {
+    const [value, setValue] = (0, react_1.useState)();
+    const [isLoading, setLoading] = (0, react_1.useState)(true);
+    const fetchValue = async (showLoading = false) => {
+        if (showLoading)
+            setLoading(true);
+        try {
+            console.log("fetching");
+            const result = await fetcher();
+            const nextValue = result ?? null;
+            setValue(current => Object.is(current, nextValue)
+                ? current
+                : nextValue);
+        }
+        catch (err) {
+            console.error(err);
+        }
+        finally {
+            if (showLoading)
+                setLoading(false);
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        fetchValue(true);
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (!interval || value)
+            return;
+        const id = setInterval(() => fetchValue(), interval * 1000);
+        return () => clearInterval(id);
+    }, [interval, value]);
     (0, react_1.useEffect)(() => {
-        if (!value)
-            getValue().then(setValue);
-    }, [value]);
-    return value;
+        if (value && callback)
+            callback();
+    }, [value, callback]);
+    return [value, isLoading];
 }
 function useList(initial = []) {
     const [items, setItems] = (0, react_1.useState)(initial);

package/dist/utils/types/element.d.ts

@@ -11,6 +11,11 @@ export type Component = {
     style?: string;
     children?: ReactNode;
 };
+export type Clickable = Component & {
+    icon?: ReactNode;
+    action?: () => void;
+    disabled?: boolean;
+};
 export type Hoverable = {
     onHover?: () => void;
     onLeave?: () => void;

package/package.json

@@ -1,6 +1,7 @@
 {
+
   "name": "@bouku/core",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",
@@ -20,9 +21,11 @@
     "./styles.css": "./dist/styles.css"
   },
   "engines": {},
+
   "scripts": {
     "build": "tsc"
   },
+
   "dependencies": {
     "clsx": "^2.1.1",
     "framer-motion": "^12.23.6",
@@ -33,6 +36,7 @@
     "tailwind-variants": "^1.0.0",
     "ts-helper-kit": "^0.0.9"
   },
+
   "devDependencies": {
     "@types/node": "^24.3.1",
     "@types/react": "^19.1.10",
@@ -42,4 +46,5 @@
     "react-router-dom": "^7.12.0",
     "typescript": "^5.9.2"
   }
-}
+
+}

package/dist/assets/styles/button.css

@@ -1,76 +0,0 @@
-.test-button::before {
-  content: "";
-  display: block;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background:
-    linear-gradient(
-      180deg,
-      rgba(20, 60, 140, 0) 0%,
-      rgba(20, 60, 140, .32) 100%
-    ),
-    rgba(60, 120, 255, .12);
-  border-radius: inherit;
-  box-shadow: inset 0 0 12px #7fb0ff3d;
-  transition: .2s opacity cubic-bezier(.6, .6, 0, 1);
-  z-index: -1;
-}
-
-.test-button::after {
-  content: "";
-  display: block;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background:
-    linear-gradient(
-      180deg,
-      rgba(20, 60, 140, 0) 0%,
-      rgba(20, 60, 140, .42) 100%
-    ),
-    rgba(60, 120, 255, .24);
-  border-radius: inherit;
-  box-shadow: inset 0 0 12px #7fb0ff70;
-  transition: .2s opacity cubic-bezier(.6, .6, 0, 1);
-  opacity: 0;
-  z-index: -1;
-}
-
-.test-button-border {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  border-radius: inherit;
-  z-index: -1;
-}
-
-.test-button-border::before {
-  content: "";
-  position: absolute;
-  inset: 0;
-  padding: 1px;
-  background:
-    linear-gradient(
-      180deg,
-      rgba(180, 210, 255, .24) 0%,
-      rgba(180, 210, 255, 0) 100%
-    ),
-    linear-gradient(
-      0deg,
-      rgba(180, 210, 255, .32),
-      rgba(180, 210, 255, .32)
-    );
-  border-radius: inherit;
-  mask:
-    linear-gradient(#fff 0 0) content-box,
-    linear-gradient(#fff 0 0);
-  mask-composite: exclude;
-  pointer-events: none;
-}

package/dist/components/accordion/index.d.ts

@@ -1,6 +0,0 @@
-export default function Accordion({ items }: {
-    items: {
-        label: string;
-        content: React.ReactNode;
-    }[];
-}): import("react").JSX.Element;

package/dist/components/accordion/index.js

@@ -1,12 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = Accordion;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const flex_1 = require("../layout/flex");
-const tab_1 = require("./tab");
-function Accordion({ items }) {
-    const [activeItem, setActiveItem] = (0, react_1.useState)(0);
-    return ((0, jsx_runtime_1.jsx)(flex_1.ColumnBox, { style: "gap-5 overflow-y-auto scrollbar-none", children: items.map(({ label, content }, i) => ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: "gap-5", children: [(0, jsx_runtime_1.jsx)("div", { onClick: () => setActiveItem(i === activeItem ? null : i), children: (0, jsx_runtime_1.jsx)(tab_1.SectionHeader, { isActive: i === activeItem, label: label }) }), i === activeItem && ((0, jsx_runtime_1.jsx)(flex_1.RowBox, { style: "w-full", center: true, children: content }))] }, i))) }));
-}

package/dist/components/accordion/tab.d.ts

@@ -1,4 +0,0 @@
-export declare function SectionHeader({ isActive, label }: {
-    isActive: boolean;
-    label: string;
-}): import("react").JSX.Element;

package/dist/components/accordion/tab.js

@@ -1,35 +0,0 @@
-"use client";
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SectionHeader = SectionHeader;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const chevron_up_svg_1 = __importDefault(require("../../assets/icons/chevron-up.svg"));
-const tailwind_variants_1 = require("tailwind-variants");
-function SectionHeader({ isActive, label }) {
-    const s = getStyles({ isActive });
-    return ((0, jsx_runtime_1.jsxs)("div", { className: s.container(), children: [(0, jsx_runtime_1.jsx)("span", { className: s.label(), children: label }), (0, jsx_runtime_1.jsx)(chevron_up_svg_1.default, { className: s.chevron() })] }));
-}
-const getStyles = (0, tailwind_variants_1.tv)({
-    slots: {
-        container: "flex justify-between items-center gap-8 px-3 py-2 border rounded duration-200 cursor-pointer",
-        label: "font-bold",
-        chevron: "duration-200"
-    },
-    variants: {
-        isActive: {
-            true: {
-                container: "bg-surface-light border-border-light",
-                label: "text-primary",
-                chevron: "text-accent rotate-180"
-            },
-            false: {
-                container: "bg-surface hover:bg-surface-light border-border",
-                label: "text-primary-dark",
-                chevron: "text-primary-dark"
-            }
-        }
-    }
-});

package/dist/components/dropdown/normal.d.ts

@@ -1,10 +0,0 @@
-import { ReactNode } from "react";
-type Option = {
-    label: ReactNode;
-    action: () => void;
-};
-export default function Dropdown({ options, children }: {
-    options: Option[];
-    children: ReactNode;
-}): import("react").JSX.Element;
-export {};

package/dist/components/dropdown/normal.js

@@ -1,22 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = Dropdown;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const framer_motion_1 = require("framer-motion");
-function Dropdown({ options, children }) {
-    const [isOpen, setOpen] = (0, react_1.useState)(false);
-    const boom = (action) => {
-        action();
-        setOpen(false);
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: styles.container, children: [(0, jsx_runtime_1.jsx)("div", { onClick: () => setOpen(true), children: children }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: isOpen && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { className: styles.dropdown, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: options.map(({ label, action }, i) => ((0, jsx_runtime_1.jsx)("div", { className: "cursor-pointer duration-200 hover:brightness-115", onClick: () => boom(action), children: label }, i))) }, "dropdown")) })] }));
-}
-const styles = {
-    container: "relative shrink-0",
-    subcontainer: "flex flex-col gap-1 w-full",
-    label: "text-xs text-slate-600",
-    trigger: "flex justify-between items-center px-3 py-2 bg-slate-200/50 hover:bg-slate-200/80 border border-slate-300 outline-blue-500 rounded text-sm duration-200 cursor-pointer",
-    dropdown: "absolute mt-2 z-50 flex flex-col items-end justify-end gap-1 w-full bg-slate-950 rounded border border-border-dark p-3 pr-4 text-sm max-h-46 overflow-y-auto"
-};

package/dist/components/fade/_.d.ts

@@ -1 +0,0 @@
-export { default as CircleFade } from "./circle";

package/dist/components/fade/_.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CircleFade = void 0;
-var circle_1 = require("./circle");
-Object.defineProperty(exports, "CircleFade", { enumerable: true, get: function () { return __importDefault(circle_1).default; } });

package/dist/components/fade/circle.d.ts

@@ -1,10 +0,0 @@
-type Props = {
-    className?: string;
-    style?: {
-        top?: string;
-        left?: string;
-        transform?: string;
-    };
-};
-export default function CircleFade({ className, style }: Props): import("react").JSX.Element;
-export {};

package/dist/components/fade/circle.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = CircleFade;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const style_1 = require("../../utils/functions/style");
-function CircleFade({ className, style }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)("absolute size-24 bg-radial from-background", className), style: style }));
-}

package/dist/components/heading/_.d.ts

@@ -1,2 +0,0 @@
-export { default as Heading } from "./normal";
-export { default as PageHeading } from "./page";

package/dist/components/heading/_.js

@@ -1,10 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PageHeading = exports.Heading = void 0;
-var normal_1 = require("./normal");
-Object.defineProperty(exports, "Heading", { enumerable: true, get: function () { return __importDefault(normal_1).default; } });
-var page_1 = require("./page");
-Object.defineProperty(exports, "PageHeading", { enumerable: true, get: function () { return __importDefault(page_1).default; } });

package/dist/components/heading/normal.d.ts

@@ -1,24 +0,0 @@
-import { ReactNode } from "react";
-type Props = {
-    badge?: string;
-    image?: string;
-    title: ReactNode;
-    subtitle?: ReactNode;
-    style?: Styles;
-};
-type Styles = {
-    container?: string;
-    badge?: string;
-    title?: string;
-    subtitle?: string;
-};
-/**
- * Text heading with badge, title, subtitle.
- *
- * @param {string} badge - Little note above the title (optional).
- * @param {ReactNode} title - Main title content.
- * @param {ReactNode} subtitle - Subtitle content (optional).
- * @param {Styles} style - Additional styles (optional).
-**/
-export default function Heading({ badge, image, title, subtitle, style }: Props): import("react").JSX.Element;
-export {};

package/dist/components/heading/normal.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = Heading;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const style_1 = require("../../utils/functions/style");
-const flex_1 = require("../layout/flex");
-const badge_1 = require("../text/badge");
-/**
- * Text heading with badge, title, subtitle.
- *
- * @param {string} badge - Little note above the title (optional).
- * @param {ReactNode} title - Main title content.
- * @param {ReactNode} subtitle - Subtitle content (optional).
- * @param {Styles} style - Additional styles (optional).
-**/
-function Heading({ badge, image, title, subtitle, style = {} }) {
-    const styles = (0, style_1.mergeStyles)(base, style);
-    return ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: styles.container, children: [(0, jsx_runtime_1.jsx)(badge_1.Badge, { style: styles.badge, children: badge }), image && (0, jsx_runtime_1.jsx)("img", { className: styles.logo, src: image, alt: "Logo" }), (0, jsx_runtime_1.jsx)(flex_1.RowBox, { style: styles.title, children: title }), (0, jsx_runtime_1.jsx)(flex_1.RowBox, { style: styles.subtitle, children: subtitle })] }));
-}
-const base = {
-    container: "items-center",
-    badge: "mb-2",
-    logo: "mb-5 w-12",
-    title: "items-center gap-2 text-2xl sm:text-3xl 2xl:text-4xl font-bold text-primary",
-    subtitle: "items-center gap-2 max-sm:text-sm 2xl:text-lg text-center text-primary-light dark:text-primary-dark"
-};

package/dist/components/heading/page.d.ts

@@ -1,25 +0,0 @@
-import { ReactNode } from "react";
-type Props = {
-    style?: Styles;
-    badge?: string;
-    icon?: ReactNode;
-    title: string;
-    subtitle?: string;
-};
-type Styles = {
-    container?: string;
-    badge?: string;
-    title?: string;
-    subtitle?: string;
-};
-/**
- * Text heading with badge, title, subtitle.
- *
- * @param {Styles} style - Additional styles. (optional)
- * @param {string} badge - Little note above the title. (optional)
- * @param {ReactNode} icon - Component displayed left of title. (optional)
- * @param {string} title - Main title content.
- * @param {string} subtitle - Subtitle content. (optional)
-**/
-export default function PageHeading({ style, badge, icon, title, subtitle }: Props): import("react").JSX.Element;
-export {};

package/dist/components/heading/page.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = PageHeading;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const style_1 = require("../../utils/functions/style");
-const flex_1 = require("../layout/flex");
-const badge_1 = require("../text/badge");
-/**
- * Text heading with badge, title, subtitle.
- *
- * @param {Styles} style - Additional styles. (optional)
- * @param {string} badge - Little note above the title. (optional)
- * @param {ReactNode} icon - Component displayed left of title. (optional)
- * @param {string} title - Main title content.
- * @param {string} subtitle - Subtitle content. (optional)
-**/
-function PageHeading({ style = {}, badge, icon, title, subtitle }) {
-    const styles = (0, style_1.mergeStyles)(base, style);
-    return ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: styles.container, children: [(0, jsx_runtime_1.jsx)(badge_1.Badge, { style: styles.badge, children: badge }), (0, jsx_runtime_1.jsxs)(flex_1.RowBox, { style: styles.title, children: [icon, title] }), (0, jsx_runtime_1.jsx)(flex_1.RowBox, { style: styles.subtitle, children: subtitle })] }));
-}
-const base = {
-    container: "w-full items-center font-mono",
-    badge: "mb-2",
-    title: "items-center gap-2 mb-3 text-4xl sm:text-5xl 2xl:text-6xl text-center font-bold text-primary",
-    subtitle: "items-center gap-2 text-sm sm:text-base 2xl:text-lg text-center text-primary-light dark:text-primary-dark"
-};

package/dist/components/information/_.d.ts

@@ -1 +0,0 @@
-export { default as Card } from "./card";

package/dist/components/information/_.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-var card_1 = require("./card");
-Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return __importDefault(card_1).default; } });

package/dist/components/information/card.d.ts

@@ -1,8 +0,0 @@
-type Props = {
-    label: string;
-    value?: string | number | null;
-    units?: string;
-    note?: string;
-};
-export declare const Card: ({ label, value, units, note }: Props) => import("react").JSX.Element;
-export default Card;

package/dist/components/information/card.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const flex_1 = require("../layout/flex");
-const Card = ({ label, value, units, note }) => ((0, jsx_runtime_1.jsxs)(flex_1.ColumnBox, { style: s.card, children: [(0, jsx_runtime_1.jsx)("span", { className: s.label, children: label }), (0, jsx_runtime_1.jsxs)("span", { className: s.value, children: [formatValue(value), " ", units] }), (0, jsx_runtime_1.jsx)("span", { className: s.note, children: note })] }));
-exports.Card = Card;
-const formatValue = (x) => {
-    if (!x)
-        return "N/A";
-    if (typeof x === "string")
-        return x;
-    else if (typeof x === "number")
-        return x.toLocaleString("en-US");
-};
-const s = {
-    card: "gap-2 flex-1 p-5 bg-surface border border-border-light rounded-md shadow hover:brightness-120 duration-200",
-    label: "text-sm font-mono tracking-wide text-primary-dark uppercase",
-    value: "text-5xl font-bold",
-    note: "text-xs text-primary-dark"
-};
-exports.default = exports.Card;

package/dist/components/layout/absolute.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode, RefObject } from "react";
-type Props = {
-    pos?: string;
-    style?: string;
-    ref?: RefObject<HTMLDivElement | null>;
-    children: ReactNode;
-};
-export default function AbsoluteBox({ pos, style, ref, children }: Props): import("react").JSX.Element;
-export {};

package/dist/components/layout/absolute.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = AbsoluteBox;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const style_1 = require("../../utils/functions/style");
-function AbsoluteBox({ pos, style, ref, children }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(styles.container, pos), ref: ref, children: (0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(styles.subcontainer, style), children: children }) }));
-}
-const styles = {
-    container: "absolute",
-    subcontainer: "relative w-full h-full"
-};

package/dist/components/layout/fade.d.ts

@@ -1,7 +0,0 @@
-import type { Component } from "../../utils/types/element";
-type Props = Component & {
-    direction?: "up" | "left" | "down";
-    gradient?: string;
-};
-export declare function FadeBox({ style, direction, gradient, children }: Props): import("react").JSX.Element;
-export default FadeBox;

package/dist/components/layout/fade.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FadeBox = FadeBox;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const style_1 = require("../../utils/functions/style");
-const tailwind_variants_1 = require("tailwind-variants");
-function FadeBox({ style, direction = "up", gradient, children }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.cn)("relative", style), children: [children, (0, jsx_runtime_1.jsx)("div", { className: (0, style_1.cn)(styles({ direction }), gradient) })] }));
-}
-const styles = (0, tailwind_variants_1.tv)({
-    base: "absolute from-background",
-    variants: {
-        direction: {
-            up: "left-0 bottom-0 w-full h-full bg-gradient-to-t",
-            left: "top-0 right-0 w-12 h-full bg-gradient-to-l",
-            down: "top-0 left-0 w-full h-full bg-gradient-to-b"
-        }
-    }
-});
-exports.default = FadeBox;

package/dist/components/layout/flex.d.ts

@@ -1,17 +0,0 @@
-import { Component, Hoverable } from "../../utils";
-type Props = Component & Hoverable & {
-    center?: boolean;
-    centerX?: boolean;
-    centerY?: boolean;
-    equal?: boolean;
-};
-/**
- * Flex containers with configurable alignment and styling.
- *
- * @param {string} style - Additional styles for container.
- * @param {ReactNode} children - Child elements to render inside the row.
- * @param {Props} opts - Variant options for styling.
-**/
-export declare function RowBox({ style, children, onHover, onLeave, ...opts }: Props): import("react").JSX.Element | null;
-export declare function ColumnBox({ style, children, onHover, onLeave, ...opts }: Props): import("react").JSX.Element | null;
-export {};