p-elements-core 1.2.32-rc8 → 1.2.32

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 (64) hide show
  1. package/.editorconfig +17 -17
  2. package/.gitlab-ci.yml +18 -18
  3. package/CHANGELOG.md +201 -201
  4. package/demo/sample.js +1 -1
  5. package/demo/screen.css +16 -16
  6. package/dist/p-elements-core-modern.js +1 -1
  7. package/dist/p-elements-core.js +1 -1
  8. package/docs/package-lock.json +6897 -6897
  9. package/docs/package.json +27 -27
  10. package/docs/src/404.md +8 -8
  11. package/docs/src/_data/demos/hello-world/hello-world.tsx +35 -35
  12. package/docs/src/_data/demos/hello-world/index.html +10 -10
  13. package/docs/src/_data/demos/hello-world/project.json +7 -7
  14. package/docs/src/_data/demos/timer/demo-timer.tsx +120 -120
  15. package/docs/src/_data/demos/timer/icons.tsx +62 -62
  16. package/docs/src/_data/demos/timer/index.html +12 -12
  17. package/docs/src/_data/demos/timer/project.json +8 -8
  18. package/docs/src/_data/global.js +13 -13
  19. package/docs/src/_data/helpers.js +19 -19
  20. package/docs/src/_includes/layouts/base.njk +30 -30
  21. package/docs/src/_includes/layouts/playground.njk +40 -40
  22. package/docs/src/_includes/partials/app-header.njk +8 -8
  23. package/docs/src/_includes/partials/head.njk +14 -14
  24. package/docs/src/_includes/partials/nav.njk +19 -19
  25. package/docs/src/_includes/partials/top-nav.njk +51 -51
  26. package/docs/src/documentation/custom-element.md +221 -221
  27. package/docs/src/documentation/decorators/bind.md +71 -71
  28. package/docs/src/documentation/decorators/custom-element-config.md +63 -63
  29. package/docs/src/documentation/decorators/property.md +83 -83
  30. package/docs/src/documentation/decorators/query.md +66 -66
  31. package/docs/src/documentation/decorators/render-property-on-set.md +60 -60
  32. package/docs/src/documentation/decorators.md +9 -9
  33. package/docs/src/documentation/reactive-properties.md +53 -53
  34. package/docs/src/index.d.ts +25 -25
  35. package/docs/src/index.md +3 -3
  36. package/docs/src/scripts/components/app-mode-switch/app-mode-switch.css +78 -78
  37. package/docs/src/scripts/components/app-mode-switch/app-mode-switch.tsx +166 -166
  38. package/docs/src/scripts/components/app-playground/app-playground.tsx +189 -189
  39. package/docs/tsconfig.json +22 -22
  40. package/index.html +10 -2
  41. package/package.json +1 -1
  42. package/readme.md +206 -206
  43. package/src/custom-element-controller.ts +31 -31
  44. package/src/custom-element.test.ts +906 -906
  45. package/src/custom-element.ts +3 -8
  46. package/src/decorators/bind.test.ts +163 -163
  47. package/src/decorators/bind.ts +46 -46
  48. package/src/decorators/custom-element-config.ts +17 -17
  49. package/src/decorators/property.test.ts +279 -279
  50. package/src/decorators/query.test.ts +146 -146
  51. package/src/decorators/query.ts +12 -12
  52. package/src/decorators/render-property-on-set.ts +3 -3
  53. package/src/helpers/css.ts +71 -71
  54. package/src/maquette/cache.ts +35 -35
  55. package/src/maquette/dom.ts +115 -115
  56. package/src/maquette/h.ts +100 -100
  57. package/src/maquette/index.ts +12 -12
  58. package/src/maquette/interfaces.ts +536 -536
  59. package/src/maquette/jsx.ts +61 -61
  60. package/src/maquette/mapping.ts +56 -56
  61. package/src/maquette/projection.ts +666 -666
  62. package/src/maquette/projector.ts +205 -205
  63. package/src/sample/mixin/highlight.tsx +33 -33
  64. package/src/sample/sample.tsx +98 -0
