@sydsoft/base 1.11.0 → 1.13.0

package/dist/esm/form/Dialog.js

@@ -1,9 +1,9 @@
 import { __assign } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, BoxFooter } from "../box";
-import { Button } from "./Button";
-import { Modal } from "../modal";
 import { createRoot } from "react-dom/client";
+import { Modal } from "../modal";
+import { Button } from "./Button";
 export var Dialog = function (config) {
     return new Promise(function (resolve) {
         if (typeof window === "undefined")
@@ -17,7 +17,7 @@ export var Dialog = function (config) {
         }
         var root = createRoot(mainDiv);
         var settings = __assign({ acceptButtonShow: true, cancelButtonShow: true, acceptButtonText: "EVET", cancelButtonText: "HAYIR", acceptButtonClass: "danger", cancelButtonClass: "secondary", vertialAlign: "center", horizontalAlign: "center", hideBackdrop: true, hideEsc: true, styleMessage: {
-                fontSize: "1.2rem",
+                fontSize: "1.1rem",
                 padding: "10px 20px"
             }, styleBox: { padding: 0, margin: 0, minWidth: 250 }, styleBoxFooter: { padding: "8px 5px" }, autoFocus: "accept" }, config);
         var close = function () {

package/dist/esm/icon/index.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { iconMap as defaultIcons } from "./icons";
+import { iconMap } from "./icons";
 export declare const iconList: ("search" | "close" | "edit" | "keyboard_arrow_up" | "keyboard_arrow_down")[];
-export type IconName = keyof typeof defaultIcons;
+export type IconName = keyof typeof iconMap;
 interface BaseProps {
     color?: string;
     fontSize?: number | string;
@@ -10,17 +10,17 @@ interface BaseProps {
     [key: string]: any;
 }
 interface NameIconProps extends BaseProps {
-    name: IconName | string;
+    name: IconName;
     customIcon?: never;
 }
+export type CustomIcon = {
+    viewBox: string;
+    content: string;
+};
 interface CustomIconProps extends BaseProps {
-    customIcon: {
-        viewBox: string;
-        content: string;
-    };
+    customIcon: CustomIcon;
     name?: never;
 }
 export type Props = NameIconProps | CustomIconProps;
-export declare const iconMap: any;
 export declare const Icon: React.FC<Props>;
 export {};

package/dist/esm/icon/index.js

@@ -1,7 +1,7 @@
 import { __assign, __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { iconMap as defaultIcons } from "./icons";
-export var iconList = Object.keys(defaultIcons);
+import { iconMap } from "./icons";
+export var iconList = Object.keys(iconMap);
 var defaultIconStyle = {
     userSelect: "none",
     width: "1em",
@@ -10,26 +10,11 @@ var defaultIconStyle = {
     verticalAlign: "middle",
     flexShrink: 0
 };
-var customIcons = {};
-// Sadece server-side’da root klasörden oku
-if (typeof window === "undefined") {
-    try {
-        var fs = require("fs");
-        var path = require("path");
-        var filePath = path.join(process.cwd(), "customIcons.json");
-        if (fs.existsSync(filePath)) {
-            customIcons = JSON.parse(fs.readFileSync(filePath, "utf-8"));
-        }
-    }
-    catch (_a) {
-        customIcons = {};
-    }
-}
-export var iconMap = __assign(__assign({}, defaultIcons), customIcons);
 export var Icon = function (_a) {
     var name = _a.name, customIcon = _a.customIcon, fontSize = _a.fontSize, color = _a.color, className = _a.className, style = _a.style, other = __rest(_a, ["name", "customIcon", "fontSize", "color", "className", "style"]);
     var iconComponent = name ? iconMap[name] : customIcon;
-    if (!iconComponent)
+    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", { viewBox: iconComponent.viewBox, fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: _jsx("g", { dangerouslySetInnerHTML: { __html: iconComponent.content } }) }) })));
 };

package/dist/esm/index.d.ts

@@ -5,6 +5,7 @@ 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/index.js

@@ -5,6 +5,7 @@ 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.d.ts

@@ -0,0 +1,43 @@
+import { propsDialog } from "../form";
+import React from "react";
+interface BaseProps {
+    style?: React.CSSProperties;
+    itemProps?: any;
+    [key: string]: any;
+}
+interface SeperatorProps extends BaseProps {
+    seperator: boolean;
+    title?: never;
+    icon?: never;
+    fullComponent?: never;
+    href?: never;
+    onClick?: never;
+    dialog?: never;
+}
+interface FullComponentProps extends BaseProps {
+    fullComponent: React.ReactElement;
+    seperator?: never;
+    title?: never;
+    icon?: never;
+    href?: never;
+    onClick?: never;
+    dialog?: never;
+}
+interface ItemComponentProps extends BaseProps {
+    seperator?: false;
+    fullComponent?: never;
+    title: string;
+    icon?: React.ReactNode;
+    href?: string;
+    onClick?: (e: React.MouseEvent<HTMLLIElement>) => void;
+    dialog?: propsDialog;
+}
+export type typeMenu = SeperatorProps | FullComponentProps | ItemComponentProps;
+interface Props {
+    menu: typeMenu[];
+    className?: string;
+    style?: React.CSSProperties;
+    withIcon?: boolean;
+}
+export declare const Menu: React.NamedExoticComponent<Props>;
+export {};

package/dist/esm/menu/index.js

@@ -0,0 +1,32 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Dialog } from "../form";
+import React, { memo } from "react";
+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 ? true : _b;
+    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 fullComponent = item.fullComponent, icon = item.icon, title = item.title, onClick = item.onClick, seperator = item.seperator, href = item.href, style = item.style, itemProps = item.itemProps, other = __rest(item, ["fullComponent", "icon", "title", "onClick", "seperator", "href", "style", "itemProps"]);
+            if (fullComponent)
+                return React.cloneElement(fullComponent, { key: key });
+            if (seperator)
+                return _jsx("li", __assign({ className: "".concat(styles.li, " ").concat(styles.seperator), style: style }, itemProps, other), key);
+            var Component = (_jsxs(_Fragment, { children: [withIcon && _jsx("div", { className: styles.menuicon, children: icon }), _jsx("div", { className: styles.menutitle, children: title })] }));
+            return (_jsx("li", __assign({ className: "".concat(styles.li), style: style, onClick: function (e) { return handleClick(item, e); } }, itemProps, other, { children: (href) ? _jsx(Link, { href: href, children: Component }) : Component }), key));
+        }) }));
+});

