@zeedhi/teknisa-components-common 1.107.1 → 1.108.0

package/jest.config.js

@@ -1 +1 @@
-module.exports = require('../../jest.config.js');
+module.exports = require('../../jest.config.js');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/teknisa-components-common",
-  "version": "1.107.1",
+  "version": "1.108.0",
   "description": "Teknisa Components Common",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -32,5 +32,5 @@
   "peerDependencies": {
     "@zeedhi/core": "^1.97.0"
   },
-  "gitHead": "ce6aeb7a4ebfca43f9ecb85ed411037f6032d214"
+  "gitHead": "c23fc7d327e5cd145b75229b2dca54967ec803d3"
 }

package/tests/__helpers__/component-event-helper.ts

@@ -1,5 +1,5 @@
-import { Component } from '@zeedhi/common';
-
-const setClick = (instance: Component, event: any = {}) => instance.click(event, {});
-
-export { setClick };
+import { Component } from '@zeedhi/common';
+
+const setClick = (instance: Component, event: any = {}) => instance.click(event, {});
+
+export { setClick };

package/tests/__helpers__/flush-promises-helper.ts

@@ -1,3 +1,3 @@
-const flushPromises = () => (new Promise(setImmediate));
-
-export { flushPromises };
+const flushPromises = () => (new Promise(setImmediate));
+
+export { flushPromises };

package/tests/__helpers__/get-child-helper.ts

@@ -1,27 +1,27 @@
-import { IComponent } from '@zeedhi/common';
-
-/**
- * Search for a component inside an array of children
- *
- * The children array can be either an array of IComponent or an array of Component
- */
-const getChild = <T extends IComponent>(children: any[], name: string): T => {
-  let found: any;
-
-  children.forEach((child) => {
-    if (child.name === name) {
-      found = child;
-      return;
-    }
-
-    if (child.children && child.children.length > 0) {
-      const result = getChild<T>(child.children, name) as T;
-
-      if (result) found = result;
-    }
-  });
-
-  return found;
-};
-
-export { getChild };
+import { IComponent } from '@zeedhi/common';
+
+/**
+ * Search for a component inside an array of children
+ *
+ * The children array can be either an array of IComponent or an array of Component
+ */
+const getChild = <T extends IComponent>(children: any[], name: string): T => {
+  let found: any;
+
+  children.forEach((child) => {
+    if (child.name === name) {
+      found = child;
+      return;
+    }
+
+    if (child.children && child.children.length > 0) {
+      const result = getChild<T>(child.children, name) as T;
+
+      if (result) found = result;
+    }
+  });
+
+  return found;
+};
+
+export { getChild };

package/tests/__helpers__/index.ts

@@ -1,3 +1,3 @@
-export * from './component-event-helper';
-export * from './get-child-helper';
-export * from './mock-created-helper';
+export * from './component-event-helper';
+export * from './get-child-helper';
+export * from './mock-created-helper';

package/tests/__helpers__/mock-created-helper.ts

@@ -1,12 +1,12 @@
-import { ComponentRender } from '@zeedhi/common';
-
-/**
- * Function used to spy on a class' onCreated and always assign the componentId as 1
- */
-const mockCreated = <T extends ComponentRender>(component: T, prototype: any) => {
-  jest.spyOn(prototype, 'onCreated').mockImplementation(() => {
-    component.componentId = 1;
-  });
-};
-
-export { mockCreated };
+import { ComponentRender } from '@zeedhi/common';
+
+/**
+ * Function used to spy on a class' onCreated and always assign the componentId as 1
+ */
+const mockCreated = <T extends ComponentRender>(component: T, prototype: any) => {
+  jest.spyOn(prototype, 'onCreated').mockImplementation(() => {
+    component.componentId = 1;
+  });
+};
+
+export { mockCreated };

package/tests/__mocks__/@zeedhi/core/i18n.js

