diff --git a/canvas_modules/common-canvas/__tests__/common-properties/controls/expression-test.js b/canvas_modules/common-canvas/__tests__/common-properties/controls/expression-test.js
index cd5f9c8351..331b422a52 100644
--- a/canvas_modules/common-canvas/__tests__/common-properties/controls/expression-test.js
+++ b/canvas_modules/common-canvas/__tests__/common-properties/controls/expression-test.js
@@ -512,6 +512,22 @@ describe("expression-builder select from tables correctly", () => {
expect(controller.getPropertyValue(propertyId)).to.equal(" Age");
});
+ it("expression builder select a field on double clicking row", () => {
+ reset();
+ const wrapper = mountWithIntl(
+
+
+
+ );
+ const fieldTable = wrapper.find("div.properties-field-table-container");
+ tableUtils.dblClickTableRows(fieldTable, [0]);
+ expect(controller.getPropertyValue(propertyId)).to.equal(" Age");
+ });
+
it("expression builder select a field value", () => {
reset();
const wrapper = mountWithIntl(
@@ -529,6 +545,22 @@ describe("expression-builder select from tables correctly", () => {
expect(controller.getPropertyValue(propertyId)).to.equal(" 21");
});
+ it("expression builder select a Value on double clicking row", () => {
+ reset();
+ const wrapper = mountWithIntl(
+
+
+
+ );
+ const valueTable = wrapper.find("div.properties-value-table-container");
+ tableUtils.dblClickTableRows(valueTable, [0]);
+ expect(controller.getPropertyValue(propertyId)).to.equal(" 21");
+ });
+
it("expression builder select a field value of type string", () => {
reset();
const wrapper = mountWithIntl(
diff --git a/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-builder.scss b/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-builder.scss
index 82552b6a58..33ac8f3be2 100644
--- a/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-builder.scss
+++ b/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-builder.scss
@@ -68,6 +68,18 @@ $operator-margin: 50%;
width: 100%;
}
}
+.expression-builder-table{
+ .properties-vt-row-selected {
+ cursor: pointer;
+ }
+ .properties-vt-row-class {
+ &:focus {
+ color: $button-primary;
+ border: 1px solid $button-primary;
+ }
+ }
+
+}
.properties-value-table-container {
width: $values-table-width;
@@ -147,3 +159,9 @@ $operator-margin: 50%;
.properties-primaryTabs .cds--tabs-trigger {
margin-bottom: 5px;
}
+
+.expression-add-field-button {
+ svg.add-btn-svg {
+ fill: $button-primary;
+ }
+}
diff --git a/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-select-field-function.jsx b/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-select-field-function.jsx
index 38117f1f3f..059331841c 100644
--- a/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-select-field-function.jsx
+++ b/canvas_modules/common-canvas/src/common-properties/controls/expression/expression-builder/expression-select-field-function.jsx
@@ -124,8 +124,8 @@ export default class ExpressionSelectFieldOrFunction extends React.Component {
});
}
-
- onAddFieldClick(rowKey) {
+ // field table - called on row doubleclick & also Add btn click.
+ onAddFieldClick(evt, rowKey, index) {
const field = this.state.currentFieldDataset[rowKey];
let value = field.id;
if (this.state.fieldCategory !== this.recentUseCat) {
@@ -150,7 +150,8 @@ export default class ExpressionSelectFieldOrFunction extends React.Component {
});
}
- onAddValueClick(rowKey) {
+ // value table - called on row doubleclick & also Add btn click.
+ onAddValueClick(evt, rowKey, index) {
if (this.props.onChange) {
const field = this.state.currentFieldDataset[this.state.fieldSelected];
const quote = "\"";
@@ -179,7 +180,8 @@ export default class ExpressionSelectFieldOrFunction extends React.Component {
});
}
- onAddFunctionClick(rowKey) {
+ // function table - called on row doubleclick & also Add btn click.
+ onAddFunctionClick(evt, rowKey, index) {
let field;
if (this.state.functionCategory === this.recentUseCat) {
field = this.props.controller.getExpressionRecentlyUsed()[rowKey];
@@ -278,24 +280,24 @@ export default class ExpressionSelectFieldOrFunction extends React.Component {
kind="ghost"
size="sm"
>
-
+ {}
);
return addValueButtonContent;
}
- handleAddButtonClick(index, tableType) {
+ handleAddButtonClick(index, tableType, evt) {
switch (tableType) {
case "value": {
- this.onAddValueClick(index);
+ this.onAddValueClick(evt, index);
break;
}
case "field": {
- this.onAddFieldClick(index);
+ this.onAddFieldClick(evt, index);
break;
}
case "function": {
- this.onAddFunctionClick(index);
+ this.onAddFunctionClick(evt, index);
break;
}
default:
@@ -497,7 +499,7 @@ export default class ExpressionSelectFieldOrFunction extends React.Component {
return (