Skip to content

Commit 07320d5

Browse files
adamkudrnaadamkudrna
committed
Fix(web): Add the missing spirit prefix to FileUploaders data-populate-field #DS-684
1 parent 0aa6824 commit 07320d5

File tree

3 files changed

+35
-35
lines changed

3 files changed

+35
-35
lines changed

‎packages/web/src/js/FileUploader.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const INPUT_ELEMENT_SELECTOR = '[data-spirit-element="input"]';
1010
const LIST_ELEMENT_SELECTOR = '[data-spirit-element="list"]';
1111
const DROP_ZONE_ELEMENT_SELECTOR = '[data-spirit-element="dropZone"]';
1212
const TEMPLATE_ELEMENT_SELECTOR = '[data-spirit-snippet="item"]';
13-
const TEMPLATE_ELEMENT_SLOT_NAME = 'data-populate-field';
13+
const TEMPLATE_ELEMENT_SLOT_NAME = 'data-spirit-populate-field';
1414
const DATA_DISMISS_ATTRIBUTE = 'data-dismiss';
1515
const DEFAULT_FILE_SIZE_LIMIT = 10000000; // = 10 MB
1616
const DEFAULT_FILE_QUEUE_LIMIT = 10;

‎packages/web/src/scss/components/FileUploader/README.md‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -192,16 +192,16 @@ truncated.
192192

193193
This way you can customize your own template in the `<template>` tag.
194194
It must be inserted inside the main wrapper element that has `data-toggle="fileUploader"`.
195-
Content of element with `data-populate-field="name"` will be replaced with file name.
195+
Content of element with `data-spirit-populate-field="name"` will be replaced with file name.
196196

