ui-beyable 1.0.0 → 1.0.1

package/lib/cjs/index.d.ts

@@ -0,0 +1,60 @@
+import BYBtn from './components/Button/BYbtn';
+import BYmodal from './components/Modal/BYmodal';
+import ByPortal from './components/Portal/BYportal';
+import BYcollapse from './components/Collapse/BYcollapse';
+import "./style/globalStyle.css";
+import "./style/params.css";
+import "./style/animate.css";
+import "./style/bootstrap-overrides.css";
+import "./style/bootstrap/css/bootstrap_framework.css";
+import "./style/btn.css";
+import "./style/c3.min.css";
+import "./style/checkbox.css";
+import "./style/colorpicker.css";
+import "./style/custom-antd.css";
+import "./style/customInput.css";
+import "./style/datepicker.css";
+import "./style/datepickerrange.min.css";
+import "./style/empty.css";
+import "./style/field.css";
+import "./style/flex.css";
+import "./style/fonts.css";
+import "./style/form.css";
+import "./style/gridstack.min.css";
+import "./style/Header.css";
+import "./style/icofont.min.css";
+import "./style/icon.css";
+import "./style/Informations.css";
+import "./style/insights.css";
+import "./style/jqCron.css";
+import "./style/listbox.css";
+import "./style/modal.css";
+import "./style/navigation.css";
+import "./style/notifications.css";
+import "./style/orchestration.css";
+import "./style/page.css";
+import "./style/panel.css";
+import "./style/place_autocomplete.css";
+import "./style/react-cron.css";
+import "./style/react-table.css";
+import "./style/reset.css";
+import "./style/scroll.css";
+import "./style/section.css";
+import "./style/setup.css";
+import "./style/shepherd.css";
+import "./style/simplegrid.css";
+import "./style/spinner.css";
+import "./style/stats.css";
+import "./style/style.css";
+import "./style/SideBar.css";
+import "./style/table.css";
+import "./style/tabs.css";
+import "./style/thumb_list.css";
+import "./style/tippy.css";
+import "./style/traffic-overview.css";
+import "./style/utils.css";
+import "./style/var.css";
+import "./style/variation.css";
+import "./style/wheel.css";
+import "./style/wishlists.css";
+export { BYBtn, BYmodal, ByPortal, BYcollapse };

package/lib/cjs/index.js