@@ -1,75 +1,75 @@
-/**
- * Mock for @zeedhi/core I18n API
- */
-
-const words = {
-  TEKGRID_CONTAINS: 'contains',
-  TEKGRID_NOT_CONTAINS: 'does not contain',
-  TEKGRID_EQUALS: 'is equal to',
-  TEKGRID_NOT_EQUALS: 'is different from',
-  TEKGRID_GREATER_THAN: 'is greater than',
-  TEKGRID_LESS_THAN: 'is less than',
-  TEKGRID_GREATER_THAN_EQUALS: 'is greater or equals to',
-  TEKGRID_LESS_THAN_EQUALS: 'is less or equals to',
-  TEKGRID_IN: 'is in',
-  TEKGRID_NOT_IN: 'is not in',
-  TEKGRID_BETWEEN: 'is between',
-  TEKGRID_AND: 'and',
-  TEKGRID_OR: 'or',
-  TEKGRID_ADD: 'Add',
-  TEKGRID_DELETE: 'Delete',
-  TEKGRID_REFRESH: 'Refresh',
-  TEKGRID_COLUMNS: 'Columns',
-  TEKGRID_SAVE: 'Save',
-  TEKGRID_CANCEL: 'Cancel',
-  TEKGRID_FILTER: 'Filter',
-  TEKGRID_MULTIPLE_VALUE_HINT: 'Separate values using ";"',
-  TEKGRID_EXPORT: 'Export',
-  TEKGRID_EXPORT_AS: 'Export as {{type}}',
-  TEKGRID_COLUMN_VISIBLE: 'Visible',
-  TEKGRID_COLUMN_GROUPED: 'Grouped',
-  TEKGRID_COLUMN_AGGREGATION: 'Aggregation',
-  TEKGRID_AGGREGATION_SUM: 'Sum',
-  TEKGRID_AGGREGATION_AVG: 'Average',
-  TEKGRID_AGGREGATION_MAX: 'Maximum',
-  TEKGRID_AGGREGATION_MIN: 'Minimum',
-  TEKGRID_AGGREGATION_COUNT: 'Count',
-  NO_NOTIFICATIONS: 'No Notifications',
-  MARK_ALL_AS_READ: 'Mark all as read',
-  NOTIFICATIONS: 'Notifications',
-  SEE_ALL_NOTIFICATIONS: 'See all notifications',
-  UNAVAILABLE_IMAGE: 'Unavailable image',
-  REFRESH: 'Refresh',
-  ACTIONS: 'Actions',
-  FILTER: 'Filter',
-  LAYOUT: 'Layout: ',
-  NEW_LAYOUT: 'New layout',
-  DEFAULT_LAYOUT: 'Default',
-};
-
-const notImplemented = (name, isMethod = true) => {
-  const member = isMethod ? `I18n.${name}() method` : `I18n.${name} property`;
-  throw new Error(`The ${member} is not yet implemented/mocked by the mock in 'tests/__mocks__/@zeedhi/core/i18n.ts'.`);
-}
-
-const mock = {
-  translate: (value, variables) => {
-    let result = words[value] || value;
-    const keys = variables ? Object.keys(variables) : undefined;
-    if (keys) {
-      keys.forEach((key) => {
-        result = result.replace(`{{${key}}}`, variables[key]);
-      });
-    }
-
-    return result;
-  },
-  registerChangeListener: () => notImplemented('registerChangeListener'),
-  unregisterChangeListener: () => notImplemented('unregisterChangeListener'),
-  init: () => notImplemented('init'),
-  changeLanguage: () => notImplemented('changeLanguage'),
-  get instance() { return { language: 'en-US'} },
-  set instance(_value) { notImplemented('instance setter') },
-}
-
+/**
+ * Mock for @zeedhi/core I18n API
+ */
+
+const words = {
+  TEKGRID_CONTAINS: 'contains',
+  TEKGRID_NOT_CONTAINS: 'does not contain',
+  TEKGRID_EQUALS: 'is equal to',
+  TEKGRID_NOT_EQUALS: 'is different from',
+  TEKGRID_GREATER_THAN: 'is greater than',
+  TEKGRID_LESS_THAN: 'is less than',
+  TEKGRID_GREATER_THAN_EQUALS: 'is greater or equals to',
+  TEKGRID_LESS_THAN_EQUALS: 'is less or equals to',
+  TEKGRID_IN: 'is in',
+  TEKGRID_NOT_IN: 'is not in',
+  TEKGRID_BETWEEN: 'is between',
+  TEKGRID_AND: 'and',
+  TEKGRID_OR: 'or',
+  TEKGRID_ADD: 'Add',
+  TEKGRID_DELETE: 'Delete',
+  TEKGRID_REFRESH: 'Refresh',
+  TEKGRID_COLUMNS: 'Columns',
+  TEKGRID_SAVE: 'Save',
+  TEKGRID_CANCEL: 'Cancel',
+  TEKGRID_FILTER: 'Filter',
+  TEKGRID_MULTIPLE_VALUE_HINT: 'Separate values using ";"',
+  TEKGRID_EXPORT: 'Export',
+  TEKGRID_EXPORT_AS: 'Export as {{type}}',
+  TEKGRID_COLUMN_VISIBLE: 'Visible',
+  TEKGRID_COLUMN_GROUPED: 'Grouped',
+  TEKGRID_COLUMN_AGGREGATION: 'Aggregation',
+  TEKGRID_AGGREGATION_SUM: 'Sum',
+  TEKGRID_AGGREGATION_AVG: 'Average',
+  TEKGRID_AGGREGATION_MAX: 'Maximum',
+  TEKGRID_AGGREGATION_MIN: 'Minimum',
+  TEKGRID_AGGREGATION_COUNT: 'Count',
+  NO_NOTIFICATIONS: 'No Notifications',
+  MARK_ALL_AS_READ: 'Mark all as read',
+  NOTIFICATIONS: 'Notifications',
+  SEE_ALL_NOTIFICATIONS: 'See all notifications',
+  UNAVAILABLE_IMAGE: 'Unavailable image',
+  REFRESH: 'Refresh',
+  ACTIONS: 'Actions',
+  FILTER: 'Filter',
+  LAYOUT: 'Layout: ',
+  NEW_LAYOUT: 'New layout',
+  DEFAULT_LAYOUT: 'Default',
+};
+
+const notImplemented = (name, isMethod = true) => {
+  const member = isMethod ? `I18n.${name}() method` : `I18n.${name} property`;
+  throw new Error(`The ${member} is not yet implemented/mocked by the mock in 'tests/__mocks__/@zeedhi/core/i18n.ts'.`);
+}
+
+const mock = {
+  translate: (value, variables) => {
+    let result = words[value] || value;
+    const keys = variables ? Object.keys(variables) : undefined;
+    if (keys) {
+      keys.forEach((key) => {
+        result = result.replace(`{{${key}}}`, variables[key]);
+      });
+    }
+
+    return result;
+  },
+  registerChangeListener: () => notImplemented('registerChangeListener'),
+  unregisterChangeListener: () => notImplemented('unregisterChangeListener'),
+  init: () => notImplemented('init'),
+  changeLanguage: () => notImplemented('changeLanguage'),
+  get instance() { return { language: 'en-US'} },
+  set instance(_value) { notImplemented('instance setter') },
+}
+
 module.exports = mock;

