funuicss 2.5.8 → 2.5.9

package/dist/index.d.ts

@@ -0,0 +1,37 @@
+export { default as Alert } from "./ui/alert/Alert";
+export { default as ThemeProvider } from "./ui/theme/theme";
+export { default as Button } from "./ui/button/Button";
+export { default as Card } from "./ui/card/Card";
+export { default as BreadCrumb } from "./ui/breadcrumb/BreadCrumb";
+export { default as Container } from "./ui/container/Container";
+export { default as Grid } from "./ui/grid/Grid";
+export { default as Col } from "./ui/grid/Col";
+export { default as Input } from "./ui/input/Input";
+export { default as Loader } from "./ui/loader/Loader";
+export { default as Modal } from "./ui/modal/Modal";
+export { default as Table } from "./ui/table/Table";
+export { default as List } from "./ui/list/List";
+export { default as Text } from "./ui/text/Text";
+export { default as Div } from "./ui/div/Div";
+export { default as StepContainer } from "./ui/step/Container";
+export { default as Step } from "./ui/step/Step";
+export { default as StepHeader } from "./ui/step/Header";
+export { default as StepLine } from "./ui/step/Line";
+export { default as NotFound } from "./ui/page/NotFound";
+export { default as UnAuthorized } from "./ui/page/UnAuthorized";
+export { default as DropUp } from "./ui/drop/Up";
+export { default as DropDown } from "./ui/drop/Down";
+export { default as Dropdown } from "./ui/drop/Dropdown";
+export { default as DropItem } from "./ui/drop/Item";
+export { default as DropMenu } from "./ui/drop/Menu";
+export { default as ProgressBar } from "./ui/progress/Bar";
+export { default as FunLoader } from "./ui/loader/Loader";
+export { default as Notification } from "./ui/notification/Notification";
+export { default as ToolTip } from "./ui/tooltip/ToolTip";
+export { default as AppBar } from "./ui/appbar/AppBar";
+export { default as Tip } from "./ui/tooltip/Tip";
+export { default as RowFlex } from "./ui/specials/RowFlex";
+export { default as Section } from "./ui/specials/Section";
+export { default as Hr } from "./ui/specials/Hr";
+export { default as Circle } from "./ui/specials/Circle";
+export { default as FullCenteredPage } from "./ui/specials/FullCenteredPage";

package/dist/index.js

