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

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/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.69",
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",