package/tests/__mocks__/@zeedhi/core.js

@@ -1,5 +1,5 @@
-const core = jest.requireActual('@zeedhi/core');
-
-core.I18n = require('./core/i18n');
-
+const core = jest.requireActual('@zeedhi/core');
+
+core.I18n = require('./core/i18n');
+
 module.exports = core;

package/tests/unit/components/crud/crud-add-button.spec.ts

@@ -1,56 +1,56 @@
-import { CrudAddButton } from '../../../../src';
-
-describe('CrudAddButton', () => {
-  describe('constructor()', () => {
-    it('should create new CrudAddButton with default values', () => {
-      const instance = new CrudAddButton({
-        name: 'saveButton',
-        component: 'TekCrudSaveButton',
-      });
-
-      expect(instance.clickShortcutKey).toBe('f2');
-      expect(instance.dark).toBeFalsy();
-      expect(instance.disabled).toBeFalsy();
-      expect(instance.fab).toBeFalsy();
-      expect(instance.fixed).toBeFalsy();
-      expect(instance.flat).toBeTruthy();
-      expect(instance.href).toBe('');
-      expect(instance.icon).toBeTruthy();
-      expect(instance.iconName).toBe('plus');
-      expect(instance.label).toBe('');
-      expect(instance.color).toBe('#666');
-    });
-
-    it('should create new CrudAddButton replace default values', () => {
-      const instance = new CrudAddButton({
-        name: 'saveButton',
-        component: 'TekCrudSaveButton',
-        clickShortcutKey: 'f3',
-        flat: true,
-        icon: false,
-        color: '#ddd',
-        iconName: 'complete',
-      });
-      expect(instance.clickShortcutKey).toBe('f3');
-      expect(instance.color).toBe('#ddd');
-      expect(instance.fixed).toBeFalsy();
-      expect(instance.flat).toBeTruthy();
-      expect(instance.icon).toBeFalsy();
-      expect(instance.iconName).toBe('complete');
-    });
-
-    it('click()', () => {
-      const method = () => undefined;
-      const instance = new CrudAddButton({
-        name: 'saveButton',
-        component: 'TekCrudSaveButton',
-        clickShortcutKey: 'f2',
-        events: { click: method },
-      });
-      const spy = jest.spyOn((instance.events as any), 'click');
-      instance.click({} as Event, {} as HTMLElement);
-      expect(spy).toHaveBeenCalledWith({ component: instance, event: {}, element: {} });
-      spy.mockClear();
-    });
-  });
-});
+import { CrudAddButton } from '../../../../src';
+
+describe('CrudAddButton', () => {
+  describe('constructor()', () => {
+    it('should create new CrudAddButton with default values', () => {
+      const instance = new CrudAddButton({
+        name: 'saveButton',
+        component: 'TekCrudSaveButton',
+      });
+
+      expect(instance.clickShortcutKey).toBe('f2');
+      expect(instance.dark).toBeFalsy();
+      expect(instance.disabled).toBeFalsy();
+      expect(instance.fab).toBeFalsy();
+      expect(instance.fixed).toBeFalsy();
+      expect(instance.flat).toBeTruthy();
+      expect(instance.href).toBe('');
+      expect(instance.icon).toBeTruthy();
+      expect(instance.iconName).toBe('plus');
+      expect(instance.label).toBe('');
+      expect(instance.color).toBe('#666');
+    });
+
+    it('should create new CrudAddButton replace default values', () => {
+      const instance = new CrudAddButton({
+        name: 'saveButton',
+        component: 'TekCrudSaveButton',
+        clickShortcutKey: 'f3',
+        flat: true,
+        icon: false,
+        color: '#ddd',
+        iconName: 'complete',
+      });
+      expect(instance.clickShortcutKey).toBe('f3');
+      expect(instance.color).toBe('#ddd');
+      expect(instance.fixed).toBeFalsy();
+      expect(instance.flat).toBeTruthy();
+      expect(instance.icon).toBeFalsy();
+      expect(instance.iconName).toBe('complete');
+    });
+
+    it('click()', () => {
+      const method = () => undefined;
+      const instance = new CrudAddButton({
+        name: 'saveButton',
+        component: 'TekCrudSaveButton',
+        clickShortcutKey: 'f2',
+        events: { click: method },
+      });
+      const spy = jest.spyOn((instance.events as any), 'click');
+      instance.click({} as Event, {} as HTMLElement);
+      expect(spy).toHaveBeenCalledWith({ component: instance, event: {}, element: {} });
+      spy.mockClear();
+    });
+  });
+});