@@ -0,0 +1,80 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FullCenteredPage = exports.Circle = exports.Hr = exports.Section = exports.RowFlex = exports.Tip = exports.AppBar = exports.ToolTip = exports.Notification = exports.FunLoader = exports.ProgressBar = exports.DropMenu = exports.DropItem = exports.Dropdown = exports.DropDown = exports.DropUp = exports.UnAuthorized = exports.NotFound = exports.StepLine = exports.StepHeader = exports.Step = exports.StepContainer = exports.Div = exports.Text = exports.List = exports.Table = exports.Modal = exports.Loader = exports.Input = exports.Col = exports.Grid = exports.Container = exports.BreadCrumb = exports.Card = exports.Button = exports.ThemeProvider = exports.Alert = void 0;
+var Alert_1 = require("./ui/alert/Alert");
+Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return __importDefault(Alert_1).default; } });
+var theme_1 = require("./ui/theme/theme");
+Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return __importDefault(theme_1).default; } });
+var Button_1 = require("./ui/button/Button");
+Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(Button_1).default; } });
+var Card_1 = require("./ui/card/Card");
+Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return __importDefault(Card_1).default; } });
+var BreadCrumb_1 = require("./ui/breadcrumb/BreadCrumb");
+Object.defineProperty(exports, "BreadCrumb", { enumerable: true, get: function () { return __importDefault(BreadCrumb_1).default; } });
+var Container_1 = require("./ui/container/Container");
+Object.defineProperty(exports, "Container", { enumerable: true, get: function () { return __importDefault(Container_1).default; } });
+var Grid_1 = require("./ui/grid/Grid");
+Object.defineProperty(exports, "Grid", { enumerable: true, get: function () { return __importDefault(Grid_1).default; } });
+var Col_1 = require("./ui/grid/Col");
+Object.defineProperty(exports, "Col", { enumerable: true, get: function () { return __importDefault(Col_1).default; } });
+var Input_1 = require("./ui/input/Input");
+Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return __importDefault(Input_1).default; } });
+var Loader_1 = require("./ui/loader/Loader");
+Object.defineProperty(exports, "Loader", { enumerable: true, get: function () { return __importDefault(Loader_1).default; } });
+var Modal_1 = require("./ui/modal/Modal");
+Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return __importDefault(Modal_1).default; } });
+var Table_1 = require("./ui/table/Table");
+Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return __importDefault(Table_1).default; } });
+var List_1 = require("./ui/list/List");
+Object.defineProperty(exports, "List", { enumerable: true, get: function () { return __importDefault(List_1).default; } });
+var Text_1 = require("./ui/text/Text");
+Object.defineProperty(exports, "Text", { enumerable: true, get: function () { return __importDefault(Text_1).default; } });
+var Div_1 = require("./ui/div/Div");
+Object.defineProperty(exports, "Div", { enumerable: true, get: function () { return __importDefault(Div_1).default; } });
+var Container_2 = require("./ui/step/Container");
+Object.defineProperty(exports, "StepContainer", { enumerable: true, get: function () { return __importDefault(Container_2).default; } });
+var Step_1 = require("./ui/step/Step");
+Object.defineProperty(exports, "Step", { enumerable: true, get: function () { return __importDefault(Step_1).default; } });
+var Header_1 = require("./ui/step/Header");
+Object.defineProperty(exports, "StepHeader", { enumerable: true, get: function () { return __importDefault(Header_1).default; } });
+var Line_1 = require("./ui/step/Line");
+Object.defineProperty(exports, "StepLine", { enumerable: true, get: function () { return __importDefault(Line_1).default; } });
+var NotFound_1 = require("./ui/page/NotFound");
+Object.defineProperty(exports, "NotFound", { enumerable: true, get: function () { return __importDefault(NotFound_1).default; } });
+var UnAuthorized_1 = require("./ui/page/UnAuthorized");
+Object.defineProperty(exports, "UnAuthorized", { enumerable: true, get: function () { return __importDefault(UnAuthorized_1).default; } });
+var Up_1 = require("./ui/drop/Up");
+Object.defineProperty(exports, "DropUp", { enumerable: true, get: function () { return __importDefault(Up_1).default; } });
+var Down_1 = require("./ui/drop/Down");
+Object.defineProperty(exports, "DropDown", { enumerable: true, get: function () { return __importDefault(Down_1).default; } });
+var Dropdown_1 = require("./ui/drop/Dropdown");
+Object.defineProperty(exports, "Dropdown", { enumerable: true, get: function () { return __importDefault(Dropdown_1).default; } });
+var Item_1 = require("./ui/drop/Item");
+Object.defineProperty(exports, "DropItem", { enumerable: true, get: function () { return __importDefault(Item_1).default; } });
+var Menu_1 = require("./ui/drop/Menu");
+Object.defineProperty(exports, "DropMenu", { enumerable: true, get: function () { return __importDefault(Menu_1).default; } });
+var Bar_1 = require("./ui/progress/Bar");
+Object.defineProperty(exports, "ProgressBar", { enumerable: true, get: function () { return __importDefault(Bar_1).default; } });
+var Loader_2 = require("./ui/loader/Loader");
+Object.defineProperty(exports, "FunLoader", { enumerable: true, get: function () { return __importDefault(Loader_2).default; } });
+var Notification_1 = require("./ui/notification/Notification");
+Object.defineProperty(exports, "Notification", { enumerable: true, get: function () { return __importDefault(Notification_1).default; } });
+var ToolTip_1 = require("./ui/tooltip/ToolTip");
+Object.defineProperty(exports, "ToolTip", { enumerable: true, get: function () { return __importDefault(ToolTip_1).default; } });
+var AppBar_1 = require("./ui/appbar/AppBar");
+Object.defineProperty(exports, "AppBar", { enumerable: true, get: function () { return __importDefault(AppBar_1).default; } });
+var Tip_1 = require("./ui/tooltip/Tip");
+Object.defineProperty(exports, "Tip", { enumerable: true, get: function () { return __importDefault(Tip_1).default; } });
+var RowFlex_1 = require("./ui/specials/RowFlex");
+Object.defineProperty(exports, "RowFlex", { enumerable: true, get: function () { return __importDefault(RowFlex_1).default; } });
+var Section_1 = require("./ui/specials/Section");
+Object.defineProperty(exports, "Section", { enumerable: true, get: function () { return __importDefault(Section_1).default; } });
+var Hr_1 = require("./ui/specials/Hr");
+Object.defineProperty(exports, "Hr", { enumerable: true, get: function () { return __importDefault(Hr_1).default; } });
+var Circle_1 = require("./ui/specials/Circle");
+Object.defineProperty(exports, "Circle", { enumerable: true, get: function () { return __importDefault(Circle_1).default; } });
+var FullCenteredPage_1 = require("./ui/specials/FullCenteredPage");
+Object.defineProperty(exports, "FullCenteredPage", { enumerable: true, get: function () { return __importDefault(FullCenteredPage_1).default; } });

package/dist/js/Fun.d.ts

