@cocreate/notification 1.6.5 → 1.7.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # [1.7.0](https://github.com/CoCreate-app/CoCreate-notification/compare/v1.6.5...v1.7.0) (2024-11-04)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * event condition ([d2a90da](https://github.com/CoCreate-app/CoCreate-notification/commit/d2a90da5d9d3d865467c036b2275bd5ae54b34e8))
7
+ * pretier.config.js and file formating ([d6b5f6f](https://github.com/CoCreate-app/CoCreate-notification/commit/d6b5f6ff70686520a208e67e773378c92e168b36))
8
+
9
+
10
+ ### Features
11
+
12
+ * add prettier.config.js and format files ([941bc61](https://github.com/CoCreate-app/CoCreate-notification/commit/941bc61b941ba421dadee355d5e50365d60a0cf3))
13
+ * add prettier.config.js and format files ([df1b112](https://github.com/CoCreate-app/CoCreate-notification/commit/df1b1128d332b83bd8aab498a1144c6f8039b6f3))
14
+
1
15
  ## [1.6.5](https://github.com/CoCreate-app/CoCreate-notification/compare/v1.6.4...v1.6.5) (2024-06-23)
2
16
 
3
17
 
package/docs/index.html CHANGED
@@ -1,347 +1,351 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1" />
7
- <title>CoCreate-notification Documentation | CoCreateJS</title>
8
- <link
9
- rel="icon"
10
- type="image/png"
11
- sizes="32x32"
12
- href="https://cocreate.app/images/favicon.ico" />
13
- <meta
14
- name="description"
15
- content="A JavaScript component target,update &amp; remove values in element's notification from an input,select or js api.Configurable using class, style or any custom attribute" />
16
- <meta name="robots" content="index,follow" />
17
- <meta
18
- property="og:image"
19
- content="https://cdn.cocreate.app/docs/notification.png" />
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
7
+ <title>CoCreate-notification Documentation | CoCreateJS</title>
8
+ <link
9
+ rel="icon"
10
+ type="image/png"
11
+ sizes="32x32"
12
+ href="https://cocreate.app/images/favicon.ico"
13
+ />
14
+ <meta
15
+ name="description"
16
+ content="A JavaScript component target,update &amp; remove values in element's notification from an input,select or js api.Configurable using class, style or any custom attribute"
17
+ />
18
+ <meta name="robots" content="index,follow" />
19
+ <meta
20
+ property="og:image"
21
+ content="https://cdn.cocreate.app/docs/notification.png"
22
+ />
20
23
 
21
- <link
22
- rel="stylesheet"
23
- href="../index.css"
24
- array="files"
25
- object="60888216117c640e7596303f"
26
- key="src"
27
- type="text/css"
28
- save="true" />
29
- <link rel="manifest" href="/manifest.webmanifest" />
30
- </head>
24
+ <link
25
+ rel="stylesheet"
26
+ href="../index.css"
27
+ array="files"
28
+ object="60888216117c640e7596303f"
29
+ key="src"
30
+ type="text/css"
31
+ save="true"
32
+ />
33
+ <link rel="manifest" href="/manifest.webmanifest" />
34
+ </head>
31
35
 
32
- <body>
33
- <!-- Navbar -->
34
- <nav
35
- class="width:100% display:flex align-items:center background:transparent padding-top:10px padding-bottom:10px"
36
- content_id="content"
37
- scroll="sticky-nav,"
38
- scroll-up="5"
39
- scroll-down="5"
40
- path="../"
41
- src="../components/navbar.html"></nav>
42
- <sidenav
43
- id="menuL"
44
- class="position:fixed top:0px left:0px overflow:hidden background:whitesmoke height:100vh width:0px width:300px@xl"
45
- resizable
46
- resize-selector="[content_id='content']"
47
- resize-property="margin-left"
48
- resize-value="width">
49
- <menu
50
- array="files"
51
- object="603717b07de7fb350ae9fec8"
52
- key="src"></menu>
53
- <div resize="right"></div>
54
- </sidenav>
55
- <main
56
- class="padding-top:15px padding:15px@lg@xl"
57
- content_id="content"
58
- id="cocreate-domEditorPanel">
59
- <div
60
- class="display:flex flex-wrap:wrap justify-content:space-between position:relative margin:10px">
61
- <div class="display:flex align-items:center">
62
- <h2>CoCreate-domEditorPanel</h2>
63
- </div>
64
- <div
65
- class="display:flex align-items:center font-size:20px position:absolute right:0 padding:5px background:white">
66
- <div
67
- class="display:flex align-items:center transition:0.3s padding-left:10px"
68
- share-network="true"
69
- share-text="A JavaScript component target,update &amp; remove values in element's notification from an input,select or js api.Configurable using class,style or any custom attribute"
70
- share-title="CoCreate notification"
71
- share-height="600"
72
- share-width="700"
73
- share-media="https://cdn.cocreate.app/docs/notification.png"
74
- hover="display:block!important"
75
- hover-selector=".social-networks">
76
- <div class="display:none social-networks">
77
- <a
78
- class="margin-right:15px"
79
- share-network="twitter"
80
- title="Share on twitter"
81
- ><i src="/assets/svg/twitter.svg"></i
82
- ></a>
83
- <a
84
- class="margin-right:15px"
85
- share-network="facebook"
86
- title="Share on Facebook"
87
- ><i src="/assets/svg/facebook.svg"></i
88
- ></a>
89
- <a
90
- class="margin-right:15px"
91
- share-network="instagram"
92
- title="Share on instagram"
93
- ><i src="/assets/svg/instagram.svg"></i
94
- ></a>
95
- </div>
96
- <a
97
- class="margin-right:15px"
98
- share-network="share"
99
- title="Share on share"
100
- ><i src="/assets/svg/share-alt.svg"></i
101
- ></a>
102
- </div>
103
- <a
104
- class="margin-right:15px"
105
- share-network="share"
106
- title="Share on share"
107
- ><i src="/assets/svg/share-alt.svg"></i
108
- ></a>
109
- </div>
110
- <a
111
- href="https://github.com/CoCreate-app/CoCreate-domEditorPanel"
112
- target="_blank"
113
- class="margin-right:15px"
114
- ><i src="/assets/svg/github.svg"></i
115
- ></a>
36
+ <body>
37
+ <!-- Navbar -->
38
+ <nav
39
+ class="width:100% display:flex align-items:center background:transparent padding-top:10px padding-bottom:10px"
40
+ content_id="content"
41
+ scroll="sticky-nav,"
42
+ scroll-up="5"
43
+ scroll-down="5"
44
+ path="../"
45
+ src="../components/navbar.html"
46
+ ></nav>
47
+ <sidenav
48
+ id="menuL"
49
+ class="position:fixed top:0px left:0px overflow:hidden background:whitesmoke height:100vh width:0px width:300px@xl"
50
+ resizable
51
+ resize-selector="[content_id='content']"
52
+ resize-property="margin-left"
53
+ resize-value="width"
54
+ >
55
+ <menu array="files" object="603717b07de7fb350ae9fec8" key="src"></menu>
56
+ <div resize="right"></div>
57
+ </sidenav>
58
+ <main
59
+ class="padding-top:15px padding:15px@lg@xl"
60
+ content_id="content"
61
+ id="cocreate-domEditorPanel"
62
+ >
63
+ <div
64
+ class="display:flex flex-wrap:wrap justify-content:space-between position:relative margin:10px"
65
+ >
66
+ <div class="display:flex align-items:center">
67
+ <h2>CoCreate-domEditorPanel</h2>
68
+ </div>
69
+ <div
70
+ class="display:flex align-items:center font-size:20px position:absolute right:0 padding:5px background:white"
71
+ >
72
+ <div
73
+ class="display:flex align-items:center transition:0.3s padding-left:10px"
74
+ share-network="true"
75
+ share-text="A JavaScript component target,update &amp; remove values in element's notification from an input,select or js api.Configurable using class,style or any custom attribute"
76
+ share-title="CoCreate notification"
77
+ share-height="600"
78
+ share-width="700"
79
+ share-media="https://cdn.cocreate.app/docs/notification.png"
80
+ hover="display:block!important"
81
+ hover-selector=".social-networks"
82
+ >
83
+ <div class="display:none social-networks">
84
+ <a
85
+ class="margin-right:15px"
86
+ share-network="twitter"
87
+ title="Share on twitter"
88
+ ><i src="/assets/svg/twitter.svg"></i
89
+ ></a>
90
+ <a
91
+ class="margin-right:15px"
92
+ share-network="facebook"
93
+ title="Share on Facebook"
94
+ ><i src="/assets/svg/facebook.svg"></i
95
+ ></a>
96
+ <a
97
+ class="margin-right:15px"
98
+ share-network="instagram"
99
+ title="Share on instagram"
100
+ ><i src="/assets/svg/instagram.svg"></i
101
+ ></a>
116
102
  </div>
103
+ <a
104
+ class="margin-right:15px"
105
+ share-network="share"
106
+ title="Share on share"
107
+ ><i src="/assets/svg/share-alt.svg"></i
108
+ ></a>
109
+ </div>
110
+ <a
111
+ class="margin-right:15px"
112
+ share-network="share"
113
+ title="Share on share"
114
+ ><i src="/assets/svg/share-alt.svg"></i
115
+ ></a>
116
+ </div>
117
+ <a
118
+ href="https://github.com/CoCreate-app/CoCreate-domEditorPanel"
119
+ target="_blank"
120
+ class="margin-right:15px"
121
+ ><i src="/assets/svg/github.svg"></i
122
+ ></a>
123
+ </div>
117
124
 
118
- <h1
119
- class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-weight:100">
120
- Simple HTML5 &amp; JavaScript component operate add, update
121
- &amp; remove values in element's notification from input, select
122
- or js api. Easy configuration using class, style or any custom
123
- attribute. Highly customizable and styleable.
124
- </h1>
125
- <div
126
- id="domEditorPanel-section"
127
- class="display:flex flex-wrap:wrap">
128
- <div
129
- class="flex-grow:1 width:400px width:300px@xs padding:0px_10px margin-top:60px">
130
- <div
131
- id="notification-install"
132
- class="border-bottom:1px_solid_lightgrey"
133
- scroll
134
- scroll-intersect="color:dodgerblue"
135
- scroll-selector="#notification-install-section">
136
- <span
137
- class="display:flex align-items:center width:fit-content"
138
- hover="display:block!important"
139
- hover-selector="[href='#notification-install']">
140
- <h2 class="padding:5px_0px">Install</h2>
141
- <a
142
- class="margin-left:10px display:none"
143
- href="#notification-install"
144
- ><i src="/assets/svg/link.svg"></i
145
- ></a>
146
- </span>
147
- </div>
125
+ <h1
126
+ class="max-width:500px margin:20px_10px line-height:1.5 font-size:16px font-weight:100"
127
+ >
128
+ Simple HTML5 &amp; JavaScript component operate add, update &amp; remove
129
+ values in element's notification from input, select or js api. Easy
130
+ configuration using class, style or any custom attribute. Highly
131
+ customizable and styleable.
132
+ </h1>
133
+ <div id="domEditorPanel-section" class="display:flex flex-wrap:wrap">
134
+ <div
135
+ class="flex-grow:1 width:400px width:300px@xs padding:0px_10px margin-top:60px"
136
+ >
137
+ <div
138
+ id="notification-install"
139
+ class="border-bottom:1px_solid_lightgrey"
140
+ scroll
141
+ scroll-intersect="color:dodgerblue"
142
+ scroll-selector="#notification-install-section"
143
+ >
144
+ <span
145
+ class="display:flex align-items:center width:fit-content"
146
+ hover="display:block!important"
147
+ hover-selector="[href='#notification-install']"
148
+ >
149
+ <h2 class="padding:5px_0px">Install</h2>
150
+ <a
151
+ class="margin-left:10px display:none"
152
+ href="#notification-install"
153
+ ><i src="/assets/svg/link.svg"></i
154
+ ></a>
155
+ </span>
156
+ </div>
148
157
 
149
- <pre><code class="language-bash">npm i @cocreate/action</code></pre>
150
- <p class="padding:10px_0px line-height:1.5">
151
- Or you can use cdn link:
152
- </p>
153
- <pre><code class="language-html">&lt;script&gt;https://cdn.cocreate.app/notification/latest/CoCreate-notification.min.js&lt;/script&gt;</code></pre>
158
+ <pre><code class="language-bash">npm i @cocreate/action</code></pre>
159
+ <p class="padding:10px_0px line-height:1.5">
160
+ Or you can use cdn link:
161
+ </p>
162
+ <pre><code class="language-html">&lt;script&gt;https://cdn.cocreate.app/notification/latest/CoCreate-notification.min.js&lt;/script&gt;</code></pre>
154
163
 
155
- <div
156
- id="notification-usage"
157
- class="margin-top:80px border-bottom:1px_solid_lightgrey"
158
- scroll
159
- scroll-intersect="color:dodgerblue"
160
- scroll-selector="#notification-usage-section">
161
- <span
162
- class="display:flex align-items:center width:fit-content"
163
- hover="display:block!important"
164
- hover-selector="[href='#notification-usage']">
165
- <h2 class="padding:5px_0px">Usage</h2>
166
- <a
167
- class="margin-left:10px display:none"
168
- href="#notification-usage"
169
- ><i src="/assets/svg/link.svg"></i
170
- ></a>
171
- </span>
172
- </div>
173
- <div class="">
174
- <p class="padding:10px_0px line-height:1.5">
175
- This is domEditorPanel usage
176
- </p>
164
+ <div
165
+ id="notification-usage"
166
+ class="margin-top:80px border-bottom:1px_solid_lightgrey"
167
+ scroll
168
+ scroll-intersect="color:dodgerblue"
169
+ scroll-selector="#notification-usage-section"
170
+ >
171
+ <span
172
+ class="display:flex align-items:center width:fit-content"
173
+ hover="display:block!important"
174
+ hover-selector="[href='#notification-usage']"
175
+ >
176
+ <h2 class="padding:5px_0px">Usage</h2>
177
+ <a
178
+ class="margin-left:10px display:none"
179
+ href="#notification-usage"
180
+ ><i src="/assets/svg/link.svg"></i
181
+ ></a>
182
+ </span>
183
+ </div>
184
+ <div class="">
185
+ <p class="padding:10px_0px line-height:1.5">
186
+ This is domEditorPanel usage
187
+ </p>
177
188
 
178
- <div class="flex-grow:1 min-width:300px width:100%">
179
- <pre><code class="language-html">&lt;div&gt;&lt;/div&gt;</code></pre>
180
- </div>
181
- <p class="padding:10px_0px line-height:1.5">
182
- This is domEditorPanel usage
183
- </p>
184
- <p class="padding:10px_0px line-height:1.5">
185
- This is domEditorPanel usage
186
- </p>
187
- </div>
188
- <div
189
- id="notification-notification"
190
- class="margin-top:80px border-bottom:1px_solid_lightgrey"
191
- scroll
192
- scroll-intersect="color:dodgerblue"
193
- scroll-selector="#notification-notification-section">
194
- <span
195
- class="display:flex align-items:center width:fit-content"
196
- hover="display:block!important"
197
- hover-selector="[href='#notification-notification']">
198
- <h2 class="padding:5px_0px">notification</h2>
199
- <a
200
- class="margin-left:10px display:none"
201
- href="#notification-notification"
202
- ><i src="/assets/svg/link.svg"></i
203
- ></a>
204
- </span>
205
- </div>
206
- <ul class="list-style-type:none">
207
- <li
208
- class="padding:15px_0px border-bottom:1px_solid_lightgrey">
209
- <h4>
210
- <span>domEditorPanel</span>
211
- <span class="cocreate-badge success"
212
- >string</span
213
- >
214
- <span class="cocreate-badge warning"
215
- >optional</span
216
- >
217
- </h4>
218
- <p>domEditorPanel-attribute</p>
219
- </li>
220
- <li
221
- class="padding:15px_0px border-bottom:1px_solid_lightgrey">
222
- <h4>
223
- <span>domEditorPanel</span>
224
- <span class="cocreate-badge success"
225
- >string</span
226
- >
227
- <span class="cocreate-badge warning"
228
- >optional</span
229
- >
230
- </h4>
231
- <p>domEditorPanel-attribute</p>
232
- </li>
233
- </ul>
234
- </div>
189
+ <div class="flex-grow:1 min-width:300px width:100%">
190
+ <pre><code class="language-html">&lt;div&gt;&lt;/div&gt;</code></pre>
191
+ </div>
192
+ <p class="padding:10px_0px line-height:1.5">
193
+ This is domEditorPanel usage
194
+ </p>
195
+ <p class="padding:10px_0px line-height:1.5">
196
+ This is domEditorPanel usage
197
+ </p>
198
+ </div>
199
+ <div
200
+ id="notification-notification"
201
+ class="margin-top:80px border-bottom:1px_solid_lightgrey"
202
+ scroll
203
+ scroll-intersect="color:dodgerblue"
204
+ scroll-selector="#notification-notification-section"
205
+ >
206
+ <span
207
+ class="display:flex align-items:center width:fit-content"
208
+ hover="display:block!important"
209
+ hover-selector="[href='#notification-notification']"
210
+ >
211
+ <h2 class="padding:5px_0px">notification</h2>
212
+ <a
213
+ class="margin-left:10px display:none"
214
+ href="#notification-notification"
215
+ ><i src="/assets/svg/link.svg"></i
216
+ ></a>
217
+ </span>
218
+ </div>
219
+ <ul class="list-style-type:none">
220
+ <li class="padding:15px_0px border-bottom:1px_solid_lightgrey">
221
+ <h4>
222
+ <span>domEditorPanel</span>
223
+ <span class="cocreate-badge success">string</span>
224
+ <span class="cocreate-badge warning">optional</span>
225
+ </h4>
226
+ <p>domEditorPanel-attribute</p>
227
+ </li>
228
+ <li class="padding:15px_0px border-bottom:1px_solid_lightgrey">
229
+ <h4>
230
+ <span>domEditorPanel</span>
231
+ <span class="cocreate-badge success">string</span>
232
+ <span class="cocreate-badge warning">optional</span>
233
+ </h4>
234
+ <p>domEditorPanel-attribute</p>
235
+ </li>
236
+ </ul>
237
+ </div>
235
238
 
236
- <div
237
- class="flex-grow:1 width:300px padding:0px_10px margin-top:60px border-bottom:1px_solid_lightgrey">
238
- <!-- SandBox -->
239
- <div
240
- id="notification-demo"
241
- class="border-bottom:1px_solid_lightgrey"
242
- scroll
243
- scroll-intersect="color:dodgerblue"
244
- scroll-selector="#notification-demo-section">
245
- <span
246
- class="display:flex align-items:center width:fit-content"
247
- hover="display:block!important"
248
- hover-selector="[href='#notification-demo']">
249
- <h2 class="padding:5px_0px">Demo</h2>
250
- <a
251
- class="margin-left:10px display:none"
252
- href="#notification-demo"
253
- ><i src="/assets/svg/link.svg"></i
254
- ></a>
255
- </span>
256
- </div>
239
+ <div
240
+ class="flex-grow:1 width:300px padding:0px_10px margin-top:60px border-bottom:1px_solid_lightgrey"
241
+ >
242
+ <!-- SandBox -->
243
+ <div
244
+ id="notification-demo"
245
+ class="border-bottom:1px_solid_lightgrey"
246
+ scroll
247
+ scroll-intersect="color:dodgerblue"
248
+ scroll-selector="#notification-demo-section"
249
+ >
250
+ <span
251
+ class="display:flex align-items:center width:fit-content"
252
+ hover="display:block!important"
253
+ hover-selector="[href='#notification-demo']"
254
+ >
255
+ <h2 class="padding:5px_0px">Demo</h2>
256
+ <a class="margin-left:10px display:none" href="#notification-demo"
257
+ ><i src="/assets/svg/link.svg"></i
258
+ ></a>
259
+ </span>
260
+ </div>
257
261
 
258
- <div
259
- class="position:sticky top:0 padding:15px_0px height:100vh">
260
- <!-- SandBox -->
261
- <div
262
- class="display:flex flex-direction:column position:relative overflow:hidden card border-radius:2px width:auto height:600px margin-top:20px"
263
- id="playground">
264
- <div
265
- id="demo-code"
266
- resizable
267
- class="position:relative height:50%">
268
- <textarea
269
- type="code"
270
- lang="html"
271
- array="demos"
272
- object=""
273
- key="demo"
274
- save="false"
275
- id="demo"
276
- class="height:100% width:100% outline:none border:none resize:none padding:5px"></textarea>
277
- <div
278
- resize="bottom"
279
- class="background:lightgrey"></div>
280
- </div>
262
+ <div class="position:sticky top:0 padding:15px_0px height:100vh">
263
+ <!-- SandBox -->
264
+ <div
265
+ class="display:flex flex-direction:column position:relative overflow:hidden card border-radius:2px width:auto height:600px margin-top:20px"
266
+ id="playground"
267
+ >
268
+ <div
269
+ id="demo-code"
270
+ resizable
271
+ class="position:relative height:50%"
272
+ >
273
+ <textarea
274
+ type="code"
275
+ lang="html"
276
+ array="demos"
277
+ object=""
278
+ key="demo"
279
+ save="false"
280
+ id="demo"
281
+ class="height:100% width:100% outline:none border:none resize:none padding:5px"
282
+ ></textarea>
283
+ <div resize="bottom" class="background:lightgrey"></div>
284
+ </div>
281
285
 
282
- <div
283
- id="demo-preview"
284
- class="position:relative overflow:auto background-color:white">
285
- <div class="demopreview padding:20px"></div>
286
- </div>
286
+ <div
287
+ id="demo-preview"
288
+ class="position:relative overflow:auto background-color:white"
289
+ >
290
+ <div class="demopreview padding:20px"></div>
291
+ </div>
287
292
 
288
- <div
289
- class="font-size:20px position:absolute top:10px right:10px opacity:0.6">
290
- <a
291
- class="margin-right:10px"
292
- id="eye"
293
- show="#eye-slash"
294
- hide="#eye, #demo-preview"
295
- toggle="code-height"
296
- toggle-selector="#demo-code"
297
- ><i
298
- class="height:18px"
299
- src="/assets/svg/eye.svg"></i
300
- ></a>
301
- <a
302
- class="margin-right:10px"
303
- hidden
304
- id="eye-slash"
305
- show="#eye, #demo-preview"
306
- hide="#eye-slash"
307
- toggle="code-height"
308
- toggle-selector="#demo-code"
309
- ><i src="/assets/svg/eye-slash.svg"></i
310
- ></a>
311
- <a
312
- class="margin-right:10px"
313
- id="code"
314
- show="#code-slash"
315
- hide="#code, #demo-code"
316
- ><i src="/assets/svg/code.svg"></i
317
- ></a>
318
- <a
319
- class="margin-right:10px"
320
- hidden
321
- id="code-slash"
322
- show="#code, #demo-code"
323
- hide="#code-slash"
324
- ><i
325
- class="height:18px"
326
- src="/assets/svg/code.svg"></i
327
- ></a>
328
- <a
329
- class="margin-right:5px"
330
- fullscreen
331
- fullscreen-selector="#playground"></a>
332
- </div>
333
- </div>
334
- <!-- End SandBox -->
335
- </div>
336
- </div>
293
+ <div
294
+ class="font-size:20px position:absolute top:10px right:10px opacity:0.6"
295
+ >
296
+ <a
297
+ class="margin-right:10px"
298
+ id="eye"
299
+ show="#eye-slash"
300
+ hide="#eye, #demo-preview"
301
+ toggle="code-height"
302
+ toggle-selector="#demo-code"
303
+ ><i class="height:18px" src="/assets/svg/eye.svg"></i
304
+ ></a>
305
+ <a
306
+ class="margin-right:10px"
307
+ hidden
308
+ id="eye-slash"
309
+ show="#eye, #demo-preview"
310
+ hide="#eye-slash"
311
+ toggle="code-height"
312
+ toggle-selector="#demo-code"
313
+ ><i src="/assets/svg/eye-slash.svg"></i
314
+ ></a>
315
+ <a
316
+ class="margin-right:10px"
317
+ id="code"
318
+ show="#code-slash"
319
+ hide="#code, #demo-code"
320
+ ><i src="/assets/svg/code.svg"></i
321
+ ></a>
322
+ <a
323
+ class="margin-right:10px"
324
+ hidden
325
+ id="code-slash"
326
+ show="#code, #demo-code"
327
+ hide="#code-slash"
328
+ ><i class="height:18px" src="/assets/svg/code.svg"></i
329
+ ></a>
330
+ <a
331
+ class="margin-right:5px"
332
+ fullscreen
333
+ fullscreen-selector="#playground"
334
+ ></a>
335
+ </div>
337
336
  </div>
338
- <button
339
- href="https://github.com/CoCreate-app/CoCreate-notification/tree/master/docs/index.html?message=docs%3A%20describe%20your%20change..."
340
- target="_blank"
341
- class="display:flex justify-content:center align-items:center position:fixed bottom:15px right:15px height:50px width:50px border-radius:50% box-shadow:0px_2px_10px_0px_rgba(0,_0,_0,_0.4)">
342
- <i class="height:20px" src="../assets/svg/pencil-alt.svg"></i>
343
- </button>
344
- </main>
345
- <script src="https://CoCreate.app/dist/CoCreate.js"></script>
346
- </body>
337
+ <!-- End SandBox -->
338
+ </div>
339
+ </div>
340
+ </div>
341
+ <button
342
+ href="https://github.com/CoCreate-app/CoCreate-notification/tree/master/docs/index.html?message=docs%3A%20describe%20your%20change..."
343
+ target="_blank"
344
+ class="display:flex justify-content:center align-items:center position:fixed bottom:15px right:15px height:50px width:50px border-radius:50% box-shadow:0px_2px_10px_0px_rgba(0,_0,_0,_0.4)"
345
+ >
346
+ <i src="../assets/svg/pencil-alt.svg"></i>
347
+ </button>
348
+ </main>
349
+ <script src="https://CoCreate.app/dist/CoCreate.js"></script>
350
+ </body>
347
351
  </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cocreate/notification",
3
- "version": "1.6.5",
3
+ "version": "1.7.0",
4
4
  "description": "Simple HTML5 & JavaScript component add, update & remove values in element's notification from input, select or js api. Easily configured using HTML5 notification and/or JavaScript API.",
5
5
  "keywords": [
6
6
  "cocreate",
@@ -0,0 +1,16 @@
1
+ module.exports = {
2
+ tabWidth: 4,
3
+ semi: true,
4
+ trailingComma: "none",
5
+ bracketSameLine: true,
6
+ useTabs: true,
7
+ overrides: [
8
+ {
9
+ files: ["*.json", "*.yml", "*.yaml"],
10
+ options: {
11
+ tabWidth: 2,
12
+ useTabs: false
13
+ },
14
+ }
15
+ ],
16
+ };
package/src/client.js CHANGED
@@ -57,8 +57,9 @@ async function handlePushPermission() {
57
57
  }
58
58
 
59
59
  // Call the function when the user interacts with a relevant UI element (e.g., a button)
60
- document.querySelector('[actions*="notification.subscribe"]').addEventListener('click', handlePushPermission);
61
-
60
+ let element = document.querySelector('[actions*="notification.subscribe"]')
61
+ if (element)
62
+ element.addEventListener('click', handlePushPermission);
62
63
  // actions.init({
63
64
  // name: "notification",
64
65
  // endEvent: "notification",