package/tests/unit/components/crud/crud-button.spec.ts

@@ -1,94 +1,94 @@
-import { GridEditable } from '@zeedhi/common';
-import { KeyMap } from '@zeedhi/core';
-import { CrudButton, CrudForm } from '../../../../src';
-
-const dispatchEvent = (key: string, modifiers: any, repeated: boolean = false) => {
-  let prevented = false;
-  const event = new KeyboardEvent('keydown', modifiers);
-  delete (event as any).key;
-  Object.defineProperty(event, 'key', { value: key });
-  delete (event as any).code;
-  Object.defineProperty(event, 'code', { value: key });
-
-  if (repeated) {
-    delete (event as any).repeat;
-    Object.defineProperty(event, 'repeat', { value: true });
-  }
-
-  delete (event as any).preventDefault;
-  Object.defineProperty(event, 'preventDefault', {
-    value: () => {
-      prevented = true;
-    },
-  });
-  document.dispatchEvent(event);
-  return prevented;
-};
-
-describe('CrudButton', () => {
-  describe('constructor()', () => {
-    it('should init KeyMap', () => {
-      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
-      const element = document.createElement('div');
-      expect(instance.initKeyMap(element)).toBe(undefined);
-    });
-
-    it('should init shortcutClick', () => {
-      let called = false;
-      const method = () => { called = true; };
-      const keyMap = {
-        a: {
-          event: method,
-        },
-      };
-      const instance = new CrudButton({
-        name: 'button',
-        component: 'tekCrudButton',
-        clickShortcutKey: 'a',
-        keyMap,
-
-      });
-
-      KeyMap.bind(instance.keyMap);
-      dispatchEvent('a', {});
-      expect(called).toBeFalsy();
-      KeyMap.unbind(instance.keyMap);
-    });
-
-    it('should init shortcutClick disabled', () => {
-      let called = false;
-      const method = () => { called = true; };
-      const keyMap = {
-        a: {
-          event: method,
-        },
-      };
-      const instance = new CrudButton({
-        name: 'button',
-        component: 'tekCrudButton',
-        clickShortcutKey: 'a',
-        disabled: true,
-        keyMap,
-
-      });
-
-      KeyMap.bind(instance.keyMap);
-      dispatchEvent('a', {});
-      expect(called).toBeFalsy();
-    });
-
-    it('parent instanceof CrudForm', () => {
-      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
-      const crudForm = new CrudForm({ name: 'grid', component: 'CrudForm' });
-      instance.parent = crudForm;
-      expect(instance.parentIsEditing).toBeFalsy();
-    });
-
-    it('parent instanceof GridEditable', () => {
-      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
-      const crudForm = new GridEditable({ name: 'grid', component: 'CrudForm' });
-      instance.parent = crudForm;
-      expect(instance.parentIsEditing).toBeFalsy();
-    });
-  });
-});
+import { GridEditable } from '@zeedhi/common';
+import { KeyMap } from '@zeedhi/core';
+import { CrudButton, CrudForm } from '../../../../src';
+
+const dispatchEvent = (key: string, modifiers: any, repeated: boolean = false) => {
+  let prevented = false;
+  const event = new KeyboardEvent('keydown', modifiers);
+  delete (event as any).key;
+  Object.defineProperty(event, 'key', { value: key });
+  delete (event as any).code;
+  Object.defineProperty(event, 'code', { value: key });
+
+  if (repeated) {
+    delete (event as any).repeat;
+    Object.defineProperty(event, 'repeat', { value: true });
+  }
+
+  delete (event as any).preventDefault;
+  Object.defineProperty(event, 'preventDefault', {
+    value: () => {
+      prevented = true;
+    },
+  });
+  document.dispatchEvent(event);
+  return prevented;
+};
+
+describe('CrudButton', () => {
+  describe('constructor()', () => {
+    it('should init KeyMap', () => {
+      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
+      const element = document.createElement('div');
+      expect(instance.initKeyMap(element)).toBe(undefined);
+    });
+
+    it('should init shortcutClick', () => {
+      let called = false;
+      const method = () => { called = true; };
+      const keyMap = {
+        a: {
+          event: method,
+        },
+      };
+      const instance = new CrudButton({
+        name: 'button',
+        component: 'tekCrudButton',
+        clickShortcutKey: 'a',
+        keyMap,
+
+      });
+
+      KeyMap.bind(instance.keyMap);
+      dispatchEvent('a', {});
+      expect(called).toBeFalsy();
+      KeyMap.unbind(instance.keyMap);
+    });
+
+    it('should init shortcutClick disabled', () => {
+      let called = false;
+      const method = () => { called = true; };
+      const keyMap = {
+        a: {
+          event: method,
+        },
+      };
+      const instance = new CrudButton({
+        name: 'button',
+        component: 'tekCrudButton',
+        clickShortcutKey: 'a',
+        disabled: true,
+        keyMap,
+
+      });
+
+      KeyMap.bind(instance.keyMap);
+      dispatchEvent('a', {});
+      expect(called).toBeFalsy();
+    });
+
+    it('parent instanceof CrudForm', () => {
+      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
+      const crudForm = new CrudForm({ name: 'grid', component: 'CrudForm' });
+      instance.parent = crudForm;
+      expect(instance.parentIsEditing).toBeFalsy();
+    });
+
+    it('parent instanceof GridEditable', () => {
+      const instance = new CrudButton({ name: 'button', component: 'tekCrudButton' });
+      const crudForm = new GridEditable({ name: 'grid', component: 'CrudForm' });
+      instance.parent = crudForm;
+      expect(instance.parentIsEditing).toBeFalsy();
+    });
+  });
+});