@randstad-uca/design-system 1.0.20-alpha.0 → 1.0.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.
Files changed (55) hide show
  1. package/dist/assets/icons/{ayuda.svg → default/ayuda.svg} +5 -5
  2. package/dist/assets/icons/{calendar.svg → default/calendar.svg} +13 -13
  3. package/dist/assets/icons/{check.svg → default/check.svg} +10 -10
  4. package/dist/assets/icons/{email.svg → default/email.svg} +4 -4
  5. package/dist/assets/icons/{eye.svg → default/eye.svg} +4 -4
  6. package/dist/assets/icons/{eye_crossed.svg → default/eye_crossed.svg} +3 -3
  7. package/dist/assets/icons/{info.svg → default/info.svg} +5 -5
  8. package/dist/assets/icons/{warning.svg → default/warning.svg} +5 -5
  9. package/dist/components/Form.d.ts +2 -0
  10. package/dist/components/Icon.d.ts +3 -1
  11. package/dist/components/Modal.d.ts +0 -11
  12. package/dist/components/Notice.d.ts +1 -9
  13. package/dist/components/Popup.d.ts +0 -3
  14. package/dist/components/Radio.d.ts +1 -0
  15. package/dist/components/Select.d.ts +5 -11
  16. package/dist/components/Test.d.ts +5 -0
  17. package/dist/components/TestButton.d.ts +6 -0
  18. package/dist/index.css +1 -1
  19. package/dist/index.d.ts +2 -0
  20. package/dist/index.js +418 -501
  21. package/dist/index.js.map +1 -1
  22. package/dist/package.json +2 -3
  23. package/dist/stories/Button.stories.d.ts +0 -1
  24. package/dist/stories/Icon.stories.d.ts +2 -1
  25. package/dist/stories/Modal.stories.d.ts +0 -5
  26. package/dist/stories/Notice.stories.d.ts +6 -39
  27. package/dist/stories/Select.stories.d.ts +174 -13
  28. package/dist/stories/Stepper.stories.d.ts +16 -29
  29. package/dist/stories/Tabs.stories.d.ts +4 -8
  30. package/dist/styles/colors.css +3 -17
  31. package/dist/styles/fonts.css +43 -0
  32. package/package.json +2 -3
  33. package/dist/assets/icons/arrow_down.svg +0 -3
  34. package/dist/assets/icons/arrow_left.svg +0 -10
  35. package/dist/assets/icons/arrow_up.svg +0 -3
  36. package/dist/assets/icons/close.svg +0 -10
  37. package/dist/assets/icons/home.svg +0 -10
  38. package/dist/assets/icons/icon_check.svg +0 -4
  39. package/dist/assets/icons/icon_trash.svg +0 -7
  40. package/dist/assets/icons/icon_warning.svg +0 -6
  41. package/dist/assets/icons/settings.svg +0 -11
  42. package/dist/assets/icons/thumbs_up.svg +0 -11
  43. package/dist/assets/icons/tick-circle.svg +0 -3
  44. package/dist/assets/icons/user.svg +0 -10
  45. package/dist/assets/img/carousel-example.png +0 -0
  46. package/dist/assets/img/facebook_logo.svg +0 -4
  47. package/dist/assets/img/google_logo.svg +0 -13
  48. package/dist/assets/img/icon_check.svg +0 -4
  49. package/dist/assets/img/icon_trash.svg +0 -7
  50. package/dist/assets/img/icon_warning.svg +0 -6
  51. package/dist/assets/img/image-upload-circle.svg +0 -6
  52. package/dist/assets/img/image-upload-disabled.svg +0 -6
  53. package/dist/assets/img/linkedin_logo.svg +0 -3
  54. package/dist/styles/fontStyles.d.ts +0 -6
  55. package/dist/styles/fontStyles.ts +0 -51