@@ -1,61 +1,61 @@
1
- import { VNode, VNodeChild, VNodeProperties } from "./interfaces";
2
-
3
- declare global {
4
- function jsx(
5
- tagName: string,
6
- properties: VNodeProperties | null,
7
- ...children: (VNode | string)[]
8
- ): VNode;
9
- }
10
-
11
- let toTextVNode = (data: any): VNode => {
12
- return {
13
- vnodeSelector: "",
14
- properties: undefined,
15
- children: undefined,
16
- text: data.toString(),
17
- domNode: null,
18
- };
19
- };
20
-
21
- let appendChildren = (insertions: any[], main: VNode[]) => {
22
- for (let i = 0, length = insertions.length; i < length; i++) {
23
- let item = insertions[i];
24
- if (Array.isArray(item)) {
25
- appendChildren(item, main);
26
- } else {
27
- if (item !== null && item !== undefined && item !== false) {
28
- if (!item.hasOwnProperty("vnodeSelector")) {
29
- item = toTextVNode(item);
30
- }
31
- main.push(item);
32
- }
33
- }
34
- }
35
- };
36
-
37
- export let jsx = (
38
- tagName: string,
39
- properties: VNodeProperties | null,
40
- ...childNodes: VNodeChild[]
41
- ): VNode => {
42
- if (childNodes.length === 1 && typeof childNodes[0] === "string") {
43
- return {
44
- vnodeSelector: tagName,
45
- properties: properties || undefined,
46
- children: undefined,
47
- text: childNodes[0],
48
- domNode: null,
49
- };
50
- }
51
- let children: VNode[] = [];
52
- appendChildren(childNodes, children);
53
- return {
54
- vnodeSelector: tagName,
55
- properties: properties || undefined,
56
- children: children,
57
- text: undefined,
58
- domNode: null,
59
- };
60
- };
61
-
1
+ import { VNode, VNodeChild, VNodeProperties } from "./interfaces";
2
+
3
+ declare global {
4
+ function jsx(
5
+ tagName: string,
6
+ properties: VNodeProperties | null,
7
+ ...children: (VNode | string)[]
8
+ ): VNode;
9
+ }
10
+
11
+ let toTextVNode = (data: any): VNode => {
12
+ return {
13
+ vnodeSelector: "",
14
+ properties: undefined,
15
+ children: undefined,
16
+ text: data.toString(),
17
+ domNode: null,
18
+ };
19
+ };
20
+
21
+ let appendChildren = (insertions: any[], main: VNode[]) => {
22
+ for (let i = 0, length = insertions.length; i < length; i++) {
23
+ let item = insertions[i];
24
+ if (Array.isArray(item)) {
25
+ appendChildren(item, main);
26
+ } else {
27
+ if (item !== null && item !== undefined && item !== false) {
28
+ if (!item.hasOwnProperty("vnodeSelector")) {
29
+ item = toTextVNode(item);
30
+ }
31
+ main.push(item);
32
+ }
33
+ }
34
+ }
35
+ };
36
+
37
+ export let jsx = (
38
+ tagName: string,
39
+ properties: VNodeProperties | null,
40
+ ...childNodes: VNodeChild[]
41
+ ): VNode => {
42
+ if (childNodes.length === 1 && typeof childNodes[0] === "string") {
43
+ return {
44
+ vnodeSelector: tagName,
45
+ properties: properties || undefined,
46
+ children: undefined,
47
+ text: childNodes[0],
48
+ domNode: null,
49
+ };
50
+ }
51
+ let children: VNode[] = [];
52
+ appendChildren(childNodes, children);
53
+ return {
54
+ vnodeSelector: tagName,
55
+ properties: properties || undefined,
56
+ children: children,
57
+ text: undefined,
58
+ domNode: null,
59
+ };
60
+ };
61
+
@@ -1,56 +1,56 @@
1
- import { Mapping } from "./interfaces";
2
-
3
- /**
4
- * Creates a {@link Mapping} instance that keeps an array of result objects synchronized with an array of source objects.
5
- * See {@link http://maquettejs.org/docs/arrays.html Working with arrays}.
6
- *
7
- * @param <Source> The type of source items. A database-record for instance.
8
- * @param <Target> The type of target items. A [[MaquetteComponent]] for instance.
9
- * @param getSourceKey `function(source)` that must return a key to identify each source object. The result must either be a string or a number.
10
- * @param createResult `function(source, index)` that must create a new result object from a given source. This function is identical
11
- * to the `callback` argument in `Array.map(callback)`.
12
- * @param updateResult `function(source, target, index)` that updates a result to an updated source.
13
- */
14
- export let createMapping = <Source, Target>(
15
- getSourceKey: (source: Source) => string | number,
16
- createResult: (source: Source, index: number) => Target,
17
- updateResult: (source: Source, target: Target, index: number) => void
18
- ): Mapping<Source, Target> => {
19
- let keys = [] as unknown[];
20
- let results = [] as Target[];
21
-
22
- return {
23
- results: results,
24
- map: (newSources: Source[]) => {
25
- let newKeys = newSources.map(getSourceKey);
26
- let oldTargets = results.slice();
27
- let oldIndex = 0;
28
- for (let i = 0; i < newSources.length; i++) {
29
- let source = newSources[i];
30
- let sourceKey = newKeys[i];
31
- if (sourceKey === keys[oldIndex]) {
32
- results[i] = oldTargets[oldIndex];
33
- updateResult(source, oldTargets[oldIndex], i);
34
- oldIndex++;
35
- } else {
36
- let found = false;
37
- for (let j = 1; j < keys.length + 1; j++) {
38
- let searchIndex = (oldIndex + j) % keys.length;
39
- if (keys[searchIndex] === sourceKey) {
40
- results[i] = oldTargets[searchIndex];
41
- updateResult(newSources[i], oldTargets[searchIndex], i);
42
- oldIndex = searchIndex + 1;
43
- found = true;
44
- break;
45
- }
46
- }
47
- if (!found) {
48
- results[i] = createResult(source, i);
49
- }
50
- }
51
- }
52
- results.length = newSources.length;
53
- keys = newKeys;
54
- },
55
- };
56
- };
1
+ import { Mapping } from "./interfaces";
2
+
3
+ /**
4
+ * Creates a {@link Mapping} instance that keeps an array of result objects synchronized with an array of source objects.
5
+ * See {@link http://maquettejs.org/docs/arrays.html Working with arrays}.
6
+ *
7
+ * @param <Source> The type of source items. A database-record for instance.
8
+ * @param <Target> The type of target items. A [[MaquetteComponent]] for instance.
9
+ * @param getSourceKey `function(source)` that must return a key to identify each source object. The result must either be a string or a number.
10
+ * @param createResult `function(source, index)` that must create a new result object from a given source. This function is identical
11
+ * to the `callback` argument in `Array.map(callback)`.
12
+ * @param updateResult `function(source, target, index)` that updates a result to an updated source.
13
+ */
14
+ export let createMapping = <Source, Target>(
15
+ getSourceKey: (source: Source) => string | number,
16
+ createResult: (source: Source, index: number) => Target,
17
+ updateResult: (source: Source, target: Target, index: number) => void
18
+ ): Mapping<Source, Target> => {
19
+ let keys = [] as unknown[];
20
+ let results = [] as Target[];
21
+
22
+ return {
23
+ results: results,
24
+ map: (newSources: Source[]) => {
25
+ let newKeys = newSources.map(getSourceKey);
26
+ let oldTargets = results.slice();
27
+ let oldIndex = 0;
28
+ for (let i = 0; i < newSources.length; i++) {
29
+ let source = newSources[i];
30
+ let sourceKey = newKeys[i];
31
+ if (sourceKey === keys[oldIndex]) {
32
+ results[i] = oldTargets[oldIndex];
33
+ updateResult(source, oldTargets[oldIndex], i);
34
+ oldIndex++;
35
+ } else {
36
+ let found = false;
37
+ for (let j = 1; j < keys.length + 1; j++) {
38
+ let searchIndex = (oldIndex + j) % keys.length;
39
+ if (keys[searchIndex] === sourceKey) {
40
+ results[i] = oldTargets[searchIndex];
41
+ updateResult(newSources[i], oldTargets[searchIndex], i);
42
+ oldIndex = searchIndex + 1;
43
+ found = true;
44
+ break;
45
+ }
46
+ }
47
+ if (!found) {
48
+ results[i] = createResult(source, i);
49
+ }
50
+ }
51
+ }
52
+ results.length = newSources.length;
53
+ keys = newKeys;
54
+ },
55
+ };
56
+ };