@@ -0,0 +1,170 @@
+'use strict';
+
+var React = require('react');
+var ReactDOM = require('react-dom');
+
+var Btn = function (_a) {
+    var children = _a.children, _b = _a.type, type = _b === void 0 ? 'button' : _b, _c = _a.htmlTag, htmlTag = _c === void 0 ? "button" : _c, onClickFunction = _a.onClickFunction, onClick = _a.onClick, _d = _a.href, href = _d === void 0 ? '' : _d, _e = _a.target, target = _e === void 0 ? '' : _e, _f = _a.message, message = _f === void 0 ? '' : _f, _g = _a.color, color = _g === void 0 ? 'primary' : _g, _h = _a.style, style = _h === void 0 ? '' : _h, _j = _a.rounded, rounded = _j === void 0 ? false : _j, _k = _a.disabled, disabled = _k === void 0 ? false : _k, _l = _a.className, className = _l === void 0 ? '' : _l, _m = _a.strong, strong = _m === void 0 ? false : _m, _o = _a.light, light = _o === void 0 ? false : _o, _p = _a.size, size = _p === void 0 ? "" : _p, _q = _a.fontSize, fontSize = _q === void 0 ? '' : _q, _r = _a.fullWidth, fullWidth = _r === void 0 ? false : _r, _s = _a.fullHeight, fullHeight = _s === void 0 ? false : _s, icon = _a.icon, _t = _a.iconPosition, iconPosition = _t === void 0 ? 'before' : _t, _u = _a.arrow, arrow = _u === void 0 ? false : _u, dataFor = _a.dataFor, dataTip = _a.dataTip;
+    var click = function (ev) {
+        if (typeof onClickFunction === 'function') {
+            onClickFunction(ev);
+        }
+        if (typeof onClick === 'function') {
+            onClick(ev);
+        }
+    };
+    var cssClass = ['btnUi'];
+    if (className) {
+        cssClass = cssClass.concat(className);
+    }
+    // Style and Color
+    var styleClass = 'btn';
+    if (style === 'outline' || style === 'ghost') {
+        styleClass += '_' + style;
+    }
+    styleClass += '_' + color;
+    cssClass.push(styleClass);
+    // Rounded
+    if (rounded) {
+        cssClass.push('btn_rounded');
+    }
+    // Disabled
+    if (disabled) {
+        cssClass.push('btn_disabled');
+    }
+    // Strong
+    if (strong) {
+        cssClass.push('btn_strong');
+    }
+    // Light
+    if (light) {
+        cssClass.push('btn_light');
+    }
+    // Arrow
+    if (arrow) {
+        cssClass.push('has_arrow');
+    }
+    // Size : xs, s, default, l, xl, xxl
+    if (size) {
+        cssClass.push('btn_' + size);
+    }
+    // Font size : s
+    if (fontSize) {
+        cssClass.push('btn_fs_' + fontSize);
+    }
+    // Icon
+    if (icon) {
+        cssClass.push('has_icon');
+    }
+    // Full width
+    if (fullWidth) {
+        cssClass.push('w_full');
+    }
+    // Full height
+    if (fullHeight) {
+        cssClass.push('h_full');
+    }
+    // Type
+    if (href) {
+        htmlTag = "a";
+    }
+    return (React.createElement("div", { className: "BYUI" },
+        htmlTag == 'button' &&
+            React.createElement("button", { type: type, className: cssClass.join(' '), onClick: function (e) { return click(e); }, "data-for": dataFor, "data-tip": dataTip },
+                icon && iconPosition !== 'after' &&
+                    icon,
+                message &&
+                    React.createElement("span", { className: "btn_txt" }, message),
+                children &&
+                    React.createElement("span", { className: "btn_txt" }, children),
+                icon && iconPosition === 'after' &&
+                    icon),
+        htmlTag == 'a' &&
+            React.createElement("a", { className: cssClass.join(' '), onClick: function (e) { return click(e); }, target: target, href: href, "data-for": dataFor, "data-tip": dataTip },
+                icon && iconPosition !== 'after' &&
+                    icon,
+                message &&
+                    React.createElement("span", { className: "btn_txt" }, message),
+                children &&
+                    React.createElement("span", { className: "btn_txt" }, children),
+                icon && iconPosition === 'after' &&
+                    icon)));
+};
+var BYbtn = React.memo(Btn);
+
+function Portal(_a) {
+    var _b = _a.target, target = _b === void 0 ? document.body : _b, children = _a.children;
+    return ReactDOM.createPortal(children, target);
+}
+
+function Modal(_a) {
+    var children = _a.children, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, onClose = _a.onClose, _c = _a.noClose, noClose = _c === void 0 ? false : _c, width = _a.width, height = _a.height, minHeight = _a.minHeight;
+    var style = { width: '', height: '', minHeight: '' };
+    var hide = function (ev) {
+        if (typeof onClose === 'function') {
+            onClose(ev);
+        }
+    };
+    if (width) {
+        style.width = width + 'px';
+    }
+    if (height) {
+        style.height = height + 'px';
+    }
+    if (minHeight) {
+        style.minHeight = 'min(100%, ' + minHeight + 'px)';
+    }
+    if (!isOpen)
+        return React.createElement(React.Fragment, null);
+    return (React.createElement(Portal, null,
+        React.createElement("div", { className: "modal_outer section_root", tabIndex: -1 },
+            React.createElement("div", { className: "modal_inner", style: style },
+                !noClose &&
+                    React.createElement("a", { onClick: function (ev) { return hide(ev); }, className: "modal_close" }),
+                children))));
+}
+
+var styles = {"wrapper_common":"collapse-module_wrapper_common__OhNXa","wrapper_close":"collapse-module_wrapper_close__pPihr","wrapper_open":"collapse-module_wrapper_open__-Pauk","header":"collapse-module_header__3XouW","header_btn":"collapse-module_header_btn__WqgSX","arrow":"collapse-module_arrow__m09w4","fas":"collapse-module_fas__KttZB","body":"collapse-module_body__n-AEV","wrapperCommon":"collapse-module_wrapper_common__OhNXa","wrapperClose":"collapse-module_wrapper_close__pPihr","wrapperOpen":"collapse-module_wrapper_open__-Pauk","headerBtn":"collapse-module_header_btn__WqgSX"};
+
+console.log('🚀--** ~ file: BYcollapse.tsx:2 ~ React:', React);
+function Collapse(_a) {
+    var label = _a.label, children = _a.children, _b = _a.defaultOpen, defaultOpen = _b === void 0 ? false : _b;
+    var _c = React.useState(true), isOpen = _c[0], setIsOpen = _c[1];
+    var bodyRef = React.useRef(null);
+    var toggle = function () {
+        if (!bodyRef.current)
+            return;
+        var delay = isOpen ? 0 : 300;
+        //@ts-ignore
+        var height = bodyRef.current.scrollHeight;
+        //@ts-ignore
+        bodyRef.current.style.height = height + 'px';
+        //@ts-ignore
+        bodyRef.current.style.overflow = 'hidden';
+        setTimeout(function () {
+            //@ts-ignore
+            bodyRef.current.style.height = '';
+            //@ts-ignore
+            bodyRef.current.style.overflow = '';
+        }, delay);
+        setIsOpen(!isOpen);
+    };
+    React.useEffect(function () {
+        if (defaultOpen && defaultOpen !== isOpen) {
+            setIsOpen(defaultOpen);
+        }
+    }, [defaultOpen]);
+    return (React.createElement("div", { className: isOpen ? styles.wrapper_open : styles.wrapper_close },
+        React.createElement("div", { className: styles.header },
+            React.createElement("div", { className: styles.header_btn, onClick: function () { return toggle(); } },
+                React.createElement("span", { className: styles.arrow },
+                    React.createElement("i", { className: "fas fa-sm fa-chevron-down", style: { 'display': 'block' } })),
+                label)),
+        React.createElement("div", { className: styles.body, ref: bodyRef }, children)));
+}
+
+exports.BYBtn = BYbtn;
+exports.BYcollapse = Collapse;
+exports.BYmodal = Modal;
+exports.ByPortal = Portal;
+//# sourceMappingURL=index.js.map

