@sydsoft/base 1.50.0 → 1.52.0

package/_dist/esm/grid/index.js

@@ -0,0 +1,97 @@
+import { __assign, __rest, __spreadArray } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState } from 'react';
+import styles from './index.module.css';
+export var Row = function (_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, style = _a.style, _c = _a.flexDirection, flexDirection = _c === void 0 ? 'row' : _c, _d = _a.flexWrap, flexWrap = _d === void 0 ? 'wrap' : _d, _e = _a.justifyContent, justifyContent = _e === void 0 ? 'flex-start' : _e, _f = _a.alignContent, alignContent = _f === void 0 ? 'center' : _f, _g = _a.alignItems, alignItems = _g === void 0 ? 'center' : _g, _h = _a.rowSpacing, rowSpacing = _h === void 0 ? 2 : _h, _j = _a.colSpacing, colSpacing = _j === void 0 ? 2 : _j, other = __rest(_a, ["children", "className", "style", "flexDirection", "flexWrap", "justifyContent", "alignContent", "alignItems", "rowSpacing", "colSpacing"]);
+    var classes = [
+        styles.row,
+        rowSpacing !== undefined && styles["row-spacing-".concat(rowSpacing)],
+        colSpacing !== undefined && styles["col-spacing-".concat(colSpacing)],
+        flexDirection !== 'row' && styles["flex-".concat(flexDirection.replace('-', '-'))],
+        flexWrap !== 'wrap' && styles["flex-".concat(flexWrap)],
+        justifyContent !== 'flex-start' && styles["justify-".concat(justifyContent.replace('flex-', '').replace('space-', ''))],
+        alignItems !== 'center' && styles["align-items-".concat(alignItems.replace('flex-', ''))],
+        alignContent !== 'center' && styles["align-content-".concat(alignContent.replace('flex-', ''))],
+        className
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsx("div", __assign({ className: classes, style: style }, other, { children: children })));
+};
+export var Col = function (_a) {
+    // Cascading logic - aynı sizin component'inizdeki gibi
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b, style = _a.style, xs = _a.xs, sm = _a.sm, md = _a.md, lg = _a.lg, xl = _a.xl, xxl = _a.xxl, other = __rest(_a, ["children", "className", "style", "xs", "sm", "md", "lg", "xl", "xxl"]);
+    var classes = [
+        styles.col,
+        // Sadece belirtilen breakpoint'ler için class ekle
+        xs && styles["col-xs-".concat(xs)],
+        sm && styles["col-sm-".concat(sm)],
+        md && styles["col-md-".concat(md)],
+        lg && styles["col-lg-".concat(lg)],
+        xl && styles["col-xl-".concat(xl)],
+        xxl && styles["col-xxl-".concat(xxl)],
+        className
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsx("div", __assign({ className: classes, style: style }, other, { children: children })));
+};
+export var Hidden = function (_a) {
+    var children = _a.children, hidden = _a.hidden, onlyHidden = _a.onlyHidden, other = __rest(_a, ["children", "hidden", "onlyHidden"]);
+    var existingClassName = children.props.className || '';
+    var hiddenClasses = [];
+    if (onlyHidden) {
+        onlyHidden.forEach(function (breakpoint) {
+            hiddenClasses.push(styles["hidden-".concat(breakpoint)]);
+        });
+    }
+    else if (hidden) {
+        // Orijinal mantık: seçilen breakpoint ve altındaki tüm breakpoint'ler gizlenir
+        var breakpoints = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
+        var targetIndex = breakpoints.indexOf(hidden);
+        if (targetIndex !== -1) {
+            for (var i = 0; i <= targetIndex; i++) {
+                hiddenClasses.push(styles["hidden-".concat(breakpoints[i])]);
+            }
+        }
+    }
+    var newClassName = __spreadArray([existingClassName], hiddenClasses, true).filter(Boolean).join(' ');
+    return React.cloneElement(children, __assign({ className: newClassName }, other));
+};
+export var DevelopGridComponent = function () {
+    var _a = useState(''), currentBreakpoint = _a[0], setCurrentBreakpoint = _a[1];
+    // Breakpoint detector
+    React.useEffect(function () {
+        var updateBreakpoint = function () {
+            var width = window.innerWidth;
+            var breakpoint = '';
+            if (width <= 576)
+                breakpoint = 'XS (≤576px)';
+            else if (width <= 768)
+                breakpoint = 'SM (577-768px)';
+            else if (width <= 992)
+                breakpoint = 'MD (769-992px)';
+            else if (width <= 1200)
+                breakpoint = 'LG (993-1200px)';
+            else if (width <= 1400)
+                breakpoint = 'XL (1201-1400px)';
+            else
+                breakpoint = 'XXL (≥1401px)';
+            setCurrentBreakpoint(breakpoint);
+        };
+        updateBreakpoint();
+        window.addEventListener('resize', updateBreakpoint);
+        return function () { return window.removeEventListener('resize', updateBreakpoint); };
+    }, []);
+    return (_jsxs("div", { style: {
+            position: 'fixed',
+            bottom: '10px',
+            right: '10px',
+            background: '#333',
+            color: 'white',
+            padding: '10px',
+            borderRadius: '4px',
+            zIndex: 9999999
+        }, children: ["Current: ", currentBreakpoint] }));
+};

