@paubox/ui 1.12.0 → 1.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.esm.js +72 -73
- package/package.json +1 -1
- package/src/lib/FilterForm/FilterForm.d.ts +6 -3
- package/src/lib/FilterForm/FilterRow.d.ts +4 -4
- package/src/lib/Inputs/MultiInput.d.ts +2 -2
- package/src/lib/Inputs/MultiSelect.d.ts +1 -1
- package/src/lib/Inputs/Select.d.ts +6 -4
- package/src/lib/Table/Table.d.ts +1 -1
package/index.esm.js
CHANGED
|
@@ -22924,7 +22924,7 @@ var SelectContainer = styled.div(_templateObject2$f());
|
|
|
22924
22924
|
var MultiInputContainer = styled.div(_templateObject3$c());
|
|
22925
22925
|
var FilterRow = function(param) {
|
|
22926
22926
|
var filterKey = param.filterKey, rowIndex = param.rowIndex, values = param.values, errors = param.errors, touched = param.touched, onChange = param.onChange, onRemove = param.onRemove, fieldOptions = param.fieldOptions, operatorOptions = param.operatorOptions, showRemove = param.showRemove;
|
|
22927
|
-
var _touched_filters_filterKey_rowIndex, _touched_filters_filterKey, _touched_filters, _errors_filters_filterKey_rowIndex, _errors_filters_filterKey, _errors_filters, _touched_filters_filterKey_rowIndex1, _touched_filters_filterKey1, _touched_filters1, _errors_filters_filterKey_rowIndex1, _errors_filters_filterKey1, _errors_filters1, _touched_filters_filterKey_rowIndex2, _touched_filters_filterKey2, _touched_filters2, _errors_filters_filterKey_rowIndex2, _errors_filters_filterKey2, _errors_filters2;
|
|
22927
|
+
var _touched_filters_filterKey_rowIndex, _touched_filters_filterKey, _touched_filters, _errors_filters_filterKey_rowIndex, _errors_filters_filterKey, _errors_filters, _touched_filters_filterKey_rowIndex1, _touched_filters_filterKey1, _touched_filters1, _errors_filters_filterKey_rowIndex1, _errors_filters_filterKey1, _errors_filters1, _currentFilter_terms, _touched_filters_filterKey_rowIndex2, _touched_filters_filterKey2, _touched_filters2, _errors_filters_filterKey_rowIndex2, _errors_filters_filterKey2, _errors_filters2;
|
|
22928
22928
|
var currentFilter = values.filters[Number(filterKey)][Number(rowIndex)];
|
|
22929
22929
|
var _useState = _sliced_to_array$e(useState(false), 2), isHovered = _useState[0], setIsHovered = _useState[1];
|
|
22930
22930
|
var currentField = fieldOptions.find(function(field) {
|
|
@@ -22950,7 +22950,7 @@ var FilterRow = function(param) {
|
|
|
22950
22950
|
onChange: function(value) {
|
|
22951
22951
|
return onChange("filters.".concat(filterKey, ".").concat(rowIndex, ".field"), value);
|
|
22952
22952
|
},
|
|
22953
|
-
error: (touched === null || touched === void 0 ? void 0 : (_touched_filters = touched.filters) === null || _touched_filters === void 0 ? void 0 : (_touched_filters_filterKey = _touched_filters[filterKey]) === null || _touched_filters_filterKey === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex = _touched_filters_filterKey[rowIndex]) === null || _touched_filters_filterKey_rowIndex === void 0 ? void 0 : _touched_filters_filterKey_rowIndex.field) && (errors === null || errors === void 0 ? void 0 : (_errors_filters = errors.filters) === null || _errors_filters === void 0 ? void 0 : (_errors_filters_filterKey = _errors_filters[filterKey]) === null || _errors_filters_filterKey === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex = _errors_filters_filterKey[rowIndex]) === null || _errors_filters_filterKey_rowIndex === void 0 ? void 0 : _errors_filters_filterKey_rowIndex.field),
|
|
22953
|
+
error: !!(touched === null || touched === void 0 ? void 0 : (_touched_filters = touched.filters) === null || _touched_filters === void 0 ? void 0 : (_touched_filters_filterKey = _touched_filters[filterKey]) === null || _touched_filters_filterKey === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex = _touched_filters_filterKey[rowIndex]) === null || _touched_filters_filterKey_rowIndex === void 0 ? void 0 : _touched_filters_filterKey_rowIndex.field) && !!(errors === null || errors === void 0 ? void 0 : (_errors_filters = errors.filters) === null || _errors_filters === void 0 ? void 0 : (_errors_filters_filterKey = _errors_filters[filterKey]) === null || _errors_filters_filterKey === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex = _errors_filters_filterKey[rowIndex]) === null || _errors_filters_filterKey_rowIndex === void 0 ? void 0 : _errors_filters_filterKey_rowIndex.field),
|
|
22954
22954
|
options: fieldOptions,
|
|
22955
22955
|
sz: "lg"
|
|
22956
22956
|
}),
|
|
@@ -22964,7 +22964,7 @@ var FilterRow = function(param) {
|
|
|
22964
22964
|
onChange: function(value) {
|
|
22965
22965
|
return onChange("filters.".concat(filterKey, ".").concat(rowIndex, ".op"), value);
|
|
22966
22966
|
},
|
|
22967
|
-
error: (touched === null || touched === void 0 ? void 0 : (_touched_filters1 = touched.filters) === null || _touched_filters1 === void 0 ? void 0 : (_touched_filters_filterKey1 = _touched_filters1[filterKey]) === null || _touched_filters_filterKey1 === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex1 = _touched_filters_filterKey1[rowIndex]) === null || _touched_filters_filterKey_rowIndex1 === void 0 ? void 0 : _touched_filters_filterKey_rowIndex1.op) && (errors === null || errors === void 0 ? void 0 : (_errors_filters1 = errors.filters) === null || _errors_filters1 === void 0 ? void 0 : (_errors_filters_filterKey1 = _errors_filters1[filterKey]) === null || _errors_filters_filterKey1 === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex1 = _errors_filters_filterKey1[rowIndex]) === null || _errors_filters_filterKey_rowIndex1 === void 0 ? void 0 : _errors_filters_filterKey_rowIndex1.op),
|
|
22967
|
+
error: !!(touched === null || touched === void 0 ? void 0 : (_touched_filters1 = touched.filters) === null || _touched_filters1 === void 0 ? void 0 : (_touched_filters_filterKey1 = _touched_filters1[filterKey]) === null || _touched_filters_filterKey1 === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex1 = _touched_filters_filterKey1[rowIndex]) === null || _touched_filters_filterKey_rowIndex1 === void 0 ? void 0 : _touched_filters_filterKey_rowIndex1.op) && !!(errors === null || errors === void 0 ? void 0 : (_errors_filters1 = errors.filters) === null || _errors_filters1 === void 0 ? void 0 : (_errors_filters_filterKey1 = _errors_filters1[filterKey]) === null || _errors_filters_filterKey1 === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex1 = _errors_filters_filterKey1[rowIndex]) === null || _errors_filters_filterKey_rowIndex1 === void 0 ? void 0 : _errors_filters_filterKey_rowIndex1.op),
|
|
22968
22968
|
options: operatorOptions,
|
|
22969
22969
|
sz: "lg",
|
|
22970
22970
|
setValue: function(value) {
|
|
@@ -22976,7 +22976,7 @@ var FilterRow = function(param) {
|
|
|
22976
22976
|
/*#__PURE__*/ jsx(MultiInputContainer, {
|
|
22977
22977
|
children: currentFilter.field === 'select' ? /*#__PURE__*/ jsx(Select, {
|
|
22978
22978
|
name: "filters.".concat(filterKey, ".").concat(rowIndex, ".terms"),
|
|
22979
|
-
value: currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.terms,
|
|
22979
|
+
value: currentFilter === null || currentFilter === void 0 ? void 0 : (_currentFilter_terms = currentFilter.terms) === null || _currentFilter_terms === void 0 ? void 0 : _currentFilter_terms[0],
|
|
22980
22980
|
style: {
|
|
22981
22981
|
width: '100%'
|
|
22982
22982
|
},
|
|
@@ -22991,7 +22991,7 @@ var FilterRow = function(param) {
|
|
|
22991
22991
|
setValues: function(terms) {
|
|
22992
22992
|
return onChange("filters.".concat(filterKey, ".").concat(rowIndex, ".terms"), terms);
|
|
22993
22993
|
},
|
|
22994
|
-
error: (touched === null || touched === void 0 ? void 0 : (_touched_filters2 = touched.filters) === null || _touched_filters2 === void 0 ? void 0 : (_touched_filters_filterKey2 = _touched_filters2[filterKey]) === null || _touched_filters_filterKey2 === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex2 = _touched_filters_filterKey2[rowIndex]) === null || _touched_filters_filterKey_rowIndex2 === void 0 ? void 0 : _touched_filters_filterKey_rowIndex2.terms) && (errors === null || errors === void 0 ? void 0 : (_errors_filters2 = errors.filters) === null || _errors_filters2 === void 0 ? void 0 : (_errors_filters_filterKey2 = _errors_filters2[filterKey]) === null || _errors_filters_filterKey2 === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex2 = _errors_filters_filterKey2[rowIndex]) === null || _errors_filters_filterKey_rowIndex2 === void 0 ? void 0 : _errors_filters_filterKey_rowIndex2.terms),
|
|
22994
|
+
error: !!(touched === null || touched === void 0 ? void 0 : (_touched_filters2 = touched.filters) === null || _touched_filters2 === void 0 ? void 0 : (_touched_filters_filterKey2 = _touched_filters2[filterKey]) === null || _touched_filters_filterKey2 === void 0 ? void 0 : (_touched_filters_filterKey_rowIndex2 = _touched_filters_filterKey2[rowIndex]) === null || _touched_filters_filterKey_rowIndex2 === void 0 ? void 0 : _touched_filters_filterKey_rowIndex2.terms) && !!(errors === null || errors === void 0 ? void 0 : (_errors_filters2 = errors.filters) === null || _errors_filters2 === void 0 ? void 0 : (_errors_filters_filterKey2 = _errors_filters2[filterKey]) === null || _errors_filters_filterKey2 === void 0 ? void 0 : (_errors_filters_filterKey_rowIndex2 = _errors_filters_filterKey2[rowIndex]) === null || _errors_filters_filterKey_rowIndex2 === void 0 ? void 0 : _errors_filters_filterKey_rowIndex2.terms),
|
|
22995
22995
|
sz: "lg"
|
|
22996
22996
|
})
|
|
22997
22997
|
})
|
|
@@ -23240,7 +23240,6 @@ var FilterForm = function(param) {
|
|
|
23240
23240
|
children: [
|
|
23241
23241
|
Object.entries(values.filters).map(function(param, index) {
|
|
23242
23242
|
var _param = _sliced_to_array$d(param, 2), filterKey = _param[0], filterGroup = _param[1];
|
|
23243
|
-
var _errors_filterKey;
|
|
23244
23243
|
return /*#__PURE__*/ jsxs(FilterGroup, {
|
|
23245
23244
|
isHovered: isHovered === index,
|
|
23246
23245
|
children: [
|
|
@@ -23284,7 +23283,7 @@ var FilterForm = function(param) {
|
|
|
23284
23283
|
children: /*#__PURE__*/ jsx(Button, {
|
|
23285
23284
|
type: "button",
|
|
23286
23285
|
color: "secondary",
|
|
23287
|
-
disabled: errors === null || errors === void 0 ? void 0 :
|
|
23286
|
+
disabled: !!(errors === null || errors === void 0 ? void 0 : errors[filterKey]),
|
|
23288
23287
|
title: "Add filter condition",
|
|
23289
23288
|
size: "large",
|
|
23290
23289
|
style: {
|
|
@@ -23301,7 +23300,7 @@ var FilterForm = function(param) {
|
|
|
23301
23300
|
}),
|
|
23302
23301
|
/*#__PURE__*/ jsx(OrButton, {
|
|
23303
23302
|
type: "button",
|
|
23304
|
-
disabled: errors
|
|
23303
|
+
disabled: !!errors,
|
|
23305
23304
|
onClick: handleAddFilter,
|
|
23306
23305
|
title: "Add filter",
|
|
23307
23306
|
children: "Or"
|
|
@@ -23311,7 +23310,7 @@ var FilterForm = function(param) {
|
|
|
23311
23310
|
/*#__PURE__*/ jsx(Button, {
|
|
23312
23311
|
type: "button",
|
|
23313
23312
|
color: "primary",
|
|
23314
|
-
disabled: errors
|
|
23313
|
+
disabled: !!errors,
|
|
23315
23314
|
size: "large",
|
|
23316
23315
|
style: {
|
|
23317
23316
|
width: '100%'
|
|
@@ -23801,11 +23800,9 @@ function _templateObject1$c() {
|
|
|
23801
23800
|
}
|
|
23802
23801
|
function _templateObject2$c() {
|
|
23803
23802
|
var data = _tagged_template_literal$g([
|
|
23804
|
-
"\n flex: 1;\n z-index: 2;\n pointer-events: none;\n border: none;\n background-color: transparent;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n &::-ms-expand {\n display: none;\n }\n
|
|
23805
|
-
";\n }\n color: ",
|
|
23803
|
+
"\n flex: 1;\n z-index: 2;\n pointer-events: none;\n border: none;\n background-color: transparent;\n\n -webkit-appearance: none;\n -moz-appearance: none;\n &::-ms-expand {\n display: none;\n }\n color: ",
|
|
23806
23804
|
";\n padding: ",
|
|
23807
|
-
";\n padding-right: 2rem;\n outline: none;\n
|
|
23808
|
-
";\n opacity: 0.3;\n }\n\n ",
|
|
23805
|
+
";\n padding-right: 2rem;\n outline: none;\n\n ",
|
|
23809
23806
|
"\n"
|
|
23810
23807
|
]);
|
|
23811
23808
|
_templateObject2$c = function _templateObject() {
|
|
@@ -23890,13 +23887,13 @@ var MultiSelectWrapper = styled.div(_templateObject1$c(), function(param) {
|
|
|
23890
23887
|
return disabled || type === 'secondary' ? neutral100 : 'white';
|
|
23891
23888
|
});
|
|
23892
23889
|
// Style for the Select itself
|
|
23893
|
-
var BaseSelect$1 = styled.select(_templateObject2$c(),
|
|
23894
|
-
var
|
|
23895
|
-
return
|
|
23890
|
+
var BaseSelect$1 = styled.select(_templateObject2$c(), function(param) {
|
|
23891
|
+
var hasValue = param.hasValue;
|
|
23892
|
+
return hasValue ? textPrimary : neutral500;
|
|
23896
23893
|
}, function(param) {
|
|
23897
23894
|
var sz = param.sz;
|
|
23898
23895
|
return sz === 'lg' ? '0.5rem 0.563rem' : '0.375rem 0.563rem';
|
|
23899
|
-
},
|
|
23896
|
+
}, function(param) {
|
|
23900
23897
|
var sz = param.sz, type = param.type;
|
|
23901
23898
|
return type === 'primary' ? sz === 'lg' ? $paragraph100Regular : $paragraph200Regular : sz === 'lg' ? $paragraph100Semibold : $paragraph200Semibold;
|
|
23902
23899
|
});
|
|
@@ -23977,19 +23974,19 @@ var MultiSelect = function(_param) {
|
|
|
23977
23974
|
/*#__PURE__*/ jsx(BaseSelect$1, _object_spread_props$j(_object_spread$n({}, props), {
|
|
23978
23975
|
type: type,
|
|
23979
23976
|
sz: sz,
|
|
23980
|
-
value:
|
|
23981
|
-
|
|
23977
|
+
value: "",
|
|
23978
|
+
hasValue: values.length > 0,
|
|
23982
23979
|
disabled: disabled,
|
|
23980
|
+
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
23981
|
+
onChange: function() {},
|
|
23983
23982
|
children: !values.length ? /*#__PURE__*/ jsx(PlaceholderOption, {
|
|
23984
23983
|
value: "",
|
|
23985
23984
|
disabled: true,
|
|
23986
23985
|
hidden: true,
|
|
23987
|
-
selected: true,
|
|
23988
23986
|
children: "".concat(placeholder || 'Please select...')
|
|
23989
23987
|
}) : !chips && /*#__PURE__*/ jsx(SelectedOption, {
|
|
23990
23988
|
value: "",
|
|
23991
23989
|
hidden: true,
|
|
23992
|
-
selected: true,
|
|
23993
23990
|
children: "".concat(label || 'Selected', " (").concat(values.length, ")")
|
|
23994
23991
|
})
|
|
23995
23992
|
})),
|
|
@@ -24694,7 +24691,8 @@ function _templateObject$d() {
|
|
|
24694
24691
|
}
|
|
24695
24692
|
function _templateObject1$a() {
|
|
24696
24693
|
var data = _tagged_template_literal$d([
|
|
24697
|
-
"\n display: flex;\n align-items: center;\n width:
|
|
24694
|
+
"\n display: flex;\n align-items: center;\n width: ",
|
|
24695
|
+
";\n position: relative;\n cursor: ",
|
|
24698
24696
|
";\n &:hover {\n background-color: ",
|
|
24699
24697
|
";\n }\n transition: all 150ms ease-in-out;\n\n &:focus-within {\n border-color: ",
|
|
24700
24698
|
";\n }\n\n &:focus {\n background-color: ",
|
|
@@ -24745,6 +24743,9 @@ function _templateObject4$6() {
|
|
|
24745
24743
|
// Wrapper for the Input and Icons
|
|
24746
24744
|
var InputWrapper = styled.div(_templateObject$d());
|
|
24747
24745
|
var SelectWrapper = styled.div(_templateObject1$a(), function(param) {
|
|
24746
|
+
var fullWidth = param.fullWidth;
|
|
24747
|
+
return fullWidth ? '100%' : 'max-content';
|
|
24748
|
+
}, function(param) {
|
|
24748
24749
|
var disabled = param.disabled;
|
|
24749
24750
|
return disabled ? 'not-allowed' : 'pointer';
|
|
24750
24751
|
}, function(param) {
|
|
@@ -24780,7 +24781,7 @@ var IconWrapper$1 = styled.div(_templateObject3$8(), function(param) {
|
|
|
24780
24781
|
});
|
|
24781
24782
|
var SelectOption = styled.option(_templateObject4$6(), $paragraph100Semibold, textPrimary);
|
|
24782
24783
|
var Select = function(_param) {
|
|
24783
|
-
var _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, _param_options = _param.options, options = _param_options === void 0 ? [] : _param_options; _param.checkbox; var _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? 'Please select...' : _param_placeholder, value = _param.value, setValue = _param.setValue; _param.initialValue; var _param_type = _param.type, type = _param_type === void 0 ? 'primary' : _param_type, style = _param.style, _param_maxHeight = _param.maxHeight, maxHeight = _param_maxHeight === void 0 ? '14rem' : _param_maxHeight, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_addClearOption = _param.addClearOption, addClearOption = _param_addClearOption === void 0 ? false : _param_addClearOption, _param_clearOptionLabel = _param.clearOptionLabel, clearOptionLabel = _param_clearOptionLabel === void 0 ? 'Clear' : _param_clearOptionLabel, props = _object_without_properties$c(_param, [
|
|
24784
|
+
var _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, _param_options = _param.options, options = _param_options === void 0 ? [] : _param_options; _param.checkbox; var _param_placeholder = _param.placeholder, placeholder = _param_placeholder === void 0 ? 'Please select...' : _param_placeholder, value = _param.value, setValue = _param.setValue; _param.initialValue; var _param_type = _param.type, type = _param_type === void 0 ? 'primary' : _param_type, style = _param.style, _param_maxHeight = _param.maxHeight, maxHeight = _param_maxHeight === void 0 ? '14rem' : _param_maxHeight, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, _param_addClearOption = _param.addClearOption, addClearOption = _param_addClearOption === void 0 ? false : _param_addClearOption, _param_clearOptionLabel = _param.clearOptionLabel, clearOptionLabel = _param_clearOptionLabel === void 0 ? 'Clear' : _param_clearOptionLabel, fullWidth = _param.fullWidth, props = _object_without_properties$c(_param, [
|
|
24784
24785
|
"sz",
|
|
24785
24786
|
"error",
|
|
24786
24787
|
"options",
|
|
@@ -24794,7 +24795,8 @@ var Select = function(_param) {
|
|
|
24794
24795
|
"maxHeight",
|
|
24795
24796
|
"disabled",
|
|
24796
24797
|
"addClearOption",
|
|
24797
|
-
"clearOptionLabel"
|
|
24798
|
+
"clearOptionLabel",
|
|
24799
|
+
"fullWidth"
|
|
24798
24800
|
]);
|
|
24799
24801
|
var _options_find;
|
|
24800
24802
|
var _useState = _sliced_to_array$9(useState(false), 2), open = _useState[0], setOpen = _useState[1];
|
|
@@ -24815,6 +24817,7 @@ var Select = function(_param) {
|
|
|
24815
24817
|
type: type,
|
|
24816
24818
|
error: error,
|
|
24817
24819
|
open: open,
|
|
24820
|
+
fullWidth: fullWidth,
|
|
24818
24821
|
style: style,
|
|
24819
24822
|
onClick: function() {
|
|
24820
24823
|
return !disabled && setOpen(function(prev) {
|
|
@@ -24828,7 +24831,7 @@ var Select = function(_param) {
|
|
|
24828
24831
|
type: type,
|
|
24829
24832
|
disabled: disabled,
|
|
24830
24833
|
sz: sz,
|
|
24831
|
-
value: value,
|
|
24834
|
+
value: value !== null && value !== void 0 ? value : '',
|
|
24832
24835
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
24833
24836
|
onChange: function() {},
|
|
24834
24837
|
error: error,
|
|
@@ -24836,11 +24839,9 @@ var Select = function(_param) {
|
|
|
24836
24839
|
value: "",
|
|
24837
24840
|
disabled: true,
|
|
24838
24841
|
hidden: true,
|
|
24839
|
-
selected: true,
|
|
24840
24842
|
children: placeholder
|
|
24841
24843
|
}) : /*#__PURE__*/ jsx(SelectOption, {
|
|
24842
24844
|
value: value,
|
|
24843
|
-
selected: true,
|
|
24844
24845
|
hidden: true,
|
|
24845
24846
|
children: ((_options_find = options.find(function(option) {
|
|
24846
24847
|
return option.value === value;
|
|
@@ -34123,53 +34124,46 @@ var ClampWrapper = styled.div(_templateObject7(), function(props) {
|
|
|
34123
34124
|
});
|
|
34124
34125
|
var TableBody = function(param) {
|
|
34125
34126
|
var table = param.table, enableRowSelection = param.enableRowSelection, onRowClick = param.onRowClick, getRowDisabled = param.getRowDisabled, dense = param.dense, _param_testId = param.testId, testId = _param_testId === void 0 ? 'table' : _param_testId;
|
|
34126
|
-
return /*#__PURE__*/
|
|
34127
|
-
children:
|
|
34128
|
-
|
|
34129
|
-
|
|
34130
|
-
|
|
34127
|
+
return /*#__PURE__*/ jsx(StyledTableBody, {
|
|
34128
|
+
children: table.getRowModel().rows.map(function(row) {
|
|
34129
|
+
var rowClickEnabled = enableRowSelection || !!onRowClick;
|
|
34130
|
+
var isDisabled = !!(getRowDisabled === null || getRowDisabled === void 0 ? void 0 : getRowDisabled(row.original));
|
|
34131
|
+
return /*#__PURE__*/ jsx(Tr, {
|
|
34132
|
+
role: rowClickEnabled ? 'button' : undefined,
|
|
34133
|
+
disabled: isDisabled,
|
|
34134
|
+
onClick: onRowClick ? function() {
|
|
34135
|
+
return !isDisabled && onRowClick(row.original);
|
|
34136
|
+
} : row.getToggleSelectedHandler(),
|
|
34137
|
+
style: {
|
|
34138
|
+
cursor: rowClickEnabled ? isDisabled ? 'not-allowed' : 'pointer' : undefined,
|
|
34139
|
+
background: row.getIsSelected() ? primary100 : undefined
|
|
34140
|
+
},
|
|
34141
|
+
enableHover: rowClickEnabled,
|
|
34142
|
+
"data-testid": "".concat(testId, "-row-").concat(row.id),
|
|
34143
|
+
children: row.getVisibleCells().map(function(cell) {
|
|
34144
|
+
var cellValue = cell.getValue();
|
|
34145
|
+
var columnDef = cell.column.columnDef;
|
|
34146
|
+
var overflow = columnDef.overflow;
|
|
34147
|
+
var maxLines = columnDef.maxLines;
|
|
34148
|
+
var autoWidth = columnDef.autoWidth;
|
|
34149
|
+
var cellContent = flexRender(cell.column.columnDef.cell, cell.getContext());
|
|
34150
|
+
return /*#__PURE__*/ jsx(Td, {
|
|
34151
|
+
variant: "paragraph200Regular",
|
|
34152
|
+
as: "td",
|
|
34153
|
+
title: typeof cellValue === 'string' ? cellValue : undefined,
|
|
34154
|
+
cellOverflow: overflow,
|
|
34155
|
+
style: {
|
|
34156
|
+
width: autoWidth ? 'auto' : "".concat(cell.column.getSize(), "px"),
|
|
34157
|
+
padding: dense ? "".concat(spacing(1), "px ").concat(spacing(cell.column.id === 'row-select' ? 1 : 1.5), "px") : "".concat(spacing(1.5), "px ").concat(spacing(cell.column.id === 'row-select' ? 1 : 1.5), "px")
|
|
34158
|
+
},
|
|
34159
|
+
children: overflow === 'clamp' && maxLines ? /*#__PURE__*/ jsx(ClampWrapper, {
|
|
34160
|
+
maxLines: maxLines,
|
|
34161
|
+
children: cellContent
|
|
34162
|
+
}) : cellContent
|
|
34163
|
+
}, cell.id);
|
|
34131
34164
|
})
|
|
34132
|
-
})
|
|
34133
|
-
|
|
34134
|
-
var rowClickEnabled = enableRowSelection || !!onRowClick;
|
|
34135
|
-
var isDisabled = !!(getRowDisabled === null || getRowDisabled === void 0 ? void 0 : getRowDisabled(row.original));
|
|
34136
|
-
return /*#__PURE__*/ jsx(Tr, {
|
|
34137
|
-
role: rowClickEnabled ? 'button' : undefined,
|
|
34138
|
-
disabled: isDisabled,
|
|
34139
|
-
onClick: onRowClick ? function() {
|
|
34140
|
-
return !isDisabled && onRowClick(row.original);
|
|
34141
|
-
} : row.getToggleSelectedHandler(),
|
|
34142
|
-
style: {
|
|
34143
|
-
cursor: rowClickEnabled ? isDisabled ? 'not-allowed' : 'pointer' : undefined,
|
|
34144
|
-
background: row.getIsSelected() ? primary100 : undefined
|
|
34145
|
-
},
|
|
34146
|
-
enableHover: rowClickEnabled,
|
|
34147
|
-
"data-testid": "".concat(testId, "-row-").concat(row.id),
|
|
34148
|
-
children: row.getVisibleCells().map(function(cell) {
|
|
34149
|
-
var cellValue = cell.getValue();
|
|
34150
|
-
var columnDef = cell.column.columnDef;
|
|
34151
|
-
var overflow = columnDef.overflow;
|
|
34152
|
-
var maxLines = columnDef.maxLines;
|
|
34153
|
-
var autoWidth = columnDef.autoWidth;
|
|
34154
|
-
var cellContent = flexRender(cell.column.columnDef.cell, cell.getContext());
|
|
34155
|
-
return /*#__PURE__*/ jsx(Td, {
|
|
34156
|
-
variant: "paragraph200Regular",
|
|
34157
|
-
as: "td",
|
|
34158
|
-
title: typeof cellValue === 'string' ? cellValue : undefined,
|
|
34159
|
-
cellOverflow: overflow,
|
|
34160
|
-
style: {
|
|
34161
|
-
width: autoWidth ? 'auto' : "".concat(cell.column.getSize(), "px"),
|
|
34162
|
-
padding: dense ? "".concat(spacing(1), "px ").concat(spacing(cell.column.id === 'row-select' ? 1 : 1.5), "px") : "".concat(spacing(1.5), "px ").concat(spacing(cell.column.id === 'row-select' ? 1 : 1.5), "px")
|
|
34163
|
-
},
|
|
34164
|
-
children: overflow === 'clamp' && maxLines ? /*#__PURE__*/ jsx(ClampWrapper, {
|
|
34165
|
-
maxLines: maxLines,
|
|
34166
|
-
children: cellContent
|
|
34167
|
-
}) : cellContent
|
|
34168
|
-
}, cell.id);
|
|
34169
|
-
})
|
|
34170
|
-
}, row.id);
|
|
34171
|
-
})
|
|
34172
|
-
]
|
|
34165
|
+
}, row.id);
|
|
34166
|
+
})
|
|
34173
34167
|
});
|
|
34174
34168
|
};
|
|
34175
34169
|
|
|
@@ -34659,6 +34653,11 @@ var Table = function(param) {
|
|
|
34659
34653
|
}),
|
|
34660
34654
|
/*#__PURE__*/ jsxs(TableWrapper, {
|
|
34661
34655
|
children: [
|
|
34656
|
+
/*#__PURE__*/ jsx("colgroup", {
|
|
34657
|
+
children: table.getAllColumns().map(function(column) {
|
|
34658
|
+
return /*#__PURE__*/ jsx("col", {}, column.id);
|
|
34659
|
+
})
|
|
34660
|
+
}),
|
|
34662
34661
|
/*#__PURE__*/ jsx(TableHeader, {
|
|
34663
34662
|
table: table,
|
|
34664
34663
|
disableControls: disableControls,
|
package/package.json
CHANGED
|
@@ -13,6 +13,9 @@ export interface FieldOption {
|
|
|
13
13
|
export interface FilterFormValues {
|
|
14
14
|
filters: Record<string, Record<string, FilterValue>>;
|
|
15
15
|
}
|
|
16
|
+
export interface NestedFormState {
|
|
17
|
+
[key: string]: NestedFormState | undefined;
|
|
18
|
+
}
|
|
16
19
|
export interface FilterFormProps {
|
|
17
20
|
values: FilterFormValues;
|
|
18
21
|
fieldOptions: FieldOption[];
|
|
@@ -22,8 +25,8 @@ export interface FilterFormProps {
|
|
|
22
25
|
}[];
|
|
23
26
|
onSubmit: () => void;
|
|
24
27
|
onClear?: () => void;
|
|
25
|
-
onChange: (path: string, value:
|
|
26
|
-
errors?:
|
|
27
|
-
touched?:
|
|
28
|
+
onChange: (path: string, value: unknown) => void;
|
|
29
|
+
errors?: NestedFormState;
|
|
30
|
+
touched?: NestedFormState;
|
|
28
31
|
}
|
|
29
32
|
export declare const FilterForm: ({ values, fieldOptions, operatorOptions, onSubmit, onClear, onChange, errors, touched, }: FilterFormProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { FilterFormValues } from './FilterForm';
|
|
1
|
+
import { FilterFormValues, NestedFormState } from './FilterForm';
|
|
2
2
|
interface FilterRowProps {
|
|
3
3
|
filterKey: string;
|
|
4
4
|
rowIndex: string;
|
|
5
5
|
values: FilterFormValues;
|
|
6
|
-
errors?:
|
|
7
|
-
touched?:
|
|
8
|
-
onChange: (path: string, value:
|
|
6
|
+
errors?: NestedFormState;
|
|
7
|
+
touched?: NestedFormState;
|
|
8
|
+
onChange: (path: string, value: unknown) => void;
|
|
9
9
|
onRemove: () => void;
|
|
10
10
|
fieldOptions: {
|
|
11
11
|
label: string;
|
|
@@ -4,8 +4,8 @@ interface MultiInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
|
4
4
|
type?: 'primary' | 'secondary';
|
|
5
5
|
isFocused?: boolean;
|
|
6
6
|
chips?: boolean;
|
|
7
|
-
values?:
|
|
8
|
-
setValues?: (values:
|
|
7
|
+
values?: string[];
|
|
8
|
+
setValues?: (values: string[]) => void;
|
|
9
9
|
}
|
|
10
10
|
export interface MultiInputValues extends MultiInputProps {
|
|
11
11
|
values: string[];
|
|
@@ -3,7 +3,7 @@ export interface MultiSelectOption {
|
|
|
3
3
|
value: string;
|
|
4
4
|
label: string;
|
|
5
5
|
}
|
|
6
|
-
export interface MultiSelectProps extends BaseSelectProps {
|
|
6
|
+
export interface MultiSelectProps extends Omit<BaseSelectProps, 'value'> {
|
|
7
7
|
values: string[];
|
|
8
8
|
setValues: (value: string[], option?: MultiSelectOption) => void;
|
|
9
9
|
options: MultiSelectOption[];
|
|
@@ -2,9 +2,11 @@ export interface SelectOption {
|
|
|
2
2
|
value: string | null;
|
|
3
3
|
label: string;
|
|
4
4
|
}
|
|
5
|
-
export interface BaseSelectProps extends React.InputHTMLAttributes<HTMLSelectElement> {
|
|
5
|
+
export interface BaseSelectProps extends Omit<React.InputHTMLAttributes<HTMLSelectElement>, 'value'> {
|
|
6
|
+
value?: string | null | undefined;
|
|
6
7
|
sz?: 'sm' | 'lg';
|
|
7
8
|
error?: boolean;
|
|
9
|
+
fullWidth?: boolean;
|
|
8
10
|
leftIcon?: React.ElementType;
|
|
9
11
|
rightIcon?: React.ElementType;
|
|
10
12
|
options?: SelectOption[];
|
|
@@ -16,7 +18,7 @@ export interface BaseSelectProps extends React.InputHTMLAttributes<HTMLSelectEle
|
|
|
16
18
|
clearOptionLabel?: string;
|
|
17
19
|
}
|
|
18
20
|
export interface SelectProps extends BaseSelectProps {
|
|
19
|
-
value:
|
|
20
|
-
setValue: (value: string) => void;
|
|
21
|
+
value: string | null | undefined;
|
|
22
|
+
setValue: (value: string | null) => void;
|
|
21
23
|
}
|
|
22
|
-
export declare const Select: ({ sz, error, options, checkbox, placeholder, value, setValue, initialValue, type, style, maxHeight, disabled, addClearOption, clearOptionLabel, ...props }: SelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
24
|
+
export declare const Select: ({ sz, error, options, checkbox, placeholder, value, setValue, initialValue, type, style, maxHeight, disabled, addClearOption, clearOptionLabel, fullWidth, ...props }: SelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
package/src/lib/Table/Table.d.ts
CHANGED
|
@@ -46,7 +46,7 @@ interface PaginationProps {
|
|
|
46
46
|
pageInfo?: PageInfoPageBased | PageInfoCursorBased;
|
|
47
47
|
subText?: string;
|
|
48
48
|
onPageSizeChange?: (size: number) => void;
|
|
49
|
-
onPageChange?: (page:
|
|
49
|
+
onPageChange?: (page: number | 'next' | 'prev') => void;
|
|
50
50
|
}
|
|
51
51
|
interface TableDataProps<T> {
|
|
52
52
|
columns: TableColumn<T>[];
|