@sydsoft/base 1.49.0 → 1.50.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/package.json +2 -2
  2. package/_lib/baseFunctions.ts +0 -94
  3. package/_lib/inputMask.ts +0 -257
  4. package/_lib/listFunctions.ts +0 -106
  5. package/_lib/storage/cookies.ts +0 -39
  6. package/_lib/storage/encData.ts +0 -41
  7. package/_lib/storage/localStorage.ts +0 -67
  8. package/_lib/storage/sessionStorage.ts +0 -67
  9. package/_lib/useInterval.ts +0 -30
  10. package/alert/index.module.css +0 -119
  11. package/alert/index.tsx +0 -131
  12. package/box/Box.module.css +0 -153
  13. package/box/Box.tsx +0 -33
  14. package/box/BoxContent.tsx +0 -18
  15. package/box/BoxFooter.tsx +0 -25
  16. package/box/BoxHeader.tsx +0 -46
  17. package/box/index.ts +0 -10
  18. package/countDown/index.tsx +0 -116
  19. package/dateTime/index.ts +0 -79
  20. package/form/Button.tsx +0 -143
  21. package/form/Checkbox.tsx +0 -48
  22. package/form/Dialog.tsx +0 -109
  23. package/form/Form.tsx +0 -19
  24. package/form/FormOlustur.tsx +0 -105
  25. package/form/Input.tsx +0 -364
  26. package/form/Label.tsx +0 -20
  27. package/form/SearchableInput.tsx +0 -406
  28. package/form/UploadBase.tsx +0 -133
  29. package/form/index.ts +0 -10
  30. package/form/styles/Button.module.css +0 -145
  31. package/form/styles/Input.module.css +0 -221
  32. package/form/styles/Label.module.css +0 -31
  33. package/form/styles/SearchableInput.module.css +0 -80
  34. package/global.d.ts +0 -9
  35. package/grid/index.module.css +0 -805
  36. package/grid/index.tsx +0 -171
  37. package/icon/icons.tsx +0 -33
  38. package/icon/index.tsx +0 -95
  39. package/icon/mui.tsx +0 -5932
  40. package/index.ts +0 -21
  41. package/menu/index.module.css +0 -92
  42. package/menu/index.tsx +0 -143
  43. package/modal/index.module.css +0 -77
  44. package/modal/index.tsx +0 -106
  45. package/npm_recovery_codes.txt +0 -5
  46. package/popover/index.module.css +0 -89
  47. package/popover/index.tsx +0 -392
  48. package/tooltip/index.tsx +0 -216
  49. package/tsconfig.json +0 -24