197197
```html
198198
<template data-spirit-snippet="item">
199-
<li class="FileUploaderAttachment" data-populate-field="item">
199+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
200200
<svg width="24" height="24" aria-hidden="true">
201201
<use xlink:href="/icons/svg/sprite.svg#file" />
202202
</svg>
203-
<span class="text-truncate" data-populate-field="name">File name</span>
204-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
203+
<span class="text-truncate" data-spirit-populate-field="name">File name</span>
204+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
205205
<span class="accessibility-hidden">Remove</span>
206206
<svg width="24" height="24" aria-hidden="true">
207207
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -232,12 +232,12 @@ This is how all subcomponents build up the complete FileUploader:
232232
<div class="FileUploader" data-toggle="fileUploader">
233233
<!-- List item template: start -->
234234
<template data-spirit-snippet="item">
235-
<li class="FileUploaderAttachment" data-populate-field="item">
235+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
236236
<svg width="24" height="24" aria-hidden="true">
237237
<use xlink:href="/icons/svg/sprite.svg#file" />
238238
</svg>
239-
<span class="text-truncate" data-populate-field="name">File name</span>
240-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
239+
<span class="text-truncate" data-spirit-populate-field="name">File name</span>
240+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
241241
<span class="accessibility-hidden">Remove</span>
242242
<svg width="24" height="24" aria-hidden="true">
243243
<use xlink:href="/icons/svg/sprite.svg#close" />

‎packages/web/src/scss/components/FileUploader/index.html‎

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@ <h2 class="docs-Heading">Input</h2>
99

1010
<!-- List item template: start -->
1111
<template data-spirit-snippet="item">
12-
<li class="FileUploaderAttachment" data-populate-field="item">
12+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
1313
<svg width="24" height="24" aria-hidden="true">
1414
<use xlink:href="/icons/svg/sprite.svg#file" />
1515
</svg>
16-
<span class="text-truncate" data-populate-field="name"></span>
17-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
16+
<span class="text-truncate" data-spirit-populate-field="name"></span>
17+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
1818
<span class="accessibility-hidden">Remove</span>
1919
<svg width="24" height="24" aria-hidden="true">
2020
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -59,12 +59,12 @@ <h2 class="docs-Heading">Input Multiple</h2>
5959

6060
<!-- List item template: start -->
6161
<template data-spirit-snippet="item">
62-
<li class="FileUploaderAttachment" data-populate-field="item">
62+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
6363
<svg width="24" height="24" aria-hidden="true">
6464
<use xlink:href="/icons/svg/sprite.svg#file" />
6565
</svg>
66-
<span class="text-truncate" data-populate-field="name"></span>
67-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
66+
<span class="text-truncate" data-spirit-populate-field="name"></span>
67+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
6868
<span class="accessibility-hidden">Remove</span>
6969
<svg width="24" height="24" aria-hidden="true">
7070
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -111,12 +111,12 @@ <h2 class="docs-Heading">Input Validation States</h2>
111111

112112
<!-- List item template: start -->
113113
<template data-spirit-snippet="item">
114-
<li class="FileUploaderAttachment" data-populate-field="item">
114+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
115115
<svg width="24" height="24" aria-hidden="true">
116116
<use xlink:href="/icons/svg/sprite.svg#file" />
117117
</svg>
118-
<span class="text-truncate" data-populate-field="name"></span>
119-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
118+
<span class="text-truncate" data-spirit-populate-field="name"></span>
119+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
120120
<span class="accessibility-hidden">Remove</span>
121121
<svg width="24" height="24" aria-hidden="true">
122122
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -152,12 +152,12 @@ <h2 class="docs-Heading">Input Validation States</h2>
152152

153153
<!-- List item template: start -->
154154
<template data-spirit-snippet="item">
155-
<li class="FileUploaderAttachment" data-populate-field="item">
155+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
156156
<svg width="24" height="24" aria-hidden="true">
157157
<use xlink:href="/icons/svg/sprite.svg#file" />
158158
</svg>
159-
<span class="text-truncate" data-populate-field="name"></span>
160-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
159+
<span class="text-truncate" data-spirit-populate-field="name"></span>
160+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
161161
<span class="accessibility-hidden">Remove</span>
162162
<svg width="24" height="24" aria-hidden="true">
163163
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -193,12 +193,12 @@ <h2 class="docs-Heading">Input Validation States</h2>
193193

194194
<!-- List item template: start -->
195195
<template data-spirit-snippet="item">
196-
<li class="FileUploaderAttachment" data-populate-field="item">
196+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
197197
<svg width="24" height="24" aria-hidden="true">
198198
<use xlink:href="/icons/svg/sprite.svg#file" />
199199
</svg>
200-
<span class="text-truncate" data-populate-field="name"></span>
201-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
200+
<span class="text-truncate" data-spirit-populate-field="name"></span>
201+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
202202
<span class="accessibility-hidden">Remove</span>
203203
<svg width="24" height="24" aria-hidden="true">
204204
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -243,12 +243,12 @@ <h2 class="docs-Heading">Input with Attachment</h2>
243243

244244
<!-- List item template: start -->
245245
<template data-spirit-snippet="item">
246-
<li class="FileUploaderAttachment" data-populate-field="item">
246+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
247247
<svg width="24" height="24" aria-hidden="true">
248248
<use xlink:href="/icons/svg/sprite.svg#file" />
249249
</svg>
250-
<span class="text-truncate" data-populate-field="name"></span>
251-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
250+
<span class="text-truncate" data-spirit-populate-field="name"></span>
251+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
252252
<span class="accessibility-hidden">Remove</span>
253253
<svg width="24" height="24" aria-hidden="true">
254254
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -305,12 +305,12 @@ <h3 id="attachments" hidden>Attachments</h3>
305305

306306
<!-- List item template: start -->
307307
<template data-spirit-snippet="item">
308-
<li class="FileUploaderAttachment" data-populate-field="item">
308+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
309309
<svg width="24" height="24" aria-hidden="true">
310310
<use xlink:href="/icons/svg/sprite.svg#file" />
311311
</svg>
312-
<span class="text-truncate" data-populate-field="name"></span>
313-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
312+
<span class="text-truncate" data-spirit-populate-field="name"></span>
313+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
314314
<span class="accessibility-hidden">Remove</span>
315315
<svg width="24" height="24" aria-hidden="true">
316316
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -427,12 +427,12 @@ <h2 class="docs-Heading">Fluid Width</h2>
427427

428428
<!-- List item template: start -->
429429
<template data-spirit-snippet="item">
430-
<li class="FileUploaderAttachment" data-populate-field="item">
430+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
431431
<svg width="24" height="24" aria-hidden="true">
432432
<use xlink:href="/icons/svg/sprite.svg#file" />
433433
</svg>
434-
<span class="text-truncate" data-populate-field="name"></span>
435-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
434+
<span class="text-truncate" data-spirit-populate-field="name"></span>
435+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
436436
<span class="accessibility-hidden">Remove</span>
437437
<svg width="24" height="24" aria-hidden="true">
438438
<use xlink:href="/icons/svg/sprite.svg#close" />
@@ -499,12 +499,12 @@ <h2 class="docs-Heading">Example form with multiple FileUploader</h2>
499499

500500
<!-- List item template: start -->
501501
<template data-spirit-snippet="item">
502-
<li class="FileUploaderAttachment" data-populate-field="item">
502+
<li class="FileUploaderAttachment" data-spirit-populate-field="item">
503503
<svg width="24" height="24" aria-hidden="true">
504504
<use xlink:href="/icons/svg/sprite.svg#file" />
505505
</svg>
506-
<span class="text-truncate" data-populate-field="name"></span>
507-
<button type="button" class="FileUploaderAttachment__remove" data-populate-field="button">
506+
<span class="text-truncate" data-spirit-populate-field="name"></span>
507+
<button type="button" class="FileUploaderAttachment__remove" data-spirit-populate-field="button">
508508
<span class="accessibility-hidden">Remove</span>
509509
<svg width="24" height="24" aria-hidden="true">
510510
<use xlink:href="/icons/svg/sprite.svg#close" />

0 commit comments

Comments
 (0)