@@ -0,0 +1,38 @@
+export declare const FunHide: {
+    hide: (selector?: string) => void;
+    show: (selector?: string) => void;
+    toggle: (selector?: string) => void;
+};
+export declare const FunVisible: {
+    hide: (selector?: string) => void;
+    show: (selector?: string) => void;
+    toggle: (selector?: string) => void;
+};
+export declare const FunGet: {
+    text: (selector?: string, data?: string) => string | undefined;
+    html: (selector?: string, data?: string) => string | undefined;
+    val: (selector?: string, data?: string) => string | undefined;
+};
+export declare const FunStyle: {
+    css: (selector?: string, css?: {}) => void;
+};
+export declare const FunEvent: {
+    event: (selector?: string, eventType?: string, callBack?: EventListenerOrEventListenerObject | null) => void;
+};
+export declare const FunClass: {
+    add: (selector?: string, newClass?: string) => void;
+    remove: (selector?: string, newClass?: string) => void;
+};
+export declare const FunAdd: {
+    append: (selector?: string, child?: Node | null) => void;
+    prepend: (selector?: string, child?: Node | null) => void;
+};
+export declare const FunRequest: {
+    get: (url: string, headers?: HeadersInit) => Promise<unknown>;
+    post: (url: string, body?: any, headers?: HeadersInit) => Promise<unknown>;
+    patch: (url: string, body?: any, headers?: HeadersInit) => Promise<unknown>;
+    delete: (url: string, headers?: HeadersInit) => Promise<unknown>;
+};
+export declare const FunQuery: {
+    query: (data: any, fields?: {}) => Promise<unknown>;
+};

package/dist/js/Fun.js

@@ -0,0 +1,235 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FunQuery = exports.FunRequest = exports.FunAdd = exports.FunClass = exports.FunEvent = exports.FunStyle = exports.FunGet = exports.FunVisible = exports.FunHide = void 0;
+exports.FunHide = {
+    hide: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            element.style.display = "none";
+        }
+    },
+    show: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            element.style.display = "inline-block";
+        }
+    },
+    toggle: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            var style = element.style.display;
+            element.style.display = style === "none" ? "inline-block" : "none";
+        }
+    }
+};
+exports.FunVisible = {
+    hide: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            element.style.visibility = "hidden";
+        }
+    },
+    show: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            element.style.visibility = "visible";
+        }
+    },
+    toggle: function (selector) {
+        var element = document.querySelector(selector);
+        if (element) {
+            var style = element.style.visibility;
+            element.style.visibility = style === "hidden" ? "visible" : "hidden";
+        }
+    }
+};
+exports.FunGet = {
+    text: function (selector, data) {
+        var element = document.querySelector(selector);
+        if (element) {
+            var text = element.textContent;
+            if (data) {
+                element.textContent = data;
+            }
+            else {
+                return text ? text : "";
+            }
+        }
+    },
+    html: function (selector, data) {
+        var element = document.querySelector(selector);
+        if (element) {
+            var text = element.innerHTML;
+            if (data) {
+                element.innerHTML = data;
+            }
+            else {
+                return text ? text : "";
+            }
+        }
+    },
+    val: function (selector, data) {
+        var element = document.querySelector(selector);
+        if (element) {
+            var text = element.value;
+            if (data !== undefined && data !== null) {
+                element.value = data === '' ? '' : data;
+            }
+            else {
+                return text;
+            }
+        }
+    },
+};
+exports.FunStyle = {
+    css: function (selector, css) {
+        var element = document.querySelector(selector);
+        if (element) {
+            Object.assign(element.style, css);
+        }
+    },
+};
+exports.FunEvent = {
+    event: function (selector, eventType, callBack) {
+        var element = document.querySelector(selector);
+        if (element && eventType && callBack) {
+            element.addEventListener(eventType, callBack);
+        }
+    },
+};
+exports.FunClass = {
+    add: function (selector, newClass) {
+        var element = document.querySelector(selector);
+        if (element && newClass) {
+            element.classList.add(newClass);
+        }
+    },
+    remove: function (selector, newClass) {
+        var element = document.querySelector(selector);
+        if (element && newClass) {
+            element.classList.remove(newClass);
+        }
+    },
+};
+exports.FunAdd = {
+    append: function (selector, child) {
+        var element = document.querySelector(selector);
+        if (element && child) {
+            element.append(child);
+        }
+    },
+    prepend: function (selector, child) {
+        var element = document.querySelector(selector);
+        if (element && child) {
+            element.prepend(child);
+        }
+    },
+};
+exports.FunRequest = {
+    get: function (url, headers) {
+        return new Promise(function (resolve, reject) {
+            fetch(url, headers ? { headers: headers } : {})
+                .then(function (response) { return response.json(); })
+                .then(function (data) {
+                resolve(data);
+            })
+                .catch(function (error) {
+                reject(error);
+            });
+        });
+    },
+    post: function (url, body, headers) {
+        return new Promise(function (resolve, reject) {
+            fetch(url, {
+                method: 'POST',
+                headers: headers ? __assign(__assign({}, headers), { 'Content-Type': 'application/json' }) : { 'Content-Type': 'application/json' },
+                body: JSON.stringify(body),
+            })
+                .then(function (response) { return response.json(); })
+                .then(function (data) {
+                resolve(data);
+            })
+                .catch(function (error) {
+                reject(error);
+            });
+        });
+    },
+    patch: function (url, body, headers) {
+        return new Promise(function (resolve, reject) {
+            fetch(url, {
+                method: 'PATCH',
+                headers: headers ? __assign(__assign({}, headers), { 'Content-Type': 'application/json' }) : { 'Content-Type': 'application/json' },
+                body: JSON.stringify(body),
+            })
+                .then(function (response) { return response.json(); })
+                .then(function (data) {
+                resolve(data);
+            })
+                .catch(function (error) {
+                reject(error);
+            });
+        });
+    },
+    delete: function (url, headers) {
+        return new Promise(function (resolve, reject) {
+            fetch(url, {
+                method: 'DELETE',
+                headers: headers ? headers : {},
+            })
+                .then(function (response) {
+                if (response.ok) {
+                    resolve("");
+                }
+                else {
+                    reject("Error: ".concat(response.status, " ").concat(response.statusText));
+                }
+            })
+                .catch(function (error) {
+                reject(error);
+            });
+        });
+    },
+};
+exports.FunQuery = {
+    query: function (data, fields) {
+        return new Promise(function (resolve, reject) {
+            if (Array.isArray(data)) {
+                resolve(data.filter(function (item) { return applyFilter(item, fields); }));
+            }
+            else if (typeof data === 'object') {
+                var filteredData = {};
+                for (var key in data) {
+                    if (applyFilter(data[key], fields)) {
+                        filteredData[key] = data[key];
+                    }
+                }
+                resolve(filteredData);
+            }
+            else {
+                reject('Invalid data type. Expected an array or object.');
+            }
+            function applyFilter(item, fields) {
+                if (typeof fields !== 'object') {
+                    reject('Invalid filter criteria. Expected an object.');
+                }
+                for (var key in fields) {
+                    if (item[key] !== fields[key]) {
+                        return false;
+                    }
+                }
+                return true;
+            }
+        });
+    },
+};

