asv-hlps 1.2.39 → 1.2.42

package/lib/cjs/index.d.ts

@@ -37,5 +37,4 @@ export * from "./react-utils";
 export * from "./sale";
 export * from "./user";
 export * from "./utils";
-export * from "./reacts/index";
 export { AuthService, StorageService, CapacitorStorageService, HlpProduct, HlpEntry, StockPipe, AmountOnListBillPipe, AmountOnBillPipe };

package/lib/cjs/index.js

@@ -68,4 +68,3 @@ __exportStar(require("./react-utils"), exports);
 __exportStar(require("./sale"), exports);
 __exportStar(require("./user"), exports);
 __exportStar(require("./utils"), exports);
-__exportStar(require("./reacts/index"), exports);

package/lib/cjs/models/types/Type.d.ts

@@ -51,7 +51,7 @@ export declare type HeaderTableColumnType = {
     tooltipB?: any;
 };
 export declare type ReactTableColumnType = {
-    Header: string;
+    Header: any;
     accessor: string;
     sort?: boolean;
     Cell?: any;

package/lib/cjs/reacts/index.d.ts

@@ -1,3 +1,4 @@
 import useReadonlyFetchTobs from "./hooks/useReadonlyFetchTobs";
 import BtnToggle from "./minton/btns/BtnToggle";
-export { useReadonlyFetchTobs, BtnToggle };
+import BtnAction from "./minton/btns/BtnAction";
+export { useReadonlyFetchTobs, BtnToggle, BtnAction };

package/lib/cjs/reacts/index.js

@@ -3,8 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BtnToggle = exports.useReadonlyFetchTobs = void 0;
+exports.BtnAction = exports.BtnToggle = exports.useReadonlyFetchTobs = void 0;
 const useReadonlyFetchTobs_1 = __importDefault(require("./hooks/useReadonlyFetchTobs"));
 exports.useReadonlyFetchTobs = useReadonlyFetchTobs_1.default;
 const BtnToggle_1 = __importDefault(require("./minton/btns/BtnToggle"));
 exports.BtnToggle = BtnToggle_1.default;
+const BtnAction_1 = __importDefault(require("./minton/btns/BtnAction"));
+exports.BtnAction = BtnAction_1.default;

package/lib/cjs/reacts/minton/btns/BtnAction.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+export interface BtnType {
+    id: number | string;
+    label: any;
+    icon?: string;
+    size?: "sm" | "lg";
+    variant?: "danger" | "success" | "primary" | "secondary" | "light" | "white" | "link" | string;
+    disabled?: boolean;
+    textColor?: "text-danger" | "text-success" | "text-primary" | "text-secondary";
+    color?: "danger" | "success" | "primary" | "secondary" | string;
+    divider?: boolean;
+    btnClass?: string;
+}
+export interface DropMenuType {
+    label: string;
+    icon?: string;
+    color?: "primary" | "success" | "info" | "danger";
+    ellipsis?: "v" | "h";
+    drops: BtnType[];
+}
+export declare type IfBtnType = "elpDropMenu" | "btnDropMenu" | "btns" | "btnLinks" | "none";
+declare type BtnActionProps = {
+    tob?: any;
+    onDrop?: any;
+    onBtn?: any;
+    ifBtn?: IfBtnType;
+    dropMenu?: DropMenuType;
+    btns?: BtnType[];
+};
+declare const BtnAction: ({ dropMenu, btns, onDrop, onBtn, tob, ifBtn }: BtnActionProps) => JSX.Element;
+export default BtnAction;

package/lib/cjs/reacts/minton/btns/BtnAction.js

@@ -0,0 +1,87 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const react_1 = __importDefault(require("react"));
+const react_bootstrap_1 = require("react-bootstrap");
+// const BtnDrop: React.FC<BtnActionProps> = ({ drops, btns, ellipsis, onDrop, onBtn, tob, ifBtn, btnDrop }) => {
+const BtnAction = ({ dropMenu, btns, onDrop, onBtn, tob, ifBtn }) => {
+    // --------------------
+    const iconClass = (icon) => {
+        return icon ? `${icon} me-1` : "me-1";
+    };
+    const textColorClass = (textColor) => {
+        const format = textColor ? `${textColor} ` : "";
+        return "text-capitalize" + format;
+    };
+    const colorClass = (color) => {
+        return color ? `btn btn-${color} ms-1 ` : "btn btn-primary ms-1";
+    };
+    const sizeClass = (size) => {
+        return size ? `btn-${size}` : "btn-sm";
+    };
+    const ellispsisDirection = (ellipsis) => {
+        let ellipsisDirection = "uil uil-ellipsis-";
+        return (ellipsisDirection += ellipsis ? ellipsis : "h");
+    };
+    const elpDropMenu = () => (
+    // <ButtonGroup>
+    (0, jsx_runtime_1.jsxs)(react_bootstrap_1.Dropdown, Object.assign({ as: react_bootstrap_1.ButtonGroup, className: "d-inline-block ms-2" }, { children: [(0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Toggle, Object.assign({ as: "a", className: "cursor-pointer arrow-none text-muted" }, { children: (0, jsx_runtime_1.jsx)("i", { className: ellispsisDirection(dropMenu.ellipsis) }) })), (0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Menu, { children: react_1.default.Children.toArray(dropMenu.drops.map((drop) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_bootstrap_1.Dropdown.Item, Object.assign({ as: "button", 
+                            // onClick={(e) => onDrop(e, { id: +drop.id, tob })}
+                            onClick: (e) => {
+                                e.stopPropagation();
+                                e.preventDefault();
+                                onDrop({ id: +drop.id, tob });
+                            }, 
+                            // onClick={(e) => handleDrop(e)}
+                            // eventKey={drop.id}
+                            // key={drop.id}
+                            // key={index}
+                            className: textColorClass(drop.textColor) }, { children: [(0, jsx_runtime_1.jsx)("i", { className: iconClass(drop.icon) }), drop.label] })), drop.divider ? (0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Divider, {}) : ""] })))) })] }))
+    // </ButtonGroup>
+    );
+    const handleDrop = (props) => {
+        console.log(props);
+        // console.log(props.target.current.value);
+    };
+    const btnDropMenu = () => (
+    // <ButtonGroup>
+    (0, jsx_runtime_1.jsxs)(react_bootstrap_1.Dropdown, Object.assign({ as: react_bootstrap_1.ButtonGroup, align: "end", size: "sm" }, { children: [(0, jsx_runtime_1.jsxs)(react_bootstrap_1.Dropdown.Toggle, Object.assign({ variant: "primary", id: "dropdown-basic", className: "cursor-pointer" }, { children: [dropMenu.icon && (0, jsx_runtime_1.jsx)("i", { className: iconClass(dropMenu.icon) }), (0, jsx_runtime_1.jsx)("small", Object.assign({ className: "text-uppercase" }, { children: dropMenu === null || dropMenu === void 0 ? void 0 : dropMenu.label })), (0, jsx_runtime_1.jsx)("i", { className: "mdi mdi-chevron-down ms-1" })] })), (0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Menu, { children: dropMenu.drops.map((drop) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("span", { children: [(0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Item, Object.assign({ className: "notify-item", onClick: () => onDrop(drop.id), eventKey: drop.id }, { children: (0, jsx_runtime_1.jsx)("span", Object.assign({ className: textColorClass(drop.textColor) }, { children: drop.label })) })), drop.divider ? (0, jsx_runtime_1.jsx)(react_bootstrap_1.Dropdown.Divider, {}) : ""] }, drop.id) }))) })] }))
+    // </ButtonGroup>
+    );
+    const btnActions = () => {
+        return btns.map((btn) => ((0, jsx_runtime_1.jsx)(react_bootstrap_1.ButtonGroup, Object.assign({ className: "ms-1 p-0 text-uppercase", size: "sm" }, { children: (0, jsx_runtime_1.jsxs)(react_bootstrap_1.Button
+            // className={classNames(colorClass(btn.color), "text-uppercase fs-6 p-0")}
+            , Object.assign({ 
+                // className={classNames(colorClass(btn.color), "text-uppercase fs-6 p-0")}
+                className: (0, classnames_1.default)(btn.btnClass, "text-uppercase fs-6"), disabled: btn.disabled, variant: btn.variant ? btn.variant : "primary", onClick: (e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    onBtn(btn.id);
+                }, size: "sm" }, { children: [btn.icon && (0, jsx_runtime_1.jsx)("i", { className: iconClass(btn.icon) }), btn.label] })) }), btn === null || btn === void 0 ? void 0 : btn.id)));
+    };
+    const btnLinks = () => {
+        return btns.map((btn) => ((0, jsx_runtime_1.jsxs)(react_bootstrap_1.Button, Object.assign({ as: "a", className: `${colorClass(btn.color)} ${sizeClass(btn.size)} float-end`, onClick: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                onBtn(btn.id);
+            } }, { children: [btn.icon && (0, jsx_runtime_1.jsx)("i", { className: iconClass(btn.icon) }), btn.label] }), btn === null || btn === void 0 ? void 0 : btn.id)));
+    };
+    /* const renderDrop = () => {
+      switch (ifBtn) {
+        case "btns":
+          return dropMenuBtn();
+        case "elpMenu":
+          return dropMenu();
+        case "btn":
+          return btnActions();
+        default:
+          return dropMenu();
+      }
+    }; */
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [ifBtn === "btnDropMenu" && btnDropMenu(), ifBtn === "elpDropMenu" && elpDropMenu(), ifBtn === "btns" && btnActions(), ifBtn === "btnLinks" && btnLinks()] }));
+};
+exports.default = BtnAction;

