@paubox/ui 0.7.1 → 0.7.3
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 +14 -11
- package/package.json +1 -1
- package/src/lib/Inputs/Input.d.ts +1 -1
- package/src/lib/Modal/Modal.d.ts +4 -2
- package/src/lib/Table/Table.d.ts +2 -1
package/index.esm.js
CHANGED
|
@@ -22522,11 +22522,12 @@ var IconWrapper$1 = styled.span(_templateObject2$5(), function(param) {
|
|
|
22522
22522
|
return position === 'right' ? '0.5rem' : 'auto';
|
|
22523
22523
|
});
|
|
22524
22524
|
var Input = function(_param) {
|
|
22525
|
-
var LeftIcon = _param.leftIcon, RightIcon = _param.rightIcon, _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, props = _object_without_properties$a(_param, [
|
|
22525
|
+
var LeftIcon = _param.leftIcon, RightIcon = _param.rightIcon, _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, style = _param.style, props = _object_without_properties$a(_param, [
|
|
22526
22526
|
"leftIcon",
|
|
22527
22527
|
"rightIcon",
|
|
22528
22528
|
"sz",
|
|
22529
|
-
"error"
|
|
22529
|
+
"error",
|
|
22530
|
+
"style"
|
|
22530
22531
|
]);
|
|
22531
22532
|
return /*#__PURE__*/ jsxs(InputWrapper$1, {
|
|
22532
22533
|
children: [
|
|
@@ -22537,10 +22538,10 @@ var Input = function(_param) {
|
|
|
22537
22538
|
/*#__PURE__*/ jsx(BaseInput, _object_spread_props$d(_object_spread$h({}, props), {
|
|
22538
22539
|
sz: sz,
|
|
22539
22540
|
error: error,
|
|
22540
|
-
style: {
|
|
22541
|
+
style: _object_spread$h({
|
|
22541
22542
|
paddingLeft: LeftIcon ? '2.063rem' : '0.563rem',
|
|
22542
22543
|
paddingRight: RightIcon ? '2.063rem' : '0.563rem'
|
|
22543
|
-
}
|
|
22544
|
+
}, style)
|
|
22544
22545
|
})),
|
|
22545
22546
|
RightIcon && /*#__PURE__*/ jsx(IconWrapper$1, {
|
|
22546
22547
|
position: "right",
|
|
@@ -26779,7 +26780,7 @@ var ModalHeader = styled.div(_templateObject2$3());
|
|
|
26779
26780
|
var ModalBody = styled.div(_templateObject3$2());
|
|
26780
26781
|
var ModalFooter = styled.div(_templateObject4$1(), spacing(1));
|
|
26781
26782
|
var Modal = function(param) {
|
|
26782
|
-
var open = param.open, onClose = param.onClose, loading = param.loading, title = param.title, children = param.children, actions = param.actions;
|
|
26783
|
+
var open = param.open, onClose = param.onClose, loading = param.loading, title = param.title, header = param.header, children = param.children, actions = param.actions, style = param.style;
|
|
26783
26784
|
return /*#__PURE__*/ jsx(StyledModal, {
|
|
26784
26785
|
open: open,
|
|
26785
26786
|
onClose: onClose,
|
|
@@ -26787,6 +26788,7 @@ var Modal = function(param) {
|
|
|
26787
26788
|
backdrop: prepareForSlot(Backdrop)
|
|
26788
26789
|
},
|
|
26789
26790
|
children: /*#__PURE__*/ jsxs(ModalContent, {
|
|
26791
|
+
style: style,
|
|
26790
26792
|
children: [
|
|
26791
26793
|
loading && /*#__PURE__*/ jsx(LoadingOverlay, {}),
|
|
26792
26794
|
/*#__PURE__*/ jsxs(ModalHeader, {
|
|
@@ -26800,6 +26802,7 @@ var Modal = function(param) {
|
|
|
26800
26802
|
},
|
|
26801
26803
|
children: title
|
|
26802
26804
|
}),
|
|
26805
|
+
header,
|
|
26803
26806
|
/*#__PURE__*/ jsx(Button, {
|
|
26804
26807
|
color: "secondary",
|
|
26805
26808
|
onClick: onClose,
|
|
@@ -31586,7 +31589,7 @@ function _unsupported_iterable_to_array$1(o, minLen) {
|
|
|
31586
31589
|
}
|
|
31587
31590
|
function _templateObject$1() {
|
|
31588
31591
|
var data = _tagged_template_literal$1([
|
|
31589
|
-
"\n position: relative;\n display: flex;\n flex-direction: column;\n z-index: 1;\n border: 1px solid ",
|
|
31592
|
+
"\n position: relative;\n display: flex;\n flex-direction: column;\n min-height: 400px;\n z-index: 1;\n border: 1px solid ",
|
|
31590
31593
|
";\n border-radius: ",
|
|
31591
31594
|
"px;\n overflow: hidden;\n"
|
|
31592
31595
|
]);
|
|
@@ -31612,10 +31615,10 @@ var Table = function(param) {
|
|
|
31612
31615
|
itemCount: 0,
|
|
31613
31616
|
currentPage: 1,
|
|
31614
31617
|
items: 50
|
|
31615
|
-
} : _param_pageInfo, onPageSizeChange = param.onPageSizeChange, onPageChange = param.onPageChange, sortBy = param.sortBy, sortOrder = param.sortOrder, onSortChange = param.onSortChange, _param_enableRowSelection = param.enableRowSelection, enableRowSelection = _param_enableRowSelection === void 0 ? false : _param_enableRowSelection, _param_selectedRows = param.selectedRows, selectedRows = _param_selectedRows === void 0 ? {} : _param_selectedRows, onRowSelectionChange = param.onRowSelectionChange, onRowClick = param.onRowClick, contextMenuActions = param.contextMenuActions, _param_dense = param.dense, dense = _param_dense === void 0 ? false : _param_dense, height = param.height;
|
|
31618
|
+
} : _param_pageInfo, onPageSizeChange = param.onPageSizeChange, onPageChange = param.onPageChange, sortBy = param.sortBy, sortOrder = param.sortOrder, onSortChange = param.onSortChange, _param_enableRowSelection = param.enableRowSelection, enableRowSelection = _param_enableRowSelection === void 0 ? false : _param_enableRowSelection, _param_selectedRows = param.selectedRows, selectedRows = _param_selectedRows === void 0 ? {} : _param_selectedRows, onRowSelectionChange = param.onRowSelectionChange, onRowClick = param.onRowClick, contextMenuActions = param.contextMenuActions, _param_dense = param.dense, dense = _param_dense === void 0 ? false : _param_dense, height = param.height, error = param.error;
|
|
31616
31619
|
var _useState = _sliced_to_array$1(useState({}), 2), columnSizing = _useState[0], setColumnSizing = _useState[1];
|
|
31617
31620
|
var _useState1 = _sliced_to_array$1(useState(null), 2), openMenuId = _useState1[0], setOpenMenuId = _useState1[1];
|
|
31618
|
-
var disableControls = isLoading || !data.length;
|
|
31621
|
+
var disableControls = isLoading || !data.length || !!error;
|
|
31619
31622
|
var tableColumns = useMemo(function() {
|
|
31620
31623
|
return columns.map(function(col) {
|
|
31621
31624
|
return _object_spread$1({
|
|
@@ -31708,7 +31711,7 @@ var Table = function(param) {
|
|
|
31708
31711
|
onSortChange
|
|
31709
31712
|
]);
|
|
31710
31713
|
var table = useReactTable({
|
|
31711
|
-
data: data,
|
|
31714
|
+
data: error ? [] : data,
|
|
31712
31715
|
columns: allColumns,
|
|
31713
31716
|
getRowId: getRowId,
|
|
31714
31717
|
defaultColumn: {
|
|
@@ -31758,7 +31761,7 @@ var Table = function(param) {
|
|
|
31758
31761
|
},
|
|
31759
31762
|
children: [
|
|
31760
31763
|
isLoading && /*#__PURE__*/ jsx(LoadingOverlay, {}),
|
|
31761
|
-
Boolean(!isLoading && !data.length) && /*#__PURE__*/ jsx(Typography, {
|
|
31764
|
+
Boolean(!isLoading && (!data.length || error)) && /*#__PURE__*/ jsx(Typography, {
|
|
31762
31765
|
variant: "paragraph200Regular",
|
|
31763
31766
|
as: "div",
|
|
31764
31767
|
style: {
|
|
@@ -31767,7 +31770,7 @@ var Table = function(param) {
|
|
|
31767
31770
|
top: '50%',
|
|
31768
31771
|
transform: 'translate(-50%, -50%)'
|
|
31769
31772
|
},
|
|
31770
|
-
children:
|
|
31773
|
+
children: !error ? 'No results found.' : error
|
|
31771
31774
|
}),
|
|
31772
31775
|
/*#__PURE__*/ jsxs(TableWrapper, {
|
|
31773
31776
|
children: [
|
package/package.json
CHANGED
|
@@ -4,4 +4,4 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
|
|
|
4
4
|
leftIcon?: React.ElementType;
|
|
5
5
|
rightIcon?: React.ElementType;
|
|
6
6
|
}
|
|
7
|
-
export declare const Input: ({ leftIcon: LeftIcon, rightIcon: RightIcon, sz, error, ...props }: InputProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare const Input: ({ leftIcon: LeftIcon, rightIcon: RightIcon, sz, error, style, ...props }: InputProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
package/src/lib/Modal/Modal.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
2
|
import { BaseButtonProps } from '../Button/BaseButton';
|
|
3
3
|
type ModalAction = {
|
|
4
4
|
label: string;
|
|
@@ -11,8 +11,10 @@ export interface ModalProps {
|
|
|
11
11
|
onClose: () => void;
|
|
12
12
|
loading?: boolean;
|
|
13
13
|
title?: string;
|
|
14
|
+
header?: ReactNode;
|
|
14
15
|
children?: ReactNode;
|
|
15
16
|
actions?: ModalAction[];
|
|
17
|
+
style?: CSSProperties;
|
|
16
18
|
}
|
|
17
|
-
export declare const Modal: ({ open, onClose, loading, title, children, actions, }: ModalProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
19
|
+
export declare const Modal: ({ open, onClose, loading, title, header, children, actions, style, }: ModalProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
18
20
|
export {};
|
package/src/lib/Table/Table.d.ts
CHANGED
|
@@ -51,8 +51,9 @@ interface TableDataProps<T> {
|
|
|
51
51
|
sortBy?: string;
|
|
52
52
|
sortOrder?: string;
|
|
53
53
|
onSortChange?: (sortBy: string, sortOrder: string) => void;
|
|
54
|
+
error?: string;
|
|
54
55
|
}
|
|
55
56
|
export interface TableProps<T extends object> extends TableStyleProps, TableRowProps<T>, TableDataProps<T> {
|
|
56
57
|
}
|
|
57
|
-
export declare const Table: <T extends object>({ columns, data, getRowId, isLoading, pageInfo, onPageSizeChange, onPageChange, sortBy, sortOrder, onSortChange, enableRowSelection, selectedRows, onRowSelectionChange, onRowClick, contextMenuActions, dense, height, }: TableProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
58
|
+
export declare const Table: <T extends object>({ columns, data, getRowId, isLoading, pageInfo, onPageSizeChange, onPageChange, sortBy, sortOrder, onSortChange, enableRowSelection, selectedRows, onRowSelectionChange, onRowClick, contextMenuActions, dense, height, error, }: TableProps<T>) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
58
59
|
export {};
|