package/dist/esm/menu/index.module.css

@@ -0,0 +1,67 @@
+.ul {
+    position: relative;
+    width: 100%;
+    background-color: #fff;
+    box-shadow: 0 2px 4px rgb(0 0 0 / 40%), 0 8px 16px rgb(0 0 0 / 10%);
+    border-radius: 8px;
+    margin: 0;
+    padding: 4px 0;
+    list-style: none;
+}
+.li {
+    cursor: pointer;
+    padding: 7px 15px;
+    min-height: 25px;
+}
+.li,
+.li a {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    width: 100%;
+}
+.li a,
+.li a:visited {
+    color: inherit;
+    text-decoration: none;
+}
+
+.li.seperator {
+    display: block;
+    border-bottom: 1px #ced0d4 solid;
+    margin: 4px;
+    padding: 0;
+    cursor: default;
+    min-height: unset;
+}
+
+.li:first-child {
+    margin-top: 5px;
+}
+
+.li:last-child {
+    margin-bottom: 5px;
+}
+
+.li:hover {
+    background: #f0f2f5;
+}
+
+.menuicon {
+    display: inline-flex;
+    overflow: hidden;
+    width: 35px;
+    flex: 0 0 auto;
+    align-items: center;
+    justify-content: center;
+    margin-right: 15px;
+    color: #606060;
+}
+
+.menutitle {
+    display: inline-flex;
+    flex: 1;
+    align-items: center;
+    justify-content: flex-start;
+    margin-right: 10px;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@sydsoft/base",
     "private": false,
-    "version": "1.11.0",
+    "version": "1.13.0",
     "description": "",
     "main": "./dist/cjs/index.js",
     "module": "./dist/esm/index.js",