package/index.ts DELETED
@@ -1,21 +0,0 @@
1
- export * from './_lib/baseFunctions';
2
- export * from './_lib/inputMask';
3
- export * from './_lib/listFunctions';
4
- export * from './_lib/storage/cookies';
5
- export * from './_lib/storage/encData';
6
- export * from './_lib/storage/localStorage';
7
- export * from './_lib/storage/sessionStorage';
8
- export * from './_lib/useInterval';
9
-
10
- export * from './alert';
11
- export * from './box';
12
- export * from './countDown';
13
- export * from './dateTime';
14
- export * from './form';
15
- export * from './grid';
16
- export * from './icon';
17
- export * from './menu';
18
- export * from './modal';
19
- export * from './popover';
20
- export * from './tooltip';
21
-
@@ -1,92 +0,0 @@
1
- .ul {
2
- position: relative;
3
- width: 100%;
4
- max-height: calc(100vh - 94px);
5
- list-style: none;
6
- padding: 0;
7
- margin: 0;
8
- background: #fff;
9
- letter-spacing: 0.2px;
10
- outline: none;
11
- border: 1px solid transparent;
12
- border-radius: 4px;
13
- box-shadow: 0 2px 6px 2px rgba(60, 64, 67, 0.15);
14
- overflow-y: auto;
15
- user-select: none;
16
- }
17
-
18
- .ul > li {
19
- cursor: pointer;
20
- padding: 2px 6px;
21
- min-height: 25px;
22
- }
23
- .ul > li,
24
- .ul > li a {
25
- display: flex;
26
- flex-direction: row;
27
- flex-wrap: nowrap;
28
- width: 100%;
29
- }
30
- .ul > li a,
31
- .ul > li a:visited {
32
- color: inherit;
33
- text-decoration: none;
34
- }
35
-
36
- .ul > li:first-child {
37
- margin-top: 5px;
38
- }
39
-
40
- .ul > li:last-child {
41
- margin-bottom: 5px;
42
- }
43
-
44
- .ul > li:hover {
45
- background: #f0f2f5;
46
- }
47
-
48
- .ul > li:global(.spopover_active) {
49
- background: #e8f0fe;
50
- }
51
-
52
- .menuicon {
53
- display: inline-flex;
54
- overflow: hidden;
55
- width: 30px;
56
- flex: 0 0 auto;
57
- align-items: center;
58
- justify-content: center;
59
- color: #606060;
60
- }
61
-
62
- .menutitle {
63
- display: inline-flex;
64
- flex: 1;
65
- align-items: center;
66
- justify-content: flex-start;
67
- margin: 0 10px;
68
- }
69
-
70
- .rightmenu {
71
- display: inline-flex;
72
- flex: 0 0 auto;
73
- align-items: center;
74
- justify-content: center;
75
- color: #909090;
76
- font-size: 12px;
77
- width: 50px;
78
- }
79
- .rightmenu span {
80
- user-select: none;
81
- }
82
-
83
- .seperator {
84
- cursor: default !important;
85
- background: #00000014 !important;
86
- border: 0;
87
- height: 1px;
88
- min-height: 1px !important;
89
- margin: 4px 0;
90
- padding: 0 !important;
91
- display: block !important;
92
- }
package/menu/index.tsx DELETED
@@ -1,143 +0,0 @@
1
- /**
2
- * @author : izzetseydaoglu
3
- * @copyright : sydSOFT Bilişim Hizmetleri (c) 2026
4
- * @version : 2026-02-07 19:31:01
5
- */
6
-
7
- import React, { memo, useMemo } from 'react';
8
- import { Dialog, propsDialog } from '../form';
9
- import { Popover, PopoverConfigBaseProps } from '../popover';
10
-
11
- import Link from 'next/link';
12
- import styles from './index.module.css';
13
-
14
- interface BaseProps {
15
- style?: React.CSSProperties;
16
- itemProps?: any;
17
- [key: string]: any;
18
- }
19
- interface SeperatorProps extends BaseProps {
20
- seperator: boolean;
21
- title?: never;
22
- icon?: never;
23
- fullComponent?: never;
24
- href?: never;
25
- onClick?: never;
26
- dialog?: never;
27
- }
28
- interface FullComponentProps extends BaseProps {
29
- fullComponent: React.ReactElement;
30
- seperator?: never;
31
- title?: never;
32
- icon?: never;
33
- href?: never;
34
- onClick?: never;
35
- dialog?: never;
36
- }
37
- interface ItemComponentProps extends BaseProps {
38
- seperator?: false;
39
- fullComponent?: never;
40
- type?: never;
41
- title: string;
42
- icon?: React.ReactNode;
43
- rightComponent?: React.ReactNode;
44
- href?: string;
45
- onClick?: (e: React.MouseEvent<HTMLLIElement>) => void;
46
- dialog?: propsDialog;
47
- }
48
-
49
- interface SubMenuProps extends BaseProps {
50
- type: 'submenu';
51
- title: string;
52
- items: typeMenu[];
53
- icon?: React.ReactNode;
54
- subMenuPopoverProps?: PopoverConfigBaseProps;
55
- rightComponent?: React.ReactNode;
56
- menuProps?: {
57
- className?: string;
58
- style?: React.CSSProperties;
59
- withIcon?: boolean | 'auto';
60
- };
61
- seperator?: never;
62
- fullComponent?: never;
63
- href?: never;
64
- onClick?: never;
65
- dialog?: never;
66
- }
67
-
68
- export type typeMenu = SeperatorProps | FullComponentProps | ItemComponentProps | SubMenuProps;
69
-
70
- interface Props {
71
- menu: typeMenu[];
72
- className?: string;
73
- style?: React.CSSProperties;
74
- withIcon?: boolean | 'auto';
75
- }
76
-
77
- export const Menu = memo(function MemoFunction({ menu, className, style, withIcon = 'auto' }: Props) {
78
- const withIconComponent = useMemo(() => {
79
- if (withIcon === true) return true;
80
- if (withIcon === false) return false;
81
- return Object.values(menu).some((item) => 'icon' in item && !!item.icon);
82
- }, [menu, withIcon]);
83
-
84
- const withRightComponent = useMemo(() => {
85
- return Object.values(menu).some((item) => 'rightComponent' in item && !!item.rightComponent);
86
- }, [menu]);
87
- const handleClick = (item: any, e: any) => {
88
- if (!item.onClick) return;
89
- if (item.dialog) {
90
- Dialog({ ...item.dialog }).then((result) => {
91
- if (result && item.onClick) {
92
- item.onClick(e);
93
- }
94
- });
95
- } else {
96
- item.onClick(e);
97
- }
98
- };
99
-
100
- return (
101
- <ul className={`smenu ${styles.ul} ${className || ''}`} style={style}>
102
- {Object.values(menu).map((item: typeMenu, key: number) => {
103
- const { fullComponent, icon, title, rightComponent, seperator, href, style, itemProps, type, items, menuProps, subMenuPopoverProps, ...other } = item as typeMenu & {
104
- subMenuPopoverProps?: PopoverConfigBaseProps;
105
- };
106
- const hasSubmenu = type === 'submenu' && Array.isArray(items) && items.length > 0;
107
-
108
- if (fullComponent) return React.cloneElement(fullComponent, { key: key });
109
- if (seperator) return <li key={key} className={styles.seperator} style={style} {...itemProps} {...other} />;
110
- const Component = (
111
- <>
112
- {withIconComponent && <div className={styles.menuicon}>{icon}</div>}
113
- <div className={styles.menutitle}>{title}</div>
114
- {withRightComponent && <div className={styles.rightmenu}>{rightComponent}</div>}
115
- </>
116
- );
117
-
118
- if (hasSubmenu) {
119
- return (
120
- <Popover
121
- key={key}
122
- component={
123
- <li style={style} {...itemProps} {...other}>
124
- {Component}
125
- </li>
126
- }
127
- position="right-top"
128
- {...(subMenuPopoverProps || {})}
129
- >
130
- <Menu menu={items} {...(menuProps || {})} />
131
- </Popover>
132
- );
133
- }
134
-
135
- return (
136
- <li key={key} style={style} onClick={(e: any) => handleClick(item, e)} {...itemProps} {...other}>
137
- {href ? <Link href={href}>{Component}</Link> : Component}
138
- </li>
139
- );
140
- })}
141
- </ul>
142
- );
143
- });
@@ -1,77 +0,0 @@
1
- .backdrop {
2
- position: fixed;
3
- z-index: 1300;
4
- inset: 0;
5
- display: none;
6
- align-items: center;
7
- justify-content: center;
8
- background: rgba(0, 0, 0, 0.23);
9
- width: 100%;
10
- height: 100%;
11
- outline: none;
12
- }
13
- .backdrop_open {
14
- display: flex !important;
15
- }
16
-
17
- .modal {
18
- position: relative;
19
- min-width: 200px;
20
- max-width: 90%;
21
- max-height: calc(100% - 64px);
22
- overflow-x: hidden;
23
- border-radius: 8px;
24
- background: transparent;
25
- box-shadow:
26
- rgb(0 0 0 / 32%) 0 4px 8px,
27
- rgb(0 0 0 / 40%) 0 8px 40px;
28
- margin: 15px;
29
- padding: 0;
30
- z-index: 1;
31
- outline: none;
32
- }
33
- .fullscreen {
34
- width: 100vw;
35
- max-width: 100vw;
36
- height: 100vh;
37
- max-height: 100vh;
38
- border-radius: 0;
39
- margin: 0;
40
- }
41
- .close_fixed {
42
- position: absolute;
43
- top: 2px;
44
- right: 2px;
45
- z-index: 1000;
46
- text-align: right;
47
- border-radius: inherit;
48
- }
49
-
50
- .close {
51
- position: fixed;
52
- background: linear-gradient(0deg, transparent, #00000026, transparent);
53
- padding: 8px 10px;
54
- font-size: 11px;
55
- transform: scale(1) translateX(-100%);
56
- border-radius: none;
57
- cursor: pointer;
58
- font-weight: bold;
59
- text-shadow: 1px 0px 0px #000000;
60
- transition: all 0.3s ease-in-out;
61
- }
62
- .close:hover {
63
- transform: scale(1.3) translateX(-85%);
64
- background: linear-gradient(180deg, transparent, #0000003a, transparent);
65
- }
66
-
67
- .sbox_header {
68
- position: sticky;
69
- top: 0;
70
- z-index: 10;
71
- }
72
-
73
- .sbox_footer {
74
- position: sticky;
75
- bottom: 0;
76
- z-index: 10;
77
- }
package/modal/index.tsx DELETED
@@ -1,106 +0,0 @@
1
- /**
2
- * Copyright (c) 2023
3
- * @author: izzetseydaoglu
4
- * @last-modified: 9.02.2024 06:07
5
- */
6
- import React, { memo, useEffect, useRef, useState } from "react";
7
-
8
- import ReactDOM from "react-dom";
9
- import styles from "./index.module.css";
10
-
11
- interface Props {
12
- children: React.ReactNode;
13
- open: boolean;
14
- close?: Function;
15
- keepMounted?: boolean;
16
- hideBackdrop?: boolean;
17
- hideEsc?: boolean;
18
- hideCloseButton?: boolean;
19
- fullScreen?: boolean;
20
- modalStyle?: React.CSSProperties;
21
- backdropStyle?: React.CSSProperties;
22
- vertialAlign?: "flex-start" | "center" | "flex-end";
23
- horizontalAlign?: "flex-start" | "center" | "flex-end";
24
- refModal?: any;
25
- }
26
-
27
- export const Modal = memo(function MemoFunction({
28
- refModal = null,
29
- children,
30
- open = false,
31
- close,
32
- keepMounted = false,
33
- fullScreen = false,
34
- hideBackdrop = true,
35
- hideEsc = false,
36
- hideCloseButton = false,
37
- modalStyle,
38
- backdropStyle,
39
- vertialAlign = "center",
40
- horizontalAlign = "center"
41
- }: Props) {
42
- const [modalDiv, setModalDiv] = useState<HTMLElement | null>(null);
43
- const ref = useRef<HTMLDivElement | null>(null);
44
-
45
- useEffect(() => {
46
- if (refModal) refModal.current = ref.current;
47
- }, [ref.current]);
48
-
49
- const onClose = () => {
50
- if (close) close();
51
- };
52
- const checkHideBackDrop = (e: any) => {
53
- if (open && ref.current && !ref.current.contains(e.target)) onClose();
54
- };
55
- const checkESC = (e: any) => {
56
- if (e.keyCode === 27 || e.key === "Escape" || e.code === "Escape") onClose();
57
- };
58
-
59
- useEffect((): any => {
60
- if (open) {
61
- if (hideBackdrop) window.addEventListener("mousedown", checkHideBackDrop);
62
- if (hideEsc) window.addEventListener("keydown", checkESC);
63
- }
64
-
65
- return () => {
66
- if (hideBackdrop) window.removeEventListener("mousedown", checkHideBackDrop);
67
- if (hideEsc) window.removeEventListener("keydown", checkESC);
68
- };
69
- });
70
-
71
- useEffect(() => {
72
- if (!modalDiv) {
73
- const modalDivCheck = document.getElementById("smodal");
74
- if (modalDivCheck) {
75
- setModalDiv(modalDivCheck);
76
- } else {
77
- const div = document.createElement("div");
78
- div.setAttribute("id", "smodal");
79
- document.body.appendChild(div);
80
- setModalDiv(div);
81
- }
82
- }
83
- return () => {
84
- onClose();
85
- };
86
- }, []);
87
-
88
- if ((!keepMounted && !open) || typeof window === "undefined") return null;
89
-
90
- const Component = (
91
- <div className={`${styles.backdrop} ${open ? styles.backdrop_open : ""}`} style={{ alignItems: vertialAlign, justifyContent: horizontalAlign, ...backdropStyle }}>
92
- <div ref={ref} className={`smodal ${styles.modal} ${fullScreen ? styles.fullscreen : ""}`} style={modalStyle}>
93
- {!hideCloseButton && (
94
- <div className={`close ${styles.close_fixed}`}>
95
- <div className={styles.close} onClick={onClose}>
96
-
97
- </div>
98
- </div>
99
- )}
100
- {children}
101
- </div>
102
- </div>
103
- );
104
-
105
- return modalDiv ? ReactDOM.createPortal(Component, modalDiv) : null;
106
- });
@@ -1,5 +0,0 @@
1
- d3c67aff268ef0dd81c4623a9743d3c550d8b24a15c4060a3ed1034b74270cf2
2
- fa9179c2ac37eb93be8d17b49abd4cfbafa82805663c80b3221a54ed680e30e3
3
- d9cce02220fa4941c34e22522d10abb80a078ae50a3d69ce70aa5d6becc1f54e
4
- 42cf513809d4a112837286a54c401738f30332c0bae53c8a2c53b51380ba0995
5
- d8a49591543c9b36137dfb840801a17757da1aed9dd4a2356f3efcda728a0021
@@ -1,89 +0,0 @@
1
- .popover {
2
- position: fixed;
3
- display: flex;
4
- align-items: center;
5
- justify-content: center;
6
- z-index: 10000;
7
- opacity: 0;
8
- visibility: hidden;
9
- pointer-events: none;
10
- transition: opacity 160ms ease;
11
- }
12
-
13
- .noFade {
14
- transition: none;
15
- }
16
-
17
- .visible {
18
- opacity: 1;
19
- visibility: visible;
20
- pointer-events: auto;
21
- }
22
-
23
- .closing {
24
- opacity: 0;
25
- }
26
-
27
- .arrow::after {
28
- content: "";
29
- position: absolute;
30
- border-width: 5px;
31
- border-style: solid;
32
- width: 0;
33
- height: 0;
34
- border-color: var(--popover-arrow-color, #757575);
35
- }
36
-
37
- .arrow.top::after {
38
- top: 100%;
39
- border-color: var(--popover-arrow-color, #757575) transparent transparent transparent;
40
- }
41
-
42
- .arrow.bottom::after {
43
- bottom: 100%;
44
- border-color: transparent transparent var(--popover-arrow-color, #757575) transparent;
45
- }
46
-
47
- .arrow.left::after {
48
- left: 100%;
49
- margin-left: -1px;
50
- border-color: transparent transparent transparent var(--popover-arrow-color, #757575);
51
- }
52
-
53
- .arrow.right::after {
54
- right: 100%;
55
- margin-right: -1px;
56
- border-color: transparent var(--popover-arrow-color, #757575) transparent transparent;
57
- }
58
-
59
- .arrow.top.alignStart::after,
60
- .arrow.bottom.alignStart::after {
61
- left: 12px;
62
- }
63
-
64
- .arrow.top.alignCenter::after,
65
- .arrow.bottom.alignCenter::after {
66
- left: 50%;
67
- transform: translateX(-50%);
68
- }
69
-
70
- .arrow.top.alignEnd::after,
71
- .arrow.bottom.alignEnd::after {
72
- right: 12px;
73
- }
74
-
75
- .arrow.left.alignStart::after,
76
- .arrow.right.alignStart::after {
77
- top: 12px;
78
- }
79
-
80
- .arrow.left.alignCenter::after,
81
- .arrow.right.alignCenter::after {
82
- top: 50%;
83
- transform: translateY(-50%);
84
- }
85
-
86
- .arrow.left.alignEnd::after,
87
- .arrow.right.alignEnd::after {
88
- bottom: 12px;
89
- }