@@ -1,4 +0,0 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M16 32C24.8365 32 32 24.8365 32 16C32 7.16343 24.8365 0 16 0C7.16343 0 0 7.16343 0 16C0 24.8365 7.16343 32 16 32Z" fill="#1977F3"/>
3
- <path d="M22.2282 20.6262L22.9369 16.0001H18.4999V12.9985C18.4999 11.734 19.1186 10.4988 21.1077 10.4988H23.126V6.5612C23.126 6.5612 21.2944 6.24844 19.5439 6.24844C15.8899 6.24844 13.5003 8.46248 13.5003 12.4743V16.0001H9.43677V20.6262H13.5003V31.8066C14.3148 31.9348 15.1496 32.0001 16.0001 32.0001C16.8506 32.0001 17.6854 31.9326 18.4999 31.8066V20.6262H22.2282Z" fill="white"/>
4
- </svg>
@@ -1,13 +0,0 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g clip-path="url(#clip0_492_3663)">
3
- <path d="M31.983 16.2994C31.983 14.9883 31.8741 14.0316 31.6385 13.0395H16.3186V18.9568H25.3111C25.1298 20.4274 24.1508 22.642 21.9751 24.1301L21.9446 24.3282L26.7885 27.9951L27.1241 28.0278C30.2062 25.2463 31.983 21.1537 31.983 16.2994Z" fill="#4285F4"/>
4
- <path d="M16.3188 31.8901C20.7243 31.8901 24.4228 30.4727 27.1243 28.0279L21.9753 24.1301C20.5975 25.0691 18.7482 25.7246 16.3188 25.7246C12.0039 25.7246 8.34163 22.9432 7.03614 19.0986L6.84478 19.1145L1.80806 22.9236L1.74219 23.1025C4.42541 28.3112 9.93696 31.8901 16.3188 31.8901Z" fill="#34A853"/>
5
- <path d="M7.03611 19.0986C6.69164 18.1065 6.49229 17.0434 6.49229 15.945C6.49229 14.8465 6.69164 13.7836 7.01799 12.7915L7.00886 12.5802L1.90901 8.70987L1.74215 8.78743C0.636269 10.9489 0.00170898 13.3761 0.00170898 15.945C0.00170898 18.514 0.636269 20.9411 1.74215 23.1025L7.03611 19.0986Z" fill="#FBBC05"/>
6
- <path d="M16.3188 6.16537C19.3828 6.16537 21.4495 7.45868 22.628 8.53948L27.2331 4.14571C24.4049 1.57679 20.7244 0 16.3188 0C9.93697 0 4.42541 3.57875 1.74219 8.78742L7.01802 12.7914C8.34164 8.94693 12.0039 6.16537 16.3188 6.16537Z" fill="#EB4335"/>
7
- </g>
8
- <defs>
9
- <clipPath id="clip0_492_3663">
10
- <rect width="32" height="32" fill="white"/>
11
- </clipPath>
12
- </defs>
13
- </svg>
@@ -1,4 +0,0 @@
1
- <svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="56" height="56" rx="28" fill="#257156" fill-opacity="0.2"/>
3
- <path d="M43.6957 15.6502C43.3752 15.3697 42.8542 15.4097 42.5737 15.7704L23.5403 38.5304L13.3624 28.1922C13.0418 27.8717 12.561 27.8717 12.2404 28.1922C11.9199 28.5128 11.9199 28.9936 12.2404 29.3142L23.0194 40.2935C23.1797 40.4538 23.38 40.5339 23.5804 40.5339H23.6204C23.8608 40.5339 24.0612 40.4137 24.2215 40.2534L43.8159 16.7721C44.0964 16.4115 44.0563 15.9307 43.6957 15.6502Z" fill="#257156"/>
4
- </svg>
@@ -1,7 +0,0 @@
1
- <svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="56" height="56" rx="28" fill="#E00F0F" fill-opacity="0.2"/>
3
- <path d="M40.7391 16.96H33.4991C33.0991 14.16 30.7791 12 27.9791 12C25.1791 12 22.8191 14.16 22.4191 16.96H15.3391C14.8991 16.96 14.5391 17.32 14.5391 17.76C14.5391 18.2 14.8991 18.56 15.3391 18.56H16.9391V40.72C16.9391 42.52 18.4191 44 20.1791 44H35.8191C37.6191 44 39.0591 42.52 39.0591 40.72V18.56H40.6591C41.0991 18.56 41.4591 18.2 41.4591 17.76C41.4591 17.32 41.1791 16.96 40.7391 16.96ZM27.9791 13.6C29.8991 13.6 31.5391 15.04 31.8991 16.96H24.0591C24.4191 15.04 26.0191 13.6 27.9791 13.6ZM37.5391 40.72C37.5391 41.64 36.7791 42.4 35.8991 42.4H20.2191C19.2991 42.4 18.5791 41.64 18.5791 40.72V18.56H37.5391V40.72Z" fill="#E00F0F"/>
4
- <path d="M27.9797 37.6C28.4197 37.6 28.7797 37.24 28.7797 36.8V24.2C28.7797 23.76 28.4197 23.4 27.9797 23.4C27.5397 23.4 27.1797 23.76 27.1797 24.2V36.8C27.1797 37.24 27.5397 37.6 27.9797 37.6Z" fill="#E00F0F"/>
5
- <path d="M32.7805 37.6C33.2205 37.6 33.5805 37.24 33.5805 36.8V24.2C33.5805 23.76 33.2205 23.4 32.7805 23.4C32.3405 23.4 31.9805 23.76 31.9805 24.2V36.8C31.9805 37.24 32.3405 37.6 32.7805 37.6Z" fill="#E00F0F"/>
6
- <path d="M23.1789 37.6C23.6189 37.6 23.9789 37.24 23.9789 36.8V24.2C23.9789 23.76 23.6189 23.4 23.1789 23.4C22.7389 23.4 22.3789 23.76 22.3789 24.2V36.8C22.3789 37.24 22.7389 37.6 23.1789 37.6Z" fill="#E00F0F"/>
7
- </svg>
@@ -1,6 +0,0 @@
1
- <svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="56" height="56" rx="28" fill="#E9A204" fill-opacity="0.2"/>
3
- <path d="M28.0413 24.16C28.7041 24.16 29.2413 23.6228 29.2413 22.96C29.2413 22.2973 28.7041 21.76 28.0413 21.76C27.3786 21.76 26.8413 22.2973 26.8413 22.96C26.8413 23.6228 27.3786 24.16 28.0413 24.16Z" fill="#E9A204"/>
4
- <path d="M28.0412 34.24C27.6012 34.24 27.2412 33.88 27.2412 33.44V26.56C27.2412 26.12 27.6012 25.76 28.0412 25.76C28.4812 25.76 28.8412 26.12 28.8412 26.56V33.44C28.8412 33.88 28.4812 34.24 28.0412 34.24Z" fill="#E9A204"/>
5
- <path d="M28 12C19.16 12 12 19.2 12 28C12 36.8 19.16 44 28 44C36.84 44 44 36.84 44 28C44 19.16 36.84 12 28 12ZM28 42.4C20.04 42.4 13.6 35.96 13.6 28C13.6 20.04 20.04 13.6 28 13.6C35.96 13.6 42.4 20.04 42.4 28C42.4 35.96 35.96 42.4 28 42.4Z" fill="#E9A204"/>
6
- </svg>
@@ -1,6 +0,0 @@
1
- <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="40" height="40" rx="20" fill="#E8F1FB"/>
3
- <path d="M28.511 9.36128H11.4891C10.3188 9.36128 9.36133 10.3188 9.36133 11.489V28.511C9.36133 29.6812 10.3188 30.6387 11.4891 30.6387H28.511C29.6813 30.6387 30.6388 29.6812 30.6388 28.511V11.489C30.6388 10.3188 29.6813 9.36128 28.511 9.36128ZM29.5749 28.511C29.5749 29.0961 29.0961 29.5748 28.511 29.5748H11.4891C10.9039 29.5748 10.4252 29.0961 10.4252 28.511V11.489C10.4252 10.9039 10.9039 10.4252 11.4891 10.4252H28.511C29.0961 10.4252 29.5749 10.9039 29.5749 11.489V28.511Z" fill="#2175D9"/>
4
- <path d="M26.0899 16.2499C25.9835 16.0903 25.8239 16.0105 25.6378 16.0105C25.4516 16.0105 25.292 16.0903 25.1856 16.2499L19.8929 23.9895L16.3821 20.9309C16.1693 20.7447 15.8767 20.7447 15.664 20.9575L11.9404 24.4683C11.7276 24.681 11.7276 25.0002 11.9138 25.213C12.0202 25.3194 12.1532 25.3726 12.3128 25.3726C12.4458 25.3726 12.5787 25.3194 12.6851 25.2396L16.0629 22.048L19.6801 25.1864C19.7865 25.2928 19.946 25.3194 20.1056 25.3194C20.2652 25.2928 20.3982 25.213 20.478 25.08L25.691 17.4999L27.5261 20.266C27.6857 20.5053 28.0315 20.5851 28.2708 20.4255C28.5102 20.266 28.59 19.9202 28.4304 19.6808L26.0899 16.2499Z" fill="#2175D9"/>
5
- <path d="M16.0373 18.8297C17.7927 18.8297 19.2289 17.3935 19.2289 15.6381C19.2289 13.8827 17.7927 12.4465 16.0373 12.4465C14.2819 12.4465 12.8457 13.8827 12.8457 15.6381C12.8457 17.3935 14.2553 18.8297 16.0373 18.8297ZM16.0373 13.5104C17.2076 13.5104 18.1651 14.4679 18.1651 15.6381C18.1651 16.8084 17.2076 17.7659 16.0373 17.7659C14.8671 17.7659 13.9096 16.8084 13.9096 15.6381C13.9096 14.4679 14.8405 13.5104 16.0373 13.5104Z" fill="#2175D9"/>
6
- </svg>
@@ -1,6 +0,0 @@
1
- <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <rect width="40" height="40" rx="20" fill="#CFD1D9"/>
3
- <path d="M28.511 9.36128H11.4891C10.3188 9.36128 9.36133 10.3188 9.36133 11.489V28.511C9.36133 29.6812 10.3188 30.6387 11.4891 30.6387H28.511C29.6813 30.6387 30.6388 29.6812 30.6388 28.511V11.489C30.6388 10.3188 29.6813 9.36128 28.511 9.36128ZM29.5749 28.511C29.5749 29.0961 29.0961 29.5748 28.511 29.5748H11.4891C10.9039 29.5748 10.4252 29.0961 10.4252 28.511V11.489C10.4252 10.9039 10.9039 10.4252 11.4891 10.4252H28.511C29.0961 10.4252 29.5749 10.9039 29.5749 11.489V28.511Z" fill="#404767"/>
4
- <path d="M26.0899 16.2499C25.9835 16.0903 25.8239 16.0105 25.6378 16.0105C25.4516 16.0105 25.292 16.0903 25.1856 16.2499L19.8929 23.9895L16.3821 20.9309C16.1693 20.7447 15.8767 20.7447 15.664 20.9575L11.9404 24.4683C11.7276 24.681 11.7276 25.0002 11.9138 25.213C12.0202 25.3194 12.1532 25.3726 12.3128 25.3726C12.4458 25.3726 12.5787 25.3194 12.6851 25.2396L16.0629 22.048L19.6801 25.1864C19.7865 25.2928 19.946 25.3194 20.1056 25.3194C20.2652 25.2928 20.3982 25.213 20.478 25.08L25.691 17.4999L27.5261 20.266C27.6857 20.5053 28.0315 20.5851 28.2708 20.4255C28.5102 20.266 28.59 19.9202 28.4304 19.6808L26.0899 16.2499Z" fill="#404767"/>
5
- <path d="M16.0373 18.8297C17.7927 18.8297 19.2289 17.3935 19.2289 15.6381C19.2289 13.8827 17.7927 12.4465 16.0373 12.4465C14.2819 12.4465 12.8457 13.8827 12.8457 15.6381C12.8457 17.3935 14.2553 18.8297 16.0373 18.8297ZM16.0373 13.5104C17.2076 13.5104 18.1651 14.4679 18.1651 15.6381C18.1651 16.8084 17.2076 17.7659 16.0373 17.7659C14.8671 17.7659 13.9096 16.8084 13.9096 15.6381C13.9096 14.4679 14.8405 13.5104 16.0373 13.5104Z" fill="#404767"/>
6
- </svg>
@@ -1,3 +0,0 @@
1
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M29.6 0H2.4C1.76348 0 1.15303 0.252856 0.702944 0.702944C0.252856 1.15303 0 1.76348 0 2.4V29.6C0 30.2365 0.252856 30.847 0.702944 31.2971C1.15303 31.7471 1.76348 32 2.4 32H29.6C30.2365 32 30.847 31.7471 31.2971 31.2971C31.7471 30.847 32 30.2365 32 29.6V2.4C32 1.76348 31.7471 1.15303 31.2971 0.702944C30.847 0.252856 30.2365 0 29.6 0ZM9.6 27.2H4.8V12.8H9.6V27.2ZM7.2 10C6.64989 9.98428 6.11662 9.80679 5.6668 9.48972C5.21699 9.17265 4.87058 8.73006 4.67087 8.21724C4.47116 7.70442 4.427 7.14413 4.5439 6.60635C4.66081 6.06858 4.9336 5.57718 5.32818 5.19356C5.72277 4.80993 6.22165 4.55109 6.7625 4.44938C7.30336 4.34767 7.86219 4.40759 8.36918 4.62167C8.87617 4.83574 9.30883 5.19447 9.6131 5.65304C9.91738 6.1116 10.0798 6.64967 10.08 7.2C10.0674 7.95256 9.75734 8.66952 9.21768 9.19419C8.67802 9.71885 7.95262 10.0086 7.2 10ZM27.2 27.2H22.4V19.616C22.4 17.344 21.44 16.528 20.192 16.528C19.8261 16.5524 19.4686 16.6488 19.1401 16.8117C18.8115 16.9746 18.5184 17.2008 18.2776 17.4774C18.0367 17.7539 17.8529 18.0753 17.7366 18.4231C17.6203 18.7709 17.5739 19.1382 17.6 19.504C17.5921 19.5785 17.5921 19.6535 17.6 19.728V27.2H12.8V12.8H17.44V14.88C17.908 14.168 18.5511 13.5881 19.3075 13.1959C20.0639 12.8037 20.9084 12.6123 21.76 12.64C24.24 12.64 27.136 14.016 27.136 18.496L27.2 27.2Z" fill="#0A66C2"/>
3
- </svg>
@@ -1,6 +0,0 @@
1
- export declare const bodyXS: import("lit").CSSResult;
2
- export declare const bodyS: import("lit").CSSResult;
3
- export declare const bodyM: import("lit").CSSResult;
4
- export declare const bodyL: import("lit").CSSResult;
5
- export declare const titleXS: import("lit").CSSResult;
6
- export declare const titleS: import("lit").CSSResult;
@@ -1,51 +0,0 @@
1
- import { css } from 'lit';
2
-
3
- export const bodyXS = css`
4
- font-family: 'Graphik', sans-serif;
5
- font-weight: 400;
6
- font-size: 12px;
7
- line-height: 15px;
8
- letter-spacing: 0%;
9
- `;
10
-
11
- export const bodyS = css`
12
- font-family: 'Graphik', sans-serif;
13
- font-weight: 400;
14
- font-size: 14px;
15
- line-height: 25px;
16
- letter-spacing: 0%;
17
- `;
18
-
19
- export const bodyM = css`
20
- font-family: 'Graphik', sans-serif;
21
- font-weight: 400;
22
- font-size: 16px;
23
- line-height: 25px;
24
- letter-spacing: 0%;
25
- `;
26
-
27
- export const bodyL = css`
28
- font-family: 'Graphik', sans-serif;
29
- font-weight: 400;
30
- font-size: 18px;
31
- line-height: 30px;
32
- letter-spacing: 0%;
33
- `;
34
-
35
- export const titleXS = css`
36
- font-family: 'Graphik', sans-serif;
37
- font-weight: 400;
38
- font-size: 20px;
39
- line-height: 30px;
40
- letter-spacing: -1%;
41
- vertical-align: middle;
42
- `;
43
-
44
- export const titleS = css`
45
- font-family: 'Graphik', sans-serif;
46
- font-weight: 400;
47
- font-size: 26px;
48
- line-height: 30px;
49
- letter-spacing: -1%;
50
- vertical-align: middle;
51
- `;