package/_dist/{icon → esm/icon}/icons.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-export const iconMap = {
+export var iconMap = {
     close: {
         viewBox: '0 -960 960 960',
         content: (_jsx(_Fragment, { children: _jsx("path", { d: "m336-280-56-56 144-144-144-143 56-56 144 144 143-144 56 56-144 143 144 144-56 56-143-144-144 144Z" }) }))

package/_dist/esm/icon/index.js

@@ -0,0 +1,26 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { iconMap } from './icons';
+export var iconList = Object.keys(iconMap);
+var defaultIconStyle = {
+    userSelect: 'none',
+    width: '1em',
+    height: '1em',
+    // display: 'inline-block',
+    verticalAlign: 'middle',
+    flexShrink: 0,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center'
+};
+export var Icon = function (_a) {
+    var name = _a.name, iconMui = _a.iconMui, customIcon = _a.customIcon, fontSize = _a.fontSize, color = _a.color, className = _a.className, style = _a.style, other = __rest(_a, ["name", "iconMui", "customIcon", "fontSize", "color", "className", "style"]);
+    if (iconMui) {
+        return (_jsx("span", __assign({ className: "material-icons ".concat(className || ''), style: __assign(__assign(__assign({}, defaultIconStyle), style), { fontSize: fontSize || '1.3rem', color: color || 'inherit' }), "aria-hidden": "true" }, other, { children: iconMui })));
+    }
+    var iconComponent = name ? iconMap[name] : customIcon;
+    if (!iconComponent) {
+        return _jsx("span", { children: "\u26A0\uFE0F" });
+    }
+    return (_jsx("span", __assign({ className: className, style: __assign(__assign(__assign({}, defaultIconStyle), style), { fontSize: fontSize || '1.5rem', color: color || 'inherit' }) }, other, { children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: iconComponent.viewBox, fill: 'currentColor', width: "1em", height: "1em", style: { display: 'block', flexShrink: 0 }, children: iconComponent.content }) })));
+};

package/_dist/esm/menu/index.js

@@ -0,0 +1,52 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @author    : izzetseydaoglu
+ * @copyright : sydSOFT Bilişim Hizmetleri (c) 2026
+ * @version   : 2026-02-07 19:31:01
+ */
+import React, { memo, useMemo } from 'react';
+import { Dialog } from '../form';
+import { Popover } from '../popover';
+import Link from 'next/link';
+import styles from './index.module.css';
+export var Menu = memo(function MemoFunction(_a) {
+    var menu = _a.menu, className = _a.className, style = _a.style, _b = _a.withIcon, withIcon = _b === void 0 ? 'auto' : _b;
+    var withIconComponent = useMemo(function () {
+        if (withIcon === true)
+            return true;
+        if (withIcon === false)
+            return false;
+        return Object.values(menu).some(function (item) { return 'icon' in item && !!item.icon; });
+    }, [menu, withIcon]);
+    var withRightComponent = useMemo(function () {
+        return Object.values(menu).some(function (item) { return 'rightComponent' in item && !!item.rightComponent; });
+    }, [menu]);
+    var handleClick = function (item, e) {
+        if (!item.onClick)
+            return;
+        if (item.dialog) {
+            Dialog(__assign({}, item.dialog)).then(function (result) {
+                if (result && item.onClick) {
+                    item.onClick(e);
+                }
+            });
+        }
+        else {
+            item.onClick(e);
+        }
+    };
+    return (_jsx("ul", { className: "smenu ".concat(styles.ul, " ").concat(className || ''), style: style, children: Object.values(menu).map(function (item, key) {
+            var _a = item, fullComponent = _a.fullComponent, icon = _a.icon, title = _a.title, rightComponent = _a.rightComponent, seperator = _a.seperator, href = _a.href, style = _a.style, itemProps = _a.itemProps, type = _a.type, items = _a.items, menuProps = _a.menuProps, subMenuPopoverProps = _a.subMenuPopoverProps, other = __rest(_a, ["fullComponent", "icon", "title", "rightComponent", "seperator", "href", "style", "itemProps", "type", "items", "menuProps", "subMenuPopoverProps"]);
+            var hasSubmenu = type === 'submenu' && Array.isArray(items) && items.length > 0;
+            if (fullComponent)
+                return React.cloneElement(fullComponent, { key: key });
+            if (seperator)
+                return _jsx("li", __assign({ className: styles.seperator, style: style }, itemProps, other), key);
+            var Component = (_jsxs(_Fragment, { children: [withIconComponent && _jsx("div", { className: styles.menuicon, children: icon }), _jsx("div", { className: styles.menutitle, children: title }), withRightComponent && _jsx("div", { className: styles.rightmenu, children: rightComponent })] }));
+            if (hasSubmenu) {
+                return (_jsx(Popover, __assign({ component: _jsx("li", __assign({ style: style }, itemProps, other, { children: Component })), position: "right-top" }, (subMenuPopoverProps || {}), { children: _jsx(Menu, __assign({ menu: items }, (menuProps || {}))) }), key));
+            }
+            return (_jsx("li", __assign({ style: style, onClick: function (e) { return handleClick(item, e); } }, itemProps, other, { children: href ? _jsx(Link, { href: href, children: Component }) : Component }), key));
+        }) }));
+});

package/_dist/esm/modal/index.js

@@ -0,0 +1,66 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Copyright (c) 2023
+ *  @author: izzetseydaoglu
+ *  @last-modified: 9.02.2024 06:07
+ */
+import { memo, useEffect, useRef, useState } from "react";
+import ReactDOM from "react-dom";
+import styles from "./index.module.css";
+export var Modal = memo(function MemoFunction(_a) {
+    var _b = _a.refModal, refModal = _b === void 0 ? null : _b, children = _a.children, _c = _a.open, open = _c === void 0 ? false : _c, close = _a.close, _d = _a.keepMounted, keepMounted = _d === void 0 ? false : _d, _e = _a.fullScreen, fullScreen = _e === void 0 ? false : _e, _f = _a.hideBackdrop, hideBackdrop = _f === void 0 ? true : _f, _g = _a.hideEsc, hideEsc = _g === void 0 ? false : _g, _h = _a.hideCloseButton, hideCloseButton = _h === void 0 ? false : _h, modalStyle = _a.modalStyle, backdropStyle = _a.backdropStyle, _j = _a.vertialAlign, vertialAlign = _j === void 0 ? "center" : _j, _k = _a.horizontalAlign, horizontalAlign = _k === void 0 ? "center" : _k;
+    var _l = useState(null), modalDiv = _l[0], setModalDiv = _l[1];
+    var ref = useRef(null);
+    useEffect(function () {
+        if (refModal)
+            refModal.current = ref.current;
+    }, [ref.current]);
+    var onClose = function () {
+        if (close)
+            close();
+    };
+    var checkHideBackDrop = function (e) {
+        if (open && ref.current && !ref.current.contains(e.target))
+            onClose();
+    };
+    var checkESC = function (e) {
+        if (e.keyCode === 27 || e.key === "Escape" || e.code === "Escape")
+            onClose();
+    };
+    useEffect(function () {
+        if (open) {
+            if (hideBackdrop)
+                window.addEventListener("mousedown", checkHideBackDrop);
+            if (hideEsc)
+                window.addEventListener("keydown", checkESC);
+        }
+        return function () {
+            if (hideBackdrop)
+                window.removeEventListener("mousedown", checkHideBackDrop);
+            if (hideEsc)
+                window.removeEventListener("keydown", checkESC);
+        };
+    });
+    useEffect(function () {
+        if (!modalDiv) {
+            var modalDivCheck = document.getElementById("smodal");
+            if (modalDivCheck) {
+                setModalDiv(modalDivCheck);
+            }
+            else {
+                var div = document.createElement("div");
+                div.setAttribute("id", "smodal");
+                document.body.appendChild(div);
+                setModalDiv(div);
+            }
+        }
+        return function () {
+            onClose();
+        };
+    }, []);
+    if ((!keepMounted && !open) || typeof window === "undefined")
+        return null;
+    var Component = (_jsx("div", { className: "".concat(styles.backdrop, " ").concat(open ? styles.backdrop_open : ""), style: __assign({ alignItems: vertialAlign, justifyContent: horizontalAlign }, backdropStyle), children: _jsxs("div", { ref: ref, className: "smodal ".concat(styles.modal, " ").concat(fullScreen ? styles.fullscreen : ""), style: modalStyle, children: [!hideCloseButton && (_jsx("div", { className: "close ".concat(styles.close_fixed), children: _jsx("div", { className: styles.close, onClick: onClose, children: "\u2715" }) })), children] }) }));
+    return modalDiv ? ReactDOM.createPortal(Component, modalDiv) : null;
+});

package/_dist/{popover → esm/popover}/index.js

@@ -3,25 +3,27 @@
  * @copyright : sydSOFT Bilişim Hizmetleri (c) 2026
  * @version   : 2026-02-10 16:12:35
  */
+import { __assign, __rest } from "tslib";
 import { cloneElement, memo, useEffect, useRef } from 'react';
 import { createRoot } from 'react-dom/client';
 import styles from './index.module.css';
-export const Popover = memo(function MemoFunction({ children, component, position = 'top', arrow = false, distance = 5, removeWhenClickInside = false, hideBackdrop = true, fade = true, arrowColor = 'auto', hover = false, hoverCloseDelay = 120, keepMounted = false, ...other }) {
-    const refComponent = useRef(null);
-    const closeTimer = useRef(null);
-    const hoverCloseTimer = useRef(null);
-    const popoverRef = useRef(null);
-    const rootRef = useRef(null);
-    const zIndexRef = useRef(null);
-    useEffect(() => {
+export var Popover = memo(function MemoFunction(_a) {
+    var children = _a.children, component = _a.component, _b = _a.position, position = _b === void 0 ? 'top' : _b, _c = _a.arrow, arrow = _c === void 0 ? false : _c, _d = _a.distance, distance = _d === void 0 ? 5 : _d, _e = _a.removeWhenClickInside, removeWhenClickInside = _e === void 0 ? false : _e, _f = _a.hideBackdrop, hideBackdrop = _f === void 0 ? true : _f, _g = _a.fade, fade = _g === void 0 ? true : _g, _h = _a.arrowColor, arrowColor = _h === void 0 ? 'auto' : _h, _j = _a.hover, hover = _j === void 0 ? false : _j, _k = _a.hoverCloseDelay, hoverCloseDelay = _k === void 0 ? 120 : _k, _l = _a.keepMounted, keepMounted = _l === void 0 ? false : _l, other = __rest(_a, ["children", "component", "position", "arrow", "distance", "removeWhenClickInside", "hideBackdrop", "fade", "arrowColor", "hover", "hoverCloseDelay", "keepMounted"]);
+    var refComponent = useRef(null);
+    var closeTimer = useRef(null);
+    var hoverCloseTimer = useRef(null);
+    var popoverRef = useRef(null);
+    var rootRef = useRef(null);
+    var zIndexRef = useRef(null);
+    useEffect(function () {
         if (typeof window === 'undefined')
             return;
-        return () => {
+        return function () {
             popoverSil(false);
         };
     }, []);
-    const checkHideBackDrop = (e) => {
-        const spopover = popoverRef.current;
+    var checkHideBackDrop = function (e) {
+        var spopover = popoverRef.current;
         if (!spopover)
             return;
         if (!((e === null || e === void 0 ? void 0 : e.target) instanceof Node)) {
@@ -31,50 +33,50 @@ export const Popover = memo(function MemoFunction({ children, component, positio
         if (!spopover.contains(e.target))
             popoverSil();
     };
-    const popoverEkle = (e) => {
+    var popoverEkle = function (e) {
         var _a, _b;
         if (popoverRef.current && keepMounted) {
-            const popover = popoverRef.current;
-            const target = e.currentTarget;
-            const wasVisible = popover.classList.contains(styles.visible);
+            var popover_1 = popoverRef.current;
+            var target_1 = e.currentTarget;
+            var wasVisible = popover_1.classList.contains(styles.visible);
             (_b = (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.call(_a, children);
-            applyArrowColor(popover);
-            popoverPosition({ target, position: position });
-            popover.style.zIndex = String(nextPopoverZIndex());
-            popover.classList.remove(styles.closing);
-            popover.classList.add(styles.visible);
+            applyArrowColor(popover_1);
+            popoverPosition({ target: target_1, position: position });
+            popover_1.style.zIndex = String(nextPopoverZIndex());
+            popover_1.classList.remove(styles.closing);
+            popover_1.classList.add(styles.visible);
             if (!wasVisible) {
                 if (hideBackdrop) {
                     window.addEventListener('mousedown', checkHideBackDrop);
                     window.addEventListener('blur', checkHideBackDrop);
                 }
                 if (removeWhenClickInside)
-                    popover.addEventListener('mouseup', popoverGecikmeliSil);
+                    popover_1.addEventListener('mouseup', popoverGecikmeliSil);
                 if (hover) {
-                    popover.addEventListener('mouseenter', clearHoverClose);
-                    popover.addEventListener('mouseleave', scheduleHoverClose);
+                    popover_1.addEventListener('mouseenter', clearHoverClose);
+                    popover_1.addEventListener('mouseleave', scheduleHoverClose);
                 }
                 incrementBodyPopover();
             }
             return;
         }
         popoverSil(false);
-        const popover = document.createElement('div');
+        var popover = document.createElement('div');
         popover.classList.add('spopover', styles.popover);
-        const zIndex = nextPopoverZIndex();
+        var zIndex = nextPopoverZIndex();
         zIndexRef.current = zIndex;
         document.body.appendChild(popover);
         // ReactDOM.render(children, popover)
-        const root = createRoot(popover);
+        var root = createRoot(popover);
         root.render(children);
         popoverRef.current = popover;
         rootRef.current = root;
-        const target = e.currentTarget;
+        var target = e.currentTarget;
         refComponent.current && refComponent.current.classList.add('spopover_active');
-        setTimeout(() => {
+        setTimeout(function () {
             var _a;
             applyArrowColor(popover);
-            popoverPosition({ target, position: position });
+            popoverPosition({ target: target, position: position });
             popover.style.zIndex = String((_a = zIndexRef.current) !== null && _a !== void 0 ? _a : zIndex);
             popover.classList.add(styles.visible);
         }, 100);
@@ -90,10 +92,11 @@ export const Popover = memo(function MemoFunction({ children, component, positio
         }
         incrementBodyPopover();
     };
-    const popoverSil = (animate = true) => {
+    var popoverSil = function (animate) {
+        if (animate === void 0) { animate = true; }
         refComponent.current && refComponent.current.classList.remove('spopover_active');
-        const check = popoverRef.current;
-        const wasVisible = !!(check === null || check === void 0 ? void 0 : check.classList.contains(styles.visible));
+        var check = popoverRef.current;
+        var wasVisible = !!(check === null || check === void 0 ? void 0 : check.classList.contains(styles.visible));
         if (check) {
             if (removeWhenClickInside)
                 check.removeEventListener('mouseup', popoverGecikmeliSil);
@@ -107,10 +110,10 @@ export const Popover = memo(function MemoFunction({ children, component, positio
                 window.clearTimeout(hoverCloseTimer.current);
             if (!fade || !animate) {
                 if (!keepMounted) {
-                    const root = rootRef.current;
-                    window.setTimeout(() => {
+                    var root_1 = rootRef.current;
+                    window.setTimeout(function () {
                         var _a;
-                        (_a = root === null || root === void 0 ? void 0 : root.unmount) === null || _a === void 0 ? void 0 : _a.call(root);
+                        (_a = root_1 === null || root_1 === void 0 ? void 0 : root_1.unmount) === null || _a === void 0 ? void 0 : _a.call(root_1);
                     }, 0);
                     check.remove();
                     popoverRef.current = null;
@@ -123,10 +126,10 @@ export const Popover = memo(function MemoFunction({ children, component, positio
             }
             else if (!check.classList.contains(styles.closing)) {
                 check.classList.add(styles.closing);
-                closeTimer.current = window.setTimeout(() => {
+                closeTimer.current = window.setTimeout(function () {
                     var _a;
                     if (!keepMounted) {
-                        const root = rootRef.current;
+                        var root = rootRef.current;
                         (_a = root === null || root === void 0 ? void 0 : root.unmount) === null || _a === void 0 ? void 0 : _a.call(root);
                         check.remove();
                         popoverRef.current = null;
@@ -146,54 +149,55 @@ export const Popover = memo(function MemoFunction({ children, component, positio
         if (wasVisible)
             decrementBodyPopover();
     };
-    const popoverGecikmeliSil = () => setTimeout(() => popoverSil(), 100);
-    const clearHoverClose = () => {
+    var popoverGecikmeliSil = function () { return setTimeout(function () { return popoverSil(); }, 100); };
+    var clearHoverClose = function () {
         if (hoverCloseTimer.current)
             window.clearTimeout(hoverCloseTimer.current);
         hoverCloseTimer.current = null;
     };
-    const scheduleHoverClose = () => {
+    var scheduleHoverClose = function () {
         clearHoverClose();
-        hoverCloseTimer.current = window.setTimeout(() => popoverSil(), hoverCloseDelay);
+        hoverCloseTimer.current = window.setTimeout(function () { return popoverSil(); }, hoverCloseDelay);
     };
-    const popoverPosition = ({ target, position }) => {
-        const popover = popoverRef.current;
+    var popoverPosition = function (_a) {
+        var target = _a.target, position = _a.position;
+        var popover = popoverRef.current;
         if (popover) {
-            const arrowMargin = arrow ? 5 : 0;
-            const margin = distance + arrowMargin;
-            const { side: preferredSide, align: preferredAlign } = normalizePosition(position);
-            const targetPosition = target.getBoundingClientRect();
-            const popoverPosition = popover.getBoundingClientRect();
-            const style = [];
-            let side = preferredSide;
-            if (side === 'top' && targetPosition.top - popoverPosition.height - margin < 0)
+            var arrowMargin = arrow ? 5 : 0;
+            var margin = distance + arrowMargin;
+            var _b = normalizePosition(position), preferredSide = _b.side, preferredAlign = _b.align;
+            var targetPosition = target.getBoundingClientRect();
+            var popoverPosition_1 = popover.getBoundingClientRect();
+            var style = [];
+            var side = preferredSide;
+            if (side === 'top' && targetPosition.top - popoverPosition_1.height - margin < 0)
                 side = 'bottom';
-            if (side === 'bottom' && targetPosition.bottom + popoverPosition.height + margin > window.innerHeight)
+            if (side === 'bottom' && targetPosition.bottom + popoverPosition_1.height + margin > window.innerHeight)
                 side = 'top';
-            if (side === 'left' && targetPosition.left - popoverPosition.width - margin < 0)
+            if (side === 'left' && targetPosition.left - popoverPosition_1.width - margin < 0)
                 side = 'right';
-            if (side === 'right' && targetPosition.right + popoverPosition.width + margin > window.innerWidth)
+            if (side === 'right' && targetPosition.right + popoverPosition_1.width + margin > window.innerWidth)
                 side = 'left';
             if (side === 'top')
-                style.push('top:' + (targetPosition.top - popoverPosition.height - margin) + 'px');
+                style.push('top:' + (targetPosition.top - popoverPosition_1.height - margin) + 'px');
             if (side === 'bottom')
                 style.push('top:' + (targetPosition.bottom + margin) + 'px');
             if (side === 'left')
-                style.push('left:' + (targetPosition.left - popoverPosition.width - margin) + 'px');
+                style.push('left:' + (targetPosition.left - popoverPosition_1.width - margin) + 'px');
             if (side === 'right')
                 style.push('left:' + (targetPosition.right + margin) + 'px');
-            let alignClass = 'center';
+            var alignClass = 'center';
             if (side === 'top' || side === 'bottom') {
-                const { left, alignClass: resolvedAlign } = resolveHorizontalAlign(preferredAlign, targetPosition, popoverPosition);
+                var _c = resolveHorizontalAlign(preferredAlign, targetPosition, popoverPosition_1), left = _c.left, resolvedAlign = _c.alignClass;
                 alignClass = resolvedAlign;
                 style.push('left:' + left + 'px');
             }
             else {
-                const { top, alignClass: resolvedAlign } = resolveVerticalAlign(preferredAlign, targetPosition, popoverPosition);
+                var _d = resolveVerticalAlign(preferredAlign, targetPosition, popoverPosition_1), top_1 = _d.top, resolvedAlign = _d.alignClass;
                 alignClass = resolvedAlign;
-                style.push('top:' + top + 'px');
+                style.push('top:' + top_1 + 'px');
             }
-            const classNames = ['spopover', styles.popover, arrow ? styles.arrow : '', fade ? '' : styles.noFade, sideClass[side], alignClassMap[alignClass]].filter(Boolean);
+            var classNames = ['spopover', styles.popover, arrow ? styles.arrow : '', fade ? '' : styles.noFade, sideClass[side], alignClassMap[alignClass]].filter(Boolean);
             popover.className = classNames.join(' ');
             popover.setAttribute('style', style.join(';'));
             applyArrowColor(popover);
@@ -206,12 +210,12 @@ export const Popover = memo(function MemoFunction({ children, component, positio
             return;
         }
         if (arrowColor === 'auto') {
-            const targetEl = (_a = popoverEl.firstElementChild) !== null && _a !== void 0 ? _a : popoverEl;
-            let bg = window.getComputedStyle(targetEl).backgroundColor;
+            var targetEl = (_a = popoverEl.firstElementChild) !== null && _a !== void 0 ? _a : popoverEl;
+            var bg = window.getComputedStyle(targetEl).backgroundColor;
             if (bg === 'rgba(0, 0, 0, 0)' || bg === 'transparent') {
-                const parent = targetEl.parentElement;
-                if (parent)
-                    bg = window.getComputedStyle(parent).backgroundColor;
+                var parent_1 = targetEl.parentElement;
+                if (parent_1)
+                    bg = window.getComputedStyle(parent_1).backgroundColor;
             }
             if (bg)
                 popoverEl.style.setProperty('--popover-arrow-color', bg);
@@ -220,15 +224,15 @@ export const Popover = memo(function MemoFunction({ children, component, positio
         popoverEl.style.setProperty('--popover-arrow-color', arrowColor);
     }
     function incrementBodyPopover() {
-        const body = document.body;
-        const count = Number(body.dataset.spopoverCount || '0') + 1;
+        var body = document.body;
+        var count = Number(body.dataset.spopoverCount || '0') + 1;
         body.dataset.spopoverCount = String(count);
         if (count > 0)
             body.classList.add('spopover_open');
     }
     function decrementBodyPopover() {
-        const body = document.body;
-        const count = Math.max(0, Number(body.dataset.spopoverCount || '0') - 1);
+        var body = document.body;
+        var count = Math.max(0, Number(body.dataset.spopoverCount || '0') - 1);
         if (count === 0) {
             delete body.dataset.spopoverCount;
             body.classList.remove('spopover_open');
@@ -238,29 +242,25 @@ export const Popover = memo(function MemoFunction({ children, component, positio
         }
     }
     function nextPopoverZIndex() {
-        const body = document.body;
-        const current = Number(body.dataset.spopoverZIndex || '10000');
-        const next = current + 1;
+        var body = document.body;
+        var current = Number(body.dataset.spopoverZIndex || '10000');
+        var next = current + 1;
         body.dataset.spopoverZIndex = String(next);
         return next;
     }
-    const componentProps = {
-        ref: refComponent,
-        onClick: (e) => {
+    var componentProps = __assign({ ref: refComponent, onClick: function (e) {
             var _a, _b;
             (_b = (_a = component.props) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
             popoverEkle(e);
-        },
-        ...other
-    };
+        } }, other);
     if (hover) {
-        componentProps.onMouseEnter = (e) => {
+        componentProps.onMouseEnter = function (e) {
             var _a, _b;
             (_b = (_a = component.props) === null || _a === void 0 ? void 0 : _a.onMouseEnter) === null || _b === void 0 ? void 0 : _b.call(_a, e);
             clearHoverClose();
             popoverEkle(e);
         };
-        componentProps.onMouseLeave = (e) => {
+        componentProps.onMouseLeave = function (e) {
             var _a, _b;
             (_b = (_a = component.props) === null || _a === void 0 ? void 0 : _a.onMouseLeave) === null || _b === void 0 ? void 0 : _b.call(_a, e);
             scheduleHoverClose();
@@ -268,31 +268,31 @@ export const Popover = memo(function MemoFunction({ children, component, positio
     }
     return cloneElement(component, componentProps);
 });
-const sideClass = {
+var sideClass = {
     top: styles.top,
     bottom: styles.bottom,
     left: styles.left,
     right: styles.right
 };
-const alignClassMap = {
+var alignClassMap = {
     start: styles.alignStart,
     center: styles.alignCenter,
     end: styles.alignEnd
 };
-const FADE_DURATION = 160;
-const normalizePosition = (position) => {
-    const [side, rawAlign] = position.split('-');
+var FADE_DURATION = 160;
+var normalizePosition = function (position) {
+    var _a = position.split('-'), side = _a[0], rawAlign = _a[1];
     if (side === 'top' || side === 'bottom') {
-        const align = rawAlign === 'left' || rawAlign === 'right' ? rawAlign : 'center';
-        return { side, align };
+        var align_1 = rawAlign === 'left' || rawAlign === 'right' ? rawAlign : 'center';
+        return { side: side, align: align_1 };
     }
-    const align = rawAlign === 'top' || rawAlign === 'bottom' ? rawAlign : 'center';
-    return { side, align };
+    var align = rawAlign === 'top' || rawAlign === 'bottom' ? rawAlign : 'center';
+    return { side: side, align: align };
 };
-const resolveHorizontalAlign = (align, target, popover) => {
-    const clamp = 2;
-    let left = 0;
-    let alignClass = 'center';
+var resolveHorizontalAlign = function (align, target, popover) {
+    var clamp = 2;
+    var left = 0;
+    var alignClass = 'center';
     if (align === 'left') {
         left = target.left;
         alignClass = 'start';
@@ -313,12 +313,12 @@ const resolveHorizontalAlign = (align, target, popover) => {
         left = window.innerWidth - popover.width - clamp;
         alignClass = 'end';
     }
-    return { left, alignClass };
+    return { left: left, alignClass: alignClass };
 };
-const resolveVerticalAlign = (align, target, popover) => {
-    const clamp = 2;
-    let top = 0;
-    let alignClass = 'center';
+var resolveVerticalAlign = function (align, target, popover) {
+    var clamp = 2;
+    var top = 0;
+    var alignClass = 'center';
     if (align === 'top') {
         top = target.top;
         alignClass = 'start';
@@ -339,5 +339,5 @@ const resolveVerticalAlign = (align, target, popover) => {
         top = window.innerHeight - popover.height - clamp;
         alignClass = 'end';
     }
-    return { top, alignClass };
+    return { top: top, alignClass: alignClass };
 };