package/lib/esm/index.d.ts

@@ -37,5 +37,4 @@ export * from "./react-utils";
 export * from "./sale";
 export * from "./user";
 export * from "./utils";
-export * from "./reacts/index";
 export { AuthService, StorageService, CapacitorStorageService, HlpProduct, HlpEntry, StockPipe, AmountOnListBillPipe, AmountOnBillPipe };

package/lib/esm/index.js

@@ -40,6 +40,5 @@ export * from "./react-utils";
 export * from "./sale";
 export * from "./user";
 export * from "./utils";
-export * from "./reacts/index";
 // export * from "./helpers/hlpProduct";
 export { AuthService, StorageService, CapacitorStorageService, HlpProduct, HlpEntry, StockPipe, AmountOnListBillPipe, AmountOnBillPipe };

package/lib/esm/models/types/Type.d.ts

@@ -51,7 +51,7 @@ export declare type HeaderTableColumnType = {
     tooltipB?: any;
 };
 export declare type ReactTableColumnType = {
-    Header: string;
+    Header: any;
     accessor: string;
     sort?: boolean;
     Cell?: any;

package/lib/esm/reacts/index.d.ts

@@ -1,3 +1,4 @@
 import useReadonlyFetchTobs from "./hooks/useReadonlyFetchTobs";
 import BtnToggle from "./minton/btns/BtnToggle";
-export { useReadonlyFetchTobs, BtnToggle };
+import BtnAction from "./minton/btns/BtnAction";
+export { useReadonlyFetchTobs, BtnToggle, BtnAction };

package/lib/esm/reacts/index.js

@@ -1,3 +1,4 @@
 import useReadonlyFetchTobs from "./hooks/useReadonlyFetchTobs";
 import BtnToggle from "./minton/btns/BtnToggle";
-export { useReadonlyFetchTobs, BtnToggle };
+import BtnAction from "./minton/btns/BtnAction";
+export { useReadonlyFetchTobs, BtnToggle, BtnAction };

package/lib/esm/reacts/minton/btns/BtnAction.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+export interface BtnType {
+    id: number | string;
+    label: any;
+    icon?: string;
+    size?: "sm" | "lg";
+    variant?: "danger" | "success" | "primary" | "secondary" | "light" | "white" | "link" | string;
+    disabled?: boolean;
+    textColor?: "text-danger" | "text-success" | "text-primary" | "text-secondary";
+    color?: "danger" | "success" | "primary" | "secondary" | string;
+    divider?: boolean;
+    btnClass?: string;
+}
+export interface DropMenuType {
+    label: string;
+    icon?: string;
+    color?: "primary" | "success" | "info" | "danger";
+    ellipsis?: "v" | "h";
+    drops: BtnType[];
+}
+export declare type IfBtnType = "elpDropMenu" | "btnDropMenu" | "btns" | "btnLinks" | "none";
+declare type BtnActionProps = {
+    tob?: any;
+    onDrop?: any;
+    onBtn?: any;
+    ifBtn?: IfBtnType;
+    dropMenu?: DropMenuType;
+    btns?: BtnType[];
+};
+declare const BtnAction: ({ dropMenu, btns, onDrop, onBtn, tob, ifBtn }: BtnActionProps) => JSX.Element;
+export default BtnAction;

package/lib/esm/reacts/minton/btns/BtnAction.js

@@ -0,0 +1,82 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import classNames from "classnames";
+import React from "react";
+import { Button, ButtonGroup, Dropdown } from "react-bootstrap";
+// const BtnDrop: React.FC<BtnActionProps> = ({ drops, btns, ellipsis, onDrop, onBtn, tob, ifBtn, btnDrop }) => {
+const BtnAction = ({ dropMenu, btns, onDrop, onBtn, tob, ifBtn }) => {
+    // --------------------
+    const iconClass = (icon) => {
+        return icon ? `${icon} me-1` : "me-1";
+    };
+    const textColorClass = (textColor) => {
+        const format = textColor ? `${textColor} ` : "";
+        return "text-capitalize" + format;
+    };
+    const colorClass = (color) => {
+        return color ? `btn btn-${color} ms-1 ` : "btn btn-primary ms-1";
+    };
+    const sizeClass = (size) => {
+        return size ? `btn-${size}` : "btn-sm";
+    };
+    const ellispsisDirection = (ellipsis) => {
+        let ellipsisDirection = "uil uil-ellipsis-";
+        return (ellipsisDirection += ellipsis ? ellipsis : "h");
+    };
+    const elpDropMenu = () => (
+    // <ButtonGroup>
+    _jsxs(Dropdown, Object.assign({ as: ButtonGroup, className: "d-inline-block ms-2" }, { children: [_jsx(Dropdown.Toggle, Object.assign({ as: "a", className: "cursor-pointer arrow-none text-muted" }, { children: _jsx("i", { className: ellispsisDirection(dropMenu.ellipsis) }) })), _jsx(Dropdown.Menu, { children: React.Children.toArray(dropMenu.drops.map((drop) => (_jsxs(_Fragment, { children: [_jsxs(Dropdown.Item, Object.assign({ as: "button", 
+                            // onClick={(e) => onDrop(e, { id: +drop.id, tob })}
+                            onClick: (e) => {
+                                e.stopPropagation();
+                                e.preventDefault();
+                                onDrop({ id: +drop.id, tob });
+                            }, 
+                            // onClick={(e) => handleDrop(e)}
+                            // eventKey={drop.id}
+                            // key={drop.id}
+                            // key={index}
+                            className: textColorClass(drop.textColor) }, { children: [_jsx("i", { className: iconClass(drop.icon) }), drop.label] })), drop.divider ? _jsx(Dropdown.Divider, {}) : ""] })))) })] }))
+    // </ButtonGroup>
+    );
+    const handleDrop = (props) => {
+        console.log(props);
+        // console.log(props.target.current.value);
+    };
+    const btnDropMenu = () => (
+    // <ButtonGroup>
+    _jsxs(Dropdown, Object.assign({ as: ButtonGroup, align: "end", size: "sm" }, { children: [_jsxs(Dropdown.Toggle, Object.assign({ variant: "primary", id: "dropdown-basic", className: "cursor-pointer" }, { children: [dropMenu.icon && _jsx("i", { className: iconClass(dropMenu.icon) }), _jsx("small", Object.assign({ className: "text-uppercase" }, { children: dropMenu === null || dropMenu === void 0 ? void 0 : dropMenu.label })), _jsx("i", { className: "mdi mdi-chevron-down ms-1" })] })), _jsx(Dropdown.Menu, { children: dropMenu.drops.map((drop) => (_jsx(_Fragment, { children: _jsxs("span", { children: [_jsx(Dropdown.Item, Object.assign({ className: "notify-item", onClick: () => onDrop(drop.id), eventKey: drop.id }, { children: _jsx("span", Object.assign({ className: textColorClass(drop.textColor) }, { children: drop.label })) })), drop.divider ? _jsx(Dropdown.Divider, {}) : ""] }, drop.id) }))) })] }))
+    // </ButtonGroup>
+    );
+    const btnActions = () => {
+        return btns.map((btn) => (_jsx(ButtonGroup, Object.assign({ className: "ms-1 p-0 text-uppercase", size: "sm" }, { children: _jsxs(Button
+            // className={classNames(colorClass(btn.color), "text-uppercase fs-6 p-0")}
+            , Object.assign({ 
+                // className={classNames(colorClass(btn.color), "text-uppercase fs-6 p-0")}
+                className: classNames(btn.btnClass, "text-uppercase fs-6"), disabled: btn.disabled, variant: btn.variant ? btn.variant : "primary", onClick: (e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    onBtn(btn.id);
+                }, size: "sm" }, { children: [btn.icon && _jsx("i", { className: iconClass(btn.icon) }), btn.label] })) }), btn === null || btn === void 0 ? void 0 : btn.id)));
+    };
+    const btnLinks = () => {
+        return btns.map((btn) => (_jsxs(Button, Object.assign({ as: "a", className: `${colorClass(btn.color)} ${sizeClass(btn.size)} float-end`, onClick: (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                onBtn(btn.id);
+            } }, { children: [btn.icon && _jsx("i", { className: iconClass(btn.icon) }), btn.label] }), btn === null || btn === void 0 ? void 0 : btn.id)));
+    };
+    /* const renderDrop = () => {
+      switch (ifBtn) {
+        case "btns":
+          return dropMenuBtn();
+        case "elpMenu":
+          return dropMenu();
+        case "btn":
+          return btnActions();
+        default:
+          return dropMenu();
+      }
+    }; */
+    return (_jsxs(_Fragment, { children: [ifBtn === "btnDropMenu" && btnDropMenu(), ifBtn === "elpDropMenu" && elpDropMenu(), ifBtn === "btns" && btnActions(), ifBtn === "btnLinks" && btnLinks()] }));
+};
+export default BtnAction;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "asv-hlps",
-  "version": "1.2.39",
+  "version": "1.2.42",
   "description": "helpers",
   "main": "./lib/cjs/index.js",
   "module": "./lib/esm/index.js",
@@ -25,9 +25,9 @@
     "@capacitor/preferences": "^4.0.1",
     "axios": "^0.27.2",
     "bcryptjs": "^2.4.3",
+    "classnames": "^2.3.1",
     "jwt-decode": "^3.1.2",
     "randomatic": "^3.1.1",
-    "react": "^18.2.0",
     "yup": "^0.32.11"
   }
 }