dce-reactkit 3.2.2-beta.7 → 3.2.2-beta.9

package/dist/cjs/types/components/ItemPicker/index.d.ts

@@ -13,6 +13,7 @@ declare type Props = {
      *   values updated
      */
     onChanged: (updatedItems: PickableItem[]) => void;
+    noBottomMargin?: boolean;
 };
 declare const ItemPicker: React.FC<Props>;
 export default ItemPicker;

package/dist/esm/index.js

@@ -2062,7 +2062,7 @@ const ItemPicker = (props) => {
     /*------------------------------------------------------------------------*/
     /* -------------- Props ------------- */
     // Destructure all props
-    const { title, items, onChanged, } = props;
+    const { title, items, onChanged, noBottomMargin, } = props;
     /*------------------------------------------------------------------------*/
     /*                           Component Functions                          */
     /*------------------------------------------------------------------------*/
@@ -2072,7 +2072,7 @@ const ItemPicker = (props) => {
     /*----------------------------------------*/
     /*                 Main UI                */
     /*----------------------------------------*/
-    return (React.createElement(TabBox, { title: title },
+    return (React.createElement(TabBox, { title: title, noBottomMargin: noBottomMargin },
         React.createElement("div", { style: { overflowX: 'auto' } },
             React.createElement(NestableItemList, { items: items, onChanged: onChanged }))));
 };
@@ -2603,6 +2603,7 @@ const style = `
     border: 0.05rem solid black;
     border-radius: 0.5rem;
     overflow: hidden;
+    padding: 0.7rem;
 
     /* Solid background */
     background-color: white;
@@ -2633,6 +2634,23 @@ const style = `
     /* Vertical scroll */
     overflow-y: auto;
   }
+
+  .LogReviewer-header-close-button {
+    border: 0 !important;
+    background-color: transparent !important;
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+    margin: 0 !important;
+    color: #333 !important;
+  }
+  .LogReviewer-header-close-button:hover {
+    border: 0 !important;
+    background-color: transparent !important;
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+    margin: 0 !important;
+    color: #000 !important;
+  }
 `;
 /*------------------------------------------------------------------------*/
 /*                            Static Functions                            */
@@ -2939,8 +2957,8 @@ const LogReviewer = (props) => {
         // Filter toggle
         const filterToggles = (React.createElement("div", { className: "LogReviewer-filter-toggles mb-2" },
             React.createElement("h3", { className: "m-0" }, "Filters:"),
-            React.createElement("div", { className: "LogReviewer-filter-toggle-buttons" },
-                React.createElement("button", { type: "button", id: "LogReviewer-toggle-date-filter-drawer", className: `btn btn-${FilterDrawer.Date === expandedFilterDrawer} me-2`, "aria-label": "toggle date filter drawer", onClick: () => {
+            React.createElement("div", { className: "LogReviewer-filter-toggle-buttons alert alert-secondary p-2 m-0" },
+                React.createElement("button", { type: "button", id: "LogReviewer-toggle-date-filter-drawer", className: `btn btn-${FilterDrawer.Date === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle date filter drawer", onClick: () => {
                         dispatch({
                             type: ActionType.ToggleFilterDrawer,
                             filterDrawer: FilterDrawer.Date,
@@ -2948,7 +2966,7 @@ const LogReviewer = (props) => {
                     } },
                     React.createElement(FontAwesomeIcon, { icon: faCalendar, className: "me-2" }),
                     "Date"),
-                React.createElement("button", { type: "button", id: "LogReviewer-toggle-context-filter-drawer", className: `btn btn-${FilterDrawer.Context === expandedFilterDrawer} me-2`, "aria-label": "toggle context filter drawer", onClick: () => {
+                React.createElement("button", { type: "button", id: "LogReviewer-toggle-context-filter-drawer", className: `btn btn-${FilterDrawer.Context === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle context filter drawer", onClick: () => {
                         dispatch({
                             type: ActionType.ToggleFilterDrawer,
                             filterDrawer: FilterDrawer.Context,
@@ -2956,7 +2974,7 @@ const LogReviewer = (props) => {
                     } },
                     React.createElement(FontAwesomeIcon, { icon: faCircle, className: "me-2" }),
                     "Context"),
-                (LogMetadata.Tag && Object.keys(LogMetadata.Tag).length > 0) && (React.createElement("button", { type: "button", id: "LogReviewer-toggle-tag-filter-drawer", className: `btn btn-${FilterDrawer.Tag === expandedFilterDrawer} me-2`, "aria-label": "toggle tag filter drawer", onClick: () => {
+                (LogMetadata.Tag && Object.keys(LogMetadata.Tag).length > 0) && (React.createElement("button", { type: "button", id: "LogReviewer-toggle-tag-filter-drawer", className: `btn btn-${FilterDrawer.Tag === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle tag filter drawer", onClick: () => {
                         dispatch({
                             type: ActionType.ToggleFilterDrawer,
                             filterDrawer: FilterDrawer.Tag,
@@ -2964,7 +2982,7 @@ const LogReviewer = (props) => {
                     } },
                     React.createElement(FontAwesomeIcon, { icon: faTag, className: "me-2" }),
                     "Tag")),
-                React.createElement("button", { type: "button", id: "LogReviewer-toggle-action-filter-drawer", className: `btn btn-${FilterDrawer.Action === expandedFilterDrawer} me-2`, "aria-label": "toggle action and error filter drawer", onClick: () => {
+                React.createElement("button", { type: "button", id: "LogReviewer-toggle-action-filter-drawer", className: `btn btn-${FilterDrawer.Action === expandedFilterDrawer ? 'warning' : 'light'} me-2`, "aria-label": "toggle action and error filter drawer", onClick: () => {
                         dispatch({
                             type: ActionType.ToggleFilterDrawer,
                             filterDrawer: FilterDrawer.Action,
@@ -2972,7 +2990,7 @@ const LogReviewer = (props) => {
                     } },
                     React.createElement(FontAwesomeIcon, { icon: faHammer, className: "me-2" }),
                     "Action"),
-                React.createElement("button", { type: "button", id: "LogReviewer-toggle-advanced-filter-drawer", className: `btn btn-${FilterDrawer.Advanced === expandedFilterDrawer}`, "aria-label": "toggle advanced filter drawer", onClick: () => {
+                React.createElement("button", { type: "button", id: "LogReviewer-toggle-advanced-filter-drawer", className: `btn btn-${FilterDrawer.Advanced === expandedFilterDrawer ? 'warning' : 'light'}`, "aria-label": "toggle advanced filter drawer", onClick: () => {
                         dispatch({
                             type: ActionType.ToggleFilterDrawer,
                             filterDrawer: FilterDrawer.Advanced,
@@ -3739,10 +3757,12 @@ const LogReviewer = (props) => {
         ];
         // Create intelliTable
         const dataTable = (logs.length === 0
-            ? (React.createElement("div", { className: "alert alert-warning" },
-                React.createElement("h4", { className: "m-1" }, "No Logs to Show"),
-                React.createElement("div", null, "Either your filters are too strict or no matching logs have been created yet.")))
-            : (React.createElement(IntelliTable, { title: "Matching Logs", id: "logs", data: logs, columns: columns })));
+            ? (React.createElement(React.Fragment, null,
+                React.createElement("h3", { className: "m-0" }, "Matching Logs:"),
+                React.createElement("div", { className: "alert alert-warning text-center" },
+                    React.createElement("h4", { className: "m-1" }, "No Logs to Show"),
+                    React.createElement("div", null, "Either your filters are too strict or no matching logs have been created yet."))))
+            : (React.createElement(IntelliTable, { title: "Matching Logs:", id: "logs", data: logs, columns: columns })));
         // Main body
         body = (React.createElement(React.Fragment, null,
             filters,
@@ -3754,13 +3774,8 @@ const LogReviewer = (props) => {
         React.createElement("div", { className: "LogReviewer-inner-container" },
             React.createElement("div", { className: "LogReviewer-header" },
                 React.createElement("div", { className: "LogReviewer-header-title" },
-                    React.createElement("h3", { className: "m-0" }, "Log Review Dashboard")),
-                React.createElement("button", { type: "button", className: "LogReviewer-header-close-button btn btn-dark btn-lg", "aria-label": "close log reviewer panel", onClick: onClose, style: {
-                        border: 0,
-                        backgroundColor: 'transparent',
-                        padding: 0,
-                        margin: 0,
-                    } },
+                    React.createElement("h3", { className: "text-center m-0" }, "Log Review Dashboard")),
+                React.createElement("button", { type: "button", className: "LogReviewer-header-close-button btn btn-dark btn-lg", "aria-label": "close log reviewer panel", onClick: onClose },
                     React.createElement(FontAwesomeIcon, { icon: faTimes }))),
             React.createElement("div", { className: "LogReviewer-contents" }, body))));
 };