Merge pull request #149 from bindable-ui/feature/unrestricted-classes

Updates to allow custom classes to be returned

Author: tomoguisuru

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bindable-ui/bindable",
   "description": "An Aurelia component library",
-  "version": "1.11.8",
+  "version": "1.11.9",
   "repository": {
     "type": "git",
     "url": "https://github.com/bindable-ui/bindable"

src/components/tables/c-table/c-table.test.ts

@@ -615,5 +615,26 @@ describe('c-table component', () => {
                 expect(col.sortClass).toBe(component.styles.sortDesc);
             });
         });
+
+        describe('#getClasses', () => {
+            it('will update with css class names from styles', () => {
+                const str = 'bgWarning';
+
+                const classes = component.getClasses(str);
+
+                expect(classes.split(' ')).toHaveLength(1);
+                expect(classes).toContain(component.styles.bgWarning);
+            });
+
+            it("will keep CSS class names applied that aren't in styles", () => {
+                const str = 'bgWarning my-custom-class';
+
+                const classes = component.getClasses(str);
+
+                expect(classes.split(' ')).toHaveLength(2);
+                expect(classes).toContain(component.styles.bgWarning);
+                expect(classes).toContain('my-custom-class');
+            });
+        });
     });
 });

src/components/tables/c-table/c-table.ts

@@ -171,7 +171,7 @@ export class CTable {
 
     public getClasses(str = '') {
         const keys = str.split(' ');
-        const classes = keys.map(key => this.styles[key]);
+        const classes = keys.map(key => (this.styles[key] ? this.styles[key] : key));
 
         return classes.join(' ');
     }