funda-ui 4.3.355 → 4.3.721
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.
- package/DynamicFields/index.d.ts +1 -0
- package/DynamicFields/index.js +23 -3
- package/EventCalendar/index.css +150 -106
- package/EventCalendar/index.d.ts +11 -2
- package/EventCalendar/index.js +835 -151
- package/EventCalendarTimeline/index.css +293 -251
- package/EventCalendarTimeline/index.d.ts +18 -9
- package/EventCalendarTimeline/index.js +1077 -505
- package/MultipleCheckboxes/index.d.ts +1 -0
- package/MultipleCheckboxes/index.js +17 -7
- package/MultipleSelect/index.d.ts +4 -0
- package/MultipleSelect/index.js +54 -8
- package/NativeSelect/index.js +1 -0
- package/Radio/index.d.ts +2 -1
- package/Radio/index.js +54 -24
- package/Select/index.js +115 -42
- package/Table/index.js +27 -3
- package/lib/cjs/DynamicFields/index.d.ts +1 -0
- package/lib/cjs/DynamicFields/index.js +23 -3
- package/lib/cjs/EventCalendar/index.d.ts +11 -2
- package/lib/cjs/EventCalendar/index.js +835 -151
- package/lib/cjs/EventCalendarTimeline/index.d.ts +18 -9
- package/lib/cjs/EventCalendarTimeline/index.js +1077 -505
- package/lib/cjs/MultipleCheckboxes/index.d.ts +1 -0
- package/lib/cjs/MultipleCheckboxes/index.js +17 -7
- package/lib/cjs/MultipleSelect/index.d.ts +4 -0
- package/lib/cjs/MultipleSelect/index.js +54 -8
- package/lib/cjs/NativeSelect/index.js +1 -0
- package/lib/cjs/Radio/index.d.ts +2 -1
- package/lib/cjs/Radio/index.js +54 -24
- package/lib/cjs/Select/index.js +115 -42
- package/lib/cjs/Table/index.js +27 -3
- package/lib/css/EventCalendar/index.css +150 -106
- package/lib/css/EventCalendarTimeline/index.css +293 -251
- package/lib/esm/DynamicFields/index.tsx +28 -3
- package/lib/esm/EventCalendar/index.scss +172 -104
- package/lib/esm/EventCalendar/index.tsx +272 -139
- package/lib/esm/EventCalendarTimeline/index.scss +275 -213
- package/lib/esm/EventCalendarTimeline/index.tsx +706 -708
- package/lib/esm/MultipleCheckboxes/index.tsx +18 -5
- package/lib/esm/MultipleSelect/ItemList.tsx +1 -0
- package/lib/esm/MultipleSelect/index.tsx +103 -52
- package/lib/esm/NativeSelect/index.tsx +2 -0
- package/lib/esm/Radio/index.tsx +68 -27
- package/lib/esm/Select/index.tsx +236 -65
- package/lib/esm/Table/Table.tsx +1 -0
- package/lib/esm/Table/TableCell.tsx +6 -0
- package/lib/esm/Table/table-utils/ToggleSelection.tsx +17 -2
- package/package.json +1 -1
package/DynamicFields/index.d.ts
CHANGED
package/DynamicFields/index.js
CHANGED
|
@@ -495,7 +495,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
495
495
|
/* harmony import */ var funda_utils_dist_cjs_useComId__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(funda_utils_dist_cjs_useComId__WEBPACK_IMPORTED_MODULE_1__);
|
|
496
496
|
/* harmony import */ var funda_utils_dist_cjs_cls__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(188);
|
|
497
497
|
/* harmony import */ var funda_utils_dist_cjs_cls__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(funda_utils_dist_cjs_cls__WEBPACK_IMPORTED_MODULE_2__);
|
|
498
|
-
var _excluded = ["wrapperClassName", "btnAddWrapperClassName", "btnRemoveWrapperClassName", "label", "data", "maxFields", "iconAddBefore", "iconAddAfter", "iconAdd", "iconAddPosition", "iconRemove", "doNotRemoveDom", "id", "confirmText", "innerAppendClassName", "innerAppendCellClassName", "innerAppendLastCellClassName", "innerAppendHideClassName", "innerAppendBodyClassName", "innerAppendHeadData", "innerAppendHeadRowShowFirst", "innerAppendHeadRowClassName", "innerAppendHeadCellClassName", "innerAppendHeadCellStyles", "innerAppendEmptyContent", "onAdd", "onRemove", "onLoad"];
|
|
498
|
+
var _excluded = ["contentRef", "wrapperClassName", "btnAddWrapperClassName", "btnRemoveWrapperClassName", "label", "data", "maxFields", "iconAddBefore", "iconAddAfter", "iconAdd", "iconAddPosition", "iconRemove", "doNotRemoveDom", "id", "confirmText", "innerAppendClassName", "innerAppendCellClassName", "innerAppendLastCellClassName", "innerAppendHideClassName", "innerAppendBodyClassName", "innerAppendHeadData", "innerAppendHeadRowShowFirst", "innerAppendHeadRowClassName", "innerAppendHeadCellClassName", "innerAppendHeadCellStyles", "innerAppendEmptyContent", "onAdd", "onRemove", "onLoad"];
|
|
499
499
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
500
500
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
501
501
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
@@ -513,7 +513,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
|
513
513
|
|
|
514
514
|
|
|
515
515
|
var DynamicFields = function DynamicFields(props) {
|
|
516
|
-
var
|
|
516
|
+
var contentRef = props.contentRef,
|
|
517
|
+
wrapperClassName = props.wrapperClassName,
|
|
517
518
|
btnAddWrapperClassName = props.btnAddWrapperClassName,
|
|
518
519
|
btnRemoveWrapperClassName = props.btnRemoveWrapperClassName,
|
|
519
520
|
label = props.label,
|
|
@@ -563,6 +564,21 @@ var DynamicFields = function DynamicFields(props) {
|
|
|
563
564
|
setTmpl = _useState4[1];
|
|
564
565
|
var addBtnIdRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)('');
|
|
565
566
|
addBtnIdRef.current = "dynamic-fields-add-".concat(idRes);
|
|
567
|
+
|
|
568
|
+
// exposes the following methods
|
|
569
|
+
(0,react__WEBPACK_IMPORTED_MODULE_0__.useImperativeHandle)(contentRef, function () {
|
|
570
|
+
return {
|
|
571
|
+
showAddBtn: function showAddBtn() {
|
|
572
|
+
addBtnRef.current.style.setProperty('display', 'inline', 'important');
|
|
573
|
+
},
|
|
574
|
+
hideAddBtn: function hideAddBtn() {
|
|
575
|
+
addBtnRef.current.style.setProperty('display', 'none', 'important');
|
|
576
|
+
},
|
|
577
|
+
appendedItemsCounter: function appendedItemsCounter() {
|
|
578
|
+
return rootRef.current.querySelectorAll(PER_ROW_DOM_STRING).length;
|
|
579
|
+
}
|
|
580
|
+
};
|
|
581
|
+
}, [contentRef]);
|
|
566
582
|
function updateLastItemCls(el, type) {
|
|
567
583
|
if (typeof el === 'undefined') return;
|
|
568
584
|
if (type === 'add') {
|
|
@@ -603,7 +619,8 @@ var DynamicFields = function DynamicFields(props) {
|
|
|
603
619
|
}
|
|
604
620
|
function checkMaxStatus() {
|
|
605
621
|
//button status
|
|
606
|
-
|
|
622
|
+
var _appendedItems = rootRef.current.querySelectorAll(PER_ROW_DOM_STRING).length;
|
|
623
|
+
if (_appendedItems + 1 >= parseFloat(maxFields)) {
|
|
607
624
|
addBtnRef.current.style.setProperty('display', 'none', 'important');
|
|
608
625
|
}
|
|
609
626
|
}
|
|
@@ -748,6 +765,9 @@ var DynamicFields = function DynamicFields(props) {
|
|
|
748
765
|
setVal(data ? data.init : []);
|
|
749
766
|
setTmpl(data ? data.tmpl : null);
|
|
750
767
|
|
|
768
|
+
//
|
|
769
|
+
checkMaxStatus();
|
|
770
|
+
|
|
751
771
|
//
|
|
752
772
|
onLoad === null || onLoad === void 0 ? void 0 : onLoad(addBtnIdRef.current, rootRef.current, PER_ROW_DOM_STRING);
|
|
753
773
|
}, [data]);
|
package/EventCalendar/index.css
CHANGED
|
@@ -1,72 +1,74 @@
|
|
|
1
1
|
/* ======================================================
|
|
2
2
|
<!-- Event Calendar -->
|
|
3
3
|
/* ====================================================== */
|
|
4
|
-
.e-
|
|
5
|
-
--e-cal-wrapper-min-width: 400px;
|
|
6
|
-
--e-cal-body-bg: #fff;
|
|
7
|
-
--e-cal-border-color: #ddd;
|
|
8
|
-
--e-cal-border-color-hover: #333;
|
|
9
|
-
--e-cal-header-fs: 1.125rem;
|
|
10
|
-
--e-cal-default-border-color: #eee;
|
|
11
|
-
--e-cal-day-border-color: #ddd;
|
|
12
|
-
--e-cal-day-hover-bg: #f6f6f6;
|
|
13
|
-
--e-cal-dayselected-bg: #0b5ed7;
|
|
14
|
-
--e-cal-dayselected-text-color: #fff;
|
|
15
|
-
--e-cal-year-month-btn-border-color: #ddd;
|
|
16
|
-
--e-cal-year-month-btn-hover-bg: rgba(0, 58, 166, .1);
|
|
17
|
-
--e-cal-year-month-btn-selected-bg: rgba(0, 58, 166, 1);
|
|
18
|
-
--e-cal-year-month-btn-selected-color: #fff;
|
|
19
|
-
--e-cal-month-wrapper-w: 18.75rem;
|
|
20
|
-
--e-cal-year-wrapper-w: 18.75rem;
|
|
21
|
-
--e-cal-header-arrow-bg: #000;
|
|
22
|
-
--e-cal-header-text-color: #000;
|
|
23
|
-
--e-cal-header-prevnext-btn-bg: transparent;
|
|
24
|
-
--e-cal-header-prevnext-btn-color: #000;
|
|
25
|
-
--e-cal-header-prevnext-btn-radius: 0.25rem;
|
|
26
|
-
--e-cal-
|
|
27
|
-
--e-cal-
|
|
28
|
-
--e-cal-footer-today-btn-
|
|
29
|
-
--e-cal-
|
|
4
|
+
.e-cal-normal__wrapper {
|
|
5
|
+
--e-cal-normal-wrapper-min-width: 400px;
|
|
6
|
+
--e-cal-normal-body-bg: #fff;
|
|
7
|
+
--e-cal-normal-border-color: #ddd;
|
|
8
|
+
--e-cal-normal-border-color-hover: #333;
|
|
9
|
+
--e-cal-normal-header-fs: 1.125rem;
|
|
10
|
+
--e-cal-normal-default-border-color: #eee;
|
|
11
|
+
--e-cal-normal-day-border-color: #ddd;
|
|
12
|
+
--e-cal-normal-day-hover-bg: #f6f6f6;
|
|
13
|
+
--e-cal-normal-dayselected-bg: #0b5ed7;
|
|
14
|
+
--e-cal-normal-dayselected-text-color: #fff;
|
|
15
|
+
--e-cal-normal-year-month-btn-border-color: #ddd;
|
|
16
|
+
--e-cal-normal-year-month-btn-hover-bg: rgba(0, 58, 166, .1);
|
|
17
|
+
--e-cal-normal-year-month-btn-selected-bg: rgba(0, 58, 166, 1);
|
|
18
|
+
--e-cal-normal-year-month-btn-selected-color: #fff;
|
|
19
|
+
--e-cal-normal-month-wrapper-w: 18.75rem;
|
|
20
|
+
--e-cal-normal-year-wrapper-w: 18.75rem;
|
|
21
|
+
--e-cal-normal-header-arrow-bg: #000;
|
|
22
|
+
--e-cal-normal-header-text-color: #000;
|
|
23
|
+
--e-cal-normal-header-prevnext-btn-bg: transparent;
|
|
24
|
+
--e-cal-normal-header-prevnext-btn-color: #000;
|
|
25
|
+
--e-cal-normal-header-prevnext-btn-radius: 0.25rem;
|
|
26
|
+
--e-cal-normal-table-add-btn-color: #0b5ed7;
|
|
27
|
+
--e-cal-normal-delete-btn-color: #ee4949;
|
|
28
|
+
--e-cal-normal-footer-today-btn-bg: rgba(0, 58, 166, 1);
|
|
29
|
+
--e-cal-normal-footer-today-btn-color: #fff;
|
|
30
|
+
--e-cal-normal-event-default-bg: rgb(255, 240, 227);
|
|
31
|
+
--e-cal-normal-table-event-font-size: 0.75rem;
|
|
30
32
|
position: relative;
|
|
31
|
-
min-width: var(--e-cal-wrapper-min-width);
|
|
32
|
-
border: 1px solid var(--e-cal-border-color);
|
|
33
|
+
min-width: var(--e-cal-normal-wrapper-min-width);
|
|
34
|
+
border: 1px solid var(--e-cal-normal-border-color);
|
|
33
35
|
/* --HEADER --*/
|
|
34
36
|
/*-- BODY --*/
|
|
35
37
|
/*-- CELL --*/
|
|
36
38
|
/*-- SELECTION --*/
|
|
37
39
|
/* --BUTTON --*/
|
|
38
40
|
}
|
|
39
|
-
.e-
|
|
40
|
-
font-size: var(--e-cal-header-fs);
|
|
41
|
+
.e-cal-normal__wrapper .e-cal-normal__header {
|
|
42
|
+
font-size: var(--e-cal-normal-header-fs);
|
|
41
43
|
font-weight: bold;
|
|
42
44
|
padding: 10px 10px 5px 10px;
|
|
43
45
|
display: flex;
|
|
44
46
|
justify-content: space-between;
|
|
45
47
|
}
|
|
46
|
-
.e-
|
|
48
|
+
.e-cal-normal__wrapper .e-cal-normal__header .e-cal-normal__header__btns .e-cal-normal__btn {
|
|
47
49
|
margin-right: 1rem;
|
|
48
|
-
color: var(--e-cal-header-text-color);
|
|
50
|
+
color: var(--e-cal-normal-header-text-color);
|
|
49
51
|
}
|
|
50
|
-
.e-
|
|
52
|
+
.e-cal-normal__wrapper .e-cal-normal__header .e-cal-normal__header__btns .e-cal-normal__btn svg {
|
|
51
53
|
margin-left: 0.3rem;
|
|
52
54
|
}
|
|
53
|
-
.e-
|
|
54
|
-
fill: var(--e-cal-header-arrow-bg);
|
|
55
|
+
.e-cal-normal__wrapper .e-cal-normal__header .e-cal-normal__header__btns .e-cal-normal__btn svg path {
|
|
56
|
+
fill: var(--e-cal-normal-header-arrow-bg);
|
|
55
57
|
}
|
|
56
|
-
.e-
|
|
58
|
+
.e-cal-normal__wrapper .e-cal-normal__header .e-cal-normal__header__btns .e-cal-normal__btn.active svg {
|
|
57
59
|
transform: rotate(180deg);
|
|
58
60
|
}
|
|
59
|
-
.e-
|
|
60
|
-
background: var(--e-cal-body-bg);
|
|
61
|
+
.e-cal-normal__wrapper .e-cal-normal__body {
|
|
62
|
+
background: var(--e-cal-normal-body-bg);
|
|
61
63
|
width: 100%;
|
|
62
64
|
display: flex;
|
|
63
65
|
flex-wrap: wrap;
|
|
64
66
|
}
|
|
65
|
-
.e-
|
|
67
|
+
.e-cal-normal__wrapper .e-cal-normal__row {
|
|
66
68
|
display: flex;
|
|
67
69
|
width: 100%;
|
|
68
70
|
}
|
|
69
|
-
.e-
|
|
71
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell {
|
|
70
72
|
flex: 1;
|
|
71
73
|
position: relative;
|
|
72
74
|
height: auto;
|
|
@@ -77,51 +79,95 @@
|
|
|
77
79
|
flex-direction: column;
|
|
78
80
|
text-align: center;
|
|
79
81
|
border-width: 0;
|
|
80
|
-
border-color: var(--e-cal-default-border-color);
|
|
82
|
+
border-color: var(--e-cal-normal-default-border-color);
|
|
81
83
|
border-style: solid;
|
|
82
84
|
border-top-width: 1px;
|
|
83
85
|
border-right-width: 1px;
|
|
86
|
+
/* Delete button */
|
|
87
|
+
/* Add button */
|
|
88
|
+
/* DAY NUMBER */
|
|
89
|
+
/* ITEMS */
|
|
84
90
|
}
|
|
85
|
-
.e-
|
|
91
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell.disabled {
|
|
86
92
|
opacity: 0.4;
|
|
87
93
|
pointer-events: none;
|
|
88
94
|
}
|
|
89
|
-
.e-
|
|
95
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell.last-cell {
|
|
90
96
|
border-right-width: 0;
|
|
91
97
|
}
|
|
92
|
-
.e-
|
|
98
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell.last-row {
|
|
93
99
|
border-bottom-width: 1px;
|
|
94
100
|
}
|
|
95
|
-
.e-
|
|
101
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell.e-cal-normal__day--week {
|
|
96
102
|
min-height: 2.75em;
|
|
97
103
|
align-items: end;
|
|
98
104
|
padding-inline-end: 0.75rem;
|
|
99
105
|
}
|
|
100
|
-
.e-
|
|
101
|
-
background-color: var(--e-cal-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
margin:
|
|
105
|
-
|
|
106
|
-
|
|
106
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell:not(.empty):hover {
|
|
107
|
+
background-color: var(--e-cal-normal-day-hover-bg);
|
|
108
|
+
}
|
|
109
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__event {
|
|
110
|
+
margin-bottom: 1px;
|
|
111
|
+
font-size: var(--e-cal-normal-table-event-font-size);
|
|
112
|
+
background-color: var(--e-cal-normal-event-default-bg);
|
|
107
113
|
text-align: left;
|
|
108
|
-
font-size: 0.75rem;
|
|
109
114
|
}
|
|
110
|
-
.e-
|
|
115
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__event:hover {
|
|
116
|
+
cursor: pointer;
|
|
117
|
+
opacity: 0.8;
|
|
118
|
+
}
|
|
119
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__cell-item.first {
|
|
120
|
+
margin-top: 2.5rem;
|
|
121
|
+
}
|
|
122
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventdel {
|
|
111
123
|
position: absolute;
|
|
112
124
|
z-index: 1;
|
|
113
|
-
|
|
125
|
+
right: -5px;
|
|
114
126
|
top: 0;
|
|
115
127
|
display: none;
|
|
116
|
-
color: var(--e-cal-delete-btn-color);
|
|
128
|
+
color: var(--e-cal-normal-delete-btn-color);
|
|
129
|
+
}
|
|
130
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventdel svg {
|
|
131
|
+
width: 10px;
|
|
132
|
+
fill: var(--e-cal-normal-delete-btn-color);
|
|
133
|
+
}
|
|
134
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventdel svg path {
|
|
135
|
+
fill: var(--e-cal-normal-delete-btn-color);
|
|
136
|
+
}
|
|
137
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventdel:hover svg {
|
|
138
|
+
transform: scale(1.2);
|
|
139
|
+
}
|
|
140
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell:not(.empty) .e-cal-normal__cell-item:hover .e-cal-normal__day__eventdel {
|
|
141
|
+
display: block;
|
|
142
|
+
}
|
|
143
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventadd {
|
|
144
|
+
position: absolute;
|
|
145
|
+
z-index: 1;
|
|
146
|
+
left: 0;
|
|
147
|
+
bottom: -8.5px;
|
|
148
|
+
display: none;
|
|
149
|
+
width: 20px;
|
|
150
|
+
color: var(--e-cal-normal-table-add-btn-color);
|
|
151
|
+
text-align: left;
|
|
152
|
+
pointer-events: none;
|
|
153
|
+
}
|
|
154
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventadd > a {
|
|
155
|
+
pointer-events: auto;
|
|
117
156
|
}
|
|
118
|
-
.e-
|
|
119
|
-
|
|
157
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventadd svg {
|
|
158
|
+
width: 15px;
|
|
159
|
+
fill: var(--e-cal-normal-table-add-btn-color);
|
|
120
160
|
}
|
|
121
|
-
.e-
|
|
122
|
-
fill: var(--e-cal-
|
|
161
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventadd svg path {
|
|
162
|
+
fill: var(--e-cal-normal-table-add-btn-color);
|
|
123
163
|
}
|
|
124
|
-
.e-
|
|
164
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell .e-cal-normal__day__eventadd:hover svg {
|
|
165
|
+
transform: scale(1.2);
|
|
166
|
+
}
|
|
167
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell:hover .e-cal-normal__day__eventadd {
|
|
168
|
+
display: block;
|
|
169
|
+
}
|
|
170
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell > span {
|
|
125
171
|
position: absolute;
|
|
126
172
|
right: 0.25rem;
|
|
127
173
|
top: 0.25rem;
|
|
@@ -133,25 +179,23 @@
|
|
|
133
179
|
line-height: 1.5;
|
|
134
180
|
margin: 0.5rem 0;
|
|
135
181
|
}
|
|
136
|
-
.e-
|
|
182
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell > span.disabled {
|
|
137
183
|
opacity: 0.2;
|
|
138
184
|
}
|
|
139
|
-
.e-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
.e-cal__wrapper .e-cal__row .e-cal__cell.selected > span {
|
|
143
|
-
color: var(--e-cal-dayselected-text-color);
|
|
144
|
-
background-color: var(--e-cal-dayselected-bg);
|
|
185
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell > div {
|
|
186
|
+
position: relative;
|
|
187
|
+
width: 100%;
|
|
145
188
|
}
|
|
146
|
-
.e-
|
|
147
|
-
|
|
189
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell:not(.empty) {
|
|
190
|
+
cursor: pointer;
|
|
148
191
|
}
|
|
149
|
-
.e-
|
|
150
|
-
|
|
192
|
+
.e-cal-normal__wrapper .e-cal-normal__row .e-cal-normal__cell.selected > span {
|
|
193
|
+
color: var(--e-cal-normal-dayselected-text-color);
|
|
194
|
+
background-color: var(--e-cal-normal-dayselected-bg);
|
|
151
195
|
}
|
|
152
|
-
.e-
|
|
196
|
+
.e-cal-normal__wrapper .e-cal-normal__month-wrapper {
|
|
153
197
|
position: absolute;
|
|
154
|
-
width: var(--e-cal-month-wrapper-w);
|
|
198
|
+
width: var(--e-cal-normal-month-wrapper-w);
|
|
155
199
|
height: auto;
|
|
156
200
|
z-index: 1;
|
|
157
201
|
top: calc(1rem + 22px);
|
|
@@ -159,18 +203,18 @@
|
|
|
159
203
|
transform: translateX(-50%);
|
|
160
204
|
display: none;
|
|
161
205
|
}
|
|
162
|
-
.e-
|
|
206
|
+
.e-cal-normal__wrapper .e-cal-normal__month-wrapper.active {
|
|
163
207
|
display: block;
|
|
164
208
|
}
|
|
165
|
-
.e-
|
|
209
|
+
.e-cal-normal__wrapper .e-cal-normal__month-wrapper .e-cal-normal__month-container {
|
|
166
210
|
display: grid;
|
|
167
211
|
grid-template-columns: repeat(3, 1fr);
|
|
168
212
|
grid-template-rows: repeat(4, 2.5em);
|
|
169
213
|
grid-gap: 10px;
|
|
170
214
|
}
|
|
171
|
-
.e-
|
|
215
|
+
.e-cal-normal__wrapper .e-cal-normal__year-wrapper {
|
|
172
216
|
position: absolute;
|
|
173
|
-
width: var(--e-cal-year-wrapper-w);
|
|
217
|
+
width: var(--e-cal-normal-year-wrapper-w);
|
|
174
218
|
height: auto;
|
|
175
219
|
z-index: 1;
|
|
176
220
|
top: calc(1rem + 22px);
|
|
@@ -178,41 +222,41 @@
|
|
|
178
222
|
transform: translateX(-50%);
|
|
179
223
|
display: none;
|
|
180
224
|
}
|
|
181
|
-
.e-
|
|
225
|
+
.e-cal-normal__wrapper .e-cal-normal__year-wrapper.active {
|
|
182
226
|
display: block;
|
|
183
227
|
}
|
|
184
|
-
.e-
|
|
228
|
+
.e-cal-normal__wrapper .e-cal-normal__year-wrapper .e-cal-normal__year-container {
|
|
185
229
|
display: grid;
|
|
186
230
|
grid-template-columns: repeat(4, 1fr);
|
|
187
231
|
grid-template-rows: repeat(5, 2.5em);
|
|
188
232
|
grid-gap: 5px;
|
|
189
233
|
}
|
|
190
|
-
.e-
|
|
191
|
-
.e-
|
|
234
|
+
.e-cal-normal__wrapper .e-cal-normal__year,
|
|
235
|
+
.e-cal-normal__wrapper .e-cal-normal__month {
|
|
192
236
|
display: flex;
|
|
193
237
|
align-items: center;
|
|
194
238
|
justify-content: center;
|
|
195
239
|
padding: 5px;
|
|
196
240
|
font-size: 0.875em;
|
|
197
|
-
border: 1px solid var(--e-cal-year-month-btn-border-color);
|
|
241
|
+
border: 1px solid var(--e-cal-normal-year-month-btn-border-color);
|
|
198
242
|
border-radius: 0.25rem;
|
|
199
243
|
cursor: pointer;
|
|
200
244
|
}
|
|
201
|
-
.e-
|
|
202
|
-
.e-
|
|
203
|
-
background-color: var(--e-cal-year-month-btn-hover-bg);
|
|
245
|
+
.e-cal-normal__wrapper .e-cal-normal__year:hover,
|
|
246
|
+
.e-cal-normal__wrapper .e-cal-normal__month:hover {
|
|
247
|
+
background-color: var(--e-cal-normal-year-month-btn-hover-bg);
|
|
204
248
|
}
|
|
205
|
-
.e-
|
|
206
|
-
.e-
|
|
207
|
-
background-color: var(--e-cal-year-month-btn-selected-bg);
|
|
208
|
-
color: var(--e-cal-year-month-btn-selected-color);
|
|
249
|
+
.e-cal-normal__wrapper .e-cal-normal__year.selected,
|
|
250
|
+
.e-cal-normal__wrapper .e-cal-normal__month.selected {
|
|
251
|
+
background-color: var(--e-cal-normal-year-month-btn-selected-bg);
|
|
252
|
+
color: var(--e-cal-normal-year-month-btn-selected-color);
|
|
209
253
|
}
|
|
210
|
-
.e-
|
|
211
|
-
.e-
|
|
254
|
+
.e-cal-normal__wrapper .e-cal-normal__year.disabled,
|
|
255
|
+
.e-cal-normal__wrapper .e-cal-normal__month.disabled {
|
|
212
256
|
opacity: 0.4;
|
|
213
257
|
pointer-events: none;
|
|
214
258
|
}
|
|
215
|
-
.e-
|
|
259
|
+
.e-cal-normal__wrapper .e-cal-normal__btn {
|
|
216
260
|
border: none;
|
|
217
261
|
outline: none;
|
|
218
262
|
background: none;
|
|
@@ -224,26 +268,26 @@
|
|
|
224
268
|
display: inline-flex;
|
|
225
269
|
align-items: center;
|
|
226
270
|
}
|
|
227
|
-
.e-
|
|
228
|
-
fill: var(--e-cal-header-arrow-bg);
|
|
271
|
+
.e-cal-normal__wrapper .e-cal-normal__btn svg path {
|
|
272
|
+
fill: var(--e-cal-normal-header-arrow-bg);
|
|
229
273
|
}
|
|
230
|
-
.e-
|
|
274
|
+
.e-cal-normal__wrapper .e-cal-normal__btn.disabled {
|
|
231
275
|
opacity: 0.4;
|
|
232
276
|
pointer-events: none;
|
|
233
277
|
}
|
|
234
|
-
.e-
|
|
235
|
-
border-radius: var(--e-cal-header-prevnext-btn-radius);
|
|
236
|
-
color: var(--e-cal-header-prevnext-btn-color);
|
|
237
|
-
background-color: var(--e-cal-header-prevnext-btn-bg);
|
|
278
|
+
.e-cal-normal__wrapper .e-cal-normal__btn--prev, .e-cal-normal__wrapper .e-cal-normal__btn--next {
|
|
279
|
+
border-radius: var(--e-cal-normal-header-prevnext-btn-radius);
|
|
280
|
+
color: var(--e-cal-normal-header-prevnext-btn-color);
|
|
281
|
+
background-color: var(--e-cal-normal-header-prevnext-btn-bg);
|
|
238
282
|
}
|
|
239
|
-
.e-
|
|
240
|
-
fill: var(--e-cal-header-prevnext-btn-color);
|
|
283
|
+
.e-cal-normal__wrapper .e-cal-normal__btn--prev svg path, .e-cal-normal__wrapper .e-cal-normal__btn--next svg path {
|
|
284
|
+
fill: var(--e-cal-normal-header-prevnext-btn-color);
|
|
241
285
|
}
|
|
242
|
-
.e-
|
|
243
|
-
border: 1px solid var(--e-cal-border-color);
|
|
286
|
+
.e-cal-normal__wrapper .e-cal-normal__btn--today {
|
|
287
|
+
border: 1px solid var(--e-cal-normal-border-color);
|
|
244
288
|
border-radius: 0.25rem;
|
|
245
289
|
font-size: 0.875em;
|
|
246
290
|
padding: 0.2rem 1rem;
|
|
247
|
-
color: var(--e-cal-footer-today-btn-color);
|
|
248
|
-
background-color: var(--e-cal-footer-today-btn-bg);
|
|
291
|
+
color: var(--e-cal-normal-footer-today-btn-color);
|
|
292
|
+
background-color: var(--e-cal-normal-footer-today-btn-bg);
|
|
249
293
|
}
|
package/EventCalendar/index.d.ts
CHANGED
|
@@ -5,8 +5,14 @@ export interface EventsValueConfig {
|
|
|
5
5
|
time: string;
|
|
6
6
|
data: string;
|
|
7
7
|
eventStyles?: React.CSSProperties;
|
|
8
|
+
callback?: () => void;
|
|
9
|
+
}
|
|
10
|
+
export interface TimelineCellListConfig {
|
|
11
|
+
date: string;
|
|
12
|
+
list: EventsValueConfig[];
|
|
8
13
|
}
|
|
9
14
|
export declare type EventCalendarProps = {
|
|
15
|
+
contentRef?: React.ForwardedRef<any>;
|
|
10
16
|
calendarWrapperClassName?: string;
|
|
11
17
|
customTodayDate?: string;
|
|
12
18
|
eventsValue?: any[];
|
|
@@ -16,8 +22,11 @@ export declare type EventCalendarProps = {
|
|
|
16
22
|
langMonthsFull?: string[];
|
|
17
23
|
langToday?: string;
|
|
18
24
|
iconRemove?: React.ReactNode | string;
|
|
25
|
+
iconAdd?: React.ReactNode | string;
|
|
19
26
|
cellCloseBtnClassName?: string;
|
|
20
27
|
cellCloseBtnLabel?: string | React.ReactNode;
|
|
28
|
+
cellAddBtnClassName?: string;
|
|
29
|
+
cellAddBtnLabel?: string | React.ReactNode;
|
|
21
30
|
onChangeDate?: (e: any, currentData: any) => void;
|
|
22
31
|
onChangeMonth?: (currentData: any) => void;
|
|
23
32
|
onChangeYear?: (currentData: any) => void;
|
|
@@ -35,9 +44,9 @@ export declare type EventCalendarProps = {
|
|
|
35
44
|
modalSubmitBtnLabel?: string | React.ReactNode;
|
|
36
45
|
modalSubmitDeleteBtnClassName?: string;
|
|
37
46
|
modalSubmitDeleteBtnLabel?: string | React.ReactNode;
|
|
38
|
-
onModalEditOpen?: (currentData: any, openwin: any) => void;
|
|
47
|
+
onModalEditOpen?: (currentData: any, openwin: any, type: 'normal' | 'new') => void;
|
|
39
48
|
onModalEditClose?: (currentData: any) => void;
|
|
40
|
-
onModalDeleteOpen?: (currentData: any) => void;
|
|
49
|
+
onModalDeleteOpen?: (currentData: any, openwin: any) => void;
|
|
41
50
|
onModalDeleteClose?: (currentData: any) => void;
|
|
42
51
|
onModalEditEvent?: (currentData: any, closewin: any) => void;
|
|
43
52
|
onModalDeleteEvent?: (currentData: any, closewin: any) => void;
|