kempo 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (194) hide show
  1. package/.gitattributes +2 -0
  2. package/LICENSE +21 -0
  3. package/README.md +2 -0
  4. package/dist/components/Card.js +1 -0
  5. package/dist/components/CodeEditor.js +1 -0
  6. package/dist/components/Component.js +1 -0
  7. package/dist/components/Dialog.js +1 -0
  8. package/dist/components/FocusCapture.js +1 -0
  9. package/dist/components/Icon.js +1 -0
  10. package/dist/components/Import.js +1 -0
  11. package/dist/components/LazyComponent.js +1 -0
  12. package/dist/components/ReactiveComponent.js +1 -0
  13. package/dist/components/ReactiveLazyComponent.js +1 -0
  14. package/dist/components/Resize.js +1 -0
  15. package/dist/components/Search.js +1 -0
  16. package/dist/components/ShowMore.js +1 -0
  17. package/dist/components/SideMenu.js +1 -0
  18. package/dist/components/Split.js +1 -0
  19. package/dist/components/Tabs.js +1 -0
  20. package/dist/components/ThemeSwitcher.js +1 -0
  21. package/dist/components/Timestamp.js +1 -0
  22. package/dist/components/WebSnippetEditor.js +1 -0
  23. package/dist/index.js +1 -0
  24. package/dist/kempo-hljs.css +1 -0
  25. package/dist/kempo-styles.css +1 -0
  26. package/dist/kempo-vars.css +1 -0
  27. package/dist/kempo.css +1 -0
  28. package/dist/kempo.js +1 -0
  29. package/dist/utils/cli.js +1 -0
  30. package/dist/utils/cookie.js +1 -0
  31. package/dist/utils/debounce.js +1 -0
  32. package/dist/utils/drag.js +1 -0
  33. package/dist/utils/element.js +1 -0
  34. package/dist/utils/formatTimestamp.js +1 -0
  35. package/dist/utils/fuzzyMatch.js +1 -0
  36. package/dist/utils/getPreferredTheme.js +1 -0
  37. package/dist/utils/loadCss.js +1 -0
  38. package/dist/utils/loadScript.js +1 -0
  39. package/dist/utils/object.js +1 -0
  40. package/dist/utils/string.js +1 -0
  41. package/dist/utils/toFunction.js +1 -0
  42. package/dist/utils/type.js +1 -0
  43. package/dist/utils/waitFrames.js +1 -0
  44. package/docs/components/_template.html +22 -0
  45. package/docs/components/card.html +35 -0
  46. package/docs/components/codeeditor.html +29 -0
  47. package/docs/components/component.html +88 -0
  48. package/docs/components/dialog.html +89 -0
  49. package/docs/components/icon.html +73 -0
  50. package/docs/components/import.html +34 -0
  51. package/docs/components/lazycomponent.html +50 -0
  52. package/docs/components/resize.html +107 -0
  53. package/docs/components/show-more.html +92 -0
  54. package/docs/components/sidemenu.html +97 -0
  55. package/docs/components/split.html +70 -0
  56. package/docs/components/tabs.html +33 -0
  57. package/docs/components/websnippeteditor.html +42 -0
  58. package/docs/index.html +17 -0
  59. package/docs/kempo/components/Card.js +1 -0
  60. package/docs/kempo/components/CodeEditor.js +1 -0
  61. package/docs/kempo/components/Collapse.js +1 -0
  62. package/docs/kempo/components/Component.js +1 -0
  63. package/docs/kempo/components/Dialog.js +1 -0
  64. package/docs/kempo/components/FocusCapture.js +1 -0
  65. package/docs/kempo/components/Icon.js +1 -0
  66. package/docs/kempo/components/Import.js +1 -0
  67. package/docs/kempo/components/LazyComponent.js +1 -0
  68. package/docs/kempo/components/ReactiveComponent.js +1 -0
  69. package/docs/kempo/components/ReactiveLazyComponent.js +1 -0
  70. package/docs/kempo/components/Resize.js +1 -0
  71. package/docs/kempo/components/Search.js +1 -0
  72. package/docs/kempo/components/ShowMore.js +1 -0
  73. package/docs/kempo/components/SideMenu.js +1 -0
  74. package/docs/kempo/components/Split.js +1 -0
  75. package/docs/kempo/components/Tabs.js +1 -0
  76. package/docs/kempo/components/ThemeSwitcher.js +1 -0
  77. package/docs/kempo/components/Timestamp.js +1 -0
  78. package/docs/kempo/components/WebSnippetEditor.js +1 -0
  79. package/docs/kempo/icons/arrow-down-double.svg +1 -0
  80. package/docs/kempo/icons/arrow-up-double.svg +1 -0
  81. package/docs/kempo/icons/close.svg +2 -0
  82. package/docs/kempo/icons/compare.svg +1 -0
  83. package/docs/kempo/icons/dark-mode.svg +1 -0
  84. package/docs/kempo/icons/delete.svg +1 -0
  85. package/docs/kempo/icons/filter-off.svg +1 -0
  86. package/docs/kempo/icons/filter.svg +1 -0
  87. package/docs/kempo/icons/light-mode.svg +1 -0
  88. package/docs/kempo/icons/menu.svg +1 -0
  89. package/docs/kempo/icons/pause.svg +1 -0
  90. package/docs/kempo/icons/play.svg +1 -0
  91. package/docs/kempo/icons/search.svg +1 -0
  92. package/docs/kempo/icons/settings.svg +1 -0
  93. package/docs/kempo/icons/storage.svg +1 -0
  94. package/docs/kempo/icons/trash-x.svg +1 -0
  95. package/docs/kempo/index.js +1 -0
  96. package/docs/kempo/kempo-hljs.css +1 -0
  97. package/docs/kempo/kempo-styles.css +1 -0
  98. package/docs/kempo/kempo-vars.css +1 -0
  99. package/docs/kempo/kempo.css +1 -0
  100. package/docs/kempo/kempo.js +1 -0
  101. package/docs/kempo/utils/cli.js +1 -0
  102. package/docs/kempo/utils/cookie.js +1 -0
  103. package/docs/kempo/utils/debounce.js +1 -0
  104. package/docs/kempo/utils/drag.js +1 -0
  105. package/docs/kempo/utils/element.js +1 -0
  106. package/docs/kempo/utils/formatTimestamp.js +1 -0
  107. package/docs/kempo/utils/fuzzyMatch.js +1 -0
  108. package/docs/kempo/utils/getPreferredTheme.js +1 -0
  109. package/docs/kempo/utils/loadCss.js +1 -0
  110. package/docs/kempo/utils/loadScript.js +1 -0
  111. package/docs/kempo/utils/object.js +1 -0
  112. package/docs/kempo/utils/string.js +1 -0
  113. package/docs/kempo/utils/toFunction.js +1 -0
  114. package/docs/kempo/utils/type.js +1 -0
  115. package/docs/kempo/utils/waitFrames.js +1 -0
  116. package/docs/nav-1.inc.html +66 -0
  117. package/docs/nav.inc.html +66 -0
  118. package/docs/search.json +94 -0
  119. package/docs/styles/_template.html +22 -0
  120. package/docs/styles/borders-spacing.html +193 -0
  121. package/docs/styles/buttons.html +113 -0
  122. package/docs/styles/colors.html +65 -0
  123. package/docs/styles/displays-layouts.html +156 -0
  124. package/docs/styles/embed-1.html +35 -0
  125. package/docs/styles/inputs.html +89 -0
  126. package/docs/styles/tables.html +143 -0
  127. package/docs/styles/typography.html +116 -0
  128. package/icons/arrow-down-double.svg +1 -0
  129. package/icons/arrow-up-double.svg +1 -0
  130. package/icons/close.svg +2 -0
  131. package/icons/compare.svg +1 -0
  132. package/icons/dark-mode.svg +1 -0
  133. package/icons/delete.svg +1 -0
  134. package/icons/filter-off.svg +1 -0
  135. package/icons/filter.svg +1 -0
  136. package/icons/light-mode.svg +1 -0
  137. package/icons/menu.svg +1 -0
  138. package/icons/pause.svg +1 -0
  139. package/icons/play.svg +1 -0
  140. package/icons/search.svg +1 -0
  141. package/icons/settings.svg +1 -0
  142. package/icons/storage.svg +1 -0
  143. package/icons/trash-x.svg +1 -0
  144. package/kempo/components/Card.js +65 -0
  145. package/kempo/components/CodeEditor.js +141 -0
  146. package/kempo/components/Component.js +109 -0
  147. package/kempo/components/Dialog.js +277 -0
  148. package/kempo/components/FocusCapture.js +30 -0
  149. package/kempo/components/Icon.js +60 -0
  150. package/kempo/components/Import.js +40 -0
  151. package/kempo/components/LazyComponent.js +40 -0
  152. package/kempo/components/ReactiveComponent.js +11 -0
  153. package/kempo/components/ReactiveLazyComponent.js +11 -0
  154. package/kempo/components/Resize.js +168 -0
  155. package/kempo/components/Search.js +136 -0
  156. package/kempo/components/ShowMore.js +82 -0
  157. package/kempo/components/SideMenu.js +156 -0
  158. package/kempo/components/Split.js +133 -0
  159. package/kempo/components/Tabs.js +254 -0
  160. package/kempo/components/ThemeSwitcher.js +77 -0
  161. package/kempo/components/Timestamp.js +25 -0
  162. package/kempo/components/WebSnippetEditor.js +159 -0
  163. package/kempo/kempo-hljs.css +145 -0
  164. package/kempo/kempo-styles.css +893 -0
  165. package/kempo/kempo-vars.css +154 -0
  166. package/kempo/kempo.js +48 -0
  167. package/kempo/utils/cli.js +54 -0
  168. package/kempo/utils/cookie.js +16 -0
  169. package/kempo/utils/debounce.js +9 -0
  170. package/kempo/utils/drag.js +74 -0
  171. package/kempo/utils/element.js +69 -0
  172. package/kempo/utils/formatTimestamp.js +11 -0
  173. package/kempo/utils/fuzzyMatch.js +55 -0
  174. package/kempo/utils/getPreferredTheme.js +1 -0
  175. package/kempo/utils/loadCss.js +10 -0
  176. package/kempo/utils/loadScript.js +10 -0
  177. package/kempo/utils/object.js +177 -0
  178. package/kempo/utils/string.js +54 -0
  179. package/kempo/utils/toFunction.js +24 -0
  180. package/kempo/utils/type.js +8 -0
  181. package/kempo/utils/waitFrames.js +17 -0
  182. package/package.json +33 -0
  183. package/scripts/build.js +131 -0
  184. package/scripts/docs.js +14 -0
  185. package/test/components/SuiteList.js +26 -0
  186. package/test/components/Test.js +357 -0
  187. package/test/index.html +49 -0
  188. package/test/index.js +25 -0
  189. package/test/suite.html +45 -0
  190. package/test/suites.inc.html +4 -0
  191. package/test/tests/components/Component.test.js +138 -0
  192. package/test/tests/utils/cli.test.js +113 -0
  193. package/test/tests/utils/cookie.test.js +87 -0
  194. package/test/tests/utils/debounce.test.js +71 -0