package/dist/js/Theme.d.ts

@@ -0,0 +1,2 @@
+declare const DarkMode: (state: any) => void;
+export default DarkMode;

package/dist/js/Theme.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var DarkMode = function (state) {
+    if (state) {
+        var root = document.querySelector(':root'); // Narrowing the type
+        if (root) {
+            root.style.setProperty('--bd-theme', '#141414'); // Dark background theme color
+            root.style.setProperty('--bd-color', '#FFFFFFD9'); // Background color
+            root.style.setProperty('--borderColor', '#444654'); // Border color
+            root.style.setProperty('--raiseThemes', '#1e1e1e'); // Raised element color
+            root.style.setProperty('--lighter', '#33333349'); // Lighter shade
+            root.style.setProperty('--inputOutline', '#1e1e1e'); // Input outline color
+            root.style.setProperty('--lightThemeDark', '#FFFFFFD9'); // Dark theme for light elements
+            root.style.setProperty('--muted', '#78716c'); // Base muted color
+            root.style.setProperty('--muted50', '#171717'); // Muted 50 (darkest)
+            root.style.setProperty('--muted100', '#262626'); // Muted 100
+            root.style.setProperty('--muted200', '#404040'); // Muted 200
+            root.style.setProperty('--muted300', '#525252'); // Muted 300
+            root.style.setProperty('--muted400', '#737373'); // Muted 400
+            root.style.setProperty('--muted500', '#a3a3a3'); // Muted 500
+            root.style.setProperty('--muted600', '#d4d4d4'); // Muted 600
+            root.style.setProperty('--muted700', '#e5e5e5'); // Muted 700
+            root.style.setProperty('--muted800', '#f5f5f5'); // Muted 800
+            root.style.setProperty('--muted900', '#fafafa');
+            // Dark theme for success colors
+            root.style.setProperty('--success', '#1d6640');
+            root.style.setProperty('--successLight', '#c7e6c8');
+            // Dark theme for info colors
+            root.style.setProperty('--info', '#2471a3');
+            root.style.setProperty('--infoLight', '#b3d9ed');
+            // Dark theme for warning colors
+            root.style.setProperty('--warning', '#8c3d00');
+            root.style.setProperty('--warningLight', '#d8b69c');
+            // Dark theme for danger colors
+            root.style.setProperty('--danger', '#6b0600');
+            root.style.setProperty('--dangerLight', '#bfbfbf');
+            root.style.setProperty('--light', '#c5d8e0'); // Light color
+            root.style.setProperty('--deepLight', '#154556'); // Deep light color
+        }
+    }
+};
+exports.default = DarkMode;