@udi-organization/udi-package 1.0.73 → 1.0.75-alpha.1
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/dist/index.cjs.js +395 -255
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +298 -158
- package/dist/index.esm.js.map +1 -1
- package/package.json +6 -2
package/dist/index.cjs.js
CHANGED
|
@@ -1,7 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var react = require('react');
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var md = require('react-icons/md');
|
|
6
|
+
var moment = require('moment');
|
|
7
|
+
var fa = require('react-icons/fa');
|
|
8
|
+
var material = require('@mui/material');
|
|
9
|
+
var AdapterDateFns = require('@mui/x-date-pickers/AdapterDateFns');
|
|
10
|
+
var LocalizationProvider = require('@mui/x-date-pickers/LocalizationProvider');
|
|
11
|
+
var MobileDateTimePicker = require('@mui/x-date-pickers/MobileDateTimePicker');
|
|
12
|
+
var PropTypes = require('prop-types');
|
|
5
13
|
|
|
6
14
|
function _arrayLikeToArray(r, a) {
|
|
7
15
|
(null == a || a > r.length) && (a = r.length);
|
|
@@ -39,8 +47,8 @@ function _asyncToGenerator(n) {
|
|
|
39
47
|
});
|
|
40
48
|
};
|
|
41
49
|
}
|
|
42
|
-
function _defineProperty
|
|
43
|
-
return (r = _toPropertyKey
|
|
50
|
+
function _defineProperty(e, r, t) {
|
|
51
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
44
52
|
value: t,
|
|
45
53
|
enumerable: true,
|
|
46
54
|
configurable: true,
|
|
@@ -80,7 +88,7 @@ function _nonIterableRest() {
|
|
|
80
88
|
function _nonIterableSpread() {
|
|
81
89
|
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
82
90
|
}
|
|
83
|
-
function ownKeys
|
|
91
|
+
function ownKeys(e, r) {
|
|
84
92
|
var t = Object.keys(e);
|
|
85
93
|
if (Object.getOwnPropertySymbols) {
|
|
86
94
|
var o = Object.getOwnPropertySymbols(e);
|
|
@@ -93,34 +101,14 @@ function ownKeys$1(e, r) {
|
|
|
93
101
|
function _objectSpread2(e) {
|
|
94
102
|
for (var r = 1; r < arguments.length; r++) {
|
|
95
103
|
var t = null != arguments[r] ? arguments[r] : {};
|
|
96
|
-
r % 2 ? ownKeys
|
|
97
|
-
_defineProperty
|
|
98
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys
|
|
104
|
+
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
|
|
105
|
+
_defineProperty(e, r, t[r]);
|
|
106
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
|
|
99
107
|
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
|
|
100
108
|
});
|
|
101
109
|
}
|
|
102
110
|
return e;
|
|
103
111
|
}
|
|
104
|
-
function _objectWithoutProperties$1(e, t) {
|
|
105
|
-
if (null == e) return {};
|
|
106
|
-
var o,
|
|
107
|
-
r,
|
|
108
|
-
i = _objectWithoutPropertiesLoose$1(e, t);
|
|
109
|
-
if (Object.getOwnPropertySymbols) {
|
|
110
|
-
var n = Object.getOwnPropertySymbols(e);
|
|
111
|
-
for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
112
|
-
}
|
|
113
|
-
return i;
|
|
114
|
-
}
|
|
115
|
-
function _objectWithoutPropertiesLoose$1(r, e) {
|
|
116
|
-
if (null == r) return {};
|
|
117
|
-
var t = {};
|
|
118
|
-
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
119
|
-
if (-1 !== e.indexOf(n)) continue;
|
|
120
|
-
t[n] = r[n];
|
|
121
|
-
}
|
|
122
|
-
return t;
|
|
123
|
-
}
|
|
124
112
|
function _regenerator() {
|
|
125
113
|
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
|
|
126
114
|
var e,
|
|
@@ -235,7 +223,7 @@ function _slicedToArray(r, e) {
|
|
|
235
223
|
function _toConsumableArray(r) {
|
|
236
224
|
return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
|
|
237
225
|
}
|
|
238
|
-
function _toPrimitive
|
|
226
|
+
function _toPrimitive(t, r) {
|
|
239
227
|
if ("object" != typeof t || !t) return t;
|
|
240
228
|
var e = t[Symbol.toPrimitive];
|
|
241
229
|
if (void 0 !== e) {
|
|
@@ -245,8 +233,8 @@ function _toPrimitive$1(t, r) {
|
|
|
245
233
|
}
|
|
246
234
|
return ("string" === r ? String : Number)(t);
|
|
247
235
|
}
|
|
248
|
-
function _toPropertyKey
|
|
249
|
-
var i = _toPrimitive
|
|
236
|
+
function _toPropertyKey(t) {
|
|
237
|
+
var i = _toPrimitive(t, "string");
|
|
250
238
|
return "symbol" == typeof i ? i : i + "";
|
|
251
239
|
}
|
|
252
240
|
function _unsupportedIterableToArray(r, a) {
|
|
@@ -257,56 +245,6 @@ function _unsupportedIterableToArray(r, a) {
|
|
|
257
245
|
}
|
|
258
246
|
}
|
|
259
247
|
|
|
260
|
-
var _excluded$1 = ["children", "onClick", "variant", "disabled", "className"];
|
|
261
|
-
var Button = function Button(_ref) {
|
|
262
|
-
var children = _ref.children,
|
|
263
|
-
onClick = _ref.onClick,
|
|
264
|
-
_ref$variant = _ref.variant,
|
|
265
|
-
variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
|
|
266
|
-
_ref$disabled = _ref.disabled,
|
|
267
|
-
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
268
|
-
_ref$className = _ref.className,
|
|
269
|
-
className = _ref$className === void 0 ? '' : _ref$className,
|
|
270
|
-
props = _objectWithoutProperties$1(_ref, _excluded$1);
|
|
271
|
-
var baseStyles = {
|
|
272
|
-
padding: '10px 20px',
|
|
273
|
-
borderRadius: '6px',
|
|
274
|
-
border: 'none',
|
|
275
|
-
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
276
|
-
fontSize: '14px',
|
|
277
|
-
fontWeight: '500',
|
|
278
|
-
opacity: disabled ? 0.6 : 1,
|
|
279
|
-
transition: 'all 0.2s ease'
|
|
280
|
-
};
|
|
281
|
-
var variantStyles = {
|
|
282
|
-
primary: {
|
|
283
|
-
backgroundColor: '#007bff',
|
|
284
|
-
color: 'white'
|
|
285
|
-
},
|
|
286
|
-
secondary: {
|
|
287
|
-
backgroundColor: '#6c757d',
|
|
288
|
-
color: 'white'
|
|
289
|
-
},
|
|
290
|
-
success: {
|
|
291
|
-
backgroundColor: '#28a745',
|
|
292
|
-
color: 'white'
|
|
293
|
-
},
|
|
294
|
-
danger: {
|
|
295
|
-
backgroundColor: '#dc3545',
|
|
296
|
-
color: 'white'
|
|
297
|
-
}
|
|
298
|
-
};
|
|
299
|
-
var buttonStyle = _objectSpread2(_objectSpread2({}, baseStyles), variantStyles[variant]);
|
|
300
|
-
return /*#__PURE__*/jsxRuntime.jsx("button", _objectSpread2(_objectSpread2({
|
|
301
|
-
style: buttonStyle,
|
|
302
|
-
onClick: onClick,
|
|
303
|
-
disabled: disabled,
|
|
304
|
-
className: className
|
|
305
|
-
}, props), {}, {
|
|
306
|
-
children: children
|
|
307
|
-
}));
|
|
308
|
-
};
|
|
309
|
-
|
|
310
248
|
function styleInject(css, ref) {
|
|
311
249
|
if ( ref === void 0 ) ref = {};
|
|
312
250
|
var insertAt = ref.insertAt;
|
|
@@ -334,7 +272,7 @@ function styleInject(css, ref) {
|
|
|
334
272
|
}
|
|
335
273
|
}
|
|
336
274
|
|
|
337
|
-
var css_248z = ":root{--udi-color-primary:var(--color-primary,#007bff);--udi-color-primary-hover:var(--color-primary-dark,#0056b3);--udi-color-primary-light:var(--color-primary-light,#e3f2fd);--udi-color-success:var(--color-success,#10b981);--udi-color-success-hover:var(--color-success,#059669);--udi-color-warning:var(--color-warning,#f59e0b);--udi-color-warning-hover:var(--color-warning,#d97706);--udi-color-danger:var(--color-error,#ef4444);--udi-color-danger-hover:var(--color-error,#dc2626);--udi-color-info:var(--color-info,#1565c0);--udi-color-background:var(--color-background,#fff);--udi-color-surface:var(--color-surface,#f8f9fa);--udi-color-surface-elevated:var(--color-surface-elevated,#fff);--udi-color-surface-hover:var(--color-surface,#f3f4f6);--udi-color-text-primary:var(--color-text-primary,#1f2937);--udi-color-text-secondary:var(--color-text-secondary,#6c757d);--udi-color-text-disabled:var(--color-text-disabled,#9ca3af);--udi-color-text-label:var(--color-text-primary,#495057);--udi-color-border:var(--color-border,#e9ecef);--udi-color-border-hover:var(--color-border,#adb5bd);--udi-color-divider:var(--color-divider,#dee2e6);--udi-color-shadow:var(--color-shadow,rgba(0,0,0,.1));--udi-color-shadow-sm:var(--color-shadow,rgba(0,0,0,.05));--udi-color-shadow-md:var(--color-shadow,rgba(0,0,0,.15));--udi-color-filter-bg:var(--color-surface,#f8f9fa);--udi-color-filter-advanced-bg:var(--color-surface-elevated,#f1f3f4);--udi-color-pagination-bg:var(--color-surface,#f8f9fa);--udi-color-scrollbar-track:var(--color-surface,#f8f9fa);--udi-color-scrollbar-thumb:var(--color-border,#cbd5e0);--udi-color-scrollbar-thumb-hover:var(--color-border,#a0aec0);--udi-color-error-bg:#f8d7da;--udi-color-error-text:#721c24;--udi-color-error-border:#dc3545}.udi-table td,.udi-table th{border-left:none!important;border-right:none!important}.udi-table-container{border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;width:100%}.udi-table-container .error-message{background:var(--udi-color-error-bg);border-left:4px solid var(--udi-color-error-border);border-radius:4px;color:var(--udi-color-error-text);font-weight:500;margin-bottom:16px;padding:12px 16px}@media (max-width:768px){.udi-table-container .error-message{font-size:14px;margin:8px}}.udi-table-filter{background:var(--udi-color-filter-bg);border-bottom:1px solid var(--udi-color-border)}.udi-table-filter .filter-section .basic-filter{align-items:center;display:flex;flex-wrap:wrap;gap:12px;padding:16px}.udi-table-filter .filter-section .basic-filter .filter-column-selector{align-items:center;display:flex;gap:8px;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{color:var(--udi-color-text-label);font-size:14px;font-weight:500}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);cursor:pointer;font-size:14px;min-width:120px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select:hover{border-color:var(--udi-color-border-hover)}.udi-table-filter .filter-section .basic-filter .filter-input{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);flex:1;font-size:14px;min-width:200px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .basic-filter .filter-input:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle{background:var(--udi-color-primary);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .15s ease-in-out;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle:hover{background:var(--udi-color-primary-hover)}.udi-table-filter .filter-section .basic-filter .reset-button{background:var(--udi-color-text-secondary);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .15s ease-in-out;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .reset-button:hover{background:var(--udi-color-text-primary)}.udi-table-filter .filter-section .advanced-filter{background:var(--udi-color-filter-advanced-bg);border-top:1px solid var(--udi-color-border);padding:16px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{color:var(--udi-color-text-label);font-size:16px;font-weight:600;margin:0}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{background:var(--udi-color-danger);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:12px;padding:6px 12px;transition:background-color .15s ease-in-out}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button:hover{background:var(--udi-color-danger-hover)}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item{display:flex;flex-direction:column;gap:4px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{color:var(--udi-color-text-label);font-size:13px;font-weight:500}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);font-size:14px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input:hover{border-color:var(--udi-color-border-hover)}.scroll-position-indicator{background:var(--udi-color-primary-light);border-bottom:1px solid var(--udi-color-primary);color:var(--udi-color-info);font-family:Courier New,monospace;font-size:12px;padding:8px 16px;text-align:center}.udi-table-wrapper{-webkit-overflow-scrolling:touch;border:1px solid var(--udi-color-border);height:300px;overflow-x:auto;overflow-y:auto}.udi-table-wrapper::-webkit-scrollbar{height:8px;width:8px}.udi-table-wrapper::-webkit-scrollbar-track{background:var(--udi-color-scrollbar-track);border-radius:4px}.udi-table-wrapper::-webkit-scrollbar-thumb{background:var(--udi-color-scrollbar-thumb);border-radius:4px}.udi-table-wrapper::-webkit-scrollbar-thumb:hover{background:var(--udi-color-scrollbar-thumb-hover)}.udi-table{border-collapse:collapse;font-size:14px;min-width:800px}.udi-table td,.udi-table th{border-bottom:1px solid var(--udi-color-border);color:var(--udi-color-text-primary);max-width:300px;overflow:hidden;padding:12px 16px;text-align:left;text-overflow:ellipsis;white-space:nowrap}.udi-table th{background:var(--udi-color-surface);border-bottom:2px solid var(--udi-color-divider);color:var(--udi-color-text-label);font-weight:600;position:sticky;top:0;z-index:10}.udi-table th.sortable{cursor:pointer;transition:background-color .15s ease-in-out;user-select:none}.udi-table th.sortable:hover{background:var(--udi-color-surface-hover)}.udi-table th.sortable .sort-icon{opacity:.4}.udi-table th.sorted{background:var(--udi-color-primary-light);color:var(--udi-color-primary)}.udi-table th.sorted .sort-icon{opacity:1}.udi-table th .th-content{align-items:center;display:flex;justify-content:space-between;min-width:0}.udi-table th .sort-icon{flex-shrink:0;font-size:12px;margin-left:8px;opacity:.7}.udi-table tbody tr{transition:background-color .15s ease-in-out}.udi-table tbody tr:hover{background:var(--udi-color-surface)}.udi-table tbody tr:nth-child(2n){background:var(--udi-color-background)}.udi-table tbody tr:nth-child(2n):hover{background:var(--udi-color-surface)}.udi-table tbody td:first-child{background:inherit;border-right:1px solid var(--udi-color-border);left:0;z-index:5}.udi-table .no-data{color:var(--udi-color-text-secondary);font-style:italic;padding:32px;text-align:center}.udi-table .loading-state{padding:40px 20px;text-align:center}.udi-table .loading-state .loading-spinner{align-items:center;display:flex;flex-direction:column;gap:12px}.udi-table .loading-state .loading-spinner .spinner{animation:spin 1s linear infinite;border-top:3px solid var(--udi-color-border);border:3px solid var(--udi-color-border);border-radius:50%;border-top-color:var(--udi-color-primary);height:32px;width:32px}.udi-table .loading-state .loading-spinner span{color:var(--udi-color-text-secondary);font-size:14px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.udi-table-pagination{align-items:center;background:var(--udi-color-pagination-bg);border-top:1px solid var(--udi-color-border);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;padding:16px}.udi-table-pagination .pagination-info{color:var(--udi-color-text-secondary);display:flex;flex-direction:column;font-size:14px;gap:8px}.udi-table-pagination .pagination-info .page-size-selector{align-items:center;display:flex;gap:8px}.udi-table-pagination .pagination-info .page-size-selector label{color:var(--udi-color-text-label);font-weight:500}.udi-table-pagination .pagination-info .page-size-selector .page-size-select{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);cursor:pointer;font-size:14px;outline:none;padding:4px 8px;transition:border-color .15s ease-in-out}.udi-table-pagination .pagination-info .page-size-selector .page-size-select:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-pagination .pagination-info .page-size-selector .page-size-select:hover{border-color:var(--udi-color-border-hover)}.udi-table-pagination .pagination-info .page-size-selector span{color:var(--udi-color-text-label)}.udi-table-pagination .pagination-info .pagination-summary{font-size:13px}.udi-table-pagination .pagination-controls{align-items:center;display:flex;gap:4px}.udi-table-pagination .pagination-controls .current-page-mobile{background:var(--udi-color-primary);border:1px solid var(--udi-color-primary);border-radius:4px;color:var(--udi-color-surface-elevated);font-size:14px;font-weight:500;min-width:60px;padding:8px 12px;text-align:center}.udi-table-pagination .pagination-controls .pagination-button{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-label);cursor:pointer;font-size:14px;min-width:40px;padding:6px 12px;transition:all .15s ease-in-out}.udi-table-pagination .pagination-controls .pagination-button:hover:not(:disabled){background:var(--udi-color-surface-hover);border-color:var(--udi-color-border-hover)}.udi-table-pagination .pagination-controls .pagination-button:disabled{background:var(--udi-color-surface);color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.6}.udi-table-pagination .pagination-controls .pagination-button.disabled{color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.5}.udi-table-pagination .pagination-controls .pagination-button.disabled,.udi-table-pagination .pagination-controls .pagination-button.disabled:hover{background:var(--udi-color-surface);border-color:var(--udi-color-border)}.udi-table-pagination .pagination-controls .pagination-button.active{background:var(--udi-color-primary);border-color:var(--udi-color-primary);color:var(--udi-color-surface-elevated)}.udi-table-pagination .pagination-controls .pagination-button.active:hover{background:var(--udi-color-primary-hover);border-color:var(--udi-color-primary-hover)}@media (min-width:1200px){.udi-table-wrapper{height:400px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:1199px) and (min-width:992px){.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:991px) and (min-width:768px){.udi-table-container{border-radius:6px}.udi-table-wrapper{height:350px}.udi-table{min-width:600px}.udi-table td,.udi-table th{font-size:13px;max-width:200px;padding:10px 12px}.udi-table-filter .filter-section .basic-filter{flex-wrap:wrap;gap:10px}.udi-table-filter .filter-section .basic-filter .filter-input{min-width:180px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:10px;grid-template-columns:repeat(2,1fr)}.udi-table-pagination{padding:12px}.udi-table-pagination .pagination-info .page-size-selector{align-items:flex-start;flex-direction:column;gap:4px}}@media (max-width:767px) and (min-width:481px){.udi-table-container{border-radius:4px;margin:0 4px}.udi-table-wrapper{height:300px}.udi-table{min-width:500px}.udi-table td,.udi-table th{font-size:12px;max-width:150px;padding:8px 10px}.udi-table tbody td:first-child,.udi-table th:first-child{background:inherit;border-right:2px solid var(--udi-color-border);font-weight:600;left:0;position:sticky;z-index:5}.scroll-position-indicator{font-size:11px;padding:6px 12px}.udi-table-filter .filter-section .basic-filter{align-items:stretch;flex-direction:column;gap:8px;padding:12px}.udi-table-filter .filter-section .basic-filter .filter-column-selector{justify-content:flex-start}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{font-size:13px}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{flex:1;font-size:14px;min-width:100px}.udi-table-filter .filter-section .basic-filter .filter-input{font-size:16px;min-width:auto}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle,.udi-table-filter .filter-section .basic-filter .reset-button{align-self:stretch;font-size:14px}.udi-table-filter .filter-section .advanced-filter{padding:12px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header{align-items:stretch;flex-direction:column;gap:8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{font-size:14px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{align-self:flex-end}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:8px;grid-template-columns:1fr}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{font-size:12px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{font-size:16px}.udi-table-pagination{align-items:stretch;flex-direction:column;gap:8px;padding:12px}.udi-table-pagination .pagination-info{text-align:center}.udi-table-pagination .pagination-info .page-size-selector{flex-wrap:wrap;justify-content:center}.udi-table-pagination .pagination-controls{justify-content:center}.udi-table-pagination .pagination-controls .pagination-button{font-size:13px;min-width:36px;padding:8px 12px}}@media (max-width:480px){.udi-table-container{border-left:1px solid var(--udi-color-border);border-radius:0;border-right:1px solid var(--udi-color-border);box-shadow:none;margin:0}.udi-table-wrapper{border:none;height:250px}.udi-table{font-size:11px;min-width:400px}.udi-table td,.udi-table th{font-size:11px;max-width:120px;padding:6px 8px}.udi-table tbody td:first-child,.udi-table th:first-child{min-width:60px}.scroll-position-indicator{font-size:10px;padding:4px 8px}.udi-table-filter .filter-section .basic-filter{gap:6px;padding:8px}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{font-size:12px}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{font-size:13px;padding:6px 8px}.udi-table-filter .filter-section .basic-filter .filter-input{font-size:16px;padding:8px 10px}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle,.udi-table-filter .filter-section .basic-filter .reset-button{font-size:13px;padding:8px 12px}.udi-table-filter .filter-section .advanced-filter{padding:8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{font-size:13px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{font-size:11px;padding:4px 8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:6px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{font-size:11px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{font-size:16px;padding:6px 8px}.udi-table-pagination{gap:6px;padding:8px}.udi-table-pagination .pagination-info{font-size:12px}.udi-table-pagination .pagination-info .page-size-selector{gap:4px}.udi-table-pagination .pagination-info .page-size-selector label{font-size:11px}.udi-table-pagination .pagination-info .page-size-selector .page-size-select{font-size:12px;padding:4px 6px}.udi-table-pagination .pagination-info .pagination-summary{font-size:11px}.udi-table-pagination .pagination-controls{flex-wrap:wrap;gap:2px}.udi-table-pagination .pagination-controls .pagination-button{font-size:11px;min-width:28px;padding:6px 8px}}.udi-table-header{margin:30px 8px}.udi-table-name{display:inline-block;margin-right:auto;vertical-align:middle}.udi-table-name h3{color:var(--udi-color-text-primary);font-size:18px;font-weight:600;line-height:1.4;margin:0}.udi-table-free-actions{align-items:center;display:inline-flex!important;flex-wrap:wrap;gap:8px;margin-left:auto;vertical-align:middle}.udi-table-name+.udi-table-free-actions{float:right}.udi-table-free-action-button{align-items:center;background-color:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:6px;color:var(--udi-color-text-primary);cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:6px;justify-content:center;min-height:36px;min-width:36px;outline:none;padding:8px 12px;transition:all .2s ease}.udi-table-free-action-button:hover{background-color:var(--udi-color-surface-hover);border-color:var(--udi-color-border-hover);box-shadow:0 2px 4px var(--udi-color-shadow);color:var(--udi-color-text-primary);transform:translateY(-1px)}.udi-table-free-action-button:active{background-color:var(--udi-color-surface);box-shadow:0 1px 2px var(--udi-color-shadow-sm);transform:translateY(0)}.udi-table-free-action-button:focus-visible{outline:2px solid var(--udi-color-primary);outline-offset:2px}.udi-table-free-action-button:disabled{background-color:var(--udi-color-surface);border-color:var(--udi-color-border);color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.5}.udi-table-free-action-button:disabled:hover{background-color:var(--udi-color-surface);border-color:var(--udi-color-border);box-shadow:none;transform:none}.udi-table-free-action-button svg{flex-shrink:0;height:18px;width:18px}.udi-table-free-action-button:has(svg:only-child){min-width:36px;padding:8px}.udi-table-free-action-button.primary{background-color:var(--udi-color-primary);border-color:var(--udi-color-primary);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.primary:hover{background-color:var(--udi-color-primary-hover);border-color:var(--udi-color-primary-hover)}.udi-table-free-action-button.success{background-color:var(--udi-color-success);border-color:var(--udi-color-success);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.success:hover{background-color:var(--udi-color-success-hover);border-color:var(--udi-color-success-hover)}.udi-table-free-action-button.warning{background-color:var(--udi-color-warning);border-color:var(--udi-color-warning);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.warning:hover{background-color:var(--udi-color-warning-hover);border-color:var(--udi-color-warning-hover)}.udi-table-free-action-button.danger{background-color:var(--udi-color-danger);border-color:var(--udi-color-danger);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.danger:hover{background-color:var(--udi-color-danger-hover);border-color:var(--udi-color-danger-hover)}.udi-table-free-action-button.ghost{background-color:transparent;border-color:transparent}.udi-table-free-action-button.ghost:hover{background-color:var(--udi-color-surface-hover);border-color:var(--udi-color-border)}@media (max-width:768px){.udi-table-free-actions-container{gap:6px}.udi-table-free-action-button{font-size:13px;min-height:32px;min-width:32px;padding:6px 10px}.udi-table-free-action-button svg{height:16px;width:16px}}@media (orientation:landscape) and (max-height:500px){.udi-table-wrapper{height:200px}.udi-table-filter .filter-section .basic-filter{flex-direction:row;flex-wrap:wrap}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.udi-table td,.udi-table th{border-width:.5px}}";
|
|
275
|
+
var css_248z = ":root{--udi-color-primary:var(--color-primary,#007bff);--udi-color-primary-hover:var(--color-primary-dark,#0056b3);--udi-color-primary-light:var(--color-primary-light,#e3f2fd);--udi-color-success:var(--color-success,#10b981);--udi-color-success-hover:var(--color-success,#059669);--udi-color-warning:var(--color-warning,#f59e0b);--udi-color-warning-hover:var(--color-warning,#d97706);--udi-color-danger:var(--color-error,#ef4444);--udi-color-danger-hover:var(--color-error,#dc2626);--udi-color-info:var(--color-info,#1565c0);--udi-color-background:var(--color-background,#fff);--udi-color-surface:var(--color-surface,#f8f9fa);--udi-color-surface-elevated:var(--color-surface-elevated,#fff);--udi-color-surface-hover:var(--color-surface,#f3f4f6);--udi-color-text-primary:var(--color-text-primary,#1f2937);--udi-color-text-secondary:var(--color-text-secondary,#6c757d);--udi-color-text-disabled:var(--color-text-disabled,#9ca3af);--udi-color-text-label:var(--color-text-primary,#495057);--udi-color-border:var(--color-border,#e9ecef);--udi-color-border-hover:var(--color-border,#adb5bd);--udi-color-divider:var(--color-divider,#dee2e6);--udi-color-shadow:var(--color-shadow,rgba(0,0,0,.1));--udi-color-shadow-sm:var(--color-shadow,rgba(0,0,0,.05));--udi-color-shadow-md:var(--color-shadow,rgba(0,0,0,.15));--udi-color-filter-bg:var(--color-surface,#f8f9fa);--udi-color-filter-advanced-bg:var(--color-surface-elevated,#f1f3f4);--udi-color-pagination-bg:var(--color-surface,#f8f9fa);--udi-color-scrollbar-track:var(--color-surface,#f8f9fa);--udi-color-scrollbar-thumb:var(--color-border,#cbd5e0);--udi-color-scrollbar-thumb-hover:var(--color-border,#a0aec0);--udi-color-error-bg:#f8d7da;--udi-color-error-text:#721c24;--udi-color-error-border:#dc3545}.udi-table td,.udi-table th{border-left:none!important;border-right:none!important}.udi-table-container{border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;max-height:5000px;opacity:1;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s ease,margin .3s ease,padding .3s ease;width:100%}.udi-table-container.collapsed{margin:0;max-height:0;opacity:0;overflow:hidden;padding:0;pointer-events:none}.udi-table-container .error-message{background:var(--udi-color-error-bg);border-left:4px solid var(--udi-color-error-border);border-radius:4px;color:var(--udi-color-error-text);font-weight:500;margin-bottom:16px;padding:12px 16px}@media (max-width:768px){.udi-table-container .error-message{font-size:14px;margin:8px}}.udi-table-filter{background:var(--udi-color-filter-bg);border-bottom:1px solid var(--udi-color-border)}.udi-table-filter .filter-section .basic-filter{align-items:center;display:flex;flex-wrap:wrap;gap:12px;padding:16px}.udi-table-filter .filter-section .basic-filter .filter-column-selector{align-items:center;display:flex;gap:8px;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{color:var(--udi-color-text-label);font-size:14px;font-weight:500}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);cursor:pointer;font-size:14px;min-width:120px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select:hover{border-color:var(--udi-color-border-hover)}.udi-table-filter .filter-section .basic-filter .filter-input{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);flex:1;font-size:14px;min-width:200px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .basic-filter .filter-input:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle{background:var(--udi-color-primary);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .15s ease-in-out;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle:hover{background:var(--udi-color-primary-hover)}.udi-table-filter .filter-section .basic-filter .reset-button{background:var(--udi-color-text-secondary);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .15s ease-in-out;white-space:nowrap}.udi-table-filter .filter-section .basic-filter .reset-button:hover{background:var(--udi-color-text-primary)}.udi-table-filter .filter-section .advanced-filter{background:var(--udi-color-filter-advanced-bg);border-top:1px solid var(--udi-color-border);padding:16px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{color:var(--udi-color-text-label);font-size:16px;font-weight:600;margin:0}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{background:var(--udi-color-danger);border:none;border-radius:4px;color:var(--udi-color-surface-elevated);cursor:pointer;font-size:12px;padding:6px 12px;transition:background-color .15s ease-in-out}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button:hover{background:var(--udi-color-danger-hover)}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item{display:flex;flex-direction:column;gap:4px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{color:var(--udi-color-text-label);font-size:13px;font-weight:500}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);font-size:14px;outline:none;padding:8px 12px;transition:border-color .15s ease-in-out}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input:hover{border-color:var(--udi-color-border-hover)}.scroll-position-indicator{background:var(--udi-color-primary-light);border-bottom:1px solid var(--udi-color-primary);color:var(--udi-color-info);font-family:Courier New,monospace;font-size:12px;padding:8px 16px;text-align:center}.udi-table-wrapper{-webkit-overflow-scrolling:touch;border:1px solid var(--udi-color-border);height:300px;overflow-x:auto;overflow-y:auto}.udi-table-wrapper::-webkit-scrollbar{height:8px;width:8px}.udi-table-wrapper::-webkit-scrollbar-track{background:var(--udi-color-scrollbar-track);border-radius:4px}.udi-table-wrapper::-webkit-scrollbar-thumb{background:var(--udi-color-scrollbar-thumb);border-radius:4px}.udi-table-wrapper::-webkit-scrollbar-thumb:hover{background:var(--udi-color-scrollbar-thumb-hover)}.udi-table{border-collapse:collapse;font-size:14px;min-width:800px}.udi-table td,.udi-table th{border-bottom:1px solid var(--udi-color-border);color:var(--udi-color-text-primary);max-width:300px;overflow:hidden;padding:12px 16px;text-align:left;text-overflow:ellipsis;white-space:nowrap}.udi-table th{background:var(--udi-color-surface);border-bottom:2px solid var(--udi-color-divider);color:var(--udi-color-text-label);font-weight:600;position:sticky;top:0;z-index:10}.udi-table th.sortable{cursor:pointer;transition:background-color .15s ease-in-out;user-select:none}.udi-table th.sortable:hover{background:var(--udi-color-surface-hover)}.udi-table th.sortable .sort-icon{opacity:.4}.udi-table th.sorted{background:var(--udi-color-primary-light);color:var(--udi-color-primary)}.udi-table th.sorted .sort-icon{opacity:1}.udi-table th .th-content{align-items:center;display:flex;justify-content:space-between;min-width:0}.udi-table th .sort-icon{flex-shrink:0;font-size:12px;margin-left:8px;opacity:.7}.udi-table tbody tr{transition:background-color .15s ease-in-out}.udi-table tbody tr:hover{background:var(--udi-color-surface)}.udi-table tbody tr:nth-child(2n){background:var(--udi-color-background)}.udi-table tbody tr:nth-child(2n):hover{background:var(--udi-color-surface)}.udi-table tbody td:first-child{background:inherit;border-right:1px solid var(--udi-color-border);left:0;z-index:5}.udi-table .no-data{color:var(--udi-color-text-secondary);font-style:italic;padding:32px;text-align:center}.udi-table .loading-state{padding:40px 20px;text-align:center}.udi-table .loading-state .loading-spinner{align-items:center;display:flex;flex-direction:column;gap:12px}.udi-table .loading-state .loading-spinner .spinner{animation:spin 1s linear infinite;border-top:3px solid var(--udi-color-border);border:3px solid var(--udi-color-border);border-radius:50%;border-top-color:var(--udi-color-primary);height:32px;width:32px}.udi-table .loading-state .loading-spinner span{color:var(--udi-color-text-secondary);font-size:14px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.udi-table-pagination{align-items:center;background:var(--udi-color-pagination-bg);border-top:1px solid var(--udi-color-border);display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;padding:16px}.udi-table-pagination .pagination-info{color:var(--udi-color-text-secondary);display:flex;flex-direction:column;font-size:14px;gap:8px}.udi-table-pagination .pagination-info .page-size-selector{align-items:center;display:flex;gap:8px}.udi-table-pagination .pagination-info .page-size-selector label{color:var(--udi-color-text-label);font-weight:500}.udi-table-pagination .pagination-info .page-size-selector .page-size-select{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-primary);cursor:pointer;font-size:14px;outline:none;padding:4px 8px;transition:border-color .15s ease-in-out}.udi-table-pagination .pagination-info .page-size-selector .page-size-select:focus{border-color:var(--udi-color-primary);box-shadow:0 0 0 .2rem var(--udi-color-shadow-sm)}.udi-table-pagination .pagination-info .page-size-selector .page-size-select:hover{border-color:var(--udi-color-border-hover)}.udi-table-pagination .pagination-info .page-size-selector span{color:var(--udi-color-text-label)}.udi-table-pagination .pagination-info .pagination-summary{font-size:13px}.udi-table-pagination .pagination-controls{align-items:center;display:flex;gap:4px}.udi-table-pagination .pagination-controls .current-page-mobile{background:var(--udi-color-primary);border:1px solid var(--udi-color-primary);border-radius:4px;color:var(--udi-color-surface-elevated);font-size:14px;font-weight:500;min-width:60px;padding:8px 12px;text-align:center}.udi-table-pagination .pagination-controls .pagination-button{background:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:4px;color:var(--udi-color-text-label);cursor:pointer;font-size:14px;min-width:40px;padding:6px 12px;transition:all .15s ease-in-out}.udi-table-pagination .pagination-controls .pagination-button:hover:not(:disabled){background:var(--udi-color-surface-hover);border-color:var(--udi-color-border-hover)}.udi-table-pagination .pagination-controls .pagination-button:disabled{background:var(--udi-color-surface);color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.6}.udi-table-pagination .pagination-controls .pagination-button.disabled{color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.5}.udi-table-pagination .pagination-controls .pagination-button.disabled,.udi-table-pagination .pagination-controls .pagination-button.disabled:hover{background:var(--udi-color-surface);border-color:var(--udi-color-border)}.udi-table-pagination .pagination-controls .pagination-button.active{background:var(--udi-color-primary);border-color:var(--udi-color-primary);color:var(--udi-color-surface-elevated)}.udi-table-pagination .pagination-controls .pagination-button.active:hover{background:var(--udi-color-primary-hover);border-color:var(--udi-color-primary-hover)}@media (min-width:1200px){.udi-table-wrapper{height:400px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:1199px) and (min-width:992px){.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:991px) and (min-width:768px){.udi-table-container{border-radius:6px}.udi-table-wrapper{height:350px}.udi-table{min-width:600px}.udi-table td,.udi-table th{font-size:13px;max-width:200px;padding:10px 12px}.udi-table-filter .filter-section .basic-filter{flex-wrap:wrap;gap:10px}.udi-table-filter .filter-section .basic-filter .filter-input{min-width:180px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:10px;grid-template-columns:repeat(2,1fr)}.udi-table-pagination{padding:12px}.udi-table-pagination .pagination-info .page-size-selector{align-items:flex-start;flex-direction:column;gap:4px}}@media (max-width:767px) and (min-width:481px){.udi-table-container{border-radius:4px;margin:0 4px}.udi-table-wrapper{height:300px}.udi-table{min-width:500px}.udi-table td,.udi-table th{font-size:12px;max-width:150px;padding:8px 10px}.udi-table tbody td:first-child,.udi-table th:first-child{background:inherit;border-right:2px solid var(--udi-color-border);font-weight:600;left:0;position:sticky;z-index:5}.scroll-position-indicator{font-size:11px;padding:6px 12px}.udi-table-filter .filter-section .basic-filter{align-items:stretch;flex-direction:column;gap:8px;padding:12px}.udi-table-filter .filter-section .basic-filter .filter-column-selector{justify-content:flex-start}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{font-size:13px}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{flex:1;font-size:14px;min-width:100px}.udi-table-filter .filter-section .basic-filter .filter-input{font-size:16px;min-width:auto}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle,.udi-table-filter .filter-section .basic-filter .reset-button{align-self:stretch;font-size:14px}.udi-table-filter .filter-section .advanced-filter{padding:12px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header{align-items:stretch;flex-direction:column;gap:8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{font-size:14px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{align-self:flex-end}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:8px;grid-template-columns:1fr}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{font-size:12px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{font-size:16px}.udi-table-pagination{align-items:stretch;flex-direction:column;gap:8px;padding:12px}.udi-table-pagination .pagination-info{text-align:center}.udi-table-pagination .pagination-info .page-size-selector{flex-wrap:wrap;justify-content:center}.udi-table-pagination .pagination-controls{justify-content:center}.udi-table-pagination .pagination-controls .pagination-button{font-size:13px;min-width:36px;padding:8px 12px}}@media (max-width:480px){.udi-table-container{border-left:1px solid var(--udi-color-border);border-radius:0;border-right:1px solid var(--udi-color-border);box-shadow:none;margin:0}.udi-table-wrapper{border:none;height:250px}.udi-table{font-size:11px;min-width:400px}.udi-table td,.udi-table th{font-size:11px;max-width:120px;padding:6px 8px}.udi-table tbody td:first-child,.udi-table th:first-child{min-width:60px}.scroll-position-indicator{font-size:10px;padding:4px 8px}.udi-table-filter .filter-section .basic-filter{gap:6px;padding:8px}.udi-table-filter .filter-section .basic-filter .filter-column-selector label{font-size:12px}.udi-table-filter .filter-section .basic-filter .filter-column-selector .filter-column-select{font-size:13px;padding:6px 8px}.udi-table-filter .filter-section .basic-filter .filter-input{font-size:16px;padding:8px 10px}.udi-table-filter .filter-section .basic-filter .advanced-filter-toggle,.udi-table-filter .filter-section .basic-filter .reset-button{font-size:13px;padding:8px 12px}.udi-table-filter .filter-section .advanced-filter{padding:8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header h4{font-size:13px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-header .clear-advanced-button{font-size:11px;padding:4px 8px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid{gap:6px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item label{font-size:11px}.udi-table-filter .filter-section .advanced-filter .advanced-filter-grid .advanced-filter-item .advanced-filter-input{font-size:16px;padding:6px 8px}.udi-table-pagination{gap:6px;padding:8px}.udi-table-pagination .pagination-info{font-size:12px}.udi-table-pagination .pagination-info .page-size-selector{gap:4px}.udi-table-pagination .pagination-info .page-size-selector label{font-size:11px}.udi-table-pagination .pagination-info .page-size-selector .page-size-select{font-size:12px;padding:4px 6px}.udi-table-pagination .pagination-info .pagination-summary{font-size:11px}.udi-table-pagination .pagination-controls{flex-wrap:wrap;gap:2px}.udi-table-pagination .pagination-controls .pagination-button{font-size:11px;min-width:28px;padding:6px 8px}}.udi-table-header{margin:30px 8px}.udi-table-name{display:inline-block;margin-right:auto;vertical-align:middle}.udi-table-collapse-button{align-items:center;background:transparent;border:none;border-radius:4px;color:var(--udi-color-text-secondary);cursor:pointer;display:inline-flex;height:24px;justify-content:center;margin-right:8px;padding:0;transition:all .2s ease;vertical-align:middle;width:24px}.udi-table-collapse-button svg{transition:transform .3s cubic-bezier(.4,0,.2,1)}.udi-table-collapse-button:hover{background:var(--udi-color-surface-hover);color:var(--udi-color-text-primary)}.udi-table-collapse-button:hover svg{transform:scale(1.1)}.udi-table-collapse-button:active{transform:scale(.95)}.udi-table-name h3{color:var(--udi-color-text-primary);display:inline-block;font-size:18px;font-weight:600;line-height:1.4;margin:0;vertical-align:middle}.udi-table-free-actions{align-items:center;display:inline-flex!important;flex-wrap:wrap;gap:8px;margin-left:auto;vertical-align:middle}.udi-table-name+.udi-table-free-actions{float:right}.udi-table-free-action-button{align-items:center;background-color:var(--udi-color-surface-elevated);border:1px solid var(--udi-color-border);border-radius:6px;color:var(--udi-color-text-primary);cursor:pointer;display:inline-flex;font-size:14px;font-weight:500;gap:6px;justify-content:center;min-height:36px;min-width:36px;outline:none;padding:8px 12px;transition:all .2s ease}.udi-table-free-action-button:hover{background-color:var(--udi-color-surface-hover);border-color:var(--udi-color-border-hover);box-shadow:0 2px 4px var(--udi-color-shadow);color:var(--udi-color-text-primary);transform:translateY(-1px)}.udi-table-free-action-button:active{background-color:var(--udi-color-surface);box-shadow:0 1px 2px var(--udi-color-shadow-sm);transform:translateY(0)}.udi-table-free-action-button:focus-visible{outline:2px solid var(--udi-color-primary);outline-offset:2px}.udi-table-free-action-button:disabled{background-color:var(--udi-color-surface);border-color:var(--udi-color-border);color:var(--udi-color-text-disabled);cursor:not-allowed;opacity:.5}.udi-table-free-action-button:disabled:hover{background-color:var(--udi-color-surface);border-color:var(--udi-color-border);box-shadow:none;transform:none}.udi-table-free-action-button svg{flex-shrink:0;height:18px;width:18px}.udi-table-free-action-button:has(svg:only-child){min-width:36px;padding:8px}.udi-table-free-action-button.primary{background-color:var(--udi-color-primary);border-color:var(--udi-color-primary);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.primary:hover{background-color:var(--udi-color-primary-hover);border-color:var(--udi-color-primary-hover)}.udi-table-free-action-button.success{background-color:var(--udi-color-success);border-color:var(--udi-color-success);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.success:hover{background-color:var(--udi-color-success-hover);border-color:var(--udi-color-success-hover)}.udi-table-free-action-button.warning{background-color:var(--udi-color-warning);border-color:var(--udi-color-warning);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.warning:hover{background-color:var(--udi-color-warning-hover);border-color:var(--udi-color-warning-hover)}.udi-table-free-action-button.danger{background-color:var(--udi-color-danger);border-color:var(--udi-color-danger);color:var(--udi-color-surface-elevated)}.udi-table-free-action-button.danger:hover{background-color:var(--udi-color-danger-hover);border-color:var(--udi-color-danger-hover)}.udi-table-free-action-button.ghost{background-color:transparent;border-color:transparent}.udi-table-free-action-button.ghost:hover{background-color:var(--udi-color-surface-hover);border-color:var(--udi-color-border)}@media (max-width:768px){.udi-table-free-actions-container{gap:6px}.udi-table-free-action-button{font-size:13px;min-height:32px;min-width:32px;padding:6px 10px}.udi-table-free-action-button svg{height:16px;width:16px}}@media (orientation:landscape) and (max-height:500px){.udi-table-wrapper{height:200px}.udi-table-filter .filter-section .basic-filter{flex-direction:row;flex-wrap:wrap}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.udi-table td,.udi-table th{border-width:.5px}}";
|
|
338
276
|
styleInject(css_248z);
|
|
339
277
|
|
|
340
278
|
var Pagination = function Pagination(_ref) {
|
|
@@ -515,75 +453,18 @@ var DesktopPaginationControls = function DesktopPaginationControls(_ref3) {
|
|
|
515
453
|
});
|
|
516
454
|
};
|
|
517
455
|
|
|
518
|
-
var DefaultContext = {
|
|
519
|
-
color: undefined,
|
|
520
|
-
size: undefined,
|
|
521
|
-
className: undefined,
|
|
522
|
-
style: undefined,
|
|
523
|
-
attr: undefined
|
|
524
|
-
};
|
|
525
|
-
var IconContext = React.createContext && /*#__PURE__*/React.createContext(DefaultContext);
|
|
526
|
-
|
|
527
|
-
var _excluded = ["attr", "size", "title"];
|
|
528
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
529
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
|
|
530
|
-
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); }
|
|
531
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
532
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
533
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
534
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
535
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
536
|
-
function Tree2Element(tree) {
|
|
537
|
-
return tree && tree.map((node, i) => /*#__PURE__*/React.createElement(node.tag, _objectSpread({
|
|
538
|
-
key: i
|
|
539
|
-
}, node.attr), Tree2Element(node.child)));
|
|
540
|
-
}
|
|
541
|
-
function GenIcon(data) {
|
|
542
|
-
return props => /*#__PURE__*/React.createElement(IconBase, _extends({
|
|
543
|
-
attr: _objectSpread({}, data.attr)
|
|
544
|
-
}, props), Tree2Element(data.child));
|
|
545
|
-
}
|
|
546
|
-
function IconBase(props) {
|
|
547
|
-
var elem = conf => {
|
|
548
|
-
var {
|
|
549
|
-
attr,
|
|
550
|
-
size,
|
|
551
|
-
title
|
|
552
|
-
} = props,
|
|
553
|
-
svgProps = _objectWithoutProperties(props, _excluded);
|
|
554
|
-
var computedSize = size || conf.size || "1em";
|
|
555
|
-
var className;
|
|
556
|
-
if (conf.className) className = conf.className;
|
|
557
|
-
if (props.className) className = (className ? className + " " : "") + props.className;
|
|
558
|
-
return /*#__PURE__*/React.createElement("svg", _extends({
|
|
559
|
-
stroke: "currentColor",
|
|
560
|
-
fill: "currentColor",
|
|
561
|
-
strokeWidth: "0"
|
|
562
|
-
}, conf.attr, attr, svgProps, {
|
|
563
|
-
className: className,
|
|
564
|
-
style: _objectSpread(_objectSpread({
|
|
565
|
-
color: props.color || conf.color
|
|
566
|
-
}, conf.style), props.style),
|
|
567
|
-
height: computedSize,
|
|
568
|
-
width: computedSize,
|
|
569
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
570
|
-
}), title && /*#__PURE__*/React.createElement("title", null, title), props.children);
|
|
571
|
-
};
|
|
572
|
-
return IconContext !== undefined ? /*#__PURE__*/React.createElement(IconContext.Consumer, null, conf => elem(conf)) : elem(DefaultContext);
|
|
573
|
-
}
|
|
574
|
-
|
|
575
|
-
// THIS FILE IS AUTO GENERATED
|
|
576
|
-
function MdOutlineMenuBook (props) {
|
|
577
|
-
return GenIcon({"attr":{"viewBox":"0 0 24 24"},"child":[{"tag":"path","attr":{"fill":"none","d":"M0 0h24v24H0z"},"child":[]},{"tag":"path","attr":{"d":"M21 5c-1.11-.35-2.33-.5-3.5-.5-1.95 0-4.05.4-5.5 1.5-1.45-1.1-3.55-1.5-5.5-1.5S2.45 4.9 1 6v14.65c0 .25.25.5.5.5.1 0 .15-.05.25-.05C3.1 20.45 5.05 20 6.5 20c1.95 0 4.05.4 5.5 1.5 1.35-.85 3.8-1.5 5.5-1.5 1.65 0 3.35.3 4.75 1.05.1.05.15.05.25.05.25 0 .5-.25.5-.5V6c-.6-.45-1.25-.75-2-1zm0 13.5c-1.1-.35-2.3-.5-3.5-.5-1.7 0-4.15.65-5.5 1.5V8c1.35-.85 3.8-1.5 5.5-1.5 1.2 0 2.4.15 3.5.5v11.5z"},"child":[]},{"tag":"path","attr":{"d":"M17.5 10.5c.88 0 1.73.09 2.5.26V9.24c-.79-.15-1.64-.24-2.5-.24-1.7 0-3.24.29-4.5.83v1.66c1.13-.64 2.7-.99 4.5-.99zM13 12.49v1.66c1.13-.64 2.7-.99 4.5-.99.88 0 1.73.09 2.5.26V11.9c-.79-.15-1.64-.24-2.5-.24-1.7 0-3.24.3-4.5.83zM17.5 14.33c-1.7 0-3.24.29-4.5.83v1.66c1.13-.64 2.7-.99 4.5-.99.88 0 1.73.09 2.5.26v-1.52c-.79-.16-1.64-.24-2.5-.24z"},"child":[]}]})(props);
|
|
578
|
-
}
|
|
579
|
-
|
|
580
456
|
var TableHeader = function TableHeader(_ref) {
|
|
581
457
|
var name = _ref.name,
|
|
582
458
|
_ref$freeActions = _ref.freeActions,
|
|
583
459
|
freeActions = _ref$freeActions === void 0 ? [] : _ref$freeActions,
|
|
584
460
|
getState = _ref.getState,
|
|
585
461
|
hasTheme = _ref.hasTheme,
|
|
586
|
-
getCSSVariable = _ref.getCSSVariable
|
|
462
|
+
getCSSVariable = _ref.getCSSVariable,
|
|
463
|
+
_ref$isCollapsed = _ref.isCollapsed,
|
|
464
|
+
isCollapsed = _ref$isCollapsed === void 0 ? false : _ref$isCollapsed,
|
|
465
|
+
onToggleCollapse = _ref.onToggleCollapse,
|
|
466
|
+
_ref$collapsible = _ref.collapsible,
|
|
467
|
+
collapsible = _ref$collapsible === void 0 ? true : _ref$collapsible;
|
|
587
468
|
var hasFreeActions = freeActions.length > 0;
|
|
588
469
|
|
|
589
470
|
// 如果沒有名稱也沒有 freeActions，不渲染任何內容
|
|
@@ -592,17 +473,29 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
592
473
|
}
|
|
593
474
|
return /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
594
475
|
className: "udi-table-header",
|
|
595
|
-
children: [name && /*#__PURE__*/jsxRuntime.
|
|
476
|
+
children: [name && /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
596
477
|
className: "udi-table-name",
|
|
597
478
|
style: {
|
|
598
479
|
display: hasFreeActions ? "inline-block" : "block"
|
|
599
480
|
},
|
|
600
|
-
children: /*#__PURE__*/jsxRuntime.jsx("
|
|
481
|
+
children: [collapsible && onToggleCollapse && /*#__PURE__*/jsxRuntime.jsx("button", {
|
|
482
|
+
className: "udi-table-collapse-button",
|
|
483
|
+
onClick: onToggleCollapse,
|
|
484
|
+
title: isCollapsed ? "展開表格" : "摺疊表格",
|
|
485
|
+
style: hasTheme ? {
|
|
486
|
+
color: getCSSVariable('--color-text-primary')
|
|
487
|
+
} : {},
|
|
488
|
+
children: isCollapsed ? /*#__PURE__*/jsxRuntime.jsx(md.MdExpandMore, {
|
|
489
|
+
size: 20
|
|
490
|
+
}) : /*#__PURE__*/jsxRuntime.jsx(md.MdExpandLess, {
|
|
491
|
+
size: 20
|
|
492
|
+
})
|
|
493
|
+
}), /*#__PURE__*/jsxRuntime.jsx("h3", {
|
|
601
494
|
style: hasTheme ? {
|
|
602
495
|
color: getCSSVariable('--color-text-primary')
|
|
603
496
|
} : {},
|
|
604
497
|
children: name
|
|
605
|
-
})
|
|
498
|
+
})]
|
|
606
499
|
}), hasFreeActions && /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
607
500
|
className: "udi-table-free-actions",
|
|
608
501
|
style: {
|
|
@@ -620,7 +513,7 @@ var TableHeader = function TableHeader(_ref) {
|
|
|
620
513
|
className: "udi-table-free-action-button",
|
|
621
514
|
style: _objectSpread2({}, action.style),
|
|
622
515
|
disabled: action.disabled,
|
|
623
|
-
children: action.icon ? action.icon : action.label ? action.label : /*#__PURE__*/jsxRuntime.jsx(MdOutlineMenuBook, {})
|
|
516
|
+
children: action.icon ? action.icon : action.label ? action.label : /*#__PURE__*/jsxRuntime.jsx(md.MdOutlineMenuBook, {})
|
|
624
517
|
}, index);
|
|
625
518
|
})
|
|
626
519
|
})]
|
|
@@ -942,29 +835,29 @@ function useDataRequest(_ref) {
|
|
|
942
835
|
_ref$isDev = _ref.isDev,
|
|
943
836
|
isDev = _ref$isDev === void 0 ? false : _ref$isDev;
|
|
944
837
|
// 資料狀態
|
|
945
|
-
var _useState =
|
|
838
|
+
var _useState = react.useState([]),
|
|
946
839
|
_useState2 = _slicedToArray(_useState, 2),
|
|
947
840
|
data = _useState2[0],
|
|
948
841
|
setData = _useState2[1];
|
|
949
|
-
var _useState3 =
|
|
842
|
+
var _useState3 = react.useState(false),
|
|
950
843
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
951
844
|
loading = _useState4[0],
|
|
952
845
|
setLoading = _useState4[1];
|
|
953
|
-
var _useState5 =
|
|
846
|
+
var _useState5 = react.useState(0),
|
|
954
847
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
955
848
|
totalCount = _useState6[0],
|
|
956
849
|
setTotalCount = _useState6[1];
|
|
957
|
-
var _useState7 =
|
|
850
|
+
var _useState7 = react.useState(null),
|
|
958
851
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
959
852
|
error = _useState8[0],
|
|
960
853
|
setError = _useState8[1];
|
|
961
|
-
var _useState9 =
|
|
854
|
+
var _useState9 = react.useState(false),
|
|
962
855
|
_useState0 = _slicedToArray(_useState9, 2),
|
|
963
856
|
isInfiniteScroll = _useState0[0],
|
|
964
857
|
setIsInfiniteScroll = _useState0[1];
|
|
965
858
|
|
|
966
859
|
// 執行資料請求
|
|
967
|
-
var executeDataRequest =
|
|
860
|
+
var executeDataRequest = react.useCallback(/*#__PURE__*/function () {
|
|
968
861
|
var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(params) {
|
|
969
862
|
var result, responseData, _t, _t2;
|
|
970
863
|
return _regenerator().w(function (_context) {
|
|
@@ -1032,7 +925,7 @@ function useDataRequest(_ref) {
|
|
|
1032
925
|
}(), [onDataRequest, isInfiniteScroll, isDev]);
|
|
1033
926
|
|
|
1034
927
|
// 防抖的請求執行
|
|
1035
|
-
var debouncedDataRequest =
|
|
928
|
+
var debouncedDataRequest = react.useMemo(function () {
|
|
1036
929
|
var timeoutId;
|
|
1037
930
|
return function (params) {
|
|
1038
931
|
clearTimeout(timeoutId);
|
|
@@ -1043,7 +936,7 @@ function useDataRequest(_ref) {
|
|
|
1043
936
|
}, [executeDataRequest]);
|
|
1044
937
|
|
|
1045
938
|
// 初始載入
|
|
1046
|
-
var initialLoad =
|
|
939
|
+
var initialLoad = react.useCallback(function (currentPageSize) {
|
|
1047
940
|
if (onDataRequest) {
|
|
1048
941
|
var params = {
|
|
1049
942
|
page: 0,
|
|
@@ -1059,7 +952,7 @@ function useDataRequest(_ref) {
|
|
|
1059
952
|
}, [onDataRequest, executeDataRequest]);
|
|
1060
953
|
|
|
1061
954
|
// 重置資料
|
|
1062
|
-
var resetData =
|
|
955
|
+
var resetData = react.useCallback(function () {
|
|
1063
956
|
setData([]);
|
|
1064
957
|
setTotalCount(0);
|
|
1065
958
|
setError(null);
|
|
@@ -1097,7 +990,7 @@ function useTableScroll() {
|
|
|
1097
990
|
_ref$data = _ref.data,
|
|
1098
991
|
data = _ref$data === void 0 ? [] : _ref$data;
|
|
1099
992
|
// 滾動位置狀態
|
|
1100
|
-
var _useState =
|
|
993
|
+
var _useState = react.useState({
|
|
1101
994
|
top: 0,
|
|
1102
995
|
left: 0,
|
|
1103
996
|
verticalPercent: 0,
|
|
@@ -1108,7 +1001,7 @@ function useTableScroll() {
|
|
|
1108
1001
|
setScrollPosition = _useState2[1];
|
|
1109
1002
|
|
|
1110
1003
|
// 滾動條資訊
|
|
1111
|
-
var _useState3 =
|
|
1004
|
+
var _useState3 = react.useState({
|
|
1112
1005
|
hasHorizontal: false,
|
|
1113
1006
|
hasVertical: false,
|
|
1114
1007
|
maxScrollLeft: 0,
|
|
@@ -1119,10 +1012,10 @@ function useTableScroll() {
|
|
|
1119
1012
|
setScrollbarInfo = _useState4[1];
|
|
1120
1013
|
|
|
1121
1014
|
// 表格容器 ref
|
|
1122
|
-
var tableWrapperRef =
|
|
1015
|
+
var tableWrapperRef = react.useRef(null);
|
|
1123
1016
|
|
|
1124
1017
|
// 滾動事件處理（使用 throttle）
|
|
1125
|
-
|
|
1018
|
+
react.useEffect(function () {
|
|
1126
1019
|
var tableWrapper = tableWrapperRef.current;
|
|
1127
1020
|
if (!tableWrapper) return;
|
|
1128
1021
|
|
|
@@ -1203,7 +1096,7 @@ function useTableScroll() {
|
|
|
1203
1096
|
}, [data]); // 當數據變化時重新初始化
|
|
1204
1097
|
|
|
1205
1098
|
// 滾動控制函數
|
|
1206
|
-
var scrollControl =
|
|
1099
|
+
var scrollControl = react.useCallback(function (axis, value) {
|
|
1207
1100
|
var tableWrapper = tableWrapperRef.current;
|
|
1208
1101
|
if (!tableWrapper) return;
|
|
1209
1102
|
var maxScrollTop = tableWrapper.scrollHeight - tableWrapper.clientHeight;
|
|
@@ -1217,7 +1110,7 @@ function useTableScroll() {
|
|
|
1217
1110
|
}, []);
|
|
1218
1111
|
|
|
1219
1112
|
// 便捷滾動方法
|
|
1220
|
-
var scrollTo =
|
|
1113
|
+
var scrollTo = react.useCallback(function () {
|
|
1221
1114
|
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
1222
1115
|
var top = options.top,
|
|
1223
1116
|
left = options.left;
|
|
@@ -1226,31 +1119,31 @@ function useTableScroll() {
|
|
|
1226
1119
|
}, [scrollControl]);
|
|
1227
1120
|
|
|
1228
1121
|
// 滾動到頂部
|
|
1229
|
-
var scrollToTop =
|
|
1122
|
+
var scrollToTop = react.useCallback(function () {
|
|
1230
1123
|
scrollControl("top", 0);
|
|
1231
1124
|
}, [scrollControl]);
|
|
1232
1125
|
|
|
1233
1126
|
// 滾動到底部
|
|
1234
|
-
var scrollToBottom =
|
|
1127
|
+
var scrollToBottom = react.useCallback(function () {
|
|
1235
1128
|
var tableWrapper = tableWrapperRef.current;
|
|
1236
1129
|
if (!tableWrapper) return;
|
|
1237
1130
|
scrollControl("top", tableWrapper.scrollHeight);
|
|
1238
1131
|
}, [scrollControl]);
|
|
1239
1132
|
|
|
1240
1133
|
// 滾動到最左邊
|
|
1241
|
-
var scrollToLeft =
|
|
1134
|
+
var scrollToLeft = react.useCallback(function () {
|
|
1242
1135
|
scrollControl("left", 0);
|
|
1243
1136
|
}, [scrollControl]);
|
|
1244
1137
|
|
|
1245
1138
|
// 滾動到最右邊
|
|
1246
|
-
var scrollToRight =
|
|
1139
|
+
var scrollToRight = react.useCallback(function () {
|
|
1247
1140
|
var tableWrapper = tableWrapperRef.current;
|
|
1248
1141
|
if (!tableWrapper) return;
|
|
1249
1142
|
scrollControl("left", tableWrapper.scrollWidth);
|
|
1250
1143
|
}, [scrollControl]);
|
|
1251
1144
|
|
|
1252
1145
|
// 取得滾動狀態
|
|
1253
|
-
var getScrollState =
|
|
1146
|
+
var getScrollState = react.useCallback(function () {
|
|
1254
1147
|
return _objectSpread2(_objectSpread2(_objectSpread2({}, scrollPosition), scrollbarInfo), {}, {
|
|
1255
1148
|
isAtTop: scrollPosition.verticalPercent === 0,
|
|
1256
1149
|
isAtBottom: scrollPosition.verticalPercent === 100,
|
|
@@ -1288,39 +1181,39 @@ function useTableFilter() {
|
|
|
1288
1181
|
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
1289
1182
|
onFilterChange = _ref.onFilterChange;
|
|
1290
1183
|
// 基本篩選狀態
|
|
1291
|
-
var _useState =
|
|
1184
|
+
var _useState = react.useState(""),
|
|
1292
1185
|
_useState2 = _slicedToArray(_useState, 2),
|
|
1293
1186
|
filterText = _useState2[0],
|
|
1294
1187
|
setFilterText = _useState2[1];
|
|
1295
|
-
var _useState3 =
|
|
1188
|
+
var _useState3 = react.useState("all"),
|
|
1296
1189
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
1297
1190
|
filterColumn = _useState4[0],
|
|
1298
1191
|
setFilterColumn = _useState4[1];
|
|
1299
1192
|
|
|
1300
1193
|
// 進階篩選狀態
|
|
1301
|
-
var _useState5 =
|
|
1194
|
+
var _useState5 = react.useState(false),
|
|
1302
1195
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
1303
1196
|
showAdvancedFilter = _useState6[0],
|
|
1304
1197
|
setShowAdvancedFilter = _useState6[1];
|
|
1305
|
-
var _useState7 =
|
|
1198
|
+
var _useState7 = react.useState({}),
|
|
1306
1199
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
1307
1200
|
advancedFilters = _useState8[0],
|
|
1308
1201
|
setAdvancedFilters = _useState8[1];
|
|
1309
1202
|
|
|
1310
1203
|
// 更新篩選文字
|
|
1311
|
-
var updateFilterText =
|
|
1204
|
+
var updateFilterText = react.useCallback(function (value) {
|
|
1312
1205
|
setFilterText(value);
|
|
1313
1206
|
onFilterChange === null || onFilterChange === void 0 || onFilterChange();
|
|
1314
1207
|
}, [onFilterChange]);
|
|
1315
1208
|
|
|
1316
1209
|
// 更新篩選欄位
|
|
1317
|
-
var updateFilterColumn =
|
|
1210
|
+
var updateFilterColumn = react.useCallback(function (value) {
|
|
1318
1211
|
setFilterColumn(value);
|
|
1319
1212
|
onFilterChange === null || onFilterChange === void 0 || onFilterChange();
|
|
1320
1213
|
}, [onFilterChange]);
|
|
1321
1214
|
|
|
1322
1215
|
// 重置所有篩選
|
|
1323
|
-
var resetFilter =
|
|
1216
|
+
var resetFilter = react.useCallback(function () {
|
|
1324
1217
|
setFilterText("");
|
|
1325
1218
|
setFilterColumn("all");
|
|
1326
1219
|
setAdvancedFilters({});
|
|
@@ -1328,21 +1221,21 @@ function useTableFilter() {
|
|
|
1328
1221
|
}, [onFilterChange]);
|
|
1329
1222
|
|
|
1330
1223
|
// 處理進階篩選變更
|
|
1331
|
-
var handleAdvancedFilterChange =
|
|
1224
|
+
var handleAdvancedFilterChange = react.useCallback(function (columnKey, value) {
|
|
1332
1225
|
setAdvancedFilters(function (prev) {
|
|
1333
|
-
return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty
|
|
1226
|
+
return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty({}, columnKey, value));
|
|
1334
1227
|
});
|
|
1335
1228
|
onFilterChange === null || onFilterChange === void 0 || onFilterChange();
|
|
1336
1229
|
}, [onFilterChange]);
|
|
1337
1230
|
|
|
1338
1231
|
// 清除進階篩選
|
|
1339
|
-
var clearAdvancedFilters =
|
|
1232
|
+
var clearAdvancedFilters = react.useCallback(function () {
|
|
1340
1233
|
setAdvancedFilters({});
|
|
1341
1234
|
onFilterChange === null || onFilterChange === void 0 || onFilterChange();
|
|
1342
1235
|
}, [onFilterChange]);
|
|
1343
1236
|
|
|
1344
1237
|
// 切換進階篩選顯示
|
|
1345
|
-
var toggleAdvancedFilter =
|
|
1238
|
+
var toggleAdvancedFilter = react.useCallback(function () {
|
|
1346
1239
|
setShowAdvancedFilter(function (prev) {
|
|
1347
1240
|
return !prev;
|
|
1348
1241
|
});
|
|
@@ -1359,7 +1252,7 @@ function useTableFilter() {
|
|
|
1359
1252
|
}).length + (filterText ? 1 : 0);
|
|
1360
1253
|
|
|
1361
1254
|
// 取得篩選狀態
|
|
1362
|
-
var getFilterState =
|
|
1255
|
+
var getFilterState = react.useCallback(function () {
|
|
1363
1256
|
return {
|
|
1364
1257
|
filterText: filterText,
|
|
1365
1258
|
filterColumn: filterColumn,
|
|
@@ -1414,23 +1307,23 @@ function useResponsive() {
|
|
|
1414
1307
|
mobileBreakpoint = _ref$mobileBreakpoint === void 0 ? 768 : _ref$mobileBreakpoint,
|
|
1415
1308
|
_ref$tabletBreakpoint = _ref.tabletBreakpoint,
|
|
1416
1309
|
tabletBreakpoint = _ref$tabletBreakpoint === void 0 ? 992 : _ref$tabletBreakpoint;
|
|
1417
|
-
var _useState =
|
|
1310
|
+
var _useState = react.useState(false),
|
|
1418
1311
|
_useState2 = _slicedToArray(_useState, 2),
|
|
1419
1312
|
isMobile = _useState2[0],
|
|
1420
1313
|
setIsMobile = _useState2[1];
|
|
1421
|
-
var _useState3 =
|
|
1314
|
+
var _useState3 = react.useState(false),
|
|
1422
1315
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
1423
1316
|
isTablet = _useState4[0],
|
|
1424
1317
|
setIsTablet = _useState4[1];
|
|
1425
|
-
var _useState5 =
|
|
1318
|
+
var _useState5 = react.useState(typeof window !== "undefined" ? window.innerWidth : 0),
|
|
1426
1319
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
1427
1320
|
screenWidth = _useState6[0],
|
|
1428
1321
|
setScreenWidth = _useState6[1];
|
|
1429
|
-
var _useState7 =
|
|
1322
|
+
var _useState7 = react.useState(typeof window !== "undefined" ? window.innerHeight : 0),
|
|
1430
1323
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
1431
1324
|
screenHeight = _useState8[0],
|
|
1432
1325
|
setScreenHeight = _useState8[1];
|
|
1433
|
-
|
|
1326
|
+
react.useEffect(function () {
|
|
1434
1327
|
var checkScreenSize = function checkScreenSize() {
|
|
1435
1328
|
var width = window.innerWidth;
|
|
1436
1329
|
var height = window.innerHeight;
|
|
@@ -1454,7 +1347,7 @@ function useResponsive() {
|
|
|
1454
1347
|
var isDesktop = !isMobile && !isTablet;
|
|
1455
1348
|
|
|
1456
1349
|
// 取得響應式狀態
|
|
1457
|
-
var getResponsiveState =
|
|
1350
|
+
var getResponsiveState = react.useCallback(function () {
|
|
1458
1351
|
return {
|
|
1459
1352
|
isMobile: isMobile,
|
|
1460
1353
|
isTablet: isTablet,
|
|
@@ -1490,7 +1383,7 @@ function useTableSort() {
|
|
|
1490
1383
|
sortable = _ref$sortable === void 0 ? true : _ref$sortable,
|
|
1491
1384
|
onSortChange = _ref.onSortChange;
|
|
1492
1385
|
// 排序狀態
|
|
1493
|
-
var _useState =
|
|
1386
|
+
var _useState = react.useState({
|
|
1494
1387
|
key: null,
|
|
1495
1388
|
direction: "asc"
|
|
1496
1389
|
}),
|
|
@@ -1499,7 +1392,7 @@ function useTableSort() {
|
|
|
1499
1392
|
setSortConfig = _useState2[1];
|
|
1500
1393
|
|
|
1501
1394
|
// 處理排序
|
|
1502
|
-
var handleSort =
|
|
1395
|
+
var handleSort = react.useCallback(function (key) {
|
|
1503
1396
|
if (!sortable) return;
|
|
1504
1397
|
setSortConfig(function (prev) {
|
|
1505
1398
|
var direction = "asc";
|
|
@@ -1515,7 +1408,7 @@ function useTableSort() {
|
|
|
1515
1408
|
}, [sortable, onSortChange]);
|
|
1516
1409
|
|
|
1517
1410
|
// 重置排序
|
|
1518
|
-
var resetSort =
|
|
1411
|
+
var resetSort = react.useCallback(function () {
|
|
1519
1412
|
setSortConfig({
|
|
1520
1413
|
key: null,
|
|
1521
1414
|
direction: "asc"
|
|
@@ -1524,7 +1417,7 @@ function useTableSort() {
|
|
|
1524
1417
|
}, [onSortChange]);
|
|
1525
1418
|
|
|
1526
1419
|
// 設定排序
|
|
1527
|
-
var setSort =
|
|
1420
|
+
var setSort = react.useCallback(function (key) {
|
|
1528
1421
|
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "asc";
|
|
1529
1422
|
setSortConfig({
|
|
1530
1423
|
key: key,
|
|
@@ -1534,7 +1427,7 @@ function useTableSort() {
|
|
|
1534
1427
|
}, [onSortChange]);
|
|
1535
1428
|
|
|
1536
1429
|
// 切換排序方向
|
|
1537
|
-
var toggleSortDirection =
|
|
1430
|
+
var toggleSortDirection = react.useCallback(function () {
|
|
1538
1431
|
setSortConfig(function (prev) {
|
|
1539
1432
|
return _objectSpread2(_objectSpread2({}, prev), {}, {
|
|
1540
1433
|
direction: prev.direction === "asc" ? "desc" : "asc"
|
|
@@ -1549,7 +1442,7 @@ function useTableSort() {
|
|
|
1549
1442
|
var sortOrder = sortConfig.direction;
|
|
1550
1443
|
|
|
1551
1444
|
// 取得排序狀態
|
|
1552
|
-
var getSortState =
|
|
1445
|
+
var getSortState = react.useCallback(function () {
|
|
1553
1446
|
return {
|
|
1554
1447
|
sortConfig: sortConfig,
|
|
1555
1448
|
sortBy: sortBy,
|
|
@@ -1606,7 +1499,7 @@ var useTableDimensions = function useTableDimensions(_ref) {
|
|
|
1606
1499
|
* 計算每個欄位的實際寬度
|
|
1607
1500
|
* @returns {Object|null} 欄位寬度映射 { columnId: widthInPx } 或 null（不啟用時）
|
|
1608
1501
|
*/
|
|
1609
|
-
var calculateColumnWidths =
|
|
1502
|
+
var calculateColumnWidths = react.useMemo(function () {
|
|
1610
1503
|
// 如果沒有啟用自動寬度，返回 null（使用舊邏輯）
|
|
1611
1504
|
if (!enableAutoWidth) return null;
|
|
1612
1505
|
|
|
@@ -1673,7 +1566,7 @@ var useTableDimensions = function useTableDimensions(_ref) {
|
|
|
1673
1566
|
* @param {number} singleSize - 單獨尺寸
|
|
1674
1567
|
* @returns {string} CSS 尺寸值
|
|
1675
1568
|
*/
|
|
1676
|
-
var calculateSize =
|
|
1569
|
+
var calculateSize = react.useCallback(function (mainSize, singleSize) {
|
|
1677
1570
|
if (singleSize) return "".concat(singleSize, "px");
|
|
1678
1571
|
if (mainSize) return "".concat(mainSize, "px");
|
|
1679
1572
|
return "auto";
|
|
@@ -1684,7 +1577,7 @@ var useTableDimensions = function useTableDimensions(_ref) {
|
|
|
1684
1577
|
* @param {number} singleRowHeight - 單獨行高
|
|
1685
1578
|
* @returns {string} CSS 高度值
|
|
1686
1579
|
*/
|
|
1687
|
-
var rowHeight =
|
|
1580
|
+
var rowHeight = react.useCallback(function (singleRowHeight) {
|
|
1688
1581
|
return calculateSize(mainRowHeight, singleRowHeight);
|
|
1689
1582
|
}, [mainRowHeight, calculateSize]);
|
|
1690
1583
|
|
|
@@ -1693,7 +1586,7 @@ var useTableDimensions = function useTableDimensions(_ref) {
|
|
|
1693
1586
|
* @param {number} singleColumnWidth - 單獨欄位寬度
|
|
1694
1587
|
* @returns {string} CSS 寬度值
|
|
1695
1588
|
*/
|
|
1696
|
-
var columnWidth =
|
|
1589
|
+
var columnWidth = react.useCallback(function (singleColumnWidth) {
|
|
1697
1590
|
return calculateSize(mainColumnWidth, singleColumnWidth);
|
|
1698
1591
|
}, [mainColumnWidth, calculateSize]);
|
|
1699
1592
|
|
|
@@ -1704,7 +1597,7 @@ var useTableDimensions = function useTableDimensions(_ref) {
|
|
|
1704
1597
|
* @param {boolean} options.isTitle - 是否為標題列
|
|
1705
1598
|
* @returns {Object} CSS 尺寸物件
|
|
1706
1599
|
*/
|
|
1707
|
-
var getGridSize =
|
|
1600
|
+
var getGridSize = react.useCallback(function (column) {
|
|
1708
1601
|
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
1709
1602
|
var _options$isTitle = options.isTitle,
|
|
1710
1603
|
isTitle = _options$isTitle === void 0 ? false : _options$isTitle;
|
|
@@ -1780,38 +1673,38 @@ var useTablePagination = function useTablePagination(_ref) {
|
|
|
1780
1673
|
_ref$totalCount = _ref.totalCount,
|
|
1781
1674
|
totalCount = _ref$totalCount === void 0 ? 0 : _ref$totalCount;
|
|
1782
1675
|
// 分頁狀態 (使用 0-based index)
|
|
1783
|
-
var _useState =
|
|
1676
|
+
var _useState = react.useState(0),
|
|
1784
1677
|
_useState2 = _slicedToArray(_useState, 2),
|
|
1785
1678
|
currentPage = _useState2[0],
|
|
1786
1679
|
setCurrentPage = _useState2[1];
|
|
1787
|
-
var _useState3 =
|
|
1680
|
+
var _useState3 = react.useState(pageSize),
|
|
1788
1681
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
1789
1682
|
currentPageSize = _useState4[0],
|
|
1790
1683
|
setCurrentPageSize = _useState4[1];
|
|
1791
1684
|
|
|
1792
1685
|
// 計算總頁數
|
|
1793
|
-
var totalPages =
|
|
1686
|
+
var totalPages = react.useMemo(function () {
|
|
1794
1687
|
return Math.ceil(totalCount / currentPageSize);
|
|
1795
1688
|
}, [totalCount, currentPageSize]);
|
|
1796
1689
|
|
|
1797
1690
|
// 分頁處理
|
|
1798
|
-
var handlePageChange =
|
|
1691
|
+
var handlePageChange = react.useCallback(function (page) {
|
|
1799
1692
|
setCurrentPage(page);
|
|
1800
1693
|
}, []);
|
|
1801
1694
|
|
|
1802
1695
|
// 處理每頁顯示數量變更
|
|
1803
|
-
var handlePageSizeChange =
|
|
1696
|
+
var handlePageSizeChange = react.useCallback(function (newPageSize) {
|
|
1804
1697
|
setCurrentPageSize(newPageSize);
|
|
1805
1698
|
setCurrentPage(0); // 重置到第一頁
|
|
1806
1699
|
}, []);
|
|
1807
1700
|
|
|
1808
1701
|
// 重置分頁到第一頁
|
|
1809
|
-
var resetToFirstPage =
|
|
1702
|
+
var resetToFirstPage = react.useCallback(function () {
|
|
1810
1703
|
setCurrentPage(0);
|
|
1811
1704
|
}, []);
|
|
1812
1705
|
|
|
1813
1706
|
// 分頁資訊（供外部使用）
|
|
1814
|
-
var paginationInfo =
|
|
1707
|
+
var paginationInfo = react.useMemo(function () {
|
|
1815
1708
|
return {
|
|
1816
1709
|
currentPage: currentPage,
|
|
1817
1710
|
currentPageSize: currentPageSize,
|
|
@@ -1909,7 +1802,7 @@ var useTableApi = function useTableApi(_ref) {
|
|
|
1909
1802
|
return null;
|
|
1910
1803
|
}
|
|
1911
1804
|
} : _ref$themeState;
|
|
1912
|
-
|
|
1805
|
+
react.useImperativeHandle(ref, function () {
|
|
1913
1806
|
return {
|
|
1914
1807
|
// ========== 數據操作方法 ==========
|
|
1915
1808
|
|
|
@@ -2151,17 +2044,17 @@ var useTableInteraction = function useTableInteraction(_ref) {
|
|
|
2151
2044
|
_ref$tableWrapperRef = _ref.tableWrapperRef,
|
|
2152
2045
|
tableWrapperRef = _ref$tableWrapperRef === void 0 ? null : _ref$tableWrapperRef;
|
|
2153
2046
|
// 互動狀態
|
|
2154
|
-
var _useState =
|
|
2047
|
+
var _useState = react.useState(false),
|
|
2155
2048
|
_useState2 = _slicedToArray(_useState, 2),
|
|
2156
2049
|
isHovered = _useState2[0],
|
|
2157
2050
|
setIsHovered = _useState2[1];
|
|
2158
|
-
var _useState3 =
|
|
2051
|
+
var _useState3 = react.useState(false),
|
|
2159
2052
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
2160
2053
|
isDropdownOpen = _useState4[0],
|
|
2161
2054
|
setIsDropdownOpen = _useState4[1];
|
|
2162
2055
|
|
|
2163
2056
|
// 滑鼠進入處理
|
|
2164
|
-
var handleMouseEnter =
|
|
2057
|
+
var handleMouseEnter = react.useCallback(function () {
|
|
2165
2058
|
setIsHovered(true);
|
|
2166
2059
|
if (syncTableControl && currentTableRef && tableWrapperRef) {
|
|
2167
2060
|
currentTableRef.current = tableWrapperRef.current;
|
|
@@ -2169,19 +2062,19 @@ var useTableInteraction = function useTableInteraction(_ref) {
|
|
|
2169
2062
|
}, [syncTableControl, currentTableRef, tableWrapperRef]);
|
|
2170
2063
|
|
|
2171
2064
|
// 滑鼠離開處理（延遲 200ms）
|
|
2172
|
-
var handleMouseLeave =
|
|
2065
|
+
var handleMouseLeave = react.useCallback(function () {
|
|
2173
2066
|
setTimeout(function () {
|
|
2174
2067
|
setIsHovered(false);
|
|
2175
2068
|
}, 200);
|
|
2176
2069
|
}, []);
|
|
2177
2070
|
|
|
2178
2071
|
// Dropdown 獲得焦點處理
|
|
2179
|
-
var handleDropdownFocus =
|
|
2072
|
+
var handleDropdownFocus = react.useCallback(function () {
|
|
2180
2073
|
setIsDropdownOpen(true);
|
|
2181
2074
|
}, []);
|
|
2182
2075
|
|
|
2183
2076
|
// Dropdown 失去焦點處理
|
|
2184
|
-
var handleDropdownBlur =
|
|
2077
|
+
var handleDropdownBlur = react.useCallback(function () {
|
|
2185
2078
|
setIsDropdownOpen(false);
|
|
2186
2079
|
}, []);
|
|
2187
2080
|
return {
|
|
@@ -2215,7 +2108,7 @@ var useTableInteraction = function useTableInteraction(_ref) {
|
|
|
2215
2108
|
function useThemeDetection() {
|
|
2216
2109
|
// SSR 保護：確保只在瀏覽器環境執行
|
|
2217
2110
|
var isBrowser = typeof window !== "undefined";
|
|
2218
|
-
var _useState =
|
|
2111
|
+
var _useState = react.useState({
|
|
2219
2112
|
hasTheme: false,
|
|
2220
2113
|
// 是否存在主題系統
|
|
2221
2114
|
themeId: null,
|
|
@@ -2232,7 +2125,7 @@ function useThemeDetection() {
|
|
|
2232
2125
|
* @param {string} fallback - 預設值（如果找不到 CSS 變數）
|
|
2233
2126
|
* @returns {string} - CSS 變數值或預設值
|
|
2234
2127
|
*/
|
|
2235
|
-
var getCSSVariable =
|
|
2128
|
+
var getCSSVariable = react.useCallback(function (varName) {
|
|
2236
2129
|
var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
2237
2130
|
if (!isBrowser) return fallback;
|
|
2238
2131
|
try {
|
|
@@ -2248,7 +2141,7 @@ function useThemeDetection() {
|
|
|
2248
2141
|
* 偵測主題系統是否存在
|
|
2249
2142
|
* @returns {Object} - 主題資訊
|
|
2250
2143
|
*/
|
|
2251
|
-
var detectTheme =
|
|
2144
|
+
var detectTheme = react.useCallback(function () {
|
|
2252
2145
|
if (!isBrowser) {
|
|
2253
2146
|
return {
|
|
2254
2147
|
hasTheme: false,
|
|
@@ -2275,7 +2168,7 @@ function useThemeDetection() {
|
|
|
2275
2168
|
/**
|
|
2276
2169
|
* 初始化：偵測主題並設置監聽器
|
|
2277
2170
|
*/
|
|
2278
|
-
|
|
2171
|
+
react.useEffect(function () {
|
|
2279
2172
|
if (!isBrowser) return;
|
|
2280
2173
|
|
|
2281
2174
|
// 初始偵測
|
|
@@ -2308,7 +2201,7 @@ function useThemeDetection() {
|
|
|
2308
2201
|
* 取得完整主題資訊（包含所有主題色彩）
|
|
2309
2202
|
* @returns {Object} - 完整的主題資訊
|
|
2310
2203
|
*/
|
|
2311
|
-
var getThemeInfo =
|
|
2204
|
+
var getThemeInfo = react.useCallback(function () {
|
|
2312
2205
|
if (!themeState.hasTheme) {
|
|
2313
2206
|
return {
|
|
2314
2207
|
hasTheme: false,
|
|
@@ -2356,7 +2249,7 @@ function useThemeDetection() {
|
|
|
2356
2249
|
};
|
|
2357
2250
|
}
|
|
2358
2251
|
|
|
2359
|
-
var UdiTable = /*#__PURE__*/
|
|
2252
|
+
var UdiTable = /*#__PURE__*/react.forwardRef(function (_ref, ref) {
|
|
2360
2253
|
var _ref$current;
|
|
2361
2254
|
var _ref$onDataRequest = _ref.onDataRequest,
|
|
2362
2255
|
onDataRequest = _ref$onDataRequest === void 0 ? null : _ref$onDataRequest,
|
|
@@ -2394,7 +2287,24 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2394
2287
|
_ref$enableAutoWidth = _ref.enableAutoWidth,
|
|
2395
2288
|
enableAutoWidth = _ref$enableAutoWidth === void 0 ? false : _ref$enableAutoWidth,
|
|
2396
2289
|
_ref$tableContainerWi = _ref.tableContainerWidth,
|
|
2397
|
-
tableContainerWidth = _ref$tableContainerWi === void 0 ? 1000 : _ref$tableContainerWi
|
|
2290
|
+
tableContainerWidth = _ref$tableContainerWi === void 0 ? 1000 : _ref$tableContainerWi,
|
|
2291
|
+
_ref$collapsible = _ref.collapsible,
|
|
2292
|
+
collapsible = _ref$collapsible === void 0 ? false : _ref$collapsible,
|
|
2293
|
+
_ref$defaultCollapsed = _ref.defaultCollapsed,
|
|
2294
|
+
defaultCollapsed = _ref$defaultCollapsed === void 0 ? false : _ref$defaultCollapsed;
|
|
2295
|
+
// 摺疊狀態
|
|
2296
|
+
var _useState = react.useState(defaultCollapsed),
|
|
2297
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
2298
|
+
isCollapsed = _useState2[0],
|
|
2299
|
+
setIsCollapsed = _useState2[1];
|
|
2300
|
+
|
|
2301
|
+
// 切換摺疊狀態
|
|
2302
|
+
var handleToggleCollapse = function handleToggleCollapse() {
|
|
2303
|
+
setIsCollapsed(function (prev) {
|
|
2304
|
+
return !prev;
|
|
2305
|
+
});
|
|
2306
|
+
};
|
|
2307
|
+
|
|
2398
2308
|
// 使用 useThemeDetection hook 偵測主題系統
|
|
2399
2309
|
var _useThemeDetection = useThemeDetection(),
|
|
2400
2310
|
hasTheme = _useThemeDetection.hasTheme,
|
|
@@ -2404,7 +2314,7 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2404
2314
|
getThemeInfo = _useThemeDetection.getThemeInfo;
|
|
2405
2315
|
|
|
2406
2316
|
// 開發模式下顯示主題偵測資訊
|
|
2407
|
-
|
|
2317
|
+
react.useEffect(function () {
|
|
2408
2318
|
if (isDev) {
|
|
2409
2319
|
console.log('🎨 UdiTable Theme Detection:', {
|
|
2410
2320
|
hasTheme: hasTheme,
|
|
@@ -2509,9 +2419,9 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2509
2419
|
handleDropdownBlur = _useTableInteraction.handleDropdownBlur;
|
|
2510
2420
|
|
|
2511
2421
|
//===========
|
|
2512
|
-
|
|
2422
|
+
react.useEffect(function () {
|
|
2513
2423
|
setTablePage === null || setTablePage === void 0 || setTablePage(function (prev) {
|
|
2514
|
-
return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty
|
|
2424
|
+
return _objectSpread2(_objectSpread2({}, prev), {}, _defineProperty(_defineProperty({}, "".concat(name, "Page"), currentPage), "".concat(name, "PageSize"), currentPageSize));
|
|
2515
2425
|
});
|
|
2516
2426
|
}, [currentPageSize, currentPage]);
|
|
2517
2427
|
|
|
@@ -2577,13 +2487,13 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2577
2487
|
|
|
2578
2488
|
// 初始載入
|
|
2579
2489
|
//=======
|
|
2580
|
-
|
|
2490
|
+
react.useEffect(function () {
|
|
2581
2491
|
initialLoad(currentPageSize);
|
|
2582
2492
|
}, []);
|
|
2583
2493
|
|
|
2584
2494
|
// 監聽篩選和排序變化
|
|
2585
2495
|
//=======
|
|
2586
|
-
|
|
2496
|
+
react.useEffect(function () {
|
|
2587
2497
|
if (!onDataRequest) return;
|
|
2588
2498
|
var params = {
|
|
2589
2499
|
page: currentPage,
|
|
@@ -2596,14 +2506,14 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2596
2506
|
};
|
|
2597
2507
|
debouncedDataRequest(params);
|
|
2598
2508
|
}, [currentPage, currentPageSize, filterText, filterColumn, advancedFilters, sortConfig]);
|
|
2599
|
-
var freeActions =
|
|
2509
|
+
var freeActions = react.useMemo(function () {
|
|
2600
2510
|
return actions.filter(function (action) {
|
|
2601
2511
|
return action.isFreeAction === true;
|
|
2602
2512
|
});
|
|
2603
2513
|
}, [actions]);
|
|
2604
2514
|
|
|
2605
2515
|
// 根據主題生成動態樣式
|
|
2606
|
-
var containerStyles =
|
|
2516
|
+
var containerStyles = react.useMemo(function () {
|
|
2607
2517
|
if (!hasTheme) {
|
|
2608
2518
|
// 沒有主題系統時，使用預設樣式（由 CSS 控制）
|
|
2609
2519
|
return {};
|
|
@@ -2623,9 +2533,12 @@ var UdiTable = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2623
2533
|
freeActions: freeActions,
|
|
2624
2534
|
getState: ref === null || ref === void 0 || (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.getState,
|
|
2625
2535
|
hasTheme: hasTheme,
|
|
2626
|
-
getCSSVariable: getCSSVariable
|
|
2536
|
+
getCSSVariable: getCSSVariable,
|
|
2537
|
+
isCollapsed: isCollapsed,
|
|
2538
|
+
onToggleCollapse: handleToggleCollapse,
|
|
2539
|
+
collapsible: collapsible
|
|
2627
2540
|
}), /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
2628
|
-
className: "udi-table-container ".concat(className),
|
|
2541
|
+
className: "udi-table-container ".concat(className, " ").concat(isCollapsed ? 'collapsed' : ''),
|
|
2629
2542
|
style: containerStyles,
|
|
2630
2543
|
onMouseEnter: handleMouseEnter,
|
|
2631
2544
|
onMouseLeave: handleMouseLeave,
|
|
@@ -2797,8 +2710,8 @@ var throttle$1 = function throttle(func, wait) {
|
|
|
2797
2710
|
* 控制滾動同步的內部 Hook
|
|
2798
2711
|
*/
|
|
2799
2712
|
var useControlScroll = function useControlScroll() {
|
|
2800
|
-
var rafId =
|
|
2801
|
-
return
|
|
2713
|
+
var rafId = react.useRef(null);
|
|
2714
|
+
return react.useCallback(function (sourceRef, targetRef) {
|
|
2802
2715
|
// 取消上一次的動畫幀
|
|
2803
2716
|
if (rafId.current) {
|
|
2804
2717
|
cancelAnimationFrame(rafId.current);
|
|
@@ -2878,10 +2791,10 @@ var useUdiTableSync$1 = function useUdiTableSync() {
|
|
|
2878
2791
|
_options$throttleMs = options.throttleMs,
|
|
2879
2792
|
throttleMs = _options$throttleMs === void 0 ? 10 : _options$throttleMs;
|
|
2880
2793
|
var controlScroll = useControlScroll();
|
|
2881
|
-
var mountedRef =
|
|
2794
|
+
var mountedRef = react.useRef(false);
|
|
2882
2795
|
|
|
2883
2796
|
// 分頁同步邏輯
|
|
2884
|
-
|
|
2797
|
+
react.useEffect(function () {
|
|
2885
2798
|
if (!enabled || !syncPagination) return;
|
|
2886
2799
|
if (!(importedTableRef !== null && importedTableRef !== void 0 && importedTableRef.current) || !(originalTableRef !== null && originalTableRef !== void 0 && originalTableRef.current)) return;
|
|
2887
2800
|
|
|
@@ -2889,7 +2802,7 @@ var useUdiTableSync$1 = function useUdiTableSync() {
|
|
|
2889
2802
|
controlPagination(importedTableRef, originalTableRef);
|
|
2890
2803
|
controlPagination(originalTableRef, importedTableRef);
|
|
2891
2804
|
}, [enabled, syncPagination, importedTableRef, originalTableRef].concat(_toConsumableArray(paginationDeps)));
|
|
2892
|
-
var handleTableMount =
|
|
2805
|
+
var handleTableMount = react.useCallback(function () {
|
|
2893
2806
|
var _importedTableRef$cur, _originalTableRef$cur;
|
|
2894
2807
|
var importedTableElement = importedTableRef === null || importedTableRef === void 0 || (_importedTableRef$cur = importedTableRef.current) === null || _importedTableRef$cur === void 0 ? void 0 : _importedTableRef$cur.getState().tableWrapperRef;
|
|
2895
2808
|
var originalTableElement = originalTableRef === null || originalTableRef === void 0 || (_originalTableRef$cur = originalTableRef.current) === null || _originalTableRef$cur === void 0 ? void 0 : _originalTableRef$cur.getState().tableWrapperRef;
|
|
@@ -2945,7 +2858,7 @@ var useUdiTableSync$1 = function useUdiTableSync() {
|
|
|
2945
2858
|
}, [importedTableRef, originalTableRef, controlScroll, correctionDelay, throttleMs]);
|
|
2946
2859
|
|
|
2947
2860
|
// 統一的掛載邏輯（帶重試機制）- 僅用於滾動同步
|
|
2948
|
-
|
|
2861
|
+
react.useEffect(function () {
|
|
2949
2862
|
if (!enabled || !syncScroll) {
|
|
2950
2863
|
return;
|
|
2951
2864
|
}
|
|
@@ -3105,20 +3018,20 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3105
3018
|
}
|
|
3106
3019
|
});
|
|
3107
3020
|
// 存儲所有已註冊的表格
|
|
3108
|
-
var registeredTablesRef =
|
|
3021
|
+
var registeredTablesRef = react.useRef(new Map());
|
|
3109
3022
|
// 存儲滾動處理函數
|
|
3110
|
-
var handlersRef =
|
|
3023
|
+
var handlersRef = react.useRef(new Map());
|
|
3111
3024
|
// 存儲修正 timer
|
|
3112
|
-
var timersRef =
|
|
3025
|
+
var timersRef = react.useRef(new Map());
|
|
3113
3026
|
// RAF ID
|
|
3114
|
-
var rafIdRef =
|
|
3027
|
+
var rafIdRef = react.useRef(null);
|
|
3115
3028
|
// 防止循環同步的鎖
|
|
3116
|
-
var isSyncingRef =
|
|
3029
|
+
var isSyncingRef = react.useRef(false);
|
|
3117
3030
|
|
|
3118
3031
|
/**
|
|
3119
3032
|
* 分頁同步邏輯 - 處理所有表格的分頁同步
|
|
3120
3033
|
*/
|
|
3121
|
-
|
|
3034
|
+
react.useEffect(function () {
|
|
3122
3035
|
if (!enabled || !syncPagination || tables.length < 2) return;
|
|
3123
3036
|
|
|
3124
3037
|
// 檢查所有表格的 ref 是否存在
|
|
@@ -3150,7 +3063,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3150
3063
|
/**
|
|
3151
3064
|
* 同步滾動位置到其他所有表格
|
|
3152
3065
|
*/
|
|
3153
|
-
var syncToOthers =
|
|
3066
|
+
var syncToOthers = react.useCallback(function (sourceId) {
|
|
3154
3067
|
if (!enabled || !syncScroll || isSyncingRef.current) return;
|
|
3155
3068
|
var sourceTable = registeredTablesRef.current.get(sourceId);
|
|
3156
3069
|
if (!sourceTable) return;
|
|
@@ -3201,7 +3114,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3201
3114
|
/**
|
|
3202
3115
|
* 註冊單個表格
|
|
3203
3116
|
*/
|
|
3204
|
-
var registerTable =
|
|
3117
|
+
var registerTable = react.useCallback(function (id, ref) {
|
|
3205
3118
|
var _ref$current;
|
|
3206
3119
|
if (!enabled || !syncScroll) {
|
|
3207
3120
|
console.warn("滾動同步未啟用");
|
|
@@ -3255,7 +3168,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3255
3168
|
/**
|
|
3256
3169
|
* 註銷單個表格
|
|
3257
3170
|
*/
|
|
3258
|
-
var unregisterTable =
|
|
3171
|
+
var unregisterTable = react.useCallback(function (id) {
|
|
3259
3172
|
var table = registeredTablesRef.current.get(id);
|
|
3260
3173
|
if (!table) return false;
|
|
3261
3174
|
var handler = handlersRef.current.get(id);
|
|
@@ -3283,7 +3196,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3283
3196
|
/**
|
|
3284
3197
|
* 帶重試機制的註冊
|
|
3285
3198
|
*/
|
|
3286
|
-
var registerWithRetry =
|
|
3199
|
+
var registerWithRetry = react.useCallback(function (id, ref) {
|
|
3287
3200
|
var retryCount = 0;
|
|
3288
3201
|
var retryTimer = null;
|
|
3289
3202
|
var _attemptRegister = function attemptRegister() {
|
|
@@ -3309,7 +3222,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3309
3222
|
/**
|
|
3310
3223
|
* 註冊所有表格（滾動同步）
|
|
3311
3224
|
*/
|
|
3312
|
-
|
|
3225
|
+
react.useEffect(function () {
|
|
3313
3226
|
if (!enabled || !syncScroll || tables.length === 0) {
|
|
3314
3227
|
return;
|
|
3315
3228
|
}
|
|
@@ -3334,7 +3247,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3334
3247
|
/**
|
|
3335
3248
|
* 組件卸載時清理所有資源
|
|
3336
3249
|
*/
|
|
3337
|
-
|
|
3250
|
+
react.useEffect(function () {
|
|
3338
3251
|
return function () {
|
|
3339
3252
|
// 取消 RAF
|
|
3340
3253
|
if (rafIdRef.current) {
|
|
@@ -3364,14 +3277,14 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3364
3277
|
/**
|
|
3365
3278
|
* 獲取已註冊的表格列表
|
|
3366
3279
|
*/
|
|
3367
|
-
var getRegisteredTables =
|
|
3280
|
+
var getRegisteredTables = react.useCallback(function () {
|
|
3368
3281
|
return Array.from(registeredTablesRef.current.keys());
|
|
3369
3282
|
}, []);
|
|
3370
3283
|
|
|
3371
3284
|
/**
|
|
3372
3285
|
* 手動觸發滾動同步
|
|
3373
3286
|
*/
|
|
3374
|
-
var manualSync =
|
|
3287
|
+
var manualSync = react.useCallback(function (sourceId) {
|
|
3375
3288
|
if (syncScroll) {
|
|
3376
3289
|
syncToOthers(sourceId);
|
|
3377
3290
|
}
|
|
@@ -3380,7 +3293,7 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3380
3293
|
/**
|
|
3381
3294
|
* 手動觸發分頁同步
|
|
3382
3295
|
*/
|
|
3383
|
-
var manualSyncPagination =
|
|
3296
|
+
var manualSyncPagination = react.useCallback(function () {
|
|
3384
3297
|
if (!syncPagination || tables.length < 2) return;
|
|
3385
3298
|
var hoveredTable = tables.find(function (table) {
|
|
3386
3299
|
var _table$ref3;
|
|
@@ -3405,17 +3318,244 @@ var useUdiTableSync = function useUdiTableSync() {
|
|
|
3405
3318
|
};
|
|
3406
3319
|
};
|
|
3407
3320
|
|
|
3408
|
-
function
|
|
3409
|
-
|
|
3321
|
+
function useDateRangePicker(tableRef, notify) {
|
|
3322
|
+
//============若未來沒bug的話可以刪除
|
|
3323
|
+
//
|
|
3324
|
+
// {{
|
|
3325
|
+
// const [startDate, setStartDate] = useState('');
|
|
3326
|
+
// const [endDate, setEndDate] = useState('');
|
|
3327
|
+
// const [startTimeStamp, setStartTimeStamp] = useState(0);
|
|
3328
|
+
// const [endTimeStamp, setEndTimeStamp] = useState(0);
|
|
3329
|
+
|
|
3330
|
+
//原訂功能:加載頁面後在useEffect中進行日期初始化後戳api,
|
|
3331
|
+
//修改原因:修改為直接在useState就初始化,而首次加載頁面本來就會戳api,應用不明
|
|
3332
|
+
|
|
3333
|
+
// const defaultSet = () => {
|
|
3334
|
+
// setStartDate(getStartOfDay);
|
|
3335
|
+
// setEndDate(getEndOfDay);
|
|
3336
|
+
// setStartTimeStamp(getStartOfDay.unix());
|
|
3337
|
+
// setEndTimeStamp(getEndOfDay.unix());
|
|
3338
|
+
// tableRef.current.onQueryChange();
|
|
3339
|
+
// };
|
|
3340
|
+
// }}
|
|
3341
|
+
|
|
3342
|
+
var getStartOfDay = moment().startOf('day');
|
|
3343
|
+
var getEndOfDay = moment().endOf('day');
|
|
3344
|
+
var _useState = react.useState(getStartOfDay),
|
|
3345
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
3346
|
+
startDate = _useState2[0],
|
|
3347
|
+
setStartDate = _useState2[1];
|
|
3348
|
+
var _useState3 = react.useState(getEndOfDay),
|
|
3349
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
3350
|
+
endDate = _useState4[0],
|
|
3351
|
+
setEndDate = _useState4[1];
|
|
3352
|
+
var _useState5 = react.useState(getStartOfDay.unix()),
|
|
3353
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
3354
|
+
startTimeStamp = _useState6[0],
|
|
3355
|
+
setStartTimeStamp = _useState6[1];
|
|
3356
|
+
var _useState7 = react.useState(getEndOfDay.unix()),
|
|
3357
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
3358
|
+
endTimeStamp = _useState8[0],
|
|
3359
|
+
setEndTimeStamp = _useState8[1];
|
|
3360
|
+
|
|
3361
|
+
//如果選擇的起始日期在結束日期之後，則結束日期會自動變成起始日期的後一天
|
|
3362
|
+
var handleStartChange = function handleStartChange(value, callback) {
|
|
3363
|
+
var _tableRef$current;
|
|
3364
|
+
var startTimestamp = moment(value).unix();
|
|
3365
|
+
if (endTimeStamp > startTimestamp) {
|
|
3366
|
+
setStartDate(value);
|
|
3367
|
+
setStartTimeStamp(startTimestamp);
|
|
3368
|
+
} else {
|
|
3369
|
+
setStartDate(value);
|
|
3370
|
+
setStartTimeStamp(startTimestamp);
|
|
3371
|
+
setEndDate(moment(value).add(1, 'day'));
|
|
3372
|
+
setEndTimeStamp(moment(value).add(1, 'day').unix());
|
|
3373
|
+
}
|
|
3374
|
+
tableRef === null || tableRef === void 0 || (_tableRef$current = tableRef.current) === null || _tableRef$current === void 0 || _tableRef$current.onQueryChange();
|
|
3375
|
+
};
|
|
3376
|
+
|
|
3377
|
+
//如果選擇的結束日期在起始日期以前，則不變更值並且跳出error message
|
|
3378
|
+
var handleEndChange = function handleEndChange(value) {
|
|
3379
|
+
var startTimestamp = moment(startDate).unix();
|
|
3380
|
+
var setEndTimestampValue = moment(value).unix();
|
|
3381
|
+
if (setEndTimestampValue > startTimestamp) {
|
|
3382
|
+
var _tableRef$current2;
|
|
3383
|
+
setEndDate(value);
|
|
3384
|
+
setEndTimeStamp(setEndTimestampValue);
|
|
3385
|
+
tableRef === null || tableRef === void 0 || (_tableRef$current2 = tableRef.current) === null || _tableRef$current2 === void 0 || _tableRef$current2.onQueryChange();
|
|
3386
|
+
} else {
|
|
3387
|
+
notify(tr('End Date Set Error'), /*#__PURE__*/jsxRuntime.jsx(fa.FaClock, {
|
|
3388
|
+
color: "#FF4C4C",
|
|
3389
|
+
fontSize: "20"
|
|
3390
|
+
}));
|
|
3391
|
+
}
|
|
3392
|
+
};
|
|
3393
|
+
return {
|
|
3394
|
+
// defaultSet, ============若未來沒bug的話可以刪除
|
|
3395
|
+
handleEndChange: handleEndChange,
|
|
3396
|
+
handleStartChange: handleStartChange,
|
|
3397
|
+
setStartDate: setStartDate,
|
|
3398
|
+
setEndDate: setEndDate,
|
|
3399
|
+
setStartTimeStamp: setStartTimeStamp,
|
|
3400
|
+
setEndTimeStamp: setEndTimeStamp,
|
|
3401
|
+
startDate: startDate,
|
|
3402
|
+
endDate: endDate,
|
|
3403
|
+
startTimeStamp: startTimeStamp,
|
|
3404
|
+
endTimeStamp: endTimeStamp
|
|
3405
|
+
};
|
|
3406
|
+
}
|
|
3407
|
+
|
|
3408
|
+
function timestampFormat() {
|
|
3409
|
+
var timestamp = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
|
|
3410
|
+
var format = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'YYYY-MM-DD HH:mm:ss';
|
|
3411
|
+
return timestamp ? moment(timestamp).format(format) : moment().format(format);
|
|
3410
3412
|
}
|
|
3411
|
-
|
|
3412
|
-
|
|
3413
|
+
|
|
3414
|
+
function DateRangePicker(_ref) {
|
|
3415
|
+
var _ref$showTitle = _ref.showTitle,
|
|
3416
|
+
showTitle = _ref$showTitle === void 0 ? true : _ref$showTitle,
|
|
3417
|
+
pickerSize = _ref.pickerSize,
|
|
3418
|
+
handleStartChange = _ref.handleStartChange,
|
|
3419
|
+
handleEndChange = _ref.handleEndChange,
|
|
3420
|
+
classes = _ref.classes,
|
|
3421
|
+
startDate = _ref.startDate,
|
|
3422
|
+
endDate = _ref.endDate;
|
|
3423
|
+
classes = classes || {
|
|
3424
|
+
marginT8: {
|
|
3425
|
+
marginTop: "8px"
|
|
3426
|
+
},
|
|
3427
|
+
marginB10: {
|
|
3428
|
+
marginBottom: "10px"
|
|
3429
|
+
},
|
|
3430
|
+
gridStyle: {
|
|
3431
|
+
textAlign: "right",
|
|
3432
|
+
color: "#404040"
|
|
3433
|
+
},
|
|
3434
|
+
labelStyle: {
|
|
3435
|
+
fontWeight: "bold",
|
|
3436
|
+
marginLeft: 0,
|
|
3437
|
+
paddingTop: "5%",
|
|
3438
|
+
width: "100%"
|
|
3439
|
+
},
|
|
3440
|
+
textAlignLeft: {
|
|
3441
|
+
textAlign: "left"
|
|
3442
|
+
},
|
|
3443
|
+
uploadForm: {
|
|
3444
|
+
padding: "2rem",
|
|
3445
|
+
marginTop: "1rem",
|
|
3446
|
+
backgroundColor: "#d3d3d391",
|
|
3447
|
+
borderRadius: "3px",
|
|
3448
|
+
width: "100%"
|
|
3449
|
+
},
|
|
3450
|
+
uploadIcon: {
|
|
3451
|
+
fontSize: "3rem",
|
|
3452
|
+
marginTop: "5px",
|
|
3453
|
+
marginLeft: "5px",
|
|
3454
|
+
marginRight: "10px"
|
|
3455
|
+
},
|
|
3456
|
+
buttonStyle: {
|
|
3457
|
+
placeSelf: "flex-end"
|
|
3458
|
+
},
|
|
3459
|
+
marginTop10: {
|
|
3460
|
+
marginTop: "10px !important"
|
|
3461
|
+
},
|
|
3462
|
+
hospitalTitle: {
|
|
3463
|
+
marginTop: "1rem"
|
|
3464
|
+
}
|
|
3465
|
+
};
|
|
3466
|
+
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
3467
|
+
children: [showTitle && /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
|
|
3468
|
+
item: true,
|
|
3469
|
+
container: true,
|
|
3470
|
+
xs: 12,
|
|
3471
|
+
sm: 2,
|
|
3472
|
+
md: 1,
|
|
3473
|
+
className: "".concat(classes.gridStyle, " ").concat(classes.marginB10, " ").concat(classes.textAlignLeft),
|
|
3474
|
+
style: {
|
|
3475
|
+
textAlign: "right"
|
|
3476
|
+
},
|
|
3477
|
+
alignContent: "center",
|
|
3478
|
+
children: /*#__PURE__*/jsxRuntime.jsxs(material.Typography, {
|
|
3479
|
+
variant: "h6",
|
|
3480
|
+
className: classes.labelStyle,
|
|
3481
|
+
children: [tr("Date"), "\uFF1A"]
|
|
3482
|
+
})
|
|
3483
|
+
}), /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
|
|
3484
|
+
item: true,
|
|
3485
|
+
container: true,
|
|
3486
|
+
xs: (pickerSize === null || pickerSize === void 0 ? void 0 : pickerSize.xs) || 12,
|
|
3487
|
+
sm: (pickerSize === null || pickerSize === void 0 ? void 0 : pickerSize.sm) || 6,
|
|
3488
|
+
md: (pickerSize === null || pickerSize === void 0 ? void 0 : pickerSize.md) || 4,
|
|
3489
|
+
className: classes.marginB10,
|
|
3490
|
+
children: /*#__PURE__*/jsxRuntime.jsx(LocalizationProvider.LocalizationProvider, {
|
|
3491
|
+
dateAdapter: AdapterDateFns.AdapterDateFns,
|
|
3492
|
+
children: /*#__PURE__*/jsxRuntime.jsxs(material.Grid, {
|
|
3493
|
+
container: true,
|
|
3494
|
+
justifyContent: "center",
|
|
3495
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(material.Grid, {
|
|
3496
|
+
item: true,
|
|
3497
|
+
sm: 6,
|
|
3498
|
+
style: {
|
|
3499
|
+
width: "100%",
|
|
3500
|
+
padding: 10
|
|
3501
|
+
},
|
|
3502
|
+
children: /*#__PURE__*/jsxRuntime.jsx(MobileDateTimePicker.MobileDateTimePicker, {
|
|
3503
|
+
label: tr("Start Date"),
|
|
3504
|
+
value: timestampFormat(startDate, "YYYY/MM/DD HH:mm"),
|
|
3505
|
+
inputFormat: "yyyy/MM/dd HH:mm",
|
|
3506
|
+
onChange: handleStartChange,
|
|
3507
|
+
renderInput: function renderInput(params) {
|
|
3508
|
+
return /*#__PURE__*/jsxRuntime.jsx(material.TextField, _objectSpread2(_objectSpread2({}, params), {}, {
|
|
3509
|
+
fullWidth: true
|
|
3510
|
+
}));
|
|
3511
|
+
}
|
|
3512
|
+
})
|
|
3513
|
+
}), /*#__PURE__*/jsxRuntime.jsx(material.Grid, {
|
|
3514
|
+
item: true,
|
|
3515
|
+
sm: 6,
|
|
3516
|
+
style: {
|
|
3517
|
+
width: "100%",
|
|
3518
|
+
padding: 10
|
|
3519
|
+
},
|
|
3520
|
+
children: /*#__PURE__*/jsxRuntime.jsx(MobileDateTimePicker.MobileDateTimePicker, {
|
|
3521
|
+
label: tr("End Date"),
|
|
3522
|
+
value: timestampFormat(endDate, "YYYY/MM/DD HH:mm"),
|
|
3523
|
+
inputFormat: "yyyy/MM/dd HH:mm",
|
|
3524
|
+
onChange: handleEndChange,
|
|
3525
|
+
renderInput: function renderInput(params) {
|
|
3526
|
+
return /*#__PURE__*/jsxRuntime.jsx(material.TextField, _objectSpread2(_objectSpread2({}, params), {}, {
|
|
3527
|
+
fullWidth: true
|
|
3528
|
+
}));
|
|
3529
|
+
}
|
|
3530
|
+
})
|
|
3531
|
+
})]
|
|
3532
|
+
})
|
|
3533
|
+
})
|
|
3534
|
+
})]
|
|
3535
|
+
});
|
|
3536
|
+
}
|
|
3537
|
+
DateRangePicker.propTypes = {
|
|
3538
|
+
handleStartChange: PropTypes.func.isRequired,
|
|
3539
|
+
handleEndChange: PropTypes.func.isRequired,
|
|
3540
|
+
classes: PropTypes.shape({
|
|
3541
|
+
marginB10: PropTypes.string,
|
|
3542
|
+
gridStyle: PropTypes.string,
|
|
3543
|
+
labelStyle: PropTypes.string,
|
|
3544
|
+
textAlignLeft: PropTypes.string
|
|
3545
|
+
}).isRequired,
|
|
3546
|
+
startDate: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.object, PropTypes.string]).isRequired,
|
|
3547
|
+
endDate: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.object, PropTypes.string]).isRequired
|
|
3548
|
+
};
|
|
3549
|
+
|
|
3550
|
+
function releaseUpdateTest() {
|
|
3551
|
+
var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'test';
|
|
3552
|
+
return "Hello, ".concat(name, "! this is a test 02/10-1");
|
|
3413
3553
|
}
|
|
3414
3554
|
|
|
3415
|
-
exports.
|
|
3555
|
+
exports.DateRangePicker = DateRangePicker;
|
|
3416
3556
|
exports.UdiTable = UdiTable;
|
|
3417
|
-
exports.
|
|
3418
|
-
exports.
|
|
3557
|
+
exports.releaseUpdateTest = releaseUpdateTest;
|
|
3558
|
+
exports.useDateRangePicker = useDateRangePicker;
|
|
3419
3559
|
exports.useUdiTableSync = useUdiTableSync$1;
|
|
3420
3560
|
exports.useUdiTableSyncMutipleTable = useUdiTableSync;
|
|
3421
3561
|
//# sourceMappingURL=index.cjs.js.map
|