@vendorflow/components 2.0.53 → 2.0.57

package/lib/components/material-ui/DataTable/DataTable.d.ts

@@ -48,6 +48,7 @@ export interface TableFeatureOptions<D extends object> {
 }
 interface Props<D extends object> {
     title?: string;
+    'data-testid'?: string;
     labels?: {
         noMatchLabel?: string;
         noMatchColSpan?: number;
@@ -58,7 +59,7 @@ interface Props<D extends object> {
     renderActions?: () => ReactNode;
     renderRowSelectActions?: () => ReactNode;
 }
-export default function DataTable<D extends object>({ title, labels, columns, instance, options, renderActions, renderRowSelectActions, }: Props<D>): JSX.Element;
+export default function DataTable<D extends object>({ title, labels, columns, instance, options, renderActions, renderRowSelectActions, ...restOfProps }: Props<D>): JSX.Element;
 export declare function usePluginConfig<D extends object>(options: TableFeatureOptions<D>): PluginHook<D>[];
 export interface UseDefaultTableInstanceProps<D extends object> {
     columns: EnhancedColumn<D>[];

package/lib/components/material-ui/DataTable/DataTable.js

@@ -97,7 +97,7 @@ var EXPAND_BTN_WIDTH = 24;
 var NO_MATCH_TEXT = 'Sorry, no matching records found';
 function DataTable(_a) {
     var _b;
-    var title = _a.title, labels = _a.labels, columns = _a.columns, instance = _a.instance, options = _a.options, renderActions = _a.renderActions, renderRowSelectActions = _a.renderRowSelectActions;
+    var title = _a.title, labels = _a.labels, columns = _a.columns, instance = _a.instance, options = _a.options, renderActions = _a.renderActions, renderRowSelectActions = _a.renderRowSelectActions, restOfProps = __rest(_a, ["title", "labels", "columns", "instance", "options", "renderActions", "renderRowSelectActions"]);
     var _c = labels || { noMatchLabel: NO_MATCH_TEXT }, _d = _c.noMatchLabel, noMatchLabel = _d === void 0 ? NO_MATCH_TEXT : _d, noMatchColSpan = _c.noMatchColSpan;
     var _e = options || {}, rowExpandingConfig = _e.rowExpanding, filtersConfig = _e.filters, globalSearchConfig = _e.globalSearch, columnHidingConfig = _e.columnHiding, paginationConfig = _e.pagination, rowSelectConfig = _e.rowSelect, sortingConfig = _e.sorting;
     var ExpandedComponent = (rowExpandingConfig || {}).Component;
@@ -139,7 +139,7 @@ function DataTable(_a) {
     var tableRows = (paginationConfig === null || paginationConfig === void 0 ? void 0 : paginationConfig.enabled) ? page : rows;
     return ((0, react_1.jsx)(react_1.ClassNames, null, function (_a) {
         var css = _a.css, cx = _a.cx;
-        return ((0, react_1.jsx)(material_1.Paper, { css: css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n            width: 100%;\n            position: relative;\n          "], ["\n            width: 100%;\n            position: relative;\n          "]))) },
+        return ((0, react_1.jsx)(material_1.Paper, __assign({ css: css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n            width: 100%;\n            position: relative;\n          "], ["\n            width: 100%;\n            position: relative;\n          "]))), className: "vendorflow-table" }, restOfProps),
             (0, react_1.jsx)("div", null,
                 (0, react_1.jsx)(Toolbar_1.default, { title: title, allColumns: allColumns, columnNameById: columnNameById, globalFilter: globalFilter, enableFilters: filtersConfig === null || filtersConfig === void 0 ? void 0 : filtersConfig.enabled, enableGlobalSearch: globalSearchConfig === null || globalSearchConfig === void 0 ? void 0 : globalSearchConfig.enabled, enableHideColumns: columnHidingConfig === null || columnHidingConfig === void 0 ? void 0 : columnHidingConfig.enabled, hasRowsSelected: hasRowsSelected, numRowsSelected: numRowsSelected, setAllFilters: setAllFilters, setGlobalFilter: (globalSearchConfig === null || globalSearchConfig === void 0 ? void 0 : globalSearchConfig.setGlobalFilter) ? globalSearchConfig === null || globalSearchConfig === void 0 ? void 0 : globalSearchConfig.setGlobalFilter : setGlobalFilter, renderActions: renderActions, renderRowSelectActions: renderRowSelectActions }),
                 (filtersConfig === null || filtersConfig === void 0 ? void 0 : filtersConfig.enabled) && ((0, react_1.jsx)(AppliedFilters_1.default, { columnNameById: columnNameById, filters: filters, setFilter: setFilter }))),

package/lib/components/material-ui/InputDate/InputDate.js

@@ -61,20 +61,31 @@ var react_1 = __importStar(require("react"));
 var date_fns_1 = require("date-fns");
 var lab_1 = require("@mui/lab");
 var material_1 = require("@mui/material");
+var lodash_1 = require("lodash");
 function InputDate(props) {
     var _a = props.clearable, clearable = _a === void 0 ? true : _a, label = props.label, name = props.name, onChange = props.onChange, _b = props.inputFormat, inputFormat = _b === void 0 ? 'MM/dd/yyyy' : _b, _c = props.InputProps, InputProps = _c === void 0 ? {} : _c, restOfProps = __rest(props, ["clearable", "label", "name", "onChange", "inputFormat", "InputProps"]);
     var _d = __read((0, react_1.useState)(null), 2), value = _d[0], setValue = _d[1];
     (0, react_1.useEffect)(function () {
-        if (props.value !== value) {
-            setValue(props.value);
+        var datetime = convertToDateTime(props.value);
+        if (((0, lodash_1.isNull)(value) && !(0, lodash_1.isNull)(datetime)) ||
+            (!(0, lodash_1.isNull)(value) && (0, lodash_1.isNull)(datetime)) ||
+            (value && !(0, date_fns_1.isSameDay)(datetime, value))) {
+            setValue(datetime);
         }
     }, [props.value]);
     function handleOnChange(date) {
         setValue(date);
         if (date === null || (0, date_fns_1.isValid)(date)) {
-            onChange({ target: { name: name, value: date ? (0, date_fns_1.formatISO)(date) : null } });
+            var localDate = convertToLocalDate(date);
+            onChange({ target: { name: name, value: localDate } });
         }
     }
+    function convertToLocalDate(date) {
+        return date && (0, date_fns_1.isValid)(date) ? (0, date_fns_1.formatISO)(date, { representation: 'date' }) : null;
+    }
+    function convertToDateTime(date) {
+        return date ? (0, date_fns_1.parseISO)(date) : null;
+    }
     return (react_1.default.createElement(lab_1.DatePicker, __assign({}, restOfProps, { clearable: clearable, inputFormat: inputFormat, renderInput: function (params) { return react_1.default.createElement(material_1.TextField, __assign({}, params, InputProps, { size: (InputProps === null || InputProps === void 0 ? void 0 : InputProps.size) || 'small' })); }, label: label, onChange: handleOnChange, value: value })));
 }
 exports.default = InputDate;

package/lib/components/material-ui/InputSearchDropdown/InputSearchDropdown.js

@@ -121,7 +121,7 @@ function InputSearchDropdown(props) {
         return ((_a = value) === null || _a === void 0 ? void 0 : _a.length) || 0;
     }
     return ((0, react_1.jsx)("div", null,
-        (0, react_1.jsx)(material_1.Autocomplete, __assign({ css: (0, react_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          &&& .MuiInputBase-root {\n            padding-right: 39px;\n          }\n        "], ["\n          &&& .MuiInputBase-root {\n            padding-right: 39px;\n          }\n        "]))), autoHighlight: autoHighlight, clearOnEscape: clearOnEscape, filterOptions: !disableFilter ? filterOptions || handleOptionFilter() : function (options) { return options; }, filterSelectedOptions: filterSelectedOptions, onChange: handleOnChange, openOnFocus: openOnFocus, renderInput: renderInput || renderDefaultInput, renderTags: renderTags || renderDefaultTags, selectOnFocus: selectOnFocus, multiple: multiple, classes: mainStyles, size: size }, restOfProps, { value: getValue() })),
+        (0, react_1.jsx)(material_1.Autocomplete, __assign({ css: (0, react_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          // TODO: this is due to a bug in MaterialUI clear up when resolve -- should file a PR ticket\n          &&& .MuiInputBase-root {\n            padding-right: 39px;\n          }\n        "], ["\n          // TODO: this is due to a bug in MaterialUI clear up when resolve -- should file a PR ticket\n          &&& .MuiInputBase-root {\n            padding-right: 39px;\n          }\n        "]))), autoHighlight: autoHighlight, clearOnEscape: clearOnEscape, filterOptions: !disableFilter ? filterOptions || handleOptionFilter() : function (options) { return options; }, filterSelectedOptions: filterSelectedOptions, onChange: handleOnChange, openOnFocus: openOnFocus, renderInput: renderInput || renderDefaultInput, renderTags: renderTags || renderDefaultTags, selectOnFocus: selectOnFocus, multiple: multiple, classes: mainStyles, size: size }, restOfProps, { value: getValue() })),
         (0, react_1.jsx)("div", null,
             helperText && ((0, react_1.jsx)(material_1.Typography, { css: (0, react_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n              float: left;\n              margin-left: 14px;\n              margin-top: 4px;\n              color: ", ";\n              width: calc(100% - 82px);\n            "], ["\n              float: left;\n              margin-left: 14px;\n              margin-top: 4px;\n              color: ", ";\n              width: calc(100% - 82px);\n            "])), error ? 'red' : 'rgba(0, 0, 0, 0.54)'), variant: "caption" }, helperText)),
             multiple && max && ((0, react_1.jsx)(material_1.Typography, { css: (0, react_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n              font-size: 0.75rem;\n              text-align: right;\n              float: right;\n              margin-left: 14px;\n              margin-right: 14px;\n              margin-top: 4px;\n              color: ", ";\n              width: 40px;\n            "], ["\n              font-size: 0.75rem;\n              text-align: right;\n              float: right;\n              margin-left: 14px;\n              margin-right: 14px;\n              margin-top: 4px;\n              color: ", ";\n              width: 40px;\n            "])), error ? 'red' : 'rgba(0, 0, 0, 0.54)'), variant: "subtitle1" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vendorflow/components",
-  "version": "2.0.53",
+  "version": "2.0.57",
   "description": "React components for vendorflow",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",