vite-awesome-svg-loader 2.0.0 → 2.1.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.
Files changed (5) hide show
  1. package/README.md +7 -1
  2. package/declarations.d.ts +390 -77
  3. package/index.js +34 -17
  4. package/index.mjs +34 -17
  5. package/package.json +2 -2
package/README.md CHANGED
@@ -78,8 +78,14 @@ import imageCurColorSrc from "./path/to/image.svg?set-current-color";
78
78
  // @ts-ignore
79
79
  import transformedImageUrl from "./path/to/image.svg?url&preserve-line-width&set-current-color";
80
80
 
81
- // explicitly disable any parameter by setting it to false. This takes precedence over config.
81
+ // Explicitly disable any parameter by setting it to false. This takes precedence over config.
82
82
  import initialLineWidthImageUrl from "./path/to/image.svg?url&preserve-line-width=false";
83
+
84
+ // Get classes and IDs prefix to target DOM elements later
85
+ import imageSrc, { prefix as imagePrefix } from "./path/to/image.svg";
86
+
87
+ // or:
88
+ import { src as imageSrc, prefix as imagePrefix } from "./path/to/image.svg";
83
89
  ```
84
90
 
85
91
  5. Optional, but highly recommended. Configure loader, so you can import SVGs without URL parameters:
package/declarations.d.ts CHANGED
@@ -1,77 +1,390 @@
1
- declare module "*.svg?url" { const src: string; export default src; }
2
- declare module "*.svg?source" { const src: string; export default src; }
3
- declare module "*.svg?source-data-uri" { const src: string; export default src; }
4
- declare module "*.svg?base64" { const src: string; export default src; }
5
- declare module "*.svg?base64-data-uri" { const src: string; export default src; }
6
- declare module "*.svg?preserve-line-width" { const src: string; export default src; }
7
- declare module "*.svg?preserve-line-width=true" { const src: string; export default src; }
8
- declare module "*.svg?preserve-line-width=false" { const src: string; export default src; }
9
- declare module "*.svg?url&preserve-line-width" { const src: string; export default src; }
10
- declare module "*.svg?url&preserve-line-width=true" { const src: string; export default src; }
11
- declare module "*.svg?url&preserve-line-width=false" { const src: string; export default src; }
12
- declare module "*.svg?source&preserve-line-width" { const src: string; export default src; }
13
- declare module "*.svg?source&preserve-line-width=true" { const src: string; export default src; }
14
- declare module "*.svg?source&preserve-line-width=false" { const src: string; export default src; }
15
- declare module "*.svg?source-data-uri&preserve-line-width" { const src: string; export default src; }
16
- declare module "*.svg?source-data-uri&preserve-line-width=true" { const src: string; export default src; }
17
- declare module "*.svg?source-data-uri&preserve-line-width=false" { const src: string; export default src; }
18
- declare module "*.svg?base64&preserve-line-width" { const src: string; export default src; }
19
- declare module "*.svg?base64&preserve-line-width=true" { const src: string; export default src; }
20
- declare module "*.svg?base64&preserve-line-width=false" { const src: string; export default src; }
21
- declare module "*.svg?base64-data-uri&preserve-line-width" { const src: string; export default src; }
22
- declare module "*.svg?base64-data-uri&preserve-line-width=true" { const src: string; export default src; }
23
- declare module "*.svg?base64-data-uri&preserve-line-width=false" { const src: string; export default src; }
24
- declare module "*.svg?set-current-color" { const src: string; export default src; }
25
- declare module "*.svg?set-current-color=true" { const src: string; export default src; }
26
- declare module "*.svg?set-current-color=false" { const src: string; export default src; }
27
- declare module "*.svg?url&set-current-color" { const src: string; export default src; }
28
- declare module "*.svg?url&set-current-color=true" { const src: string; export default src; }
29
- declare module "*.svg?url&set-current-color=false" { const src: string; export default src; }
30
- declare module "*.svg?source&set-current-color" { const src: string; export default src; }
31
- declare module "*.svg?source&set-current-color=true" { const src: string; export default src; }
32
- declare module "*.svg?source&set-current-color=false" { const src: string; export default src; }
33
- declare module "*.svg?source-data-uri&set-current-color" { const src: string; export default src; }
34
- declare module "*.svg?source-data-uri&set-current-color=true" { const src: string; export default src; }
35
- declare module "*.svg?source-data-uri&set-current-color=false" { const src: string; export default src; }
36
- declare module "*.svg?base64&set-current-color" { const src: string; export default src; }
37
- declare module "*.svg?base64&set-current-color=true" { const src: string; export default src; }
38
- declare module "*.svg?base64&set-current-color=false" { const src: string; export default src; }
39
- declare module "*.svg?base64-data-uri&set-current-color" { const src: string; export default src; }
40
- declare module "*.svg?base64-data-uri&set-current-color=true" { const src: string; export default src; }
41
- declare module "*.svg?base64-data-uri&set-current-color=false" { const src: string; export default src; }
42
- declare module "*.svg?skip-transforms" { const src: string; export default src; }
43
- declare module "*.svg?skip-transforms=true" { const src: string; export default src; }
44
- declare module "*.svg?skip-transforms=false" { const src: string; export default src; }
45
- declare module "*.svg?url&skip-transforms" { const src: string; export default src; }
46
- declare module "*.svg?url&skip-transforms=true" { const src: string; export default src; }
47
- declare module "*.svg?url&skip-transforms=false" { const src: string; export default src; }
48
- declare module "*.svg?source&skip-transforms" { const src: string; export default src; }
49
- declare module "*.svg?source&skip-transforms=true" { const src: string; export default src; }
50
- declare module "*.svg?source&skip-transforms=false" { const src: string; export default src; }
51
- declare module "*.svg?source-data-uri&skip-transforms" { const src: string; export default src; }
52
- declare module "*.svg?source-data-uri&skip-transforms=true" { const src: string; export default src; }
53
- declare module "*.svg?source-data-uri&skip-transforms=false" { const src: string; export default src; }
54
- declare module "*.svg?base64&skip-transforms" { const src: string; export default src; }
55
- declare module "*.svg?base64&skip-transforms=true" { const src: string; export default src; }
56
- declare module "*.svg?base64&skip-transforms=false" { const src: string; export default src; }
57
- declare module "*.svg?base64-data-uri&skip-transforms" { const src: string; export default src; }
58
- declare module "*.svg?base64-data-uri&skip-transforms=true" { const src: string; export default src; }
59
- declare module "*.svg?base64-data-uri&skip-transforms=false" { const src: string; export default src; }
60
- declare module "*.svg?skip-awesome-svg-loader" { const src: string; export default src; }
61
- declare module "*.svg?skip-awesome-svg-loader=true" { const src: string; export default src; }
62
- declare module "*.svg?skip-awesome-svg-loader=false" { const src: string; export default src; }
63
- declare module "*.svg?url&skip-awesome-svg-loader" { const src: string; export default src; }
64
- declare module "*.svg?url&skip-awesome-svg-loader=true" { const src: string; export default src; }
65
- declare module "*.svg?url&skip-awesome-svg-loader=false" { const src: string; export default src; }
66
- declare module "*.svg?source&skip-awesome-svg-loader" { const src: string; export default src; }
67
- declare module "*.svg?source&skip-awesome-svg-loader=true" { const src: string; export default src; }
68
- declare module "*.svg?source&skip-awesome-svg-loader=false" { const src: string; export default src; }
69
- declare module "*.svg?source-data-uri&skip-awesome-svg-loader" { const src: string; export default src; }
70
- declare module "*.svg?source-data-uri&skip-awesome-svg-loader=true" { const src: string; export default src; }
71
- declare module "*.svg?source-data-uri&skip-awesome-svg-loader=false" { const src: string; export default src; }
72
- declare module "*.svg?base64&skip-awesome-svg-loader" { const src: string; export default src; }
73
- declare module "*.svg?base64&skip-awesome-svg-loader=true" { const src: string; export default src; }
74
- declare module "*.svg?base64&skip-awesome-svg-loader=false" { const src: string; export default src; }
75
- declare module "*.svg?base64-data-uri&skip-awesome-svg-loader" { const src: string; export default src; }
76
- declare module "*.svg?base64-data-uri&skip-awesome-svg-loader=true" { const src: string; export default src; }
77
- declare module "*.svg?base64-data-uri&skip-awesome-svg-loader=false" { const src: string; export default src; }
1
+ declare module "*.svg" {
2
+ export const src: string;
3
+ export default src;
4
+ export const prefix: string
5
+ }
6
+ declare module "*.svg?url" {
7
+ export const src: string;
8
+ export default src;
9
+ export const prefix: string
10
+ }
11
+ declare module "*.svg?source" {
12
+ export const src: string;
13
+ export default src;
14
+ export const prefix: string
15
+ }
16
+ declare module "*.svg?source-data-uri" {
17
+ export const src: string;
18
+ export default src;
19
+ export const prefix: string
20
+ }
21
+ declare module "*.svg?base64" {
22
+ export const src: string;
23
+ export default src;
24
+ export const prefix: string
25
+ }
26
+ declare module "*.svg?base64-data-uri" {
27
+ export const src: string;
28
+ export default src;
29
+ export const prefix: string
30
+ }
31
+ declare module "*.svg?preserve-line-width" {
32
+ export const src: string;
33
+ export default src;
34
+ export const prefix: string
35
+ }
36
+ declare module "*.svg?preserve-line-width=true" {
37
+ export const src: string;
38
+ export default src;
39
+ export const prefix: string
40
+ }
41
+ declare module "*.svg?preserve-line-width=false" {
42
+ export const src: string;
43
+ export default src;
44
+ export const prefix: string
45
+ }
46
+ declare module "*.svg?url&preserve-line-width" {
47
+ export const src: string;
48
+ export default src;
49
+ export const prefix: string
50
+ }
51
+ declare module "*.svg?url&preserve-line-width=true" {
52
+ export const src: string;
53
+ export default src;
54
+ export const prefix: string
55
+ }
56
+ declare module "*.svg?url&preserve-line-width=false" {
57
+ export const src: string;
58
+ export default src;
59
+ export const prefix: string
60
+ }
61
+ declare module "*.svg?source&preserve-line-width" {
62
+ export const src: string;
63
+ export default src;
64
+ export const prefix: string
65
+ }
66
+ declare module "*.svg?source&preserve-line-width=true" {
67
+ export const src: string;
68
+ export default src;
69
+ export const prefix: string
70
+ }
71
+ declare module "*.svg?source&preserve-line-width=false" {
72
+ export const src: string;
73
+ export default src;
74
+ export const prefix: string
75
+ }
76
+ declare module "*.svg?source-data-uri&preserve-line-width" {
77
+ export const src: string;
78
+ export default src;
79
+ export const prefix: string
80
+ }
81
+ declare module "*.svg?source-data-uri&preserve-line-width=true" {
82
+ export const src: string;
83
+ export default src;
84
+ export const prefix: string
85
+ }
86
+ declare module "*.svg?source-data-uri&preserve-line-width=false" {
87
+ export const src: string;
88
+ export default src;
89
+ export const prefix: string
90
+ }
91
+ declare module "*.svg?base64&preserve-line-width" {
92
+ export const src: string;
93
+ export default src;
94
+ export const prefix: string
95
+ }
96
+ declare module "*.svg?base64&preserve-line-width=true" {
97
+ export const src: string;
98
+ export default src;
99
+ export const prefix: string
100
+ }
101
+ declare module "*.svg?base64&preserve-line-width=false" {
102
+ export const src: string;
103
+ export default src;
104
+ export const prefix: string
105
+ }
106
+ declare module "*.svg?base64-data-uri&preserve-line-width" {
107
+ export const src: string;
108
+ export default src;
109
+ export const prefix: string
110
+ }
111
+ declare module "*.svg?base64-data-uri&preserve-line-width=true" {
112
+ export const src: string;
113
+ export default src;
114
+ export const prefix: string
115
+ }
116
+ declare module "*.svg?base64-data-uri&preserve-line-width=false" {
117
+ export const src: string;
118
+ export default src;
119
+ export const prefix: string
120
+ }
121
+ declare module "*.svg?set-current-color" {
122
+ export const src: string;
123
+ export default src;
124
+ export const prefix: string
125
+ }
126
+ declare module "*.svg?set-current-color=true" {
127
+ export const src: string;
128
+ export default src;
129
+ export const prefix: string
130
+ }
131
+ declare module "*.svg?set-current-color=false" {
132
+ export const src: string;
133
+ export default src;
134
+ export const prefix: string
135
+ }
136
+ declare module "*.svg?url&set-current-color" {
137
+ export const src: string;
138
+ export default src;
139
+ export const prefix: string
140
+ }
141
+ declare module "*.svg?url&set-current-color=true" {
142
+ export const src: string;
143
+ export default src;
144
+ export const prefix: string
145
+ }
146
+ declare module "*.svg?url&set-current-color=false" {
147
+ export const src: string;
148
+ export default src;
149
+ export const prefix: string
150
+ }
151
+ declare module "*.svg?source&set-current-color" {
152
+ export const src: string;
153
+ export default src;
154
+ export const prefix: string
155
+ }
156
+ declare module "*.svg?source&set-current-color=true" {
157
+ export const src: string;
158
+ export default src;
159
+ export const prefix: string
160
+ }
161
+ declare module "*.svg?source&set-current-color=false" {
162
+ export const src: string;
163
+ export default src;
164
+ export const prefix: string
165
+ }
166
+ declare module "*.svg?source-data-uri&set-current-color" {
167
+ export const src: string;
168
+ export default src;
169
+ export const prefix: string
170
+ }
171
+ declare module "*.svg?source-data-uri&set-current-color=true" {
172
+ export const src: string;
173
+ export default src;
174
+ export const prefix: string
175
+ }
176
+ declare module "*.svg?source-data-uri&set-current-color=false" {
177
+ export const src: string;
178
+ export default src;
179
+ export const prefix: string
180
+ }
181
+ declare module "*.svg?base64&set-current-color" {
182
+ export const src: string;
183
+ export default src;
184
+ export const prefix: string
185
+ }
186
+ declare module "*.svg?base64&set-current-color=true" {
187
+ export const src: string;
188
+ export default src;
189
+ export const prefix: string
190
+ }
191
+ declare module "*.svg?base64&set-current-color=false" {
192
+ export const src: string;
193
+ export default src;
194
+ export const prefix: string
195
+ }
196
+ declare module "*.svg?base64-data-uri&set-current-color" {
197
+ export const src: string;
198
+ export default src;
199
+ export const prefix: string
200
+ }
201
+ declare module "*.svg?base64-data-uri&set-current-color=true" {
202
+ export const src: string;
203
+ export default src;
204
+ export const prefix: string
205
+ }
206
+ declare module "*.svg?base64-data-uri&set-current-color=false" {
207
+ export const src: string;
208
+ export default src;
209
+ export const prefix: string
210
+ }
211
+ declare module "*.svg?skip-transforms" {
212
+ export const src: string;
213
+ export default src;
214
+ export const prefix: string
215
+ }
216
+ declare module "*.svg?skip-transforms=true" {
217
+ export const src: string;
218
+ export default src;
219
+ export const prefix: string
220
+ }
221
+ declare module "*.svg?skip-transforms=false" {
222
+ export const src: string;
223
+ export default src;
224
+ export const prefix: string
225
+ }
226
+ declare module "*.svg?url&skip-transforms" {
227
+ export const src: string;
228
+ export default src;
229
+ export const prefix: string
230
+ }
231
+ declare module "*.svg?url&skip-transforms=true" {
232
+ export const src: string;
233
+ export default src;
234
+ export const prefix: string
235
+ }
236
+ declare module "*.svg?url&skip-transforms=false" {
237
+ export const src: string;
238
+ export default src;
239
+ export const prefix: string
240
+ }
241
+ declare module "*.svg?source&skip-transforms" {
242
+ export const src: string;
243
+ export default src;
244
+ export const prefix: string
245
+ }
246
+ declare module "*.svg?source&skip-transforms=true" {
247
+ export const src: string;
248
+ export default src;
249
+ export const prefix: string
250
+ }
251
+ declare module "*.svg?source&skip-transforms=false" {
252
+ export const src: string;
253
+ export default src;
254
+ export const prefix: string
255
+ }
256
+ declare module "*.svg?source-data-uri&skip-transforms" {
257
+ export const src: string;
258
+ export default src;
259
+ export const prefix: string
260
+ }
261
+ declare module "*.svg?source-data-uri&skip-transforms=true" {
262
+ export const src: string;
263
+ export default src;
264
+ export const prefix: string
265
+ }
266
+ declare module "*.svg?source-data-uri&skip-transforms=false" {
267
+ export const src: string;
268
+ export default src;
269
+ export const prefix: string
270
+ }
271
+ declare module "*.svg?base64&skip-transforms" {
272
+ export const src: string;
273
+ export default src;
274
+ export const prefix: string
275
+ }
276
+ declare module "*.svg?base64&skip-transforms=true" {
277
+ export const src: string;
278
+ export default src;
279
+ export const prefix: string
280
+ }
281
+ declare module "*.svg?base64&skip-transforms=false" {
282
+ export const src: string;
283
+ export default src;
284
+ export const prefix: string
285
+ }
286
+ declare module "*.svg?base64-data-uri&skip-transforms" {
287
+ export const src: string;
288
+ export default src;
289
+ export const prefix: string
290
+ }
291
+ declare module "*.svg?base64-data-uri&skip-transforms=true" {
292
+ export const src: string;
293
+ export default src;
294
+ export const prefix: string
295
+ }
296
+ declare module "*.svg?base64-data-uri&skip-transforms=false" {
297
+ export const src: string;
298
+ export default src;
299
+ export const prefix: string
300
+ }
301
+ declare module "*.svg?skip-awesome-svg-loader" {
302
+ export const src: string;
303
+ export default src;
304
+ export const prefix: string
305
+ }
306
+ declare module "*.svg?skip-awesome-svg-loader=true" {
307
+ export const src: string;
308
+ export default src;
309
+ export const prefix: string
310
+ }
311
+ declare module "*.svg?skip-awesome-svg-loader=false" {
312
+ export const src: string;
313
+ export default src;
314
+ export const prefix: string
315
+ }
316
+ declare module "*.svg?url&skip-awesome-svg-loader" {
317
+ export const src: string;
318
+ export default src;
319
+ export const prefix: string
320
+ }
321
+ declare module "*.svg?url&skip-awesome-svg-loader=true" {
322
+ export const src: string;
323
+ export default src;
324
+ export const prefix: string
325
+ }
326
+ declare module "*.svg?url&skip-awesome-svg-loader=false" {
327
+ export const src: string;
328
+ export default src;
329
+ export const prefix: string
330
+ }
331
+ declare module "*.svg?source&skip-awesome-svg-loader" {
332
+ export const src: string;
333
+ export default src;
334
+ export const prefix: string
335
+ }
336
+ declare module "*.svg?source&skip-awesome-svg-loader=true" {
337
+ export const src: string;
338
+ export default src;
339
+ export const prefix: string
340
+ }
341
+ declare module "*.svg?source&skip-awesome-svg-loader=false" {
342
+ export const src: string;
343
+ export default src;
344
+ export const prefix: string
345
+ }
346
+ declare module "*.svg?source-data-uri&skip-awesome-svg-loader" {
347
+ export const src: string;
348
+ export default src;
349
+ export const prefix: string
350
+ }
351
+ declare module "*.svg?source-data-uri&skip-awesome-svg-loader=true" {
352
+ export const src: string;
353
+ export default src;
354
+ export const prefix: string
355
+ }
356
+ declare module "*.svg?source-data-uri&skip-awesome-svg-loader=false" {
357
+ export const src: string;
358
+ export default src;
359
+ export const prefix: string
360
+ }
361
+ declare module "*.svg?base64&skip-awesome-svg-loader" {
362
+ export const src: string;
363
+ export default src;
364
+ export const prefix: string
365
+ }
366
+ declare module "*.svg?base64&skip-awesome-svg-loader=true" {
367
+ export const src: string;
368
+ export default src;
369
+ export const prefix: string
370
+ }
371
+ declare module "*.svg?base64&skip-awesome-svg-loader=false" {
372
+ export const src: string;
373
+ export default src;
374
+ export const prefix: string
375
+ }
376
+ declare module "*.svg?base64-data-uri&skip-awesome-svg-loader" {
377
+ export const src: string;
378
+ export default src;
379
+ export const prefix: string
380
+ }
381
+ declare module "*.svg?base64-data-uri&skip-awesome-svg-loader=true" {
382
+ export const src: string;
383
+ export default src;
384
+ export const prefix: string
385
+ }
386
+ declare module "*.svg?base64-data-uri&skip-awesome-svg-loader=false" {
387
+ export const src: string;
388
+ export default src;
389
+ export const prefix: string
390
+ }
package/index.js CHANGED
@@ -84,14 +84,17 @@ function matchesPath(relPathWithSlash, matchers) {
84
84
  for (const matcher of matchers) {
85
85
  const isRegex = matcher instanceof RegExp;
86
86
  for (const entry of toMatch) {
87
- if (isRegex) {
88
- return !!matcher.exec(entry);
87
+ const matches = isRegex ? matcher.test(entry) : entry === matcher;
88
+ if (matches) {
89
+ return true;
89
90
  }
90
- return entry === matcher;
91
91
  }
92
92
  }
93
93
  return false;
94
94
  }
95
+ function normalizeSelector(selector) {
96
+ return selector.replaceAll(/\s+/g, " ").trim();
97
+ }
95
98
  function selectorsToList(relPathWithSlash, selectors, returnEmptyList) {
96
99
  const resolvedSelectors = [];
97
100
  if (returnEmptyList) {
@@ -99,11 +102,13 @@ function selectorsToList(relPathWithSlash, selectors, returnEmptyList) {
99
102
  }
100
103
  for (const selector of selectors) {
101
104
  if (typeof selector === "string") {
102
- resolvedSelectors.push(selector);
105
+ resolvedSelectors.push(normalizeSelector(selector));
103
106
  continue;
104
107
  }
105
108
  if (matchesPath(relPathWithSlash, selector.files)) {
106
- resolvedSelectors.push(...selector.selectors);
109
+ for (const selectorStr of selector.selectors) {
110
+ resolvedSelectors.push(normalizeSelector(selectorStr));
111
+ }
107
112
  }
108
113
  }
109
114
  return resolvedSelectors;
@@ -119,7 +124,7 @@ function matchesSelectors(node, selectors) {
119
124
  }
120
125
  function replaceColor(color, replacements) {
121
126
  if (!color) {
122
- return "";
127
+ return replacements.default || "";
123
128
  }
124
129
  return replacements.replacements[color.toLowerCase()] || replacements.default || color;
125
130
  }
@@ -471,14 +476,17 @@ function viteAwesomeSvgLoader(options = {}) {
471
476
  mergedOptions.skipTransformsSelectors,
472
477
  shouldSkipTransforms
473
478
  );
474
- let hash = relPathWithSlash + "-";
479
+ const hashParts = [relPathWithSlash];
480
+ for (const arr of [skipPreserveLineWidthSelectors, skipReplaceColorsSelectors, skipTransformsSelectors]) {
481
+ hashParts.push(arr.join(","));
482
+ }
475
483
  for (const param of [shouldSkipTransforms, shouldPreserveLineWidth, shouldReplaceColors]) {
476
- hash += param ? "1" : "0";
484
+ hashParts.push(param ? "1" : "0");
477
485
  }
478
486
  if (shouldReplaceColors) {
479
- hash += JSON.stringify(colorReplacements);
487
+ hashParts.push(JSON.stringify(colorReplacements));
480
488
  }
481
- hash = new import_imurmurhash.default(hash).result();
489
+ const hash = new import_imurmurhash.default(hashParts.join("__")).result();
482
490
  const fileNameNoExt = import_path2.default.basename(relPathWithSlash).split(".")[0];
483
491
  const assetFileNameNoExt = `${fileNameNoExt}-${hash}`;
484
492
  const assetFileName = assetFileNameNoExt + ".svg";
@@ -487,6 +495,7 @@ function viteAwesomeSvgLoader(options = {}) {
487
495
  let code = import_fs_extra.default.readFileSync(fullPath).toString();
488
496
  let isFillSetOnRoot = false;
489
497
  const nodesWithOrigColors = [];
498
+ const classesAndIdsPrefix = assetFileNameNoExt + "__";
490
499
  let didTransform = false;
491
500
  code = (0, import_svgo.optimize)(code, {
492
501
  multipass: true,
@@ -496,7 +505,8 @@ function viteAwesomeSvgLoader(options = {}) {
496
505
  params: {
497
506
  prefixIds: true,
498
507
  prefixClassNames: true,
499
- prefix: assetFileNameNoExt
508
+ prefix: classesAndIdsPrefix,
509
+ delim: ""
500
510
  }
501
511
  },
502
512
  {
@@ -540,27 +550,34 @@ function viteAwesomeSvgLoader(options = {}) {
540
550
  importType = type;
541
551
  }
542
552
  }
553
+ const getExports = (src) => {
554
+ return [
555
+ `export const src = ${src};`,
556
+ `export const prefix = "${classesAndIdsPrefix}"`,
557
+ `export default src`
558
+ ].join("\n");
559
+ };
543
560
  switch (importType) {
544
561
  case "source":
545
- return "export default `" + escapeBackticks(code) + "`;";
562
+ return getExports("`" + escapeBackticks(code) + "`");
546
563
  case "source-data-uri":
547
- return "export default `data:image/svg+xml," + encodeURIComponent(code) + "`;";
564
+ return getExports("`data:image/svg+xml," + encodeURIComponent(code) + "`");
548
565
  case "base64":
549
- return "export default `" + escapeBackticks(toBase64(code)) + "`;";
566
+ return getExports("`" + escapeBackticks(toBase64(code)) + "`");
550
567
  case "base64-data-uri":
551
- return "export default `data:image/svg+xml;base64," + encodeURIComponent(toBase64(code)) + "`;";
568
+ return getExports("`data:image/svg+xml;base64," + encodeURIComponent(toBase64(code)) + "`");
552
569
  }
553
570
  if (!isBuildMode) {
554
571
  const assetUrl = mergedOptions.tempDir + assetRelPath;
555
572
  import_fs_extra.default.outputFileSync(root + assetUrl, code);
556
- return `export default "${base + assetUrl}"`;
573
+ return getExports(`"${base + assetUrl}"`);
557
574
  }
558
575
  const assetId = this.emitFile({
559
576
  type: "asset",
560
577
  name: assetFileName,
561
578
  source: code
562
579
  });
563
- return `export default "__VITE_ASSET__${assetId}__";`;
580
+ return getExports(`"__VITE_ASSET__${assetId}__"`);
564
581
  }
565
582
  };
566
583
  }
package/index.mjs CHANGED
@@ -51,14 +51,17 @@ function matchesPath(relPathWithSlash, matchers) {
51
51
  for (const matcher of matchers) {
52
52
  const isRegex = matcher instanceof RegExp;
53
53
  for (const entry of toMatch) {
54
- if (isRegex) {
55
- return !!matcher.exec(entry);
54
+ const matches = isRegex ? matcher.test(entry) : entry === matcher;
55
+ if (matches) {
56
+ return true;
56
57
  }
57
- return entry === matcher;
58
58
  }
59
59
  }
60
60
  return false;
61
61
  }
62
+ function normalizeSelector(selector) {
63
+ return selector.replaceAll(/\s+/g, " ").trim();
64
+ }
62
65
  function selectorsToList(relPathWithSlash, selectors, returnEmptyList) {
63
66
  const resolvedSelectors = [];
64
67
  if (returnEmptyList) {
@@ -66,11 +69,13 @@ function selectorsToList(relPathWithSlash, selectors, returnEmptyList) {
66
69
  }
67
70
  for (const selector of selectors) {
68
71
  if (typeof selector === "string") {
69
- resolvedSelectors.push(selector);
72
+ resolvedSelectors.push(normalizeSelector(selector));
70
73
  continue;
71
74
  }
72
75
  if (matchesPath(relPathWithSlash, selector.files)) {
73
- resolvedSelectors.push(...selector.selectors);
76
+ for (const selectorStr of selector.selectors) {
77
+ resolvedSelectors.push(normalizeSelector(selectorStr));
78
+ }
74
79
  }
75
80
  }
76
81
  return resolvedSelectors;
@@ -86,7 +91,7 @@ function matchesSelectors(node, selectors) {
86
91
  }
87
92
  function replaceColor(color, replacements) {
88
93
  if (!color) {
89
- return "";
94
+ return replacements.default || "";
90
95
  }
91
96
  return replacements.replacements[color.toLowerCase()] || replacements.default || color;
92
97
  }
@@ -438,14 +443,17 @@ function viteAwesomeSvgLoader(options = {}) {
438
443
  mergedOptions.skipTransformsSelectors,
439
444
  shouldSkipTransforms
440
445
  );
441
- let hash = relPathWithSlash + "-";
446
+ const hashParts = [relPathWithSlash];
447
+ for (const arr of [skipPreserveLineWidthSelectors, skipReplaceColorsSelectors, skipTransformsSelectors]) {
448
+ hashParts.push(arr.join(","));
449
+ }
442
450
  for (const param of [shouldSkipTransforms, shouldPreserveLineWidth, shouldReplaceColors]) {
443
- hash += param ? "1" : "0";
451
+ hashParts.push(param ? "1" : "0");
444
452
  }
445
453
  if (shouldReplaceColors) {
446
- hash += JSON.stringify(colorReplacements);
454
+ hashParts.push(JSON.stringify(colorReplacements));
447
455
  }
448
- hash = new MurmurHash3(hash).result();
456
+ const hash = new MurmurHash3(hashParts.join("__")).result();
449
457
  const fileNameNoExt = path2.basename(relPathWithSlash).split(".")[0];
450
458
  const assetFileNameNoExt = `${fileNameNoExt}-${hash}`;
451
459
  const assetFileName = assetFileNameNoExt + ".svg";
@@ -454,6 +462,7 @@ function viteAwesomeSvgLoader(options = {}) {
454
462
  let code = fs.readFileSync(fullPath).toString();
455
463
  let isFillSetOnRoot = false;
456
464
  const nodesWithOrigColors = [];
465
+ const classesAndIdsPrefix = assetFileNameNoExt + "__";
457
466
  let didTransform = false;
458
467
  code = optimize(code, {
459
468
  multipass: true,
@@ -463,7 +472,8 @@ function viteAwesomeSvgLoader(options = {}) {
463
472
  params: {
464
473
  prefixIds: true,
465
474
  prefixClassNames: true,
466
- prefix: assetFileNameNoExt
475
+ prefix: classesAndIdsPrefix,
476
+ delim: ""
467
477
  }
468
478
  },
469
479
  {
@@ -507,27 +517,34 @@ function viteAwesomeSvgLoader(options = {}) {
507
517
  importType = type;
508
518
  }
509
519
  }
520
+ const getExports = (src) => {
521
+ return [
522
+ `export const src = ${src};`,
523
+ `export const prefix = "${classesAndIdsPrefix}"`,
524
+ `export default src`
525
+ ].join("\n");
526
+ };
510
527
  switch (importType) {
511
528
  case "source":
512
- return "export default `" + escapeBackticks(code) + "`;";
529
+ return getExports("`" + escapeBackticks(code) + "`");
513
530
  case "source-data-uri":
514
- return "export default `data:image/svg+xml," + encodeURIComponent(code) + "`;";
531
+ return getExports("`data:image/svg+xml," + encodeURIComponent(code) + "`");
515
532
  case "base64":
516
- return "export default `" + escapeBackticks(toBase64(code)) + "`;";
533
+ return getExports("`" + escapeBackticks(toBase64(code)) + "`");
517
534
  case "base64-data-uri":
518
- return "export default `data:image/svg+xml;base64," + encodeURIComponent(toBase64(code)) + "`;";
535
+ return getExports("`data:image/svg+xml;base64," + encodeURIComponent(toBase64(code)) + "`");
519
536
  }
520
537
  if (!isBuildMode) {
521
538
  const assetUrl = mergedOptions.tempDir + assetRelPath;
522
539
  fs.outputFileSync(root + assetUrl, code);
523
- return `export default "${base + assetUrl}"`;
540
+ return getExports(`"${base + assetUrl}"`);
524
541
  }
525
542
  const assetId = this.emitFile({
526
543
  type: "asset",
527
544
  name: assetFileName,
528
545
  source: code
529
546
  });
530
- return `export default "__VITE_ASSET__${assetId}__";`;
547
+ return getExports(`"__VITE_ASSET__${assetId}__"`);
531
548
  }
532
549
  };
533
550
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "vite-awesome-svg-loader",
3
- "description": "Imports SVGs as source code, base64 and data URI. Preserves stroke width, replaces colors with currentColor. Optimizes SVGs with SVGO. Creates SVG sprites.",
3
+ "description": "Imports SVGs as source code, base64 and data URI. Preserves stroke width, replaces colors with currentColor or custom colors. Optimizes SVGs with SVGO. Creates SVG sprites.",
4
4
  "keywords": [
5
5
  "vite",
6
6
  "svg",
@@ -27,7 +27,7 @@
27
27
  "vite-awesome-svg-loader",
28
28
  "svgo"
29
29
  ],
30
- "version": "2.0.0",
30
+ "version": "2.1.0",
31
31
  "homepage": "https://github.com/matafokka/vite-awesome-svg-loader",
32
32
  "repository": "https://github.com/matafokka/vite-awesome-svg-loader",
33
33
  "license": "LGPL-2.1-or-later",