@@ -0,0 +1,113 @@
1
+ import cli from '../../kempo/utils/cli.js';
2
+
3
+ export const name = 'CLI Tests';
4
+ export const description = 'The CLI function returns an object that contains the key-value pairs of command line arguments passed into the scripts, it supports short codes and flags (they will simply have a true value).';
5
+
6
+ export const tests = [
7
+ {
8
+ name: 'Get Arguments',
9
+ description: 'Does the function property return the arguments?',
10
+ test: ({
11
+ pass,
12
+ fail,
13
+ log
14
+ }) => {
15
+ window.global = window;
16
+ window.process = window.process || {};
17
+ window.process.argv = [
18
+ 'node',
19
+ 'scriptname',
20
+ '--arg1',
21
+ 'val1',
22
+ '--arg2',
23
+ 'val2'
24
+ ];
25
+ log(`Setting process.argv to ${JSON.stringify(process.argv)}`);
26
+ log('Running cli() to build these arguments into an object');
27
+ const results = cli();
28
+ const serialized = JSON.stringify(results);
29
+ log(`results = ${serialized}`);
30
+ if(serialized === `{"arg1":"val1","arg2":"val2"}`){
31
+ pass('The arguments were successfully parsed');
32
+ } else {
33
+ fail(
34
+ 'Expected: {"arg1":"val1","arg2":"val2"}',
35
+ `Recieved: ${serialized}`
36
+ );
37
+ }
38
+ }
39
+ },
40
+ {
41
+ name: 'Process Flags',
42
+ description: 'Does this function understand flags (argument without values)',
43
+ test: ({
44
+ pass,
45
+ fail,
46
+ log
47
+ }) => {
48
+ window.global = window;
49
+ window.process = window.process || {};
50
+ window.process.argv = [
51
+ 'node',
52
+ 'scriptname',
53
+ '--arg1',
54
+ 'val1',
55
+ '--flag1',
56
+ '--arg2',
57
+ 'val2',
58
+ '--flag2'
59
+ ];
60
+ log(`Setting process.argv to ${JSON.stringify(process.argv)}`);
61
+ log('Running cli() to build these arguments into an object');
62
+ const results = cli();
63
+ const serialized = JSON.stringify(results);
64
+ log(`results = ${serialized}`);
65
+ if(serialized === `{"arg1":"val1","flag1":true,"arg2":"val2","flag2":true}`){
66
+ pass('The arguments were successfully parsed');
67
+ } else {
68
+ fail(
69
+ 'Expected: {"arg1":"val1","flag1":true,"arg2":"val2","flag2":true}',
70
+ `Recieved: ${serialized}`
71
+ );
72
+ }
73
+ }
74
+ },
75
+ {
76
+ name: 'Process Shorthand Args',
77
+ description: 'Does this function understand shorthands, args and flags',
78
+ test: ({
79
+ pass,
80
+ fail,
81
+ log
82
+ }) => {
83
+ window.global = window;
84
+ window.process = window.process || {};
85
+ window.process.argv = [
86
+ 'node',
87
+ 'scriptname',
88
+ '-a',
89
+ 'val1',
90
+ '-b',
91
+ 'val2',
92
+ ];
93
+ const shortMap = {
94
+ a: 'arg1',
95
+ b: 'arg2'
96
+ }
97
+ log(`Setting process.argv to ${JSON.stringify(process.argv)}`);
98
+ log(`Creating a shorthand argument map ${JSON.stringify(shortMap)}`)
99
+ log('Running cli(shortMap) to build these arguments into an object');
100
+ const results = cli(shortMap);
101
+ const serialized = JSON.stringify(results);
102
+ log(`results = ${serialized}`);
103
+ if(serialized === `{"arg1":"val1","arg2":"val2"}`){
104
+ pass('The arguments were successfully parsed');
105
+ } else {
106
+ fail(
107
+ 'Expected: {"arg1":"val1","arg2":"val2"}',
108
+ `Recieved: ${serialized}`
109
+ );
110
+ }
111
+ }
112
+ }
113
+ ];
@@ -0,0 +1,87 @@
1
+ import {
2
+ saveCookie,
3
+ getCookie,
4
+ deleteCookie
5
+ } from '../../kempo/utils/cookie.js';
6
+
7
+ export const name = 'Cookie Tests';
8
+ export const description = 'Testing cookie utility functions in <code>/kempo/utils/cookie.js</code>';
9
+
10
+ export const tests = [
11
+ {
12
+ name: 'saveCookie',
13
+ description: 'Save a cookie to the browser',
14
+ test: ({
15
+ pass,
16
+ fail,
17
+ log
18
+ }) => {
19
+ const name = "test";
20
+ const expected = "test123";
21
+ log(`Using saveCookie to save the cookie ${name}="${expected}"`);
22
+ saveCookie(name, expected);
23
+ const recieved = document.cookie.split('; ').find(cookie => cookie.startsWith(`${name}=`)).split('=')[1];
24
+ log('Retrieving the value from the cookie, and comparing it to the expected value');
25
+ document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
26
+ if(expected===recieved){
27
+ pass('The cookie was successfully saved with the correct value');
28
+ } else {
29
+ fail(
30
+ 'The cookie was not saved with the correct value',
31
+ `Expected: ${expected}`,
32
+ `Recieved: ${recieved}`
33
+ );
34
+ }
35
+ }
36
+ },
37
+ {
38
+ name: 'getCookie',
39
+ description: 'Retrieve a cookie from the browser',
40
+ test: ({
41
+ pass,
42
+ fail,
43
+ log
44
+ }) => {
45
+ const name = 'test';
46
+ const expected = 'test123';
47
+ log('Manually setting a cookie');
48
+ document.cookie = `${name}=${expected}; expires='${new Date(Date.now()+60000).toUTCString()};path=/`;
49
+ log('Using getCookie to retrieve the value');
50
+ const recieved = getCookie(name);
51
+ document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
52
+ if(expected === recieved){
53
+ pass('The cookie was successfully retrieved with the correct value');
54
+ } else {
55
+ fail(
56
+ 'The cookie was not retrieved with the correct value',
57
+ `Expected: ${expected}`,
58
+ `Recieved: ${recieved}`
59
+ );
60
+ }
61
+
62
+ }
63
+ },
64
+ {
65
+ name: 'delete Cookie',
66
+ description: 'Delete a cookie from the browser',
67
+ test: ({
68
+ pass,
69
+ fail,
70
+ log
71
+ }) => {
72
+ const name = 'test';
73
+ const value = 'test123';
74
+ log('Setting cookie');
75
+ document.cookie = `${name}=${value}; expires='${new Date(Date.now()+60000).toUTCString()};path=/`;
76
+ log('Deleting cookie with deleteCookie');
77
+ deleteCookie(name);
78
+ log('Attempting to retrieve cookie');
79
+ const recieved = document.cookie.split('; ').find(cookie => cookie.startsWith(`${name}=`));
80
+ if(recieved){
81
+ fail(`A cookie was found with name "${name}" when it should have been deleted`, recieved);
82
+ } else {
83
+ pass('The cookie was successfully deleted');
84
+ }
85
+ }
86
+ }
87
+ ]
@@ -0,0 +1,71 @@
1
+ import debounce from '../../../kempo/utils/debounce.js';
2
+
3
+ const wait = ms => new Promise(r=>setTimeout(r,ms));
4
+
5
+ export const name = 'Debounce Function Test';
6
+ export const description = 'Testing debounce utility functions in <code>/kempo/utils/debounce.js</code>';
7
+
8
+ export const tests = [
9
+ {
10
+ name: 'Call Twice, Execute Once',
11
+ description: 'The debounced function will be called twice within the timeout and should only be executed once',
12
+ test: async ({
13
+ pass,
14
+ fail,
15
+ log
16
+ }) => {
17
+ log('Creating a call counter');
18
+ let callCount = 0;
19
+ log('Creating a debounced function that incraments the counter when exectured, with a debounce timeout of 100ms');
20
+ const func = debounce(()=>{
21
+ log(`debounced function executed, incrament counter to ${++callCount}`);
22
+ }, 100);
23
+ log('Waiting 10ms');
24
+ await wait(10);
25
+ log('Calling the debounced function');
26
+ func();
27
+ log('Waiting 50ms');
28
+ await wait(50);
29
+ log('Calling the debounced function');
30
+ func();
31
+ log('Waiting 200ms before checking the counter');
32
+ await wait(200);
33
+ log('Checking the counter');
34
+ if(callCount === 1){
35
+ pass('The debounced function was executed once as expected');
36
+ } else {
37
+ fail(`The debounced function should have been executed once, but was executed ${callCount} times`);
38
+ }
39
+ }
40
+ },
41
+ {
42
+ name: 'Call Twice, Execure Twice',
43
+ description: 'The debounced function will be called twice, but with long enough between calls that both should execute',
44
+ test: async ({
45
+ pass,
46
+ fail,
47
+ log
48
+ }) => {
49
+ log('Creating a call counter');
50
+ let callCount = 0;
51
+ log('Creating a debounced function that incraments the counter when exectured, with a debounce timeout of 100ms');
52
+ const func = debounce(()=>{
53
+ log(`debounced function executed, incrament counter to ${++callCount}`);
54
+ }, 100);
55
+ log('Calling the debounced function');
56
+ func();
57
+ log('Waiting 101ms');
58
+ await wait(101);
59
+ log('Calling the debounced function');
60
+ func();
61
+ log('Waiting 200ms before checking the counter');
62
+ await wait(200);
63
+ log('Checking the counter');
64
+ if(callCount === 2){
65
+ pass('The debounced function was executed once as expected');
66
+ } else {
67
+ fail(`The debounced function should have been executed once, but was executed ${callCount} times`);
68
+ }
69
+ }
70
+ }
71
+ ]