@cocreate/render 1.41.0 → 1.41.2

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 (4) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/docs/index.html +13 -35
  3. package/package.json +6 -6
  4. package/src/index.js +36 -4
package/CHANGELOG.md CHANGED
@@ -1,3 +1,19 @@
1
+ ## [1.41.2](https://github.com/CoCreate-app/CoCreate-render/compare/v1.41.1...v1.41.2) (2024-06-19)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * create new object from data to perserve its values ([a3496fc](https://github.com/CoCreate-app/CoCreate-render/commit/a3496fcb17e3488586ff8f6495c87feab7a38da8))
7
+ * handle key='{}' object ([37cc2aa](https://github.com/CoCreate-app/CoCreate-render/commit/37cc2aa324d37d248593b84b0398bc5a4938c13e))
8
+
9
+ ## [1.41.1](https://github.com/CoCreate-app/CoCreate-render/compare/v1.41.0...v1.41.1) (2024-06-12)
10
+
11
+
12
+ ### Bug Fixes
13
+
14
+ * bump cocreate dependencies ([159b84d](https://github.com/CoCreate-app/CoCreate-render/commit/159b84d5def4a8d2e430e50d39844f6aeeb49174))
15
+ * svg icon class ([9a1981d](https://github.com/CoCreate-app/CoCreate-render/commit/9a1981de65735c15f0c98642db4a189beebb5e64))
16
+
1
17
  # [1.41.0](https://github.com/CoCreate-app/CoCreate-render/compare/v1.40.4...v1.41.0) (2024-05-19)
2
18
 
3
19
 
package/docs/index.html CHANGED
@@ -81,43 +81,33 @@
81
81
  class="margin-right:15px"
82
82
  share-network="twitter"
83
83
  title="Share on twitter"
84
- ><i
85
- class="height:20px fill:#505050"
86
- src="/assets/svg/twitter.svg"></i
84
+ ><i src="/assets/svg/twitter.svg"></i
87
85
  ></a>
88
86
  <a
89
87
  class="margin-right:15px"
90
88
  share-network="facebook"
91
89
  title="Share on Facebook"
92
- ><i
93
- class="height:20px fill:#505050"
94
- src="/assets/svg/facebook.svg"></i
90
+ ><i src="/assets/svg/facebook.svg"></i
95
91
  ></a>
96
92
  <a
97
93
  class="margin-right:15px"
98
94
  share-network="instagram"
99
95
  title="Share on instagram"
100
- ><i
101
- class="height:20px fill:#505050"
102
- src="/assets/svg/instagram.svg"></i
96
+ ><i src="/assets/svg/instagram.svg"></i
103
97
  ></a>
104
98
  </div>
105
99
  <a
106
100
  class="margin-right:15px"
107
101
  share-network="share"
108
102
  title="Share on share"
109
- ><i
110
- class="height:20px fill:#505050"
111
- src="/assets/svg/share-alt.svg"></i
103
+ ><i src="/assets/svg/share-alt.svg"></i
112
104
  ></a>
113
105
  </div>
114
106
  <a
115
107
  href="https://github.com/CoCreate-app/CoCreate-dnd"
116
108
  target="_blank"
117
109
  class=""
118
- ><i
119
- class="height:20px fill:#505050"
120
- src="/assets/svg/github.svg"></i
110
+ ><i src="/assets/svg/github.svg"></i
121
111
  ></a>
122
112
  </div>
123
113
  </div>
@@ -143,9 +133,7 @@
143
133
  <a
144
134
  class="margin-left:10px display:none"
145
135
  href="#render-install"
146
- ><i
147
- class="height:20px fill:#505050"
148
- src="/assets/svg/link.svg"></i
136
+ ><i src="/assets/svg/link.svg"></i
149
137
  ></a>
150
138
  </span>
151
139
  </div>
@@ -172,9 +160,7 @@
172
160
  <a
173
161
  class="margin-left:10px display:none"
174
162
  href="#render-usage"
175
- ><i
176
- class="height:20px fill:#505050"
177
- src="/assets/svg/link.svg"></i
163
+ ><i src="/assets/svg/link.svg"></i
178
164
  ></a>
179
165
  </span>
180
166
  </div>
@@ -283,9 +269,7 @@
283
269
  <a
284
270
  class="margin-left:10px display:none"
285
271
  href="#render-attributes"
286
- ><i
287
- class="height:20px fill:#505050"
288
- src="/assets/svg/link.svg"></i
272
+ ><i src="/assets/svg/link.svg"></i
289
273
  ></a>
290
274
  </span>
291
275
  </div>
@@ -468,9 +452,7 @@
468
452
  <a
469
453
  class="margin-left:10px display:none"
470
454
  href="#render-demo"
471
- ><i
472
- class="height:20px fill:#505050"
473
- src="/assets/svg/link.svg"></i
455
+ ><i src="/assets/svg/link.svg"></i
474
456
  ></a>
475
457
  </span>
476
458
  </div>
@@ -514,7 +496,7 @@
514
496
  toggle="code-height"
515
497
  toggle-selector="#demo-code"
516
498
  ><i
517
- class="height:18px fill:#505050"
499
+ class="height:18px"
518
500
  src="/assets/svg/eye.svg"></i
519
501
  ></a>
520
502
  <a
@@ -525,18 +507,14 @@
525
507
  hide="#eye-slash"
526
508
  toggle="code-height"
527
509
  toggle-selector="#demo-code"
528
- ><i
529
- class="height:20px fill:#505050"
530
- src="/assets/svg/eye-slash.svg"></i
510
+ ><i src="/assets/svg/eye-slash.svg"></i
531
511
  ></a>
532
512
  <a
533
513
  class="margin-right:10px"
534
514
  id="code"
535
515
  show="#code-slash"
536
516
  hide="#code, #demo-code"
537
- ><i
538
- class="height:20px fill:#505050"
539
- src="/assets/svg/code.svg"></i
517
+ ><i src="/assets/svg/code.svg"></i
540
518
  ></a>
541
519
  <a
542
520
  class="margin-right:10px"
@@ -545,7 +523,7 @@
545
523
  show="#code, #demo-code"
546
524
  hide="#code-slash"
547
525
  ><i
548
- class="display:flex height:18px fill:#505050"
526
+ class="height:18px"
549
527
  src="/assets/svg/code.svg"></i
550
528
  ></a>
551
529
  <a
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocreate/render",
3
- "version": "1.41.0",
3
+ "version": "1.41.2",
4
4
  "description": "A simple render component in vanilla javascript. Easily configured using HTML5 attributes and/or JavaScript API.",
5
5
  "keywords": [
6
6
  "render",
@@ -58,10 +58,10 @@
58
58
  "webpack-log": "^3.0.1"
59
59
  },
60
60
  "dependencies": {
61
- "@cocreate/actions": "^1.18.1",
62
- "@cocreate/api": "^1.20.5",
63
- "@cocreate/element-prototype": "^1.22.2",
64
- "@cocreate/observer": "^1.16.0",
65
- "@cocreate/utils": "^1.33.6"
61
+ "@cocreate/actions": "^1.18.2",
62
+ "@cocreate/api": "^1.21.0",
63
+ "@cocreate/element-prototype": "^1.23.0",
64
+ "@cocreate/observer": "^1.16.1",
65
+ "@cocreate/utils": "^1.33.7"
66
66
  }
67
67
  }
package/src/index.js CHANGED
@@ -81,6 +81,7 @@ function init(element) {
81
81
  * @param {boolean} [options.remove] - Flag to indicate if the rendering should remove elements instead of updating or appending.
82
82
  */
83
83
  async function render({ source, element, selector, data, key, index, currentIndex, update, remove }) {
84
+ let Data = { ...data }
84
85
  if (!element) {
85
86
  if (source) {
86
87
  element = queryElements({ element: source, prefix: 'render' })
@@ -114,20 +115,21 @@ async function render({ source, element, selector, data, key, index, currentInde
114
115
  else if (!key)
115
116
  return
116
117
 
117
- }
118
+ } else if (key == '{}')
119
+ key = 'object'
118
120
  }
119
121
  let sourceData = sources.get(source)
120
122
  if (!sourceData) {
121
- sourceData = { element: source, data }
123
+ sourceData = { element: source, Data }
122
124
  sources.set(source, sourceData)
123
125
  }
124
126
 
125
127
  source = sourceData
126
128
  if (!source.data)
127
- source.data = data
129
+ source.data = Data
128
130
 
129
131
  } else if (data)
130
- source = { data }
132
+ source = { Data }
131
133
 
132
134
  if (data.$filter) {
133
135
  index = index || data.$filter.startingIndex || data.$filter.index
@@ -259,6 +261,14 @@ async function renderTemplate(template, data, key, index, keyPath) {
259
261
  element.remove()
260
262
  template.clones.delete(key)
261
263
  }
264
+ // if (renderedNodes.size) {
265
+ // for (let [element] of renderedNodes) {
266
+ // element.remove()
267
+ // }
268
+ // renderedNodes.clear();
269
+ // }
270
+
271
+
262
272
  // template.data = renderData
263
273
  }
264
274
  // else if (index) {
@@ -674,6 +684,18 @@ async function renderValue(node, data, placeholder, renderAs, renderedNode, inde
674
684
 
675
685
 
676
686
  function getRenderValue(node, data, key, renderAs) {
687
+ // TODO: handle operators directly from render placholders
688
+ // <span>{{ $toLocaleDateString.object.created.on }}</span>
689
+
690
+ let operator
691
+ if (key.startsWith('$')) {
692
+ let keys = key.split('.');
693
+ operator = keys.shift();
694
+ if (keys.length > 0) {
695
+ key = keys.join('.');
696
+ }
697
+ }
698
+
677
699
  let value = getValueFromObject(data, key);
678
700
 
679
701
  if (!value && value !== '' && node) {
@@ -742,6 +764,16 @@ function getRenderValue(node, data, key, renderAs) {
742
764
 
743
765
  } while (!value && parentTemplate)
744
766
  }
767
+
768
+ if (operator) {
769
+ if (value) {
770
+ console.log('return processed render value using operator', value)
771
+ } else {
772
+ console.log('return render operator', operator)
773
+
774
+ }
775
+ }
776
+
745
777
  return value
746
778
  }
747
779