@sydsoft/base 1.53.0 → 1.56.0

package/{_dist → dist/esm}/form/UploadBase.js

@@ -1,22 +1,19 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.uploadBase_CreateForm = exports.UploadBase = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Copyright (c) 2024
  *  @author: izzetseydaoglu
  *  @last-modified: 11.06.2024 02:39
  */
-var react_1 = require("react");
-var alert_1 = require("../alert");
+import { useEffect, useRef } from "react";
+import { alert_add } from "../alert";
 var upload_ext_ok = ["pdf", "doc", "docx", "xls", "xlsx", "jpg", "jpeg", "png", "bmp", "tiff", "tif", "udf", "txt", "rtf", "csv", "xml", "zip", "rar"];
 var upload_maxsize = 30;
 var upload_maxfile = 50;
-var UploadBase = function (_a) {
+export var UploadBase = function (_a) {
     var _b = _a.component, component = _b === void 0 ? "div" : _b, children = _a.children, targetForm = _a.targetForm, onChange = _a.onChange, _c = _a.name, name = _c === void 0 ? "file__" : _c, _d = _a.required, required = _d === void 0 ? true : _d, _e = _a.multiple, multiple = _e === void 0 ? false : _e, _f = _a.maxSize, maxSize = _f === void 0 ? upload_maxsize : _f, _g = _a.maxFile, maxFile = _g === void 0 ? upload_maxfile : _g, _h = _a.ext_ok, ext_ok = _h === void 0 ? upload_ext_ok : _h, style = _a.style, className = _a.className, _j = _a.refUploadInput, refUploadInput = _j === void 0 ? null : _j, label = _a.label;
-    var ref = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(function () {
+    var ref = useRef(null);
+    useEffect(function () {
         if (refUploadInput)
             refUploadInput.current = ref.current;
     }, [ref.current]);
@@ -26,7 +23,7 @@ var UploadBase = function (_a) {
             return null;
         }
         if (e.target.files.length > maxFile) {
-            (0, alert_1.alert_add)({ type: "error", message: "En fazla " + maxFile + " dosya seçebilirsiniz." });
+            alert_add({ type: "error", message: "En fazla " + maxFile + " dosya seçebilirsiniz." });
             e.target.value = null;
             return null;
         }
@@ -35,10 +32,10 @@ var UploadBase = function (_a) {
             var size = file.size;
             var ext = file.name.replace(/^.*\./, "").toLowerCase();
             if (ext_ok.indexOf(ext) === -1) {
-                (0, alert_1.alert_add)({ type: "error", message: "Yüklemeye çalıştığınız dosya türü desteklenmiyor. Desteklenen dosya türleri: " + ext_ok.join(", ") });
+                alert_add({ type: "error", message: "Yüklemeye çalıştığınız dosya türü desteklenmiyor. Desteklenen dosya türleri: " + ext_ok.join(", ") });
             }
             else if (size > maxSize * 1000000) {
-                (0, alert_1.alert_add)({ type: "error", message: "En fazla " + maxSize + "MB büyüklüğündeki dosyaları seçebilirsiniz." });
+                alert_add({ type: "error", message: "En fazla " + maxSize + "MB büyüklüğündeki dosyaları seçebilirsiniz." });
             }
             else {
                 fileList.push(file);
@@ -53,10 +50,10 @@ var UploadBase = function (_a) {
             fileList.map(function (file) {
                 var _a;
                 uniqueID_1 = uniqueID_1 + 1;
-                newform_1 = tslib_1.__assign(tslib_1.__assign({}, newform_1), (_a = {}, _a[name + uniqueID_1] = file, _a));
+                newform_1 = __assign(__assign({}, newform_1), (_a = {}, _a[name + uniqueID_1] = file, _a));
                 nameList_1.push(file.name);
             });
-            targetForm(function (prev) { return (tslib_1.__assign(tslib_1.__assign({}, prev), { uploadBaseList: tslib_1.__assign({}, newform_1), uploadBaseListName: nameList_1.join(", ") })); });
+            targetForm(function (prev) { return (__assign(__assign({}, prev), { uploadBaseList: __assign({}, newform_1), uploadBaseListName: nameList_1.join(", ") })); });
         }
     };
     var defaultStyle = {
@@ -64,7 +61,7 @@ var UploadBase = function (_a) {
         cursor: "pointer"
     };
     var Component = component.toLowerCase();
-    return ((0, jsx_runtime_1.jsxs)(Component, { className: className, style: tslib_1.__assign(tslib_1.__assign({}, defaultStyle), style), "data-label": label !== null && label !== void 0 ? label : "", children: [children, (0, jsx_runtime_1.jsx)("input", { ref: ref, type: "file", required: required, onChange: fileSelected, multiple: multiple, accept: ext_ok.map(function (i) { return "." + i; }).join(","), style: {
+    return (_jsxs(Component, { className: className, style: __assign(__assign({}, defaultStyle), style), "data-label": label !== null && label !== void 0 ? label : "", children: [children, _jsx("input", { ref: ref, type: "file", required: required, onChange: fileSelected, multiple: multiple, accept: ext_ok.map(function (i) { return "." + i; }).join(","), style: {
                     position: "absolute",
                     top: 0,
                     left: 0,
@@ -75,17 +72,15 @@ var UploadBase = function (_a) {
                     zIndex: 1
                 } })] }));
 };
-exports.UploadBase = UploadBase;
-var uploadBase_CreateForm = function (formData) {
+export var uploadBase_CreateForm = function (formData) {
     var _a;
-    var newform = tslib_1.__assign({}, formData);
+    var newform = __assign({}, formData);
     var list = (_a = formData["uploadBaseList"]) !== null && _a !== void 0 ? _a : {};
     Object.keys(list).map(function (fileKey) {
         var _a;
-        return (newform = tslib_1.__assign(tslib_1.__assign({}, newform), (_a = {}, _a[fileKey] = list[fileKey], _a)));
+        return (newform = __assign(__assign({}, newform), (_a = {}, _a[fileKey] = list[fileKey], _a)));
     });
     delete newform["uploadBaseList"];
     delete newform["uploadBaseListName"];
     return newform;
 };
-exports.uploadBase_CreateForm = uploadBase_CreateForm;

package/dist/esm/form/index.js

@@ -0,0 +1,9 @@
+export * from "./Button";
+export * from "./Checkbox";
+export * from "./Dialog";
+export * from "./Form";
+export * from "./FormOlustur";
+export * from "./Input";
+export * from "./Label";
+export * from "./SearchableInput";
+export * from "./UploadBase";

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/esm/icon/icons.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+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" }) }))
+    },
+    search: {
+        viewBox: '0 0 24 24',
+        content: (_jsxs(_Fragment, { children: [_jsx("path", { d: "M0 0h24v24H0V0z", fill: "none" }), _jsx("path", { d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" })] }))
+    },
+    edit: {
+        viewBox: '0 -960 960 960',
+        content: (_jsx("path", { d: "M200-200h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T817-647L290-120H120Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z" }))
+    },
+    keyboard_arrow_up: {
+        viewBox: '0 -960 960 960',
+        content: _jsx("path", { d: "M480-528 296-344l-56-56 240-240 240 240-56 56-184-184Z" })
+    },
+    keyboard_arrow_down: {
+        viewBox: '0 -960 960 960',
+        content: _jsx("path", { d: "M480-344 240-584l56-56 184 184 184-184 56 56-240 240Z" })
+    }
+};

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/icon/mui.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/index.js

@@ -0,0 +1,19 @@
+export * from './_lib/baseFunctions';
+export * from './_lib/inputMask';
+export * from './_lib/listFunctions';
+export * from './_lib/storage/cookies';
+export * from './_lib/storage/encData';
+export * from './_lib/storage/localStorage';
+export * from './_lib/storage/sessionStorage';
+export * from './_lib/useInterval';
+export * from './alert';
+export * from './box';
+export * from './countDown';
+export * from './dateTime';
+export * from './form';
+export * from './grid';
+export * from './icon';
+export * from './menu';
+export * from './modal';
+export * from './popover';
+export * from './tooltip';

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 → dist/esm}/modal/index.js

@@ -1,21 +1,18 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Modal = void 0;
-var tslib_1 = require("tslib");
-var jsx_runtime_1 = require("react/jsx-runtime");
+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
  */
-var react_1 = require("react");
-var react_dom_1 = tslib_1.__importDefault(require("react-dom"));
-var index_module_css_1 = tslib_1.__importDefault(require("./index.module.css"));
-exports.Modal = (0, react_1.memo)(function MemoFunction(_a) {
+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 = (0, react_1.useState)(null), modalDiv = _l[0], setModalDiv = _l[1];
-    var ref = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(function () {
+    var _l = useState(null), modalDiv = _l[0], setModalDiv = _l[1];
+    var ref = useRef(null);
+    useEffect(function () {
         if (refModal)
             refModal.current = ref.current;
     }, [ref.current]);
@@ -31,7 +28,7 @@ exports.Modal = (0, react_1.memo)(function MemoFunction(_a) {
         if (e.keyCode === 27 || e.key === "Escape" || e.code === "Escape")
             onClose();
     };
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         if (open) {
             if (hideBackdrop)
                 window.addEventListener("mousedown", checkHideBackDrop);
@@ -45,7 +42,7 @@ exports.Modal = (0, react_1.memo)(function MemoFunction(_a) {
                 window.removeEventListener("keydown", checkESC);
         };
     });
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         if (!modalDiv) {
             var modalDivCheck = document.getElementById("smodal");
             if (modalDivCheck) {
@@ -64,6 +61,6 @@ exports.Modal = (0, react_1.memo)(function MemoFunction(_a) {
     }, []);
     if ((!keepMounted && !open) || typeof window === "undefined")
         return null;
-    var Component = ((0, jsx_runtime_1.jsx)("div", { className: "".concat(index_module_css_1.default.backdrop, " ").concat(open ? index_module_css_1.default.backdrop_open : ""), style: tslib_1.__assign({ alignItems: vertialAlign, justifyContent: horizontalAlign }, backdropStyle), children: (0, jsx_runtime_1.jsxs)("div", { ref: ref, className: "smodal ".concat(index_module_css_1.default.modal, " ").concat(fullScreen ? index_module_css_1.default.fullscreen : ""), style: modalStyle, children: [!hideCloseButton && ((0, jsx_runtime_1.jsx)("div", { className: "close ".concat(index_module_css_1.default.close_fixed), children: (0, jsx_runtime_1.jsx)("div", { className: index_module_css_1.default.close, onClick: onClose, children: "\u2715" }) })), children] }) }));
-    return modalDiv ? react_dom_1.default.createPortal(Component, modalDiv) : 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 → dist/esm}/popover/index.js

@@ -1,24 +1,21 @@
-"use strict";
 /**
  * @author    : izzetseydaoglu
  * @copyright : sydSOFT Bilişim Hizmetleri (c) 2026
  * @version   : 2026-02-10 16:12:35
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Popover = void 0;
-var tslib_1 = require("tslib");
-var react_1 = require("react");
-var client_1 = require("react-dom/client");
-var index_module_css_1 = tslib_1.__importDefault(require("./index.module.css"));
-exports.Popover = (0, react_1.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 = tslib_1.__rest(_a, ["children", "component", "position", "arrow", "distance", "removeWhenClickInside", "hideBackdrop", "fade", "arrowColor", "hover", "hoverCloseDelay", "keepMounted"]);
-    var refComponent = (0, react_1.useRef)(null);
-    var closeTimer = (0, react_1.useRef)(null);
-    var hoverCloseTimer = (0, react_1.useRef)(null);
-    var popoverRef = (0, react_1.useRef)(null);
-    var rootRef = (0, react_1.useRef)(null);
-    var zIndexRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(function () {
+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 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 function () {
@@ -41,13 +38,13 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
         if (popoverRef.current && keepMounted) {
             var popover_1 = popoverRef.current;
             var target_1 = e.currentTarget;
-            var wasVisible = popover_1.classList.contains(index_module_css_1.default.visible);
+            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_1);
             popoverPosition({ target: target_1, position: position });
             popover_1.style.zIndex = String(nextPopoverZIndex());
-            popover_1.classList.remove(index_module_css_1.default.closing);
-            popover_1.classList.add(index_module_css_1.default.visible);
+            popover_1.classList.remove(styles.closing);
+            popover_1.classList.add(styles.visible);
             if (!wasVisible) {
                 if (hideBackdrop) {
                     window.addEventListener('mousedown', checkHideBackDrop);
@@ -65,12 +62,12 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
         }
         popoverSil(false);
         var popover = document.createElement('div');
-        popover.classList.add('spopover', index_module_css_1.default.popover);
+        popover.classList.add('spopover', styles.popover);
         var zIndex = nextPopoverZIndex();
         zIndexRef.current = zIndex;
         document.body.appendChild(popover);
         // ReactDOM.render(children, popover)
-        var root = (0, client_1.createRoot)(popover);
+        var root = createRoot(popover);
         root.render(children);
         popoverRef.current = popover;
         rootRef.current = root;
@@ -81,7 +78,7 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
             applyArrowColor(popover);
             popoverPosition({ target: target, position: position });
             popover.style.zIndex = String((_a = zIndexRef.current) !== null && _a !== void 0 ? _a : zIndex);
-            popover.classList.add(index_module_css_1.default.visible);
+            popover.classList.add(styles.visible);
         }, 100);
         if (hideBackdrop) {
             window.addEventListener('mousedown', checkHideBackDrop);
@@ -99,7 +96,7 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
         if (animate === void 0) { animate = true; }
         refComponent.current && refComponent.current.classList.remove('spopover_active');
         var check = popoverRef.current;
-        var wasVisible = !!(check === null || check === void 0 ? void 0 : check.classList.contains(index_module_css_1.default.visible));
+        var wasVisible = !!(check === null || check === void 0 ? void 0 : check.classList.contains(styles.visible));
         if (check) {
             if (removeWhenClickInside)
                 check.removeEventListener('mouseup', popoverGecikmeliSil);
@@ -123,12 +120,12 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
                     rootRef.current = null;
                 }
                 else {
-                    check.classList.remove(index_module_css_1.default.visible);
-                    check.classList.remove(index_module_css_1.default.closing);
+                    check.classList.remove(styles.visible);
+                    check.classList.remove(styles.closing);
                 }
             }
-            else if (!check.classList.contains(index_module_css_1.default.closing)) {
-                check.classList.add(index_module_css_1.default.closing);
+            else if (!check.classList.contains(styles.closing)) {
+                check.classList.add(styles.closing);
                 closeTimer.current = window.setTimeout(function () {
                     var _a;
                     if (!keepMounted) {
@@ -139,8 +136,8 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
                         rootRef.current = null;
                     }
                     else {
-                        check.classList.remove(index_module_css_1.default.visible);
-                        check.classList.remove(index_module_css_1.default.closing);
+                        check.classList.remove(styles.visible);
+                        check.classList.remove(styles.closing);
                     }
                 }, FADE_DURATION);
             }
@@ -200,7 +197,7 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
                 alignClass = resolvedAlign;
                 style.push('top:' + top_1 + 'px');
             }
-            var classNames = ['spopover', index_module_css_1.default.popover, arrow ? index_module_css_1.default.arrow : '', fade ? '' : index_module_css_1.default.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);
@@ -251,7 +248,7 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
         body.dataset.spopoverZIndex = String(next);
         return next;
     }
-    var componentProps = tslib_1.__assign({ ref: refComponent, onClick: function (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);
@@ -269,18 +266,18 @@ exports.Popover = (0, react_1.memo)(function MemoFunction(_a) {
             scheduleHoverClose();
         };
     }
-    return (0, react_1.cloneElement)(component, componentProps);
+    return cloneElement(component, componentProps);
 });
 var sideClass = {
-    top: index_module_css_1.default.top,
-    bottom: index_module_css_1.default.bottom,
-    left: index_module_css_1.default.left,
-    right: index_module_css_1.default.right
+    top: styles.top,
+    bottom: styles.bottom,
+    left: styles.left,
+    right: styles.right
 };
 var alignClassMap = {
-    start: index_module_css_1.default.alignStart,
-    center: index_module_css_1.default.alignCenter,
-    end: index_module_css_1.default.alignEnd
+    start: styles.alignStart,
+    center: styles.alignCenter,
+    end: styles.alignEnd
 };
 var FADE_DURATION = 160;
 var normalizePosition = function (position) {

package/{_dist → dist/esm}/tooltip/index.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tooltip = void 0;
-var tslib_1 = require("tslib");
-var react_1 = tslib_1.__importStar(require("react"));
-exports.Tooltip = (0, react_1.memo)(function MemoFunction(_a) {
-    var children = _a.children, title = _a.title, _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, other = tslib_1.__rest(_a, ["children", "title", "position", "arrow", "distance"]);
-    (0, react_1.useEffect)(function () {
+import { __assign, __rest } from "tslib";
+import React, { memo, useEffect } from "react";
+export var Tooltip = memo(function MemoFunction(_a) {
+    var children = _a.children, title = _a.title, _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, other = __rest(_a, ["children", "title", "position", "arrow", "distance"]);
+    useEffect(function () {
         if (typeof window === "undefined")
             return null;
         var cssCheck = document.getElementsByClassName("stooltip_css")[0];
@@ -117,6 +114,6 @@ exports.Tooltip = (0, react_1.memo)(function MemoFunction(_a) {
             tooltip.setAttribute("style", style.join(";"));
         }
     };
-    return react_1.default.cloneElement(children, tslib_1.__assign({ onMouseEnter: tooltipEkle, onMouseLeave: tooltipSil, onMouseDown: tooltipSil }, other));
+    return React.cloneElement(children, __assign({ onMouseEnter: tooltipEkle, onMouseLeave: tooltipSil, onMouseDown: tooltipSil }, other));
 });
 var tooltipCss = "\n.stooltip {\n    position: fixed;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: #1a1a1a;\n    color: rgba(255,255,255,0.9);\n    text-align: center;\n    font-size: 0.9rem;\n    font-weight:400;\n    padding: 5px 10px;\n    border-radius: 8px;\n    z-index: 1000000;\n    opacity: 0.9;\n    pointer-events: none;\n    /*transition: all 0.1s;*/\n    white-space:pre-line;\n    max-width: 300px;\n    animation: stooltip_fadein 0.7s;\n}\n\n.stooltip.arrow:after {\n    content: \"\";\n    position: absolute;\n    margin-left: -5px;\n    border-width: 5px;\n    border-style: solid;\n}\n\n.stooltip.arrow.top:after {\n    top: 100%;\n    border-color: #1a1a1a transparent transparent transparent;\n}\n\n.stooltip.arrow.top.start:after { left: 15px;}\n\n.stooltip.arrow.top.center:after { left: 50%;}\n\n.stooltip.arrow.top.end:after { right: 15px;}\n\n\n.stooltip.arrow.bottom:after {\n    bottom: 100%;\n    border-color: transparent transparent #1a1a1a transparent;\n}\n\n.stooltip.arrow.bottom.start:after { left: 15px;}\n\n.stooltip.arrow.bottom.center:after { left: 50%;}\n\n.stooltip.bottom.end:after { right: 15px;}\n\n.stooltip.arrow.left:after {\n    margin-left: -1px;\n    left: 100%;\n    border-color: transparent transparent transparent #1a1a1a;\n}\n\n.stooltip.arrow.left.start:after { top: 5px;}\n\n.stooltip.arrow.left.center:after { top: 50%; margin-top: -5px;}\n\n.stooltip.arrow.left.end:after { bottom: 15px;}\n\n.stooltip.arrow.right:after {\n    margin-right: -1px;\n    right: 100%;\n    border-color: transparent #1a1a1a transparent transparent;\n}\n\n.stooltip.arrow.right.start:after { top: 5px;}\n\n.stooltip.arrow.right.center:after { top: 50%; margin-top: -5px;}\n\n.stooltip.arrow.right.end:after { bottom: 15px;}\n\n@keyframes stooltip_fadein {\n    from { opacity: 0; }\n    to   { opacity: 0.85; }\n}\n";

package/package.json

@@ -1,23 +1,18 @@
 {
     "name": "@sydsoft/base",
     "private": false,
-    "version": "1.53.0",
-    "description": "",
-    "main": "./_dist/index.js",
-    "types": "./_dist/index.d.ts",
+    "version": "1.56.0",
+    "main": "./dist/cjs/index.js",
+    "module": "./dist/esm/index.js",
+    "types": "./dist/esm/index.d.ts",
     "files": [
-        "./_dist/",
+        "./dist/",
         "README.md"
     ],
-    "exports": {
-        ".": {
-            "types": "./_dist/index.d.ts",
-            "default": "./_dist/index.js"
-        }
-    },
     "scripts": {
-        "clean": "rm -rf ./_dist",
-        "copyFiles": "find . -name \"*.css\" -not -path \"./_dist/*\" -exec sh -c 'for f do mkdir -p \"_dist/$(dirname \"$f\")\"; cp \"$f\" \"_dist/$f\"; done' sh {} +",
+        "clean": "rm -rf ./dist",
+        "test": "rm -rf ../*.tgz && rm -rf ../.next && npm run build && npm pack --pack-destination ../ && cd ../ && npm uninstall @sydsoft/base && npm install *.tgz && npm run dev",
+        "copyFiles": "find . -name \"*.css\" -not -path \"./dist/*\" -exec sh -c 'for f do mkdir -p \"dist/esm/$(dirname \"$f\")\"; cp \"$f\" \"dist/esm/$f\"; done' sh {} +",
         "build": "npm run clean && tsc && npm run copyFiles",
         "publishNPM": "npm run build && npm version patch && npm version minor && npm publish --dry-run && npm publish --access public && npm run clean"
     },