package/lib/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/esm/components/BYbtn.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { IBYbtn } from './type';
+declare const Btn: ({ children, type, htmlTag, onClickFunction, onClick, href, target, message, color, style, rounded, disabled, className, strong, light, size, fontSize, fullWidth, fullHeight, icon, iconPosition, arrow, dataFor, dataTip }: IBYbtn) => React.JSX.Element;
+export { Btn };
+declare const BYbtn: React.MemoExoticComponent<({ children, type, htmlTag, onClickFunction, onClick, href, target, message, color, style, rounded, disabled, className, strong, light, size, fontSize, fullWidth, fullHeight, icon, iconPosition, arrow, dataFor, dataTip }: IBYbtn) => React.JSX.Element>;
+export default BYbtn;

package/lib/esm/components/Button/BYbtn.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { IBYbtn } from './type';
+declare const Btn: ({ children, type, htmlTag, onClickFunction, onClick, href, target, message, color, style, rounded, disabled, className, strong, light, size, fontSize, fullWidth, fullHeight, icon, iconPosition, arrow, dataFor, dataTip }: IBYbtn) => JSX.Element;
+export { Btn };
+declare const BYbtn: React.MemoExoticComponent<({ children, type, htmlTag, onClickFunction, onClick, href, target, message, color, style, rounded, disabled, className, strong, light, size, fontSize, fullWidth, fullHeight, icon, iconPosition, arrow, dataFor, dataTip }: IBYbtn) => JSX.Element>;
+export default BYbtn;

package/lib/esm/components/Button/type.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+export interface IBYbtn {
+    children?: React.ReactNode;
+    type?: "button" | "submit" | "reset";
+    htmlTag?: 'button' | 'a';
+    onClickFunction?: (e: React.MouseEvent) => any;
+    onClick?: (e: React.MouseEvent) => any;
+    href?: string;
+    target?: string;
+    message?: string;
+    color?: string;
+    style?: string;
+    rounded?: boolean;
+    disabled?: boolean;
+    className?: string;
+    strong?: boolean;
+    light?: boolean;
+    size?: "" | "xxs" | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
+    fontSize?: string;
+    fullWidth?: boolean;
+    fullHeight?: boolean;
+    icon?: any;
+    iconPosition?: 'before' | 'after';
+    arrow?: boolean | "true" | "false";
+    dataFor?: string;
+    dataTip?: string;
+}

package/lib/esm/components/Button.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface IButtonProps extends React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> {
+    backgroundColor?: string;
+    color?: string;
+}
+declare const Button: React.FunctionComponent<IButtonProps>;
+export default Button;

package/lib/esm/components/Collapse/BYcollapse.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { IBYcollapse } from './type';
+declare function Collapse({ label, children, defaultOpen }: IBYcollapse): JSX.Element;
+export default Collapse;

package/lib/esm/components/Collapse/type.d.ts

@@ -0,0 +1,5 @@
+export interface IBYcollapse {
+    label?: string;
+    children?: any;
+    defaultOpen?: boolean;
+}

package/lib/esm/components/Modal/BYmodal.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { IBYmodal } from './types';
+declare function Modal({ children, isOpen, onClose, noClose, width, height, minHeight }: IBYmodal): JSX.Element;
+export default Modal;

package/lib/esm/components/Modal/types.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+interface IBYmodal {
+    children: React.ReactNode;
+    isOpen: boolean;
+    onClose?: (e: any) => any;
+    noClose?: boolean;
+    width?: string;
+    height?: string;
+    minHeight?: string;
+}
+export type { IBYmodal };

package/lib/esm/components/Portal/BYportal.d.ts

@@ -0,0 +1,3 @@
+import { IBYportal } from './type';
+declare function Portal({ target, children }: IBYportal): any;
+export default Portal;

package/lib/esm/components/Portal/type.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface IBYportal {
+    target?: any;
+    children: React.ReactNode;
+}
+export type { IBYportal };

package/lib/esm/components/type.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+export interface IBYbtn {
+    children?: React.ReactNode;
+    type?: "button" | "submit" | "reset";
+    htmlTag?: 'button' | 'a';
+    onClickFunction?: (e: React.MouseEvent) => any;
+    onClick?: (e: React.MouseEvent) => any;
+    href?: string;
+    target?: string;
+    message?: string;
+    color?: string;
+    style?: string;
+    rounded?: boolean;
+    disabled?: boolean;
+    className?: string;
+    strong?: boolean;
+    light?: boolean;
+    size?: "" | "xxs" | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';
+    fontSize?: string;
+    fullWidth?: boolean;
+    fullHeight?: boolean;
+    icon?: any;
+    iconPosition?: 'before' | 'after';
+    arrow?: boolean | "true" | "false";
+    dataFor?: string;
+    dataTip?: string;
+}