optimized-react-component-library-xyz123 0.1.68 → 0.1.70

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/dist/index.css CHANGED
@@ -3,525 +3,13 @@
3
3
  /* src/NewInputComponentStandard/TextAreaStandard/TextAreaStandard.css */
4
4
  /* src/NewInputComponentStandard/FilesUploadStandard/FilesUploadStandard.css */
5
5
  /* src/NewInputComponentStandard/AddFilesStandard/AddFilesStandard.css */
6
- .invisible {
7
- display: none;
8
- width: 1px;
9
- }
10
- .filePickLabel {
11
- display: flex;
12
- align-items: center;
13
- justify-content: flex-start;
14
- width: 100%;
15
- margin: 0;
16
- padding: 0;
17
- height: 48px;
18
- border: 1px solid #747474;
19
- border-radius: var(--bs-border-radius);
20
- }
21
- .filePickLabel:focus {
22
- border: #000000 2px solid;
23
- box-shadow: none;
24
- }
25
- .filePickLabel .filePickButton {
26
- cursor: pointer;
27
- padding: 16px;
28
- height: 100%;
29
- background: #747474;
30
- border-top-left-radius: 4px;
31
- border-bottom-left-radius: 4px;
32
- display: flex;
33
- align-items: center;
34
- flex-direction: column;
35
- justify-content: center;
36
- align-self: stretch;
37
- color: #ffff;
38
- font-family: Arial;
39
- font-size: 16px;
40
- font-style: normal;
41
- font-weight: 400;
42
- line-height: 24px;
43
- }
44
- .filePickButton {
45
- width: auto !important;
46
- border: none;
47
- margin-left: 0px !important;
48
- }
49
- .filePickButton.error {
50
- background: #8e0039 !important;
51
- color: #fff !important;
52
- }
53
- @media (max-width: 990px) {
54
- .filePickLabel .filePickButton {
55
- font-size: 14px;
56
- line-height: 14px;
57
- text-align: center;
58
- }
59
- }
60
- .filePickLabel .filePickText {
61
- padding-left: 16px;
62
- color: #000;
63
- font-family: Arial;
64
- font-size: 16px;
65
- font-style: normal;
66
- font-weight: 400;
67
- line-height: 24px;
68
- }
69
- .inputContainer {
70
- display: flex;
71
- align-items: center;
72
- justify-content: center;
73
- width: 100%;
74
- height: 100%;
75
- }
76
- @media (max-width: 768px) {
77
- .inputContainer {
78
- margin-bottom: 16px;
79
- }
80
- }
81
- .inputContainer button {
82
- margin: 0;
83
- padding: 8px 24px;
84
- margin-left: 16px;
85
- height: 50px;
86
- width: 200px;
87
- }
88
- .inputContainer input[type=text] {
89
- font-size: 16px;
90
- }
91
- .custom-file-button input[type=file] {
92
- margin-left: -2px !important;
93
- }
94
- .custom-file-button input[type=file]::-webkit-file-upload-button {
95
- display: none;
96
- }
97
- .custom-file-button input[type=file]::file-selector-button {
98
- display: none;
99
- }
100
- .custom-file-button:hover label {
101
- background-color: #dde0e3;
102
- cursor: pointer;
103
- }
104
- @media (max-width: 768px) {
105
- .DropZoneContainer {
106
- display: none;
107
- }
108
- }
109
- .DropZone {
110
- color: #000;
111
- margin-top: 20px;
112
- margin-bottom: 16px;
113
- font-family: Arial;
114
- font-size: 20px;
115
- font-style: normal;
116
- font-weight: 400;
117
- line-height: 24px;
118
- display: inline-flex;
119
- width: 100%;
120
- height: 180px;
121
- position: relative;
122
- clip-path: inset(0 round 8px 8px 8px 8px);
123
- background: var(--neutral-350, #f7f7f7);
124
- align-items: center;
125
- justify-content: center;
126
- text-align: center;
127
- gap: 10px;
128
- flex-direction: column;
129
- cursor: pointer;
130
- }
131
- .DropZone::before {
132
- content: "";
133
- position: absolute;
134
- left: -7px;
135
- top: -7px;
136
- right: -7px;
137
- bottom: -7px;
138
- border: 9px dashed rgba(0, 0, 0, 0.6);
139
- border-radius: 15px 15px 15px 15px;
140
- box-sizing: border-box;
141
- }
142
- .DropZone:hover {
143
- background: var(--neutral-350, #f7f7f7);
144
- opacity: 0.9;
145
- cursor: copy;
146
- }
147
- .ClipboardLink {
148
- display: block;
149
- position: relative;
150
- z-index: 2000;
151
- cursor: pointer;
152
- font-size: "12px";
153
- text-decoration: "underline";
154
- color: black;
155
- }
156
- .ClipboardLink:hover {
157
- cursor: pointer;
158
- }
159
- .makeTopSpace {
160
- margin-top: 12px;
161
- }
162
- .UploadedFile {
163
- margin-top: 24px;
164
- }
165
- .uploadFileRow {
166
- max-width: 555px;
167
- }
168
- @media (max-width: 768px) {
169
- .uploadFileRow {
170
- margin-left: 0px;
171
- }
172
- }
173
- .uploadedFileName {
174
- color: #000000;
175
- position: relative;
176
- border: 0px solid red;
177
- width: 76%;
178
- top: -21px;
179
- left: 24px;
180
- }
181
- .desktopFileName {
182
- display: block;
183
- }
184
- .mobileFirstFileName {
185
- display: block;
186
- }
187
- .uploadedDot.mobileVersion {
188
- display: none;
189
- }
190
- @media (max-width: 768px) {
191
- svg.uploadFileIcon {
192
- display: none;
193
- }
194
- .uploadedDot.mobileVersion {
195
- display: flex;
196
- }
197
- }
198
- .lastCol {
199
- display: flex;
200
- justify-content: flex-end;
201
- max-width: 62px;
202
- padding: 0;
203
- margin: 0;
204
- }
205
- .fileInListContainer {
206
- max-width: 624px;
207
- }
208
- .fileListUnorderedList {
209
- list-style: none !important;
210
- padding: 0;
211
- margin: 0;
212
- }
213
- .fileInList {
214
- width: 100%;
215
- }
216
- .fileInList .row {
217
- display: flex;
218
- justify-content: space-between;
219
- align-items: center;
220
- max-width: 100% !important;
221
- border: 0px solid black;
222
- padding: 0px 0px;
223
- --bs-gutter-x: 0px !important;
224
- }
225
- .fileInList .row .col {
226
- padding: 0;
227
- margin: 0;
228
- }
229
- .fileInList .row .lastCol {
230
- display: flex;
231
- justify-content: flex-end;
232
- }
233
- .fileInList .makeSpace {
234
- border-bottom: 1px solid #747474;
235
- }
236
- .fileInfo {
237
- display: flex;
238
- flex-direction: column;
239
- align-items: flex-start;
240
- gap: 13px;
241
- }
242
- .uploadedPercentage {
243
- font-family: Arial;
244
- font-size: 13px;
245
- font-style: normal;
246
- font-weight: 400;
247
- line-height: 16px;
248
- margin-top: 2px;
249
- }
250
- @media (max-width: 768px) {
251
- .uploadedPercentage {
252
- display: none;
253
- }
254
- }
255
- .trashCan {
256
- width: 57px;
257
- display: flex;
258
- flex-direction: column;
259
- flex-shrink: 0;
260
- justify-content: start;
261
- align-items: center;
262
- padding: 0;
263
- }
264
- .trashCan a {
265
- cursor: pointer;
266
- display: flex;
267
- flex-direction: column;
268
- flex-shrink: 0;
269
- justify-content: center;
270
- align-items: center;
271
- padding: 0;
272
- }
273
- .trashCan svg {
274
- width: 24px;
275
- height: 27px;
276
- stroke-width: 2px;
277
- stroke: var(--purple-900-primary, #6e3282);
278
- }
279
- .trashCanPositioning {
280
- display: flex;
281
- align-items: flex-start;
282
- justify-content: flex-end;
283
- gap: 4px;
284
- flex-shrink: 0;
285
- padding: 0;
286
- position: relative;
287
- border: 0px solid red;
288
- max-width: 70px;
289
- top: -6px;
290
- left: 12px;
291
- }
292
- .trashCanText {
293
- color: #6e3282;
294
- font-family: Arial;
295
- font-size: 10px;
296
- font-style: normal;
297
- font-weight: 400;
298
- line-height: normal;
299
- }
300
- .removeError {
301
- width: 57px;
302
- display: flex;
303
- flex-direction: column;
304
- flex-shrink: 0;
305
- justify-content: start;
306
- align-items: center;
307
- padding: 0;
308
- }
309
- .removeError svg {
310
- width: 16px;
311
- height: 18px;
312
- stroke-width: 2px;
313
- stroke: var(--purple-900-primary, #6e3282);
314
- }
315
- .removeError a {
316
- cursor: pointer;
317
- }
318
- .uploadedDot {
319
- border-radius: 17px;
320
- background: var(--red-green-green, #008e55);
321
- display: flex;
322
- width: 16px;
323
- height: 16px;
324
- padding: 10px;
325
- flex-direction: column;
326
- justify-content: center;
327
- align-items: center;
328
- gap: 10px;
329
- flex-shrink: 0;
330
- }
331
- .uploadedDot.uploadFailed {
332
- background: var(--red-green-red, #8e0039);
333
- color: var(--neutral-300, #fff);
334
- font-family: Arial;
335
- font-size: 13px;
336
- font-style: normal;
337
- font-weight: 700;
338
- line-height: 16px;
339
- }
340
- .uploadedDot svg {
341
- stroke-width: 1.5px;
342
- stroke: var(--neutral-300, #fff);
343
- flex-shrink: 0;
344
- }
345
- .uploadStatus {
346
- display: flex;
347
- align-items: flex-start;
348
- justify-content: flex-end;
349
- gap: 8px;
350
- flex-shrink: 0;
351
- padding: 0;
352
- position: relative;
353
- border: 0px solid red;
354
- max-width: 70px;
355
- top: 0;
356
- right: 0;
357
- }
358
- @media (max-width: 768px) {
359
- .uploadStatus {
360
- display: none;
361
- }
362
- }
363
- .uploadFileIcon {
364
- display: flex;
365
- align-items: flex-start;
366
- justify-content: flex-end;
367
- gap: 8px;
368
- flex-shrink: 0;
369
- padding: 0;
370
- position: relative;
371
- border: 0px solid red;
372
- max-width: 70px;
373
- top: 0;
374
- left: 0;
375
- }
376
- .uploadFileName {
377
- display: flex;
378
- align-items: normal;
379
- justify-content: flex-start;
380
- gap: 8px;
381
- flex-shrink: 0;
382
- padding: 0;
383
- color: #000;
384
- font-family: Arial;
385
- font-size: 16px;
386
- font-style: normal;
387
- font-weight: 400;
388
- line-height: 24px;
389
- }
390
- .uploadFileName.uploadFailed {
391
- color: var(--red-green-red, #8e0039);
392
- }
393
- .errorMessageAddingFile {
394
- color: var(--red-green-red, #8e0039);
395
- font-family: Arial;
396
- font-size: 13px;
397
- font-style: normal;
398
- font-weight: 400;
399
- line-height: 16px;
400
- }
401
- @media (max-width: 768px) {
402
- .errorMessageAddingFile {
403
- margin-left: 12px;
404
- }
405
- }
406
- .selectedFilesLinkButton {
407
- display: flex;
408
- align-items: center;
409
- padding-bottom: 16px;
410
- padding-left: 0;
411
- gap: 8px;
412
- flex-shrink: 0;
413
- stroke-width: 2px;
414
- stroke: var(--purple-900-primary, #6e3282);
415
- color: var(--purple-900-primary, #6e3282);
416
- font-family: Arial;
417
- font-size: 16px;
418
- font-style: normal;
419
- font-weight: 400;
420
- line-height: 24px;
421
- text-decoration: none;
422
- cursor: pointer;
423
- background-color: transparent;
424
- border: 0px;
425
- }
426
- .selectedFilesLinkButton:hover {
427
- color: var(--purple-900-primary, #6e3282);
428
- text-decoration: underline;
429
- }
430
- .uploadFileRow_x {
431
- max-width: 630px;
432
- }
433
- .uploadIndicator {
434
- height: 6px;
435
- flex-shrink: 0;
436
- margin-top: 0px;
437
- border-radius: 8px 8px 8px 8px;
438
- }
439
- @media (max-width: 768px) {
440
- .uploadIndicator {
441
- display: none;
442
- }
443
- }
444
- .uploadIndicator.uploadDone {
445
- width: 100%;
446
- background: var(--red-green-green, #008e55);
447
- }
448
- .uploadIndicator.uploadFailed {
449
- width: 10%;
450
- background: var(--red-green-red, #8e0039);
451
- }
452
- .uploadIndicator.uploadLoading {
453
- width: 50%;
454
- background: var(--red-green-red, rgb(211, 165, 0));
455
- }
456
- .UploadedFile .divider {
457
- border: 1px solid #747474;
458
- margin-top: 24px;
459
- }
460
- @media (max-width: 768px) {
461
- .UploadedFile .divider {
462
- margin-top: 0px;
463
- }
464
- }
465
- .ClipboardFiles {
466
- display: flex;
467
- flex-direction: column;
468
- align-items: center;
469
- gap: 16px;
470
- padding: 16px;
471
- margin-top: 32px;
472
- background-color: #222;
473
- animation-name: color;
474
- animation-duration: 1s;
475
- animation-iteration-count: infinite;
476
- border-radius: 8px;
477
- cursor: pointer;
478
- }
479
- .ClipboardFiles.clicked {
480
- background-color: #ccc;
481
- animation-name: none;
482
- cursor: copy;
483
- }
484
- @keyframes color {
485
- 0% {
486
- background-color: #ddd;
487
- }
488
- 25% {
489
- background-color: #ccc;
490
- }
491
- 50% {
492
- background-color: #bbb;
493
- }
494
- 75% {
495
- background-color: #ccc;
496
- }
497
- 100% {
498
- background-color: #ddd;
499
- }
500
- }
501
- .addFilesMandatory {
502
- margin-bottom: 16px;
503
- }
504
- .addFilesMandatory.error {
505
- display: inline;
506
- margin-bottom: 0px;
507
- }
508
-
509
6
  /* src/NewTextComponentStandard/EditPreviewLinkStandard/EditPreviewLinkStandard.css */
510
-
511
7
  /* src/NewTextComponentStandard/FooterStandard/FooterStandard.css */
512
-
513
8
  /* src/NewTextComponentStandard/HeaderStandard/HeaderStandard.css */
514
-
515
9
  /* src/NewTextComponentStandard/InfoOnlyStandard/InfoOnlyStandard.css */
516
-
517
10
  /* src/NewTextComponentStandard/ModalStandard/ModalStandard.css */
518
-
519
11
  /* src/NewTextComponentStandard/TextHeadlineAndBodyStandard/TextHeadlineAndBodyStandard.css */
520
-
521
12
  /* src/NewTextComponentStandard/ServiceHeadlineAndBodyStandard/ServiceHeadlineAndBodyStandard.css */
522
-
523
13
  /* src/NewTextComponentStandard/SkipLinkStandard/SkipLinkStandard.css */
524
-
525
14
  /* src/NewTextComponentStandard/StepperButtonsStandard/StepperButtonsStandard.css */
526
-
527
15
  /* src/NewTextComponentStandard/StepperStandard/StepperStandard.css */
package/dist/index.js CHANGED
@@ -897,11 +897,11 @@ var ExploreFiles = ({
897
897
  showErrors && questionObject.error ? "filePickButton error" : ""
898
898
  ),
899
899
  "aria-describedby": `${aboutId} ${questionObject.hasValidationError ? errorId : ""}`.trim(),
900
- "aria-label": `${activatedLanguage === "sv" ? "Knap aria-label V\xE4lj fil" : "Choose file"} ${addFilesInfoText}`,
900
+ "aria-label": `${activatedLanguage === "sv" ? "V\xE4lj fil" : "Choose file"} ${addFilesInfoText}`,
901
901
  children: activatedLanguage === "sv" ? "V\xE4lj fil" : "Choose file"
902
902
  }
903
903
  ),
904
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { "aria-hidden": true, className: "filePickText", children: addFilesInfoText + "span aria-hidden=true" })
904
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { "aria-hidden": true, className: "filePickText", children: addFilesInfoText })
905
905
  ]
906
906
  }
907
907
  ),
package/dist/index.mjs CHANGED
@@ -832,11 +832,11 @@ var ExploreFiles = ({
832
832
  showErrors && questionObject.error ? "filePickButton error" : ""
833
833
  ),
834
834
  "aria-describedby": `${aboutId} ${questionObject.hasValidationError ? errorId : ""}`.trim(),
835
- "aria-label": `${activatedLanguage === "sv" ? "Knap aria-label V\xE4lj fil" : "Choose file"} ${addFilesInfoText}`,
835
+ "aria-label": `${activatedLanguage === "sv" ? "V\xE4lj fil" : "Choose file"} ${addFilesInfoText}`,
836
836
  children: activatedLanguage === "sv" ? "V\xE4lj fil" : "Choose file"
837
837
  }
838
838
  ),
839
- /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: "filePickText", children: addFilesInfoText + "span aria-hidden=true" })
839
+ /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: "filePickText", children: addFilesInfoText })
840
840
  ]
841
841
  }
842
842
  ),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "optimized-react-component-library-xyz123",
3
- "version": "0.1.68",
3
+ "version": "0.1.70",
4
4
  "description": "A modern React component library using TypeScript with React 19 support.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
@@ -118,15 +118,14 @@ fieldset {
118
118
  margin-bottom: 3.6rem;
119
119
  }
120
120
 
121
- .pts-root-question legend{
122
- font-family: Arial;
123
- font-size: 1.6rem;
124
- font-style: normal;
125
- font-weight: 400;
126
- line-height: 20px;
121
+ .pts-root-question legend {
122
+ font-family: Arial;
123
+ font-size: 1.6rem;
124
+ font-style: normal;
125
+ font-weight: 400;
126
+ line-height: 20px;
127
127
  }
128
128
 
129
-
130
129
  .pts-root-question legend,
131
130
  .pts-root-question label,
132
131
  .pts-radio-option {
@@ -265,7 +264,7 @@ textarea:focus-visible,
265
264
  margin: 0 0 15px 0;
266
265
  text-align: left;
267
266
  }
268
- .pts-cookieBanner-Links{
267
+ .pts-cookieBanner-Links {
269
268
  margin-bottom: 1.6rem;
270
269
  }
271
270
 
@@ -329,18 +328,18 @@ textarea:focus-visible,
329
328
  margin-bottom: 2.8rem;
330
329
  }
331
330
 
332
- .pts-main-service-headline a svg{
333
- width: 1.6rem;
334
- height: 1.6rem;
335
- background-color: #6e3282;
336
- border-radius: 50%;
337
- padding: 0.4rem;
338
- flex-shrink: 0;
339
- margin-right: 1.6rem;
331
+ .pts-main-service-headline a svg {
332
+ width: 1.6rem;
333
+ height: 1.6rem;
334
+ background-color: #6e3282;
335
+ border-radius: 50%;
336
+ padding: 0.4rem;
337
+ flex-shrink: 0;
338
+ margin-right: 1.6rem;
340
339
  }
341
340
 
342
- .pts-main-service-headline a svg path{
343
- fill:#ffffff;
341
+ .pts-main-service-headline a svg path {
342
+ fill: #ffffff;
344
343
  }
345
344
 
346
345
  .pts-moreinfo-list {
@@ -616,10 +615,10 @@ textarea:focus-visible,
616
615
  font-size: 1.4rem;
617
616
  }
618
617
 
619
- .textfield-about{
620
- margin-bottom: 0.4rem;
621
- color: #545454;
622
- font-size: 1.4rem;
618
+ .textfield-about {
619
+ margin-bottom: 0.4rem;
620
+ color: #545454;
621
+ font-size: 1.4rem;
623
622
  }
624
623
 
625
624
  /* ---------- TEXTAREA ---------- */
@@ -739,40 +738,39 @@ textarea:focus-visible,
739
738
  width: 100%;
740
739
  }
741
740
 
742
- dl{
741
+ dl {
743
742
  display: grid;
744
743
  grid-template-columns: 50% 50%;
745
-
746
744
  }
747
745
 
748
- dt , dd{
746
+ dt,
747
+ dd {
749
748
  padding: 16px 0px 4px 0px;
750
749
  margin-inline-start: 0px;
751
- border-bottom: 1px solid #DDD;
750
+ border-bottom: 1px solid #ddd;
752
751
  line-height: 2.4rem;
753
752
  margin: 0 !important;
754
753
  width: 100% !important;
755
754
  }
756
755
 
757
- dt{
756
+ dt {
758
757
  font-size: 1.6rem !important;
759
758
  font-weight: 600 !important;
760
759
  }
761
760
 
762
- dd{
761
+ dd {
763
762
  padding-left: 36px;
764
763
  }
765
764
 
766
- .preview-undefined{
767
- display:none;
765
+ .preview-undefined {
766
+ display: none;
768
767
  }
769
768
 
770
-
771
- .pts-addFiles-preview{
772
- display:flex;
769
+ .pts-addFiles-preview {
770
+ display: flex;
773
771
  }
774
772
 
775
- .pts-addFiles-preview .no-answer-preview-page{
773
+ .pts-addFiles-preview .no-answer-preview-page {
776
774
  display: inline-block;
777
775
  padding: 16px 0px 0px 8px;
778
776
  text-align: center;
@@ -1908,8 +1906,6 @@ dd{
1908
1906
  margin-bottom: 0px;
1909
1907
  }
1910
1908
 
1911
-
1912
-
1913
1909
  /* preview */
1914
1910
 
1915
1911
  /* .addFilesPreviewContainer {