diff --git a/dev-app/app.html b/dev-app/app.html
index ef22d170..bd02b87d 100644
--- a/dev-app/app.html
+++ b/dev-app/app.html
@@ -52,7 +52,7 @@
diff --git a/package.json b/package.json
index a1757fc1..50e19002 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "@bindable-ui/bindable",
"description": "An Aurelia component library",
- "version": "1.11.6",
+ "version": "1.11.7",
"repository": {
"type": "git",
"url": "https://github.com/bindable-ui/bindable"
diff --git a/src/components/tables/c-table/c-table-interfaces.ts b/src/components/tables/c-table/c-table-interfaces.ts
index 7c53f870..51bacbff 100644
--- a/src/components/tables/c-table/c-table-interfaces.ts
+++ b/src/components/tables/c-table/c-table-interfaces.ts
@@ -71,6 +71,11 @@ export interface CTableCol {
* If you need to highlight a search string in the table (currently only supported on c-td-truncate)
*/
getSearchVal?(): string;
+
+ /**
+ * For custom search queries, pass in the words and phrases in an array that you would like to highlight
+ */
+ getSearchPhrases?(): string[];
}
export interface CTableActions {
diff --git a/src/components/tables/td-contents/c-td-truncate/c-td-truncate.ts b/src/components/tables/td-contents/c-td-truncate/c-td-truncate.ts
index 39424c72..efbb7667 100644
--- a/src/components/tables/td-contents/c-td-truncate/c-td-truncate.ts
+++ b/src/components/tables/td-contents/c-td-truncate/c-td-truncate.ts
@@ -3,6 +3,7 @@
Licensed under the terms of the MIT license. See the LICENSE file in the project root for license terms.
*/
+import {highlightSearchPhrases} from '../../../../helpers/highlight-phrases';
import {highlightSearchText} from '../../../../helpers/highlight-text';
import * as styles from './c-td-truncate.css.json';
@@ -23,5 +24,12 @@ export class CTdTruncate {
this.searchHighlight = highlightSearchText(searchVal, this.value);
}
}
+
+ if (model.col && _.isFunction(model.col.getSearchPhrases)) {
+ const searchPhrases = model.col.getSearchPhrases();
+ if (searchPhrases.length > 0) {
+ this.searchHighlight = highlightSearchPhrases(searchPhrases, this.value);
+ }
+ }
}
}
diff --git a/src/helpers/highlight-phrases.ts b/src/helpers/highlight-phrases.ts
new file mode 100644
index 00000000..77e93224
--- /dev/null
+++ b/src/helpers/highlight-phrases.ts
@@ -0,0 +1,13 @@
+export const highlightSearchPhrases = (searchPhrases: string[], matchAgainst?: string): string => {
+ let title = matchAgainst || '';
+ title = title
+ .replace('&', '&')
+ .replace('<', '<')
+ .replace('>', '>');
+ if (searchPhrases && searchPhrases.length > 0) {
+ searchPhrases.forEach(orig => {
+ title = title.replace(orig, `${orig}`);
+ });
+ }
+ return title;
+};