@cocreate/render 1.24.31 → 1.25.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.
@@ -17,10 +17,10 @@
17
17
  }
18
18
  </style>
19
19
  <body>
20
- <cocreate-select name="current_org" template_id="abc1">
21
- <selected template="abc1" render-array="data">
22
- <cc-option class="template" value="{{document.current_org}}">
23
- <h3>{{document.current_org}}</h3>
20
+ <cocreate-select key="current_org">
21
+ <selected template>
22
+ <cc-option class="template" value="{{object.current_org}}">
23
+ <h3>{{object.current_org}}</h3>
24
24
  </cc-option>
25
25
  </selected>
26
26
  </cocreate-select>
@@ -32,7 +32,7 @@
32
32
  CoCreate.render.data({
33
33
  selector: '[template=abc1]',
34
34
  data: {
35
- collection : 'dededede',
35
+ array : 'dededede',
36
36
  data: [{
37
37
  _id : '123kijfhgfkel45',
38
38
  current_org: 'test1'
@@ -44,7 +44,6 @@
44
44
  </pre>
45
45
 
46
46
  <!-- CoCreate JS CDN -->
47
- <!--<script src="../dist/CoCreate-render-key.js"></script>-->
48
47
  <script src="https://cdn.cocreate.app/latest/CoCreate.min.js"></script>
49
48
  <!-- <script src="https://cdn.cocreate.app/latest/CoCreate.min.js"></script> -->
50
49
  </body>
package/demo/index.html CHANGED
@@ -12,15 +12,13 @@
12
12
  <link rel="manifest" href="/manifest.webmanifest" />
13
13
  </head>
14
14
  <body>
15
- <div template_id="abc1">
15
+ <div template="abc1">
16
16
  <div
17
- class="template card {{render2.collection}} card margin:10px firstname"
17
+ class="template card {{render2.array}} card margin:10px firstname"
18
18
  value="{{render2.data._id}}"
19
- template_id="abc1"
20
- render-array="render2.data">
21
- <div
22
- class="card-body padding:15px"
23
- collection="{{render2.collection}}">
19
+ template
20
+ render="render2.data">
21
+ <div class="card-body padding:15px" array="{{render2.array}}">
24
22
  <h3
25
23
  class="{{render2.data.firstname}} blue"
26
24
  value="{{render2.data.lastname}} - {{render2.data.firstname}}">
@@ -29,35 +27,35 @@
29
27
  <h3
30
28
  value="{{ render2.data.lastname }}"
31
29
  test="{{lastname}}"></h3>
32
- <input value="{{ render2.collection }}" />
30
+ <input value="{{ render2.array }}" />
33
31
  <h3 class="email" value="{{render2.data.email}}">--</h3>
34
32
  <textarea value="{{render2.data.lastname}}"></textarea>
35
33
  <h3
36
34
  data-attribute="{{render2.data.personal_info.email}}"
37
- name="email"
35
+ key="email"
38
36
  value="{{render2.data.personal_info.email}}"></h3>
39
37
 
40
38
  <div
41
39
  class="template card"
42
- render-array="render2.data.testing_array">
40
+ render="render2.data.testing_array">
43
41
  testing-array template
44
42
  <h3
45
43
  data-attribute="{{render2.data.testing_array.email}}"
46
- name="email"
44
+ key="email"
47
45
  class="{{render2.data.testing_array.email}}"
48
46
  value="{{render2.data.testing_array.email}}"></h3>
49
- <h3 value="{{render2.collection}}"></h3>
47
+ <h3 value="{{render2.array}}"></h3>
50
48
 
51
49
  <h3 value="{{render2.data.personal_info.email}}"></h3>
52
50
  <div>*******************************************</div>
53
51
  </div>
54
52
  <div
55
53
  class="template card"
56
- render-array="render2.data.string_array"
57
- render-key="string">
54
+ render="render2.data.string_array"
55
+ render-as="string">
58
56
  string - template
59
57
  <h3
60
- name="test"
58
+ key="test"
61
59
  data-attribute="{{string}}"
62
60
  class="{{string}}"
63
61
  value="{{string}}"></h3>
@@ -74,7 +72,7 @@
74
72
  selector: '[template=abc1]',
75
73
  data: {
76
74
  render2: {
77
- collection : 'dededede',
75
+ array : 'dededede',
78
76
  data: [{
79
77
  _id : '123kijfhgfkel45',
80
78
  firstname : 'Jin',
@@ -18,30 +18,11 @@
18
18
  </style>
19
19
 
20
20
  <body>
21
- <filter
22
- template_id="domains"
23
- filter-name="_id"
24
- filter-value="5ff747727005da1c272740ab"></filter>
25
- <cc-options
26
- fetch-collection="organizations"
27
- fetch-name="domains"
28
- template_id="domains"
29
- class="overflow:auto">
30
- <cc-option
31
- class="template display:flex"
32
- template_id="domains"
33
- value="{{domains}}">
34
- <h4>{{domains}}</h4>
35
- </cc-option>
36
- </cc-options>
21
+ <div template>
22
+ <h3>{{object[0]._id}}</h3>
37
23
 
38
- <div template="abc1">
39
- <div
40
- class="template"
41
- render-array="data[0].current"
42
- render-key="current_org"
43
- value="{{current_org.name}}">
44
- <h3>{{current_org.name}}</h3>
24
+ <div render="object.current">
25
+ <h3>{{object.current.name}}</h3>
45
26
  </div>
46
27
  </div>
47
28
 
@@ -52,12 +33,19 @@
52
33
  CoCreate.render.data({
53
34
  selector: '[template=abc1]',
54
35
  data: {
55
- collection : 'dededede',
56
- data: [{
57
- _id : '123kijfhgfkel45',
58
- current_org: ['test1', 'test2', 'test31', 'test3'],
59
- current: [{name: 'test1w'}, {name: 'test2'}, {name: 'test31'}, {name: 'test3'}]
60
- }]
36
+ array : 'dededede',
37
+ object: [
38
+ {
39
+ _id : '123',
40
+ current_org: ['test1', 'test2'],
41
+ current: [{name: 'test1w'}, {name: 'test2'}, {name: 'test31'}, {name: 'test3'}]
42
+ },
43
+ {
44
+ _id : '321',
45
+ current_org: ['test2', 'test3'],
46
+ current: [{name: 'test1w'}, {name: 'test2'}, {name: 'test31'}, {name: 'test3'}]
47
+ }
48
+ ]
61
49
  }
62
50
 
63
51
  })
package/demo/render.html CHANGED
@@ -18,9 +18,9 @@
18
18
  </style>
19
19
 
20
20
  <body>
21
- <div template="abc1">
22
- <h3>{{document.collection}}</h3>
23
- <h3>{{document._id}}</h3>
21
+ <div template render>
22
+ <h3>{{array}}</h3>
23
+ <h3>{{object._id}}</h3>
24
24
  </div>
25
25
 
26
26
  <pre>
@@ -30,8 +30,8 @@
30
30
  CoCreate.render.data({
31
31
  selector: '[template=abc1]',
32
32
  data: {
33
- collection: 'dededede',
34
- data: {
33
+ array: 'dededede',
34
+ object: {
35
35
  _id : '123kijfhgfkel45',
36
36
  current_org: ['test1', 'test2', 'test31', 'test3'],
37
37
  current: [{name: 'test1w'}, {name: 'test2'}, {name: 'test31'}, {name: 'test3'}]
@@ -17,16 +17,16 @@
17
17
  }
18
18
  </style>
19
19
  <body>
20
- <div template="abc1">
20
+ <div template>
21
21
  <!-- <div>{{data}}</div>
22
- <h1> {{document.collection}} {{document._id}}</h1> -->
23
- <div class="template" render-object="" render-key="one">
22
+ <h1> {{object.array}} {{object._id}}</h1> -->
23
+ <div class="template" render="" render-as="one">
24
24
  <h5>{{one.key}}: {{one.value}}</h5>
25
25
  </div>
26
26
  <div
27
27
  class="template"
28
- render-array="data[0].current_org"
29
- render-key="current_org"
28
+ render="data[0].current_org"
29
+ render-as="current_org"
30
30
  value="{{current_org}}">
31
31
  <h3>{{current_org}}</h3>
32
32
  </div>
@@ -39,9 +39,9 @@
39
39
  CoCreate.render.data({
40
40
  selector: '[template=abc1]',
41
41
  data: {
42
- collection : 'dededede',
42
+ array : 'dededede',
43
43
  data: [{
44
- collection : 'dededede',
44
+ array : 'dededede',
45
45
  _id : '123kijfhgfkel45',
46
46
  current_org: ['test1', 'test2', 'test31', 'test3']
47
47
  }]
package/docs/index.html CHANGED
@@ -11,10 +11,10 @@
11
11
  sizes="32x32"
12
12
  href="https://cocreate.app/images/favicon.ico" />
13
13
  <meta
14
- name="description"
14
+ key="description"
15
15
  content="A simple yet powerful drag-and-drop solution powered by javascript." />
16
16
  <meta
17
- name="keywords"
17
+ key="keywords"
18
18
  content="drag and drop, colaboration, dnd utility, drag and drop utility" />
19
19
  <meta name="robots" content="index,follow" />
20
20
  <meta
@@ -29,9 +29,9 @@
29
29
  <link
30
30
  rel="stylesheet"
31
31
  href="/docs/index.css"
32
- collection="files"
33
- document_id="60888216117c640e7596303f"
34
- name="src"
32
+ array="files"
33
+ object="60888216117c640e7596303f"
34
+ key="src"
35
35
  type="text/css"
36
36
  save="true" />
37
37
  <link rel="manifest" href="/manifest.webmanifest" />
@@ -44,20 +44,20 @@
44
44
  scroll="sticky-nav,hide-nav"
45
45
  scroll-up="10"
46
46
  scroll-down="10"
47
- collection="files"
48
- document_id="60395ef42b3ac232657040fd"
49
- name="src"></nav>
47
+ array="files"
48
+ object="60395ef42b3ac232657040fd"
49
+ key="src"></nav>
50
50
  <sidenav
51
51
  id="menuL"
52
52
  class="position:fixed top:0px left:0px overflow:hidden background:whitesmoke height:100vh width:0px width:300px@xl"
53
53
  resizable
54
- resize-target="[content_id='content']"
54
+ resize-selector="[content_id='content']"
55
55
  resize-property="margin-left"
56
56
  resize-value="width">
57
57
  <menu
58
- collection="files"
59
- document_id="603717b07de7fb350ae9fec8"
60
- name="src"></menu>
58
+ array="files"
59
+ object="603717b07de7fb350ae9fec8"
60
+ key="src"></menu>
61
61
  <div resize="right"></div>
62
62
  </sidenav>
63
63
  <main
@@ -80,7 +80,7 @@
80
80
  share-width="700"
81
81
  share-media="https://cdn.cocreate.app/docs/render.png"
82
82
  hover="display:block!important"
83
- hover-target=".social-networks">
83
+ hover-selector=".social-networks">
84
84
  <div class="display:none social-networks">
85
85
  <a
86
86
  class="margin-right:15px"
@@ -139,11 +139,11 @@
139
139
  class="border-bottom:1px_solid_lightgrey"
140
140
  scroll
141
141
  scroll-intersect="color:dodgerblue"
142
- scroll-target="#render-install-section">
142
+ scroll-selector="#render-install-section">
143
143
  <span
144
144
  class="display:flex align-items:center width:fit-content"
145
145
  hover="display:block!important"
146
- hover-target="[href='#render-install']">
146
+ hover-selector="[href='#render-install']">
147
147
  <h2 class="padding:5px_0px">Install</h2>
148
148
  <a
149
149
  class="margin-left:10px display:none"
@@ -168,11 +168,11 @@
168
168
  class="margin-top:80px border-bottom:1px_solid_lightgrey"
169
169
  scroll
170
170
  scroll-intersect="color:dodgerblue"
171
- scroll-target="#render-usage-section">
171
+ scroll-selector="#render-usage-section">
172
172
  <span
173
173
  class="display:flex align-items:center width:fit-content"
174
174
  hover="display:block!important"
175
- hover-target="[href='#render-usage']">
175
+ hover-selector="[href='#render-usage']">
176
176
  <h2 class="padding:5px_0px">Usage</h2>
177
177
  <a
178
178
  class="margin-left:10px display:none"
@@ -200,31 +200,31 @@
200
200
 
201
201
  <div class="margin-top:10px">
202
202
  <pre><code class="language-html">
203
- &lt;div template_id=&quot;abc1&quot; fetch-collection=&quot;render_test&quot;&gt;
204
- &lt;div class=&quot;template card {{render2.collection}} card margin:10px firstname&quot;
203
+ &lt;div template_id=&quot;abc1&quot; array=&quot;render_test&quot;&gt;
204
+ &lt;div class=&quot;template card {{render2.array}} card margin:10px firstname&quot;
205
205
  value=&quot;{{render2.data._id}}&quot;
206
206
  template_id=&quot;abc1&quot;
207
- render-array=&quot;render2.data&quot;&gt;
208
- &lt;div class=&quot;card-body padding:15px&quot; collection=&quot;{{render2.collection}}&quot;&gt;
207
+ render=&quot;render2.data&quot;&gt;
208
+ &lt;div class=&quot;card-body padding:15px&quot; array=&quot;{{render2.array}}&quot;&gt;
209
209
  &lt;h3 class=&quot;{{render2.data.firstname}} blue&quot; value=&quot;{{render2.data.lastname}} - {{render2.data.firstname}}&quot;&gt;--&lt;/h3&gt;
210
210
  &lt;h3 value=&quot;{{ render2.data.lastname }}&quot; value=&quot;{{lastname}}&quot;&gt;&lt;/h3&gt;
211
- &lt;input value=&quot;{{ render2.collection }}&quot;/&gt;
211
+ &lt;input value=&quot;{{ render2.array }}&quot;/&gt;
212
212
  &lt;h3 class=&quot;email&quot; value=&quot;{{render2.data.email}}&quot;&gt;--&lt;/h3&gt;
213
213
  &lt;textarea value=&quot;{{render2.data.lastname}}&quot;&gt;&lt;/textarea&gt;
214
- &lt;h3 data-attribute=&quot;{{render2.data.personal_info.email}}&quot; name=&quot;email&quot; value=&quot;{{render2.data.personal_info.email}}&quot;&gt;&lt;/h3&gt;
214
+ &lt;h3 data-attribute=&quot;{{render2.data.personal_info.email}}&quot; key=&quot;email&quot; value=&quot;{{render2.data.personal_info.email}}&quot;&gt;&lt;/h3&gt;
215
215
 
216
216
  &lt;div class=&quot;template card &quot;
217
- render-array=&quot;render2.data.testing_array&quot;&gt;
217
+ render=&quot;render2.data.testing_array&quot;&gt;
218
218
 
219
- &lt;h3 data-attribute=&quot;{{render2.data.testing_array.email}}&quot; name=&quot;email&quot; class=&quot;{{render2.data.testing_array.email}}&quot; value=&quot;{{render2.data.testing_array.email}}&quot;&gt;&lt;/h3&gt;
220
- &lt;h3 value=&quot;{{render2.collection}}&quot;&gt;&lt;/h3&gt;
219
+ &lt;h3 data-attribute=&quot;{{render2.data.testing_array.email}}&quot; key=&quot;email&quot; class=&quot;{{render2.data.testing_array.email}}&quot; value=&quot;{{render2.data.testing_array.email}}&quot;&gt;&lt;/h3&gt;
220
+ &lt;h3 value=&quot;{{render2.array}}&quot;&gt;&lt;/h3&gt;
221
221
 
222
222
  &lt;h3 value=&quot;{{render2.data.personal_info.email}}&quot;&gt;&lt;/h3&gt;
223
223
  &lt;/div&gt;
224
224
  &lt;div class=&quot;template card &quot;
225
- render-array=&quot;render2.data.string_array&quot; render-key=&quot;string_&quot;&gt;
225
+ render=&quot;render2.data.string_array&quot; render-as=&quot;string_&quot;&gt;
226
226
 
227
- &lt;h3 name=&quot;test&quot;
227
+ &lt;h3 key=&quot;test&quot;
228
228
  data-attribute=&quot;{{string_.--}}&quot;
229
229
  class=&quot;{{string_.--}}&quot;
230
230
  value=&quot;{{string_.--}}&quot;&gt;&lt;/h3&gt;
@@ -244,7 +244,7 @@
244
244
  selector: '[template=abc1]',
245
245
  data: {
246
246
  render2: {
247
- collection : 'dededede',
247
+ array : 'dededede',
248
248
  data: [{
249
249
  _id : '123kijfhgfkel45',
250
250
  firstname : 'Jin',
@@ -279,11 +279,11 @@
279
279
  class="margin-top:80px border-bottom:1px_solid_lightgrey"
280
280
  scroll
281
281
  scroll-intersect="color:dodgerblue"
282
- scroll-target="#render-attributes-section">
282
+ scroll-selector="#render-attributes-section">
283
283
  <span
284
284
  class="display:flex align-items:center width:fit-content"
285
285
  hover="display:block!important"
286
- hover-target="[href='#render-attributes']">
286
+ hover-selector="[href='#render-attributes']">
287
287
  <h2 class="padding:5px_0px">Attributes</h2>
288
288
  <a
289
289
  class="margin-left:10px display:none"
@@ -298,7 +298,7 @@
298
298
  <li
299
299
  class="padding:15px_0px border-bottom:1px_solid_lightgrey">
300
300
  <h4>
301
- <span>render-array</span>
301
+ <span>render</span>
302
302
  <span class="cocreate-badge warning"
303
303
  >optional</span
304
304
  ><span class="cocreate-badge danger"
@@ -313,18 +313,15 @@
313
313
  <li
314
314
  class="padding:15px_0px border-bottom:1px_solid_lightgrey">
315
315
  <h4>
316
- <span>render-key</span>
316
+ <span>render-as</span>
317
317
  <span class="cocreate-badge warning"
318
318
  >optional</span
319
319
  ><span class="cocreate-badge"
320
- >Default: render-array's value</span
320
+ >Default: render's value</span
321
321
  >
322
322
  </h4>
323
- <p>
324
- If render-array defined, this attribute can
325
- define
326
- </p>
327
- <p>Default value is value of render-array</p>
323
+ <p>If render defined, this attribute can define</p>
324
+ <p>Default value is value of render</p>
328
325
  </li>
329
326
  </ul>
330
327
 
@@ -446,7 +443,7 @@
446
443
  <p>
447
444
  To render the array data, Render need to define
448
445
  <code class="language-js">class="template"</code>.
449
- <code class="language-js">render-array</code>
446
+ <code class="language-js">render</code>
450
447
  </p>
451
448
 
452
449
  <h2
@@ -467,11 +464,11 @@
467
464
  class="border-bottom:1px_solid_lightgrey"
468
465
  scroll
469
466
  scroll-intersect="color:dodgerblue"
470
- scroll-target="#render-demo-section">
467
+ scroll-selector="#render-demo-section">
471
468
  <span
472
469
  class="display:flex align-items:center width:fit-content"
473
470
  hover="display:block!important"
474
- hover-target="[href='#render-demo']">
471
+ hover-selector="[href='#render-demo']">
475
472
  <h2 class="padding:5px_0px">Demo</h2>
476
473
  <a
477
474
  class="margin-left:10px display:none"
@@ -495,9 +492,9 @@
495
492
  <textarea
496
493
  type="code"
497
494
  lang="html"
498
- collection="demos"
499
- document_id=""
500
- name="demo"
495
+ array="demos"
496
+ object=""
497
+ key="demo"
501
498
  save="false"
502
499
  id="demo"
503
500
  class="height:100% width:100% outline:none border:none resize:none padding:5px"></textarea>
@@ -520,7 +517,7 @@
520
517
  show="#eye-slash"
521
518
  hide="#eye, #demo-preview"
522
519
  toggle="code-height"
523
- toggle-target="#demo-code"
520
+ toggle-selector="#demo-code"
524
521
  ><i
525
522
  class="height:18px fill:#505050"
526
523
  src="/assets/svg/eye.svg"></i
@@ -532,7 +529,7 @@
532
529
  show="#eye, #demo-preview"
533
530
  hide="#eye-slash"
534
531
  toggle="code-height"
535
- toggle-target="#demo-code"
532
+ toggle-selector="#demo-code"
536
533
  ><i
537
534
  class="height:20px fill:#505050"
538
535
  src="/assets/svg/eye-slash.svg"></i
@@ -559,7 +556,7 @@
559
556
  <a
560
557
  class="margin-right:5px"
561
558
  fullscreen
562
- fullscreen-target="#playground"></a>
559
+ fullscreen-selector="#playground"></a>
563
560
  </div>
564
561
  </div>
565
562
  <!-- End SandBox -->
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocreate/render",
3
- "version": "1.24.31",
3
+ "version": "1.25.0",
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",
@@ -25,7 +25,7 @@
25
25
  },
26
26
  "scripts": {
27
27
  "start": "npx webpack --config webpack.config.js",
28
- "build": "NODE_ENV=production npx webpack --config webpack.config.js",
28
+ "build": "npx webpack --mode=production --config webpack.config.js",
29
29
  "dev": "npx webpack --config webpack.config.js --watch",
30
30
  "postinstall": "node -e \"const { execSync } = require('child_process'); try { execSync('coc --version', { stdio: 'ignore' }); } catch (error) { try { execSync('npm install -g @cocreate/cli', { stdio: 'inherit' }); console.log('Installed \"@cocreate/cli\" globally.'); } catch (error) { console.error('Failed to install \"@cocreate/cli\" globally:', error); } }\""
31
31
  },
@@ -34,7 +34,7 @@
34
34
  "url": "git+https://github.com/CoCreate-app/CoCreate-render.git"
35
35
  },
36
36
  "author": "CoCreate LLC",
37
- "license": "MIT",
37
+ "license": "AGPL-3.0",
38
38
  "bugs": {
39
39
  "url": "https://github.com/CoCreate-app/CoCreate-render/issues"
40
40
  },
@@ -58,11 +58,10 @@
58
58
  "webpack-log": "^3.0.1"
59
59
  },
60
60
  "dependencies": {
61
- "@cocreate/actions": "^1.8.30",
62
- "@cocreate/api": "^1.10.29",
63
- "@cocreate/cli": "^1.33.8",
64
- "@cocreate/element-prototype": "^1.8.28",
65
- "@cocreate/observer": "^1.8.17",
66
- "@cocreate/utils": "^1.21.14"
61
+ "@cocreate/actions": "^1.8.32",
62
+ "@cocreate/api": "^1.10.31",
63
+ "@cocreate/element-prototype": "^1.8.30",
64
+ "@cocreate/observer": "^1.8.19",
65
+ "@cocreate/utils": "^1.21.16"
67
66
  }
68
67
  }