@jant/core 0.3.20 → 0.3.21

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.
@@ -106,6 +106,7 @@ function NewCollectionContent() {
106
106
  <form
107
107
  data-signals="{title: '', path: '', description: ''}"
108
108
  data-on:submit__prevent="@post('/dash/collections')"
109
+ data-indicator="_loading"
109
110
  class="flex flex-col gap-4 max-w-lg"
110
111
  >
111
112
  <div class="field">
@@ -166,11 +167,20 @@ function NewCollectionContent() {
166
167
  </div>
167
168
 
168
169
  <div class="flex gap-2">
169
- <button type="submit" class="btn">
170
- {t({
171
- message: "Create Collection",
172
- comment: "@context: Button to save new collection",
173
- })}
170
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
171
+ <span data-show="!$_loading">
172
+ {t({
173
+ message: "Create Collection",
174
+ comment: "@context: Button to save new collection",
175
+ })}
176
+ </span>
177
+ <span data-show="$_loading">
178
+ {t({
179
+ message: "Processing...",
180
+ comment:
181
+ "@context: Loading text shown on submit button while request is in progress",
182
+ })}
183
+ </span>
174
184
  </button>
175
185
  <a href="/dash/collections" class="btn-outline">
176
186
  {t({
@@ -297,6 +307,7 @@ function EditCollectionContent({ collection }: { collection: Collection }) {
297
307
  <form
298
308
  data-signals={signals}
299
309
  data-on:submit__prevent={`@post('/dash/collections/${collection.id}')`}
310
+ data-indicator="_loading"
300
311
  class="flex flex-col gap-4 max-w-lg"
301
312
  >
302
313
  <div class="field">
@@ -335,11 +346,20 @@ function EditCollectionContent({ collection }: { collection: Collection }) {
335
346
  </div>
336
347
 
337
348
  <div class="flex gap-2">
338
- <button type="submit" class="btn">
339
- {t({
340
- message: "Update Collection",
341
- comment: "@context: Button to save collection changes",
342
- })}
349
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
350
+ <span data-show="!$_loading">
351
+ {t({
352
+ message: "Update Collection",
353
+ comment: "@context: Button to save collection changes",
354
+ })}
355
+ </span>
356
+ <span data-show="$_loading">
357
+ {t({
358
+ message: "Processing...",
359
+ comment:
360
+ "@context: Loading text shown on submit button while request is in progress",
361
+ })}
362
+ </span>
343
363
  </button>
344
364
  <a href={`/dash/collections/${collection.id}`} class="btn-outline">
345
365
  {t({
@@ -119,6 +119,7 @@ function NavigationFormContent({
119
119
  <form
120
120
  data-signals={signals}
121
121
  data-on:submit__prevent={`@post('${action}')`}
122
+ data-indicator="_loading"
122
123
  class="flex flex-col gap-4 max-w-lg"
123
124
  >
124
125
  <div class="field">
@@ -167,16 +168,25 @@ function NavigationFormContent({
167
168
  </div>
168
169
 
169
170
  <div class="flex gap-2">
170
- <button type="submit" class="btn">
171
- {isEdit
172
- ? t({
173
- message: "Save Changes",
174
- comment: "@context: Button to save edited navigation link",
175
- })
176
- : t({
177
- message: "Create Link",
178
- comment: "@context: Button to save new navigation link",
179
- })}
171
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
172
+ <span data-show="!$_loading">
173
+ {isEdit
174
+ ? t({
175
+ message: "Save Changes",
176
+ comment: "@context: Button to save edited navigation link",
177
+ })
178
+ : t({
179
+ message: "Create Link",
180
+ comment: "@context: Button to save new navigation link",
181
+ })}
182
+ </span>
183
+ <span data-show="$_loading">
184
+ {t({
185
+ message: "Processing...",
186
+ comment:
187
+ "@context: Loading text shown on submit button while request is in progress",
188
+ })}
189
+ </span>
180
190
  </button>
181
191
  <a href="/dash/navigation" class="btn-outline">
182
192
  {t({
@@ -90,6 +90,7 @@ function NewRedirectContent() {
90
90
  <form
91
91
  data-signals="{fromPath: '', toPath: '', type: '301'}"
92
92
  data-on:submit__prevent="@post('/dash/redirects')"
93
+ data-indicator="_loading"
93
94
  class="flex flex-col gap-4 max-w-lg"
94
95
  >
95
96
  <div class="field">
@@ -157,11 +158,20 @@ function NewRedirectContent() {
157
158
  </div>
158
159
 
159
160
  <div class="flex gap-2">
160
- <button type="submit" class="btn">
161
- {t({
162
- message: "Create Redirect",
163
- comment: "@context: Button to save new redirect",
164
- })}
161
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
162
+ <span data-show="!$_loading">
163
+ {t({
164
+ message: "Create Redirect",
165
+ comment: "@context: Button to save new redirect",
166
+ })}
167
+ </span>
168
+ <span data-show="$_loading">
169
+ {t({
170
+ message: "Processing...",
171
+ comment:
172
+ "@context: Loading text shown on submit button while request is in progress",
173
+ })}
174
+ </span>
165
175
  </button>
166
176
  <a href="/dash/redirects" class="btn-outline">
167
177
  {t({
@@ -123,6 +123,7 @@ function GeneralContent({
123
123
  <form
124
124
  data-signals={generalSignals}
125
125
  data-on:submit__prevent="@post('/dash/settings')"
126
+ data-indicator="_loading"
126
127
  >
127
128
  <div class="card">
128
129
  <header>
@@ -188,11 +189,20 @@ function GeneralContent({
188
189
  </section>
189
190
  </div>
190
191
 
191
- <button type="submit" class="btn mt-4">
192
- {t({
193
- message: "Save Settings",
194
- comment: "@context: Button to save settings",
195
- })}
192
+ <button type="submit" class="btn mt-4" data-attr-disabled="$_loading">
193
+ <span data-show="!$_loading">
194
+ {t({
195
+ message: "Save Settings",
196
+ comment: "@context: Button to save settings",
197
+ })}
198
+ </span>
199
+ <span data-show="$_loading">
200
+ {t({
201
+ message: "Processing...",
202
+ comment:
203
+ "@context: Loading text shown on submit button while request is in progress",
204
+ })}
205
+ </span>
196
206
  </button>
197
207
  </form>
198
208
  </div>
@@ -346,6 +356,7 @@ function AccountContent({ userName }: { userName: string }) {
346
356
  <form
347
357
  data-signals={profileSignals}
348
358
  data-on:submit__prevent="@post('/dash/settings/account')"
359
+ data-indicator="_profileLoading"
349
360
  >
350
361
  <div class="card">
351
362
  <header>
@@ -374,17 +385,31 @@ function AccountContent({ userName }: { userName: string }) {
374
385
  </section>
375
386
  </div>
376
387
 
377
- <button type="submit" class="btn mt-4">
378
- {t({
379
- message: "Save Profile",
380
- comment: "@context: Button to save profile",
381
- })}
388
+ <button
389
+ type="submit"
390
+ class="btn mt-4"
391
+ data-attr-disabled="$_profileLoading"
392
+ >
393
+ <span data-show="!$_profileLoading">
394
+ {t({
395
+ message: "Save Profile",
396
+ comment: "@context: Button to save profile",
397
+ })}
398
+ </span>
399
+ <span data-show="$_profileLoading">
400
+ {t({
401
+ message: "Processing...",
402
+ comment:
403
+ "@context: Loading text shown on submit button while request is in progress",
404
+ })}
405
+ </span>
382
406
  </button>
383
407
  </form>
384
408
 
385
409
  <form
386
410
  data-signals="{currentPassword: '', newPassword: '', confirmPassword: ''}"
387
411
  data-on:submit__prevent="@post('/dash/settings/password')"
412
+ data-indicator="_passwordLoading"
388
413
  >
389
414
  <div class="card">
390
415
  <header>
@@ -448,11 +473,24 @@ function AccountContent({ userName }: { userName: string }) {
448
473
  </section>
449
474
  </div>
450
475
 
451
- <button type="submit" class="btn mt-4">
452
- {t({
453
- message: "Change Password",
454
- comment: "@context: Button to change password",
455
- })}
476
+ <button
477
+ type="submit"
478
+ class="btn mt-4"
479
+ data-attr-disabled="$_passwordLoading"
480
+ >
481
+ <span data-show="!$_passwordLoading">
482
+ {t({
483
+ message: "Change Password",
484
+ comment: "@context: Button to change password",
485
+ })}
486
+ </span>
487
+ <span data-show="$_passwordLoading">
488
+ {t({
489
+ message: "Processing...",
490
+ comment:
491
+ "@context: Loading text shown on submit button while request is in progress",
492
+ })}
493
+ </span>
456
494
  </button>
457
495
  </form>
458
496
  </div>
@@ -33,6 +33,7 @@ export const PageForm: FC<PageFormProps> = ({
33
33
  <form
34
34
  data-signals={signals}
35
35
  data-on:submit__prevent={`@post('${action}')`}
36
+ data-indicator="_loading"
36
37
  class="flex flex-col gap-4"
37
38
  >
38
39
  <div id="page-form-message"></div>
@@ -146,16 +147,25 @@ export const PageForm: FC<PageFormProps> = ({
146
147
 
147
148
  {/* Submit */}
148
149
  <div class="flex gap-2">
149
- <button type="submit" class="btn">
150
- {isEdit
151
- ? t({
152
- message: "Update Page",
153
- comment: "@context: Button to update existing page",
154
- })
155
- : t({
156
- message: "Create Page",
157
- comment: "@context: Button to create new page",
158
- })}
150
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
151
+ <span data-show="!$_loading">
152
+ {isEdit
153
+ ? t({
154
+ message: "Update Page",
155
+ comment: "@context: Button to update existing page",
156
+ })
157
+ : t({
158
+ message: "Create Page",
159
+ comment: "@context: Button to create new page",
160
+ })}
161
+ </span>
162
+ <span data-show="$_loading">
163
+ {t({
164
+ message: "Processing...",
165
+ comment:
166
+ "@context: Loading text shown on submit button while request is in progress",
167
+ })}
168
+ </span>
159
169
  </button>
160
170
  <a href={cancelUrl} class="btn-outline">
161
171
  {t({
@@ -53,6 +53,7 @@ export const PostForm: FC<PostFormProps> = ({
53
53
  <form
54
54
  data-signals={signals}
55
55
  data-on:submit__prevent={`@post('${action}')`}
56
+ data-indicator="_loading"
56
57
  class="flex flex-col gap-4"
57
58
  >
58
59
  <div id="post-form-message"></div>
@@ -308,16 +309,25 @@ export const PostForm: FC<PostFormProps> = ({
308
309
 
309
310
  {/* Submit */}
310
311
  <div class="flex gap-2">
311
- <button type="submit" class="btn">
312
- {isEdit
313
- ? t({
314
- message: "Update",
315
- comment: "@context: Button to update existing post",
316
- })
317
- : t({
318
- message: "Publish",
319
- comment: "@context: Button to publish new post",
320
- })}
312
+ <button type="submit" class="btn" data-attr-disabled="$_loading">
313
+ <span data-show="!$_loading">
314
+ {isEdit
315
+ ? t({
316
+ message: "Update",
317
+ comment: "@context: Button to update existing post",
318
+ })
319
+ : t({
320
+ message: "Publish",
321
+ comment: "@context: Button to publish new post",
322
+ })}
323
+ </span>
324
+ <span data-show="$_loading">
325
+ {t({
326
+ message: "Processing...",
327
+ comment:
328
+ "@context: Loading text shown on submit button while request is in progress",
329
+ })}
330
+ </span>
321
331
  </button>
322
332
  <a href="/dash/posts" class="btn-outline">
323
333
  {t({ message: "Cancel", comment: "@context: Button to cancel form" })}