@vuu-ui/vuu-table-extras 0.8.5-debug → 0.8.6-debug

package/cjs/index.js

@@ -1870,12 +1870,12 @@ var import_classnames6 = __toESM(require("classnames"), 1);
 var import_react12 = require("react");
 
 // src/datagrid-configuration-ui/column-picker/ColumnPicker.tsx
-var import_salt_lab2 = require("@heswell/salt-lab");
+var import_lab2 = require("@salt-ds/lab");
 var import_core = require("@salt-ds/core");
 var import_react5 = require("react");
 
 // src/datagrid-configuration-ui/column-picker/ColumnListItem.tsx
-var import_salt_lab = require("@heswell/salt-lab");
+var import_lab = require("@salt-ds/lab");
 var import_classnames3 = __toESM(require("classnames"), 1);
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var classBase4 = "vuuColumnListItem";
@@ -1890,7 +1890,7 @@ var ColumnListItem = ({
     [`${classBase4}-calculated`]: item == null ? void 0 : item.expression,
     [`${classBase4}-hidden`]: item == null ? void 0 : item.hidden
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_salt_lab.ListItem, { className, ...restProps, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_lab.ListItem, { className, ...restProps, children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: `${classBase4}-iconType` }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { className: `${classBase4}-label`, children: label }),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: `${classBase4}-iconHidden` })
@@ -1943,12 +1943,6 @@ var ColumnPicker = ({
     (evt, selected) => onSelectionChange == null ? void 0 : onSelectionChange(selected),
     [onSelectionChange]
   );
-  const handleDrop = (0, import_react5.useCallback)(
-    (moveFrom, moveTo) => {
-      dispatch({ type: "moveColumn", moveFrom, moveTo });
-    },
-    [dispatch]
-  );
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: classBase5, id, children: [
     /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: `${classBase5}-listColumn`, children: [
       /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("label", { htmlFor: `available-${id}`, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core.Text, { as: "h4", children: "Available Columns" }) }),
@@ -1958,7 +1952,7 @@ var ColumnPicker = ({
           className: `${classBase5}-listContainer`,
           style: { flex: 1, overflow: "hidden" },
           children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-            import_salt_lab2.List,
+            import_lab2.List,
             {
               borderless: true,
               checkable: false,
@@ -1998,16 +1992,14 @@ var ColumnPicker = ({
           className: `${classBase5}-listContainer`,
           style: { flex: 1, overflow: "hidden" },
           children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-            import_salt_lab2.List,
+            import_lab2.List,
             {
               ListItem: ColumnListItem,
-              allowDragDrop: true,
               borderless: true,
               height: "100%",
               id: `selected-${id}`,
               itemHeight: 24,
               itemToString: (item) => item.name,
-              onMoveListItem: handleDrop,
               onSelectionChange: handleSelectionChange2,
               selected: selectedColumn,
               style: { flex: 1 },
@@ -2070,20 +2062,20 @@ var ColumnPicker = ({
 
 // src/datagrid-configuration-ui/column-settings-panel/ColumnSettingsPanel.tsx
 var import_vuu_layout = require("@vuu-ui/vuu-layout");
-var import_salt_lab5 = require("@heswell/salt-lab");
+var import_lab5 = require("@salt-ds/lab");
 var import_core4 = require("@salt-ds/core");
 var import_classnames5 = __toESM(require("classnames"), 1);
 var import_react8 = require("react");
 
 // src/datagrid-configuration-ui/column-type-panel/ColumnTypePanel.tsx
 var import_vuu_utils7 = require("@vuu-ui/vuu-utils");
-var import_salt_lab4 = require("@heswell/salt-lab");
+var import_lab4 = require("@salt-ds/lab");
 var import_core3 = require("@salt-ds/core");
 var import_classnames4 = __toESM(require("classnames"), 1);
 var import_react7 = require("react");
 
 // src/datagrid-configuration-ui/column-type-panel/NumericColumnPanel.tsx
-var import_salt_lab3 = require("@heswell/salt-lab");
+var import_lab3 = require("@salt-ds/lab");
 var import_core2 = require("@salt-ds/core");
 var import_react6 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
@@ -2138,9 +2130,12 @@ var NumericColumnPanel = ({
   switch (column.serverDataType) {
     case "double":
       return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_salt_lab3.FormField, { label: "No of Decimals", labelPlacement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_salt_lab3.StepperInput, { value: decimals, onChange: handleChangeDecimals }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core2.FormField, { labelPlacement: "top", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core2.FormFieldLabel, { children: "No of Decimals" }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lab3.StepperInput, { value: decimals, onChange: handleChangeDecimals })
+        ] }),
         /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          import_salt_lab3.Switch,
+          import_lab3.Switch,
           {
             checked: alignOnDecimals,
             label: "Align on decimals",
@@ -2149,7 +2144,7 @@ var NumericColumnPanel = ({
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-          import_salt_lab3.Switch,
+          import_lab3.Switch,
           {
             checked: zeroPad,
             label: "Zero pad",
@@ -2231,7 +2226,7 @@ var ColumnTypePanel = ({
   const availableRenderers = getAvailableCellRenderers(column);
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-      import_salt_lab4.Dropdown,
+      import_lab4.Dropdown,
       {
         className: (0, import_classnames4.default)(`${classBase6}-renderer`),
         fullWidth: true,
@@ -2256,7 +2251,6 @@ var classBase7 = "vuuColumnSettingsPanel";
 var tabstripProps = {
   className: "salt-density-high"
 };
-var NullActivationIndicator = () => null;
 var ColumnSettingsPanel = ({
   column,
   dispatchColumnAction,
@@ -2282,11 +2276,11 @@ var ColumnSettingsPanel = ({
     [dispatchUpdate]
   );
   const handleChangeHidden = (0, import_react8.useCallback)(
-    (evt, value) => dispatchUpdate({ hidden: value }),
+    (evt) => dispatchUpdate({ hidden: evt.target.checked }),
     [dispatchUpdate]
   );
   const handleChangeLabel = (0, import_react8.useCallback)(
-    (evt, value) => dispatchUpdate({ label: value }),
+    (evt) => dispatchUpdate({ label: evt.target.value }),
     [dispatchUpdate]
   );
   const handleChangeWidth = (0, import_react8.useCallback)(
@@ -2307,76 +2301,72 @@ var ColumnSettingsPanel = ({
           import_vuu_layout.Stack,
           {
             active: activeTab,
-            showTabs: true,
             className: (0, import_classnames5.default)(`${classBase7}-columnTabs`),
             onTabSelectionChanged: setActiveTab,
             TabstripProps: tabstripProps,
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.Panel, { title: "Column", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.FormField, { label: "Hidden", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.Checkbox,
-                  {
-                    checked: column.hidden === true,
-                    onChange: handleChangeHidden
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.FormField, { label: "Label", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.Input,
-                  {
-                    value: (_a = column.label) != null ? _a : column.name,
-                    onChange: handleChangeLabel
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.FormField, { label: "Width", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.StepperInput,
-                  {
-                    value: (_b = column.width) != null ? _b : 100,
-                    onChange: handleChangeWidth
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.FormField,
-                  {
-                    label: "Align",
-                    labelPlacement: "left",
-                    ActivationIndicatorComponent: NullActivationIndicator,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-                      import_salt_lab5.RadioButtonGroup,
-                      {
-                        "aria-label": "Column Align",
-                        value: (_c = column.align) != null ? _c : "left",
-                        legend: "Align",
-                        onChange: handleChangeAlign,
-                        children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.RadioButton, { label: "Left", value: "left" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.RadioButton, { label: "Right", value: "right" })
-                        ]
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.FormField,
-                  {
-                    label: "Pin Column",
-                    labelPlacement: "left",
-                    ActivationIndicatorComponent: NullActivationIndicator,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-                      import_salt_lab5.RadioButtonGroup,
-                      {
-                        "aria-label": "Pin Column",
-                        value: (_d = column.pin) != null ? _d : "",
-                        legend: "Pin Column",
-                        onChange: handleChangePin,
-                        children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.RadioButton, { label: "Do not pin", value: "" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.RadioButton, { label: "Left", value: "left" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.RadioButton, { label: "Right", value: "right" })
-                        ]
-                      }
-                    )
-                  }
-                )
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Hidden" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                    import_core4.Checkbox,
+                    {
+                      checked: column.hidden === true,
+                      onChange: handleChangeHidden
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Label" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                    import_core4.Input,
+                    {
+                      value: (_a = column.label) != null ? _a : column.name,
+                      onChange: handleChangeLabel
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Width" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                    import_lab5.StepperInput,
+                    {
+                      value: (_b = column.width) != null ? _b : 100,
+                      onChange: handleChangeWidth
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "ALign" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+                    import_core4.RadioButtonGroup,
+                    {
+                      "aria-label": "Column Align",
+                      value: (_c = column.align) != null ? _c : "left",
+                      onChange: handleChangeAlign,
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.RadioButton, { label: "Left", value: "left" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.RadioButton, { label: "Right", value: "right" })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Pin Column" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+                    import_core4.RadioButtonGroup,
+                    {
+                      "aria-label": "Pin Column",
+                      value: (_d = column.pin) != null ? _d : "",
+                      onChange: handleChangePin,
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.RadioButton, { label: "Do not pin", value: "" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.RadioButton, { label: "Left", value: "left" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.RadioButton, { label: "Right", value: "right" })
+                      ]
+                    }
+                  )
+                ] })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 ColumnTypePanel,
@@ -2387,26 +2377,14 @@ var ColumnSettingsPanel = ({
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.Panel, { title: "Vuu", variant: "secondary", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.FormField,
-                  {
-                    label: "Name",
-                    labelPlacement: "top",
-                    readOnly: true,
-                    variant: "secondary",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.Input, { value: column.name })
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                  import_salt_lab5.FormField,
-                  {
-                    label: "Vuu type",
-                    labelPlacement: "top",
-                    readOnly: true,
-                    variant: "secondary",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_salt_lab5.Input, { value: column.serverDataType })
-                  }
-                )
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "top", readOnly: true, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Name" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.Input, { value: column.name })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core4.FormField, { labelPlacement: "top", readOnly: true, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.FormFieldLabel, { children: "Vuu Type" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core4.Input, { value: column.serverDataType })
+                ] })
               ] })
             ]
           }
@@ -2417,12 +2395,11 @@ var ColumnSettingsPanel = ({
 };
 
 // src/datagrid-configuration-ui/settings-panel/GridSettingsPanel.tsx
-var import_salt_lab6 = require("@heswell/salt-lab");
 var import_core5 = require("@salt-ds/core");
+var import_lab6 = require("@salt-ds/lab");
 var import_react9 = require("react");
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var classBase8 = "vuuGridSettingsPanel";
-var NullActivationIndicator2 = () => null;
 var GridSettingsPanel = ({
   config,
   dispatchColumnAction,
@@ -2458,35 +2435,32 @@ var GridSettingsPanel = ({
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.Text, { as: "h4", children: "Grid Settings" }),
         /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core5.Panel, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            import_salt_lab6.FormField,
-            {
-              label: "Format column labels",
-              labelPlacement: "left",
-              ActivationIndicatorComponent: NullActivationIndicator2,
-              children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
-                import_salt_lab6.RadioButtonGroup,
-                {
-                  "aria-label": "Format column labels",
-                  value: config.columnFormatHeader,
-                  legend: "Format column labels",
-                  onChange: handleChangeLabelFormatting,
-                  children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_salt_lab6.RadioButton, { label: "No Formatting", value: void 0 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_salt_lab6.RadioButton, { label: "Capitalize", value: "capitalize" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_salt_lab6.RadioButton, { label: "Uppercase", value: "uppercase" })
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_salt_lab6.FormField, { label: "Default Column Width", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            import_salt_lab6.StepperInput,
-            {
-              value: (_a = config.columnDefaultWidth) != null ? _a : 100,
-              onChange: handleChangeWidth
-            }
-          ) })
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core5.FormField, { labelPlacement: "left", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.FormFieldLabel, { children: "Format column labels" }),
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+              import_core5.RadioButtonGroup,
+              {
+                "aria-label": "Format column labels",
+                value: config.columnFormatHeader,
+                onChange: handleChangeLabelFormatting,
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.RadioButton, { label: "No Formatting", value: void 0 }),
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.RadioButton, { label: "Capitalize", value: "capitalize" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.RadioButton, { label: "Uppercase", value: "uppercase" })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core5.FormField, { labelPlacement: "left", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core5.FormFieldLabel, { children: "Default Column Width" }),
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              import_lab6.StepperInput,
+              {
+                value: (_a = config.columnDefaultWidth) != null ? _a : 100,
+                onChange: handleChangeWidth
+              }
+            )
+          ] })
         ] })
       ]
     }
@@ -2495,7 +2469,7 @@ var GridSettingsPanel = ({
 
 // src/datagrid-configuration-ui/settings-panel/useGridSettings.ts
 var import_react10 = require("react");
-var import_salt_lab7 = require("@heswell/salt-lab");
+var import_vuu_ui_controls = require("@vuu-ui/vuu-ui-controls");
 var import_vuu_utils8 = require("@vuu-ui/vuu-utils");
 var gridSettingsReducer = (state, action) => {
   console.log(`gridSettingsReducer ${action.type}`);
@@ -2571,7 +2545,7 @@ function moveColumn(state, { column, moveBy, moveFrom, moveTo }) {
   } else if (typeof moveFrom === "number" && typeof moveTo === "number") {
     return {
       ...state,
-      columns: (0, import_salt_lab7.moveItem)(stateColumns, moveFrom, moveTo)
+      columns: (0, import_vuu_ui_controls.moveItem)(stateColumns, moveFrom, moveTo)
     };
   } else {
     return state;
@@ -2654,7 +2628,6 @@ function replaceColumn(columns, column) {
 var import_vuu_layout2 = require("@vuu-ui/vuu-layout");
 
 // src/datagrid-configuration-ui/calculated-column-panel/CalculatedColumnPanel.tsx
-var import_salt_lab8 = require("@heswell/salt-lab");
 var import_core6 = require("@salt-ds/core");
 var import_react11 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
@@ -2702,7 +2675,10 @@ var CalculatedColumnPanel = ({
   }, [columnName, dispatchColumnAction]);
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core6.Panel, { className: "vuuCalculatedColumnPanel", title: "Define Computed Column", children: [
     /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core6.Text, { styleAs: "h4", children: "Define Computed Column" }),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_salt_lab8.FormField, { label: "Column Name", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_salt_lab8.Input, { value: columnName, onChange: handleChangeName }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core6.FormField, { labelPlacement: "left", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core6.FormFieldLabel, { children: "Column Name" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core6.Input, { value: columnName, onChange: handleChangeName })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       ColumnExpressionInput,
       {
@@ -2782,7 +2758,6 @@ var DatagridSettingsPanel = ({
         getTabLabel,
         active: selectedTabIndex === 2 ? 1 : selectedTabIndex,
         onTabSelectionChanged: handleTabSelectionChanged,
-        showTabs: true,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             GridSettingsPanel,
@@ -2864,20 +2839,20 @@ var DataSourceStats = ({
 
 // src/table-settings/column-settings-panel/ColumnSettingsPanel.tsx
 var import_vuu_layout3 = require("@vuu-ui/vuu-layout");
-var import_salt_lab11 = require("@heswell/salt-lab");
+var import_lab9 = require("@salt-ds/lab");
 var import_core10 = require("@salt-ds/core");
 var import_classnames9 = __toESM(require("classnames"), 1);
 var import_react16 = require("react");
 
 // src/table-settings/column-type-panel/ColumnTypePanel.tsx
 var import_vuu_utils9 = require("@vuu-ui/vuu-utils");
-var import_salt_lab10 = require("@heswell/salt-lab");
+var import_lab8 = require("@salt-ds/lab");
 var import_core9 = require("@salt-ds/core");
 var import_classnames8 = __toESM(require("classnames"), 1);
 var import_react15 = require("react");
 
 // src/table-settings/column-type-panel/NumericColumnPanel.tsx
-var import_salt_lab9 = require("@heswell/salt-lab");
+var import_lab7 = require("@salt-ds/lab");
 var import_core8 = require("@salt-ds/core");
 var import_react14 = require("react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
@@ -2932,9 +2907,12 @@ var NumericColumnPanel2 = ({
   switch (column.serverDataType) {
     case "double":
       return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_salt_lab9.FormField, { label: "No of Decimals", labelPlacement: "top", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_salt_lab9.StepperInput, { value: decimals, onChange: handleChangeDecimals }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core8.FormField, { labelPlacement: "top", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core8.FormFieldLabel, { children: "No of Decimals" }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lab7.StepperInput, { value: decimals, onChange: handleChangeDecimals })
+        ] }),
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          import_salt_lab9.Switch,
+          import_lab7.Switch,
           {
             checked: alignOnDecimals,
             label: "Align on decimals",
@@ -2943,7 +2921,7 @@ var NumericColumnPanel2 = ({
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-          import_salt_lab9.Switch,
+          import_lab7.Switch,
           {
             checked: zeroPad,
             label: "Zero pad",
@@ -3025,7 +3003,7 @@ var ColumnTypePanel2 = ({
   const availableRenderers = getAvailableCellRenderers2(column);
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-      import_salt_lab10.Dropdown,
+      import_lab8.Dropdown,
       {
         className: (0, import_classnames8.default)(`${classBase11}-renderer`),
         fullWidth: true,
@@ -3050,7 +3028,6 @@ var classBase12 = "vuuColumnSettingsPanel";
 var tabstripProps2 = {
   className: "salt-density-high"
 };
-var NullActivationIndicator3 = () => null;
 var ColumnSettingsPanel2 = ({
   column,
   dispatchColumnAction,
@@ -3076,11 +3053,11 @@ var ColumnSettingsPanel2 = ({
     [dispatchUpdate]
   );
   const handleChangeHidden = (0, import_react16.useCallback)(
-    (evt, value) => dispatchUpdate({ hidden: value }),
+    (evt) => dispatchUpdate({ hidden: evt.target.checked }),
     [dispatchUpdate]
   );
   const handleChangeLabel = (0, import_react16.useCallback)(
-    (evt, value) => dispatchUpdate({ label: value }),
+    (evt) => dispatchUpdate({ label: evt.target.value }),
     [dispatchUpdate]
   );
   const handleChangeWidth = (0, import_react16.useCallback)(
@@ -3101,76 +3078,72 @@ var ColumnSettingsPanel2 = ({
           import_vuu_layout3.Stack,
           {
             active: activeTab,
-            showTabs: true,
             className: (0, import_classnames9.default)(`${classBase12}-columnTabs`),
             onTabSelectionChanged: setActiveTab,
             TabstripProps: tabstripProps2,
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.Panel, { title: "Column", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.FormField, { label: "Hidden", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.Checkbox,
-                  {
-                    checked: column.hidden === true,
-                    onChange: handleChangeHidden
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.FormField, { label: "Label", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.Input,
-                  {
-                    value: (_a = column.label) != null ? _a : column.name,
-                    onChange: handleChangeLabel
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.FormField, { label: "Width", labelPlacement: "left", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.StepperInput,
-                  {
-                    value: (_b = column.width) != null ? _b : 100,
-                    onChange: handleChangeWidth
-                  }
-                ) }),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.FormField,
-                  {
-                    label: "Align",
-                    labelPlacement: "left",
-                    ActivationIndicatorComponent: NullActivationIndicator3,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-                      import_salt_lab11.RadioButtonGroup,
-                      {
-                        "aria-label": "Column Align",
-                        value: (_c = column.align) != null ? _c : "left",
-                        legend: "Align",
-                        onChange: handleChangeAlign,
-                        children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.RadioButton, { label: "Left", value: "left" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.RadioButton, { label: "Right", value: "right" })
-                        ]
-                      }
-                    )
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.FormField,
-                  {
-                    label: "Pin Column",
-                    labelPlacement: "left",
-                    ActivationIndicatorComponent: NullActivationIndicator3,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-                      import_salt_lab11.RadioButtonGroup,
-                      {
-                        "aria-label": "Pin Column",
-                        value: (_d = column.pin) != null ? _d : "",
-                        legend: "Pin Column",
-                        onChange: handleChangePin,
-                        children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.RadioButton, { label: "Do not pin", value: "" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.RadioButton, { label: "Left", value: "left" }),
-                          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.RadioButton, { label: "Right", value: "right" })
-                        ]
-                      }
-                    )
-                  }
-                )
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Hidden" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                    import_core10.Checkbox,
+                    {
+                      checked: column.hidden === true,
+                      onChange: handleChangeHidden
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Label" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                    import_core10.Input,
+                    {
+                      value: (_a = column.label) != null ? _a : column.name,
+                      onChange: handleChangeLabel
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Width" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                    import_lab9.StepperInput,
+                    {
+                      value: (_b = column.width) != null ? _b : 100,
+                      onChange: handleChangeWidth
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Align" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+                    import_core10.RadioButtonGroup,
+                    {
+                      "aria-label": "Column Align",
+                      value: (_c = column.align) != null ? _c : "left",
+                      onChange: handleChangeAlign,
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.RadioButton, { label: "Left", value: "left" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.RadioButton, { label: "Right", value: "right" })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "left", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Pin Column" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+                    import_core10.RadioButtonGroup,
+                    {
+                      "aria-label": "Pin Column",
+                      value: (_d = column.pin) != null ? _d : "",
+                      onChange: handleChangePin,
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.RadioButton, { label: "Do not pin", value: "" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.RadioButton, { label: "Left", value: "left" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.RadioButton, { label: "Right", value: "right" })
+                      ]
+                    }
+                  )
+                ] })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 ColumnTypePanel2,
@@ -3181,26 +3154,14 @@ var ColumnSettingsPanel2 = ({
                 }
               ),
               /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.Panel, { title: "Vuu", variant: "secondary", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.FormField,
-                  {
-                    label: "Name",
-                    labelPlacement: "top",
-                    readOnly: true,
-                    variant: "secondary",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.Input, { value: column.name })
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  import_salt_lab11.FormField,
-                  {
-                    label: "Vuu type",
-                    labelPlacement: "top",
-                    readOnly: true,
-                    variant: "secondary",
-                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_salt_lab11.Input, { value: column.serverDataType })
-                  }
-                )
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "top", readOnly: true, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Name" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.Input, { value: column.name })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_core10.FormField, { labelPlacement: "top", readOnly: true, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.FormFieldLabel, { children: "Vuu Type" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_core10.Input, { value: column.serverDataType })
+                ] })
               ] })
             ]
           }