@ultraviolet/ui 1.0.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 (115) hide show
  1. package/LICENSE +189 -0
  2. package/README.md +64 -0
  3. package/dist/index.d.ts +2427 -0
  4. package/dist/react-datepicker/dist/react-datepicker.min.css.js +3 -0
  5. package/dist/react-toastify/dist/ReactToastify.min.css.js +3 -0
  6. package/dist/src/components/ActionBar/index.js +55 -0
  7. package/dist/src/components/Alert/index.js +144 -0
  8. package/dist/src/components/Avatar/index.js +90 -0
  9. package/dist/src/components/Badge/index.js +143 -0
  10. package/dist/src/components/Banner/index.js +117 -0
  11. package/dist/src/components/BarChart/Tooltip.js +63 -0
  12. package/dist/src/components/BarChart/index.js +94 -0
  13. package/dist/src/components/BarStack/index.js +223 -0
  14. package/dist/src/components/Breadcrumbs/index.js +89 -0
  15. package/dist/src/components/Bullet/index.js +137 -0
  16. package/dist/src/components/Button/index.js +303 -0
  17. package/dist/src/components/Card/index.js +81 -0
  18. package/dist/src/components/Carousel/index.js +162 -0
  19. package/dist/src/components/Checkbox/index.js +338 -0
  20. package/dist/src/components/CopyButton/index.js +92 -0
  21. package/dist/src/components/DateInput/index.js +250 -0
  22. package/dist/src/components/EmptyState/index.js +124 -0
  23. package/dist/src/components/Expandable/index.js +84 -0
  24. package/dist/src/components/Icon/index.js +350 -0
  25. package/dist/src/components/LineChart/CustomLegend.js +147 -0
  26. package/dist/src/components/LineChart/Tooltip.js +58 -0
  27. package/dist/src/components/LineChart/helpers.js +75 -0
  28. package/dist/src/components/LineChart/index.js +139 -0
  29. package/dist/src/components/Link/index.js +159 -0
  30. package/dist/src/components/List/Body.js +22 -0
  31. package/dist/src/components/List/Cell.js +38 -0
  32. package/dist/src/components/List/HeaderCell.js +118 -0
  33. package/dist/src/components/List/HeaderRow.js +47 -0
  34. package/dist/src/components/List/ListContext.js +120 -0
  35. package/dist/src/components/List/Row.js +211 -0
  36. package/dist/src/components/List/SelectBar.js +52 -0
  37. package/dist/src/components/List/SkeletonRows.js +54 -0
  38. package/dist/src/components/List/constants.js +3 -0
  39. package/dist/src/components/List/index.js +77 -0
  40. package/dist/src/components/Loader/index.js +87 -0
  41. package/dist/src/components/Menu/Item.js +122 -0
  42. package/dist/src/components/Menu/index.js +143 -0
  43. package/dist/src/components/Modal/index.js +279 -0
  44. package/dist/src/components/Notice/index.js +33 -0
  45. package/dist/src/components/NumberInput/helpers.js +6 -0
  46. package/dist/src/components/NumberInput/index.js +366 -0
  47. package/dist/src/components/Pagination/getPageNumbers.js +32 -0
  48. package/dist/src/components/Pagination/index.js +118 -0
  49. package/dist/src/components/PasswordCheck/index.js +42 -0
  50. package/dist/src/components/PasswordStrengthMeter/index.js +116 -0
  51. package/dist/src/components/PieChart/Legends.js +183 -0
  52. package/dist/src/components/PieChart/Tooltip.js +64 -0
  53. package/dist/src/components/PieChart/index.js +133 -0
  54. package/dist/src/components/PieChart/patterns.js +9 -0
  55. package/dist/src/components/Popover/index.js +131 -0
  56. package/dist/src/components/ProgressBar/index.js +72 -0
  57. package/dist/src/components/Radio/index.js +231 -0
  58. package/dist/src/components/Row/index.js +43 -0
  59. package/dist/src/components/SelectInput/index.js +662 -0
  60. package/dist/src/components/SelectableCard/index.js +154 -0
  61. package/dist/src/components/Separator/index.js +91 -0
  62. package/dist/src/components/Skeleton/Block.js +53 -0
  63. package/dist/src/components/Skeleton/Blocks.js +52 -0
  64. package/dist/src/components/Skeleton/BoxWithIcon.js +47 -0
  65. package/dist/src/components/Skeleton/Donut.js +58 -0
  66. package/dist/src/components/Skeleton/IconSkeleton.js +37 -0
  67. package/dist/src/components/Skeleton/Line.js +19 -0
  68. package/dist/src/components/Skeleton/List.js +60 -0
  69. package/dist/src/components/Skeleton/Slider.js +57 -0
  70. package/dist/src/components/Skeleton/index.js +85 -0
  71. package/dist/src/components/Snippet/index.js +250 -0
  72. package/dist/src/components/Stack/index.js +24 -0
  73. package/dist/src/components/Status/index.js +101 -0
  74. package/dist/src/components/StepList/index.js +81 -0
  75. package/dist/src/components/Stepper/index.js +217 -0
  76. package/dist/src/components/SwitchButton/FocusOverlay.js +47 -0
  77. package/dist/src/components/SwitchButton/index.js +131 -0
  78. package/dist/src/components/Table/Body.js +12 -0
  79. package/dist/src/components/Table/Cell.js +27 -0
  80. package/dist/src/components/Table/Header.js +21 -0
  81. package/dist/src/components/Table/HeaderCell.js +119 -0
  82. package/dist/src/components/Table/HeaderRow.js +35 -0
  83. package/dist/src/components/Table/Row.js +70 -0
  84. package/dist/src/components/Table/SelectBar.js +52 -0
  85. package/dist/src/components/Table/SkeletonRows.js +52 -0
  86. package/dist/src/components/Table/TableContext.js +91 -0
  87. package/dist/src/components/Table/index.js +84 -0
  88. package/dist/src/components/Tabs/Tab.js +165 -0
  89. package/dist/src/components/Tabs/TabMenu.js +46 -0
  90. package/dist/src/components/Tabs/TabMenuItem.js +40 -0
  91. package/dist/src/components/Tabs/TabsContext.js +6 -0
  92. package/dist/src/components/Tabs/index.js +117 -0
  93. package/dist/src/components/Tag/index.js +177 -0
  94. package/dist/src/components/TagInput/index.js +277 -0
  95. package/dist/src/components/TagList/index.js +110 -0
  96. package/dist/src/components/Text/index.js +106 -0
  97. package/dist/src/components/TextInput/index.js +529 -0
  98. package/dist/src/components/TimeInput/index.js +38 -0
  99. package/dist/src/components/Toaster/index.js +116 -0
  100. package/dist/src/components/Toggle/index.js +192 -0
  101. package/dist/src/components/Tooltip/helpers.js +131 -0
  102. package/dist/src/components/Tooltip/index.js +275 -0
  103. package/dist/src/components/VerificationCode/index.js +203 -0
  104. package/dist/src/helpers/isJSON.js +11 -0
  105. package/dist/src/helpers/legend.js +13 -0
  106. package/dist/src/helpers/recursivelyGetChildrenString.js +12 -0
  107. package/dist/src/index.js +63 -0
  108. package/dist/src/theme/index.js +25 -0
  109. package/dist/src/utils/animations.js +250 -0
  110. package/dist/src/utils/capitalize.js +4 -0
  111. package/dist/src/utils/ids.js +12 -0
  112. package/dist/src/utils/normalize.js +36 -0
  113. package/dist/src/utils/responsive/Breakpoint.js +12 -0
  114. package/dist/src/utils/responsive/utilities.js +12 -0
  115. package/package.json +70 -0
@@ -0,0 +1,3 @@
1
+ var css_248z = ".react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow,.react-datepicker__navigation-icon::before{border-color:#ccc;border-style:solid;border-width:3px 3px 0 0;content:\"\";display:block;height:9px;position:absolute;top:6px;width:9px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{margin-left:-4px;position:absolute;width:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{box-sizing:content-box;position:absolute;border:8px solid rgba(0,0,0,0);height:0;width:1px;content:\"\";z-index:-1;border-width:8px;left:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{top:0;margin-top:-8px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{border-top:none;border-bottom-color:#f0f0f0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{top:0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{top:-1px;border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle{bottom:0;margin-bottom:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{border-bottom:none;border-top-color:#fff}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{bottom:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before{bottom:-1px;border-top-color:#aeaeae}.react-datepicker-wrapper{display:inline-block;padding:0;border:0;width:100%}.react-datepicker{font-family:\"Helvetica Neue\",helvetica,arial,sans-serif;font-size:.8em;background-color:#fff;color:#000;border:1px solid #aeaeae;border-radius:.3em;display:inline-block;position:relative}.react-datepicker--time-only .react-datepicker__triangle{left:35px}.react-datepicker--time-only .react-datepicker__time-container{border-left:0}.react-datepicker--time-only .react-datepicker__time,.react-datepicker--time-only .react-datepicker__time-box{border-bottom-left-radius:.3em;border-bottom-right-radius:.3em}.react-datepicker__triangle{position:absolute;left:50px}.react-datepicker-popper{z-index:1}.react-datepicker-popper[data-placement^=bottom]{padding-top:10px}.react-datepicker-popper[data-placement=bottom-end] .react-datepicker__triangle,.react-datepicker-popper[data-placement=top-end] .react-datepicker__triangle{left:auto;right:50px}.react-datepicker-popper[data-placement^=top]{padding-bottom:10px}.react-datepicker-popper[data-placement^=right]{padding-left:8px}.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle{left:auto;right:42px}.react-datepicker-popper[data-placement^=left]{padding-right:8px}.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle{left:42px;right:auto}.react-datepicker__header{text-align:center;background-color:#f0f0f0;border-bottom:1px solid #aeaeae;border-top-left-radius:.3em;padding:8px 0;position:relative}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:0}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:.3em}.react-datepicker__year-dropdown-container--select,.react-datepicker__month-dropdown-container--select,.react-datepicker__month-year-dropdown-container--select,.react-datepicker__year-dropdown-container--scroll,.react-datepicker__month-dropdown-container--scroll,.react-datepicker__month-year-dropdown-container--scroll{display:inline-block;margin:0 15px}.react-datepicker__current-month,.react-datepicker-time__header,.react-datepicker-year-header{margin-top:0;color:#000;font-weight:bold;font-size:.944em}.react-datepicker-time__header{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.react-datepicker__navigation{align-items:center;background:none;display:flex;justify-content:center;text-align:center;cursor:pointer;position:absolute;top:2px;padding:0;border:none;z-index:1;height:32px;width:32px;text-indent:-999em;overflow:hidden}.react-datepicker__navigation--previous{left:2px}.react-datepicker__navigation--next{right:2px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:85px}.react-datepicker__navigation--years{position:relative;top:0;display:block;margin-left:auto;margin-right:auto}.react-datepicker__navigation--years-previous{top:4px}.react-datepicker__navigation--years-upcoming{top:-4px}.react-datepicker__navigation:hover *::before{border-color:#a6a6a6}.react-datepicker__navigation-icon{position:relative;top:-1px;font-size:20px;width:0}.react-datepicker__navigation-icon--next{left:-2px}.react-datepicker__navigation-icon--next::before{transform:rotate(45deg);left:-7px}.react-datepicker__navigation-icon--previous{right:-2px}.react-datepicker__navigation-icon--previous::before{transform:rotate(225deg);right:-7px}.react-datepicker__month-container{float:left}.react-datepicker__year{margin:.4em;text-align:center}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:180px}.react-datepicker__year .react-datepicker__year-text{display:inline-block;width:4em;margin:2px}.react-datepicker__month{margin:.4em;text-align:center}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;width:4em;margin:2px}.react-datepicker__input-time-container{clear:both;width:100%;float:left;margin:5px 0 10px 15px;text-align:left}.react-datepicker__input-time-container .react-datepicker-time__caption{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input{display:inline-block;margin-left:10px}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input{width:auto}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]{-moz-appearance:textfield}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter{margin-left:5px;display:inline-block}.react-datepicker__time-container{float:right;border-left:1px solid #aeaeae;width:85px}.react-datepicker__time-container--with-today-button{display:inline;border:1px solid #aeaeae;border-radius:.3em;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{position:relative;background:#fff;border-bottom-right-radius:.3em}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{width:85px;overflow-x:hidden;margin:0 auto;text-align:center;border-bottom-right-radius:.3em}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{list-style:none;margin:0;height:calc(195px + (1.7em / 2));overflow-y:scroll;padding-right:0;padding-left:0;width:100%;box-sizing:content-box}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{height:30px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{cursor:pointer;background-color:#f0f0f0}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:#216ba5;color:#fff;font-weight:bold}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:#216ba5}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{cursor:default;background-color:rgba(0,0,0,0)}.react-datepicker__week-number{color:#ccc;display:inline-block;width:1.7em;line-height:1.7em;text-align:center;margin:.166em}.react-datepicker__week-number.react-datepicker__week-number--clickable{cursor:pointer}.react-datepicker__week-number.react-datepicker__week-number--clickable:hover{border-radius:.3em;background-color:#f0f0f0}.react-datepicker__day-names,.react-datepicker__week{white-space:nowrap}.react-datepicker__day-names{margin-bottom:-8px}.react-datepicker__day-name,.react-datepicker__day,.react-datepicker__time-name{color:#000;display:inline-block;width:1.7em;line-height:1.7em;text-align:center;margin:.166em}.react-datepicker__day,.react-datepicker__month-text,.react-datepicker__quarter-text,.react-datepicker__year-text{cursor:pointer}.react-datepicker__day:hover,.react-datepicker__month-text:hover,.react-datepicker__quarter-text:hover,.react-datepicker__year-text:hover{border-radius:.3em;background-color:#f0f0f0}.react-datepicker__day--today,.react-datepicker__month-text--today,.react-datepicker__quarter-text--today,.react-datepicker__year-text--today{font-weight:bold}.react-datepicker__day--highlighted,.react-datepicker__month-text--highlighted,.react-datepicker__quarter-text--highlighted,.react-datepicker__year-text--highlighted{border-radius:.3em;background-color:#3dcc4a;color:#fff}.react-datepicker__day--highlighted:hover,.react-datepicker__month-text--highlighted:hover,.react-datepicker__quarter-text--highlighted:hover,.react-datepicker__year-text--highlighted:hover{background-color:#32be3f}.react-datepicker__day--highlighted-custom-1,.react-datepicker__month-text--highlighted-custom-1,.react-datepicker__quarter-text--highlighted-custom-1,.react-datepicker__year-text--highlighted-custom-1{color:#f0f}.react-datepicker__day--highlighted-custom-2,.react-datepicker__month-text--highlighted-custom-2,.react-datepicker__quarter-text--highlighted-custom-2,.react-datepicker__year-text--highlighted-custom-2{color:green}.react-datepicker__day--selected,.react-datepicker__day--in-selecting-range,.react-datepicker__day--in-range,.react-datepicker__month-text--selected,.react-datepicker__month-text--in-selecting-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--selected,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--selected,.react-datepicker__year-text--in-selecting-range,.react-datepicker__year-text--in-range{border-radius:.3em;background-color:#216ba5;color:#fff}.react-datepicker__day--selected:hover,.react-datepicker__day--in-selecting-range:hover,.react-datepicker__day--in-range:hover,.react-datepicker__month-text--selected:hover,.react-datepicker__month-text--in-selecting-range:hover,.react-datepicker__month-text--in-range:hover,.react-datepicker__quarter-text--selected:hover,.react-datepicker__quarter-text--in-selecting-range:hover,.react-datepicker__quarter-text--in-range:hover,.react-datepicker__year-text--selected:hover,.react-datepicker__year-text--in-selecting-range:hover,.react-datepicker__year-text--in-range:hover{background-color:#1d5d90}.react-datepicker__day--keyboard-selected,.react-datepicker__month-text--keyboard-selected,.react-datepicker__quarter-text--keyboard-selected,.react-datepicker__year-text--keyboard-selected{border-radius:.3em;background-color:#bad9f1;color:#000}.react-datepicker__day--keyboard-selected:hover,.react-datepicker__month-text--keyboard-selected:hover,.react-datepicker__quarter-text--keyboard-selected:hover,.react-datepicker__year-text--keyboard-selected:hover{background-color:#1d5d90}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range){background-color:#f0f0f0;color:#000}.react-datepicker__day--disabled,.react-datepicker__month-text--disabled,.react-datepicker__quarter-text--disabled,.react-datepicker__year-text--disabled{cursor:default;color:#ccc}.react-datepicker__day--disabled:hover,.react-datepicker__month-text--disabled:hover,.react-datepicker__quarter-text--disabled:hover,.react-datepicker__year-text--disabled:hover{background-color:rgba(0,0,0,0)}.react-datepicker__input-container{position:relative;display:inline-block;width:100%}.react-datepicker__input-container .react-datepicker__calendar-icon{position:absolute;padding:.5em}.react-datepicker__view-calendar-icon input{padding:6px 10px 5px 25px}.react-datepicker__year-read-view,.react-datepicker__month-read-view,.react-datepicker__month-year-read-view{border:1px solid rgba(0,0,0,0);border-radius:.3em;position:relative}.react-datepicker__year-read-view:hover,.react-datepicker__month-read-view:hover,.react-datepicker__month-year-read-view:hover{cursor:pointer}.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow{border-top-color:#b3b3b3}.react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow{transform:rotate(135deg);right:-16px;top:0}.react-datepicker__year-dropdown,.react-datepicker__month-dropdown,.react-datepicker__month-year-dropdown{background-color:#f0f0f0;position:absolute;width:50%;left:25%;top:30px;z-index:1;text-align:center;border-radius:.3em;border:1px solid #aeaeae}.react-datepicker__year-dropdown:hover,.react-datepicker__month-dropdown:hover,.react-datepicker__month-year-dropdown:hover{cursor:pointer}.react-datepicker__year-dropdown--scrollable,.react-datepicker__month-dropdown--scrollable,.react-datepicker__month-year-dropdown--scrollable{height:150px;overflow-y:scroll}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{line-height:20px;width:100%;display:block;margin-left:auto;margin-right:auto}.react-datepicker__year-option:first-of-type,.react-datepicker__month-option:first-of-type,.react-datepicker__month-year-option:first-of-type{border-top-left-radius:.3em;border-top-right-radius:.3em}.react-datepicker__year-option:last-of-type,.react-datepicker__month-option:last-of-type,.react-datepicker__month-year-option:last-of-type{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-bottom-left-radius:.3em;border-bottom-right-radius:.3em}.react-datepicker__year-option:hover,.react-datepicker__month-option:hover,.react-datepicker__month-year-option:hover{background-color:#ccc}.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming{border-bottom-color:#b3b3b3}.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous{border-top-color:#b3b3b3}.react-datepicker__year-option--selected,.react-datepicker__month-option--selected,.react-datepicker__month-year-option--selected{position:absolute;left:15px}.react-datepicker__close-icon{cursor:pointer;background-color:rgba(0,0,0,0);border:0;outline:0;padding:0 6px 0 0;position:absolute;top:0;right:0;height:100%;display:table-cell;vertical-align:middle}.react-datepicker__close-icon::after{cursor:pointer;background-color:#216ba5;color:#fff;border-radius:50%;height:16px;width:16px;padding:2px;font-size:12px;line-height:1;text-align:center;display:table-cell;vertical-align:middle;content:\"×\"}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;cursor:pointer;text-align:center;font-weight:bold;padding:5px 0;clear:left}.react-datepicker__portal{position:fixed;width:100vw;height:100vh;background-color:rgba(0,0,0,.8);left:0;top:0;justify-content:center;align-items:center;display:flex;z-index:2147483647}.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:3em;line-height:3em}@media(max-width: 400px),(max-height: 550px){.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:2em;line-height:2em}}.react-datepicker__portal .react-datepicker__current-month,.react-datepicker__portal .react-datepicker-time__header{font-size:1.44em}.react-datepicker__children-container{width:13.8em;margin:.4em;padding-right:.2em;padding-left:.2em;height:auto}.react-datepicker__aria-live{position:absolute;clip-path:circle(0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;width:1px;white-space:nowrap}.react-datepicker__calendar-icon{width:1em;height:1em;vertical-align:-0.125em}\n";
2
+
3
+ export { css_248z as default };
@@ -0,0 +1,3 @@
1
+ var css_248z = ":root{--toastify-color-light:#fff;--toastify-color-dark:#121212;--toastify-color-info:#3498db;--toastify-color-success:#07bc0c;--toastify-color-warning:#f1c40f;--toastify-color-error:#e74c3c;--toastify-color-transparent:hsla(0,0%,100%,.7);--toastify-icon-color-info:var(--toastify-color-info);--toastify-icon-color-success:var(--toastify-color-success);--toastify-icon-color-warning:var(--toastify-color-warning);--toastify-icon-color-error:var(--toastify-color-error);--toastify-toast-width:320px;--toastify-toast-background:#fff;--toastify-toast-min-height:64px;--toastify-toast-max-height:800px;--toastify-font-family:sans-serif;--toastify-z-index:9999;--toastify-text-color-light:#757575;--toastify-text-color-dark:#fff;--toastify-text-color-info:#fff;--toastify-text-color-success:#fff;--toastify-text-color-warning:#fff;--toastify-text-color-error:#fff;--toastify-spinner-color:#616161;--toastify-spinner-color-empty-area:#e0e0e0;--toastify-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);--toastify-color-progress-dark:#bb86fc;--toastify-color-progress-info:var(--toastify-color-info);--toastify-color-progress-success:var(--toastify-color-success);--toastify-color-progress-warning:var(--toastify-color-warning);--toastify-color-progress-error:var(--toastify-color-error)}.Toastify__toast-container{z-index:var(--toastify-z-index);-webkit-transform:translateZ(var(--toastify-z-index));position:fixed;padding:4px;width:var(--toastify-toast-width);box-sizing:border-box;color:#fff}.Toastify__toast-container--top-left{top:1em;left:1em}.Toastify__toast-container--top-center{top:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--top-right{top:1em;right:1em}.Toastify__toast-container--bottom-left{bottom:1em;left:1em}.Toastify__toast-container--bottom-center{bottom:1em;left:50%;transform:translateX(-50%)}.Toastify__toast-container--bottom-right{bottom:1em;right:1em}@media only screen and (max-width:480px){.Toastify__toast-container{width:100vw;padding:0;left:0;margin:0}.Toastify__toast-container--top-center,.Toastify__toast-container--top-left,.Toastify__toast-container--top-right{top:0;transform:translateX(0)}.Toastify__toast-container--bottom-center,.Toastify__toast-container--bottom-left,.Toastify__toast-container--bottom-right{bottom:0;transform:translateX(0)}.Toastify__toast-container--rtl{right:0;left:auto}}.Toastify__toast{position:relative;min-height:var(--toastify-toast-min-height);box-sizing:border-box;margin-bottom:1rem;padding:8px;border-radius:4px;box-shadow:0 1px 10px 0 rgba(0,0,0,.1),0 2px 15px 0 rgba(0,0,0,.05);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;max-height:var(--toastify-toast-max-height);overflow:hidden;font-family:var(--toastify-font-family);cursor:default;direction:ltr;z-index:0}.Toastify__toast--rtl{direction:rtl}.Toastify__toast--close-on-click{cursor:pointer}.Toastify__toast-body{margin:auto 0;-ms-flex:1 1 auto;flex:1 1 auto;padding:6px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.Toastify__toast-body>div:last-child{word-break:break-word;-ms-flex:1;flex:1}.Toastify__toast-icon{-webkit-margin-end:10px;margin-inline-end:10px;width:20px;-ms-flex-negative:0;flex-shrink:0;display:-ms-flexbox;display:flex}.Toastify--animate{animation-fill-mode:both;animation-duration:.7s}.Toastify--animate-icon{animation-fill-mode:both;animation-duration:.3s}@media only screen and (max-width:480px){.Toastify__toast{margin-bottom:0;border-radius:0}}.Toastify__toast-theme--dark{background:var(--toastify-color-dark);color:var(--toastify-text-color-dark)}.Toastify__toast-theme--colored.Toastify__toast--default,.Toastify__toast-theme--light{background:var(--toastify-color-light);color:var(--toastify-text-color-light)}.Toastify__toast-theme--colored.Toastify__toast--info{color:var(--toastify-text-color-info);background:var(--toastify-color-info)}.Toastify__toast-theme--colored.Toastify__toast--success{color:var(--toastify-text-color-success);background:var(--toastify-color-success)}.Toastify__toast-theme--colored.Toastify__toast--warning{color:var(--toastify-text-color-warning);background:var(--toastify-color-warning)}.Toastify__toast-theme--colored.Toastify__toast--error{color:var(--toastify-text-color-error);background:var(--toastify-color-error)}.Toastify__progress-bar-theme--light{background:var(--toastify-color-progress-light)}.Toastify__progress-bar-theme--dark{background:var(--toastify-color-progress-dark)}.Toastify__progress-bar--info{background:var(--toastify-color-progress-info)}.Toastify__progress-bar--success{background:var(--toastify-color-progress-success)}.Toastify__progress-bar--warning{background:var(--toastify-color-progress-warning)}.Toastify__progress-bar--error{background:var(--toastify-color-progress-error)}.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning{background:var(--toastify-color-transparent)}.Toastify__close-button{color:#fff;background:transparent;outline:none;border:none;padding:0;cursor:pointer;opacity:.7;transition:.3s ease;-ms-flex-item-align:start;align-self:flex-start}.Toastify__close-button--light{color:#000;opacity:.3}.Toastify__close-button>svg{fill:currentColor;height:16px;width:14px}.Toastify__close-button:focus,.Toastify__close-button:hover{opacity:1}@keyframes Toastify__trackProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.Toastify__progress-bar{position:absolute;bottom:0;left:0;width:100%;height:5px;z-index:var(--toastify-z-index);opacity:.7;transform-origin:left}.Toastify__progress-bar--animated{animation:Toastify__trackProgress linear 1 forwards}.Toastify__progress-bar--controlled{transition:transform .2s}.Toastify__progress-bar--rtl{right:0;left:auto;transform-origin:right}.Toastify__spinner{width:20px;height:20px;box-sizing:border-box;border:2px solid;border-radius:100%;border-color:var(--toastify-spinner-color-empty-area);border-right-color:var(--toastify-spinner-color);animation:Toastify__spin .65s linear infinite}@keyframes Toastify__bounceInRight{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(3000px,0,0)}60%{opacity:1;transform:translate3d(-25px,0,0)}75%{transform:translate3d(10px,0,0)}90%{transform:translate3d(-5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutRight{20%{opacity:1;transform:translate3d(-20px,0,0)}to{opacity:0;transform:translate3d(2000px,0,0)}}@keyframes Toastify__bounceInLeft{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes Toastify__bounceOutLeft{20%{opacity:1;transform:translate3d(20px,0,0)}to{opacity:0;transform:translate3d(-2000px,0,0)}}@keyframes Toastify__bounceInUp{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,3000px,0)}60%{opacity:1;transform:translate3d(0,-20px,0)}75%{transform:translate3d(0,10px,0)}90%{transform:translate3d(0,-5px,0)}to{transform:translateZ(0)}}@keyframes Toastify__bounceOutUp{20%{transform:translate3d(0,-10px,0)}40%,45%{opacity:1;transform:translate3d(0,20px,0)}to{opacity:0;transform:translate3d(0,-2000px,0)}}@keyframes Toastify__bounceInDown{0%,60%,75%,90%,to{animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;transform:translate3d(0,-3000px,0)}60%{opacity:1;transform:translate3d(0,25px,0)}75%{transform:translate3d(0,-10px,0)}90%{transform:translate3d(0,5px,0)}to{transform:none}}@keyframes Toastify__bounceOutDown{20%{transform:translate3d(0,10px,0)}40%,45%{opacity:1;transform:translate3d(0,-20px,0)}to{opacity:0;transform:translate3d(0,2000px,0)}}.Toastify__bounce-enter--bottom-left,.Toastify__bounce-enter--top-left{animation-name:Toastify__bounceInLeft}.Toastify__bounce-enter--bottom-right,.Toastify__bounce-enter--top-right{animation-name:Toastify__bounceInRight}.Toastify__bounce-enter--top-center{animation-name:Toastify__bounceInDown}.Toastify__bounce-enter--bottom-center{animation-name:Toastify__bounceInUp}.Toastify__bounce-exit--bottom-left,.Toastify__bounce-exit--top-left{animation-name:Toastify__bounceOutLeft}.Toastify__bounce-exit--bottom-right,.Toastify__bounce-exit--top-right{animation-name:Toastify__bounceOutRight}.Toastify__bounce-exit--top-center{animation-name:Toastify__bounceOutUp}.Toastify__bounce-exit--bottom-center{animation-name:Toastify__bounceOutDown}@keyframes Toastify__zoomIn{0%{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes Toastify__zoomOut{0%{opacity:1}50%{opacity:0;transform:scale3d(.3,.3,.3)}to{opacity:0}}.Toastify__zoom-enter{animation-name:Toastify__zoomIn}.Toastify__zoom-exit{animation-name:Toastify__zoomOut}@keyframes Toastify__flipIn{0%{transform:perspective(400px) rotateX(90deg);animation-timing-function:ease-in;opacity:0}40%{transform:perspective(400px) rotateX(-20deg);animation-timing-function:ease-in}60%{transform:perspective(400px) rotateX(10deg);opacity:1}80%{transform:perspective(400px) rotateX(-5deg)}to{transform:perspective(400px)}}@keyframes Toastify__flipOut{0%{transform:perspective(400px)}30%{transform:perspective(400px) rotateX(-20deg);opacity:1}to{transform:perspective(400px) rotateX(90deg);opacity:0}}.Toastify__flip-enter{animation-name:Toastify__flipIn}.Toastify__flip-exit{animation-name:Toastify__flipOut}@keyframes Toastify__slideInRight{0%{transform:translate3d(110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInLeft{0%{transform:translate3d(-110%,0,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInUp{0%{transform:translate3d(0,110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideInDown{0%{transform:translate3d(0,-110%,0);visibility:visible}to{transform:translateZ(0)}}@keyframes Toastify__slideOutRight{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(110%,0,0)}}@keyframes Toastify__slideOutLeft{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(-110%,0,0)}}@keyframes Toastify__slideOutDown{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,500px,0)}}@keyframes Toastify__slideOutUp{0%{transform:translateZ(0)}to{visibility:hidden;transform:translate3d(0,-500px,0)}}.Toastify__slide-enter--bottom-left,.Toastify__slide-enter--top-left{animation-name:Toastify__slideInLeft}.Toastify__slide-enter--bottom-right,.Toastify__slide-enter--top-right{animation-name:Toastify__slideInRight}.Toastify__slide-enter--top-center{animation-name:Toastify__slideInDown}.Toastify__slide-enter--bottom-center{animation-name:Toastify__slideInUp}.Toastify__slide-exit--bottom-left,.Toastify__slide-exit--top-left{animation-name:Toastify__slideOutLeft}.Toastify__slide-exit--bottom-right,.Toastify__slide-exit--top-right{animation-name:Toastify__slideOutRight}.Toastify__slide-exit--top-center{animation-name:Toastify__slideOutUp}.Toastify__slide-exit--bottom-center{animation-name:Toastify__slideOutDown}@keyframes Toastify__spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}";
2
+
3
+ export { css_248z as default };
@@ -0,0 +1,55 @@
1
+ import _styled from '@emotion/styled/base';
2
+ import { createPortal } from 'react-dom';
3
+ import { jsx } from '@emotion/react/jsx-runtime';
4
+ import { fadeIn } from '../../utils/animations.js';
5
+
6
+ const HEIGHT = 56;
7
+ const SPACING = 20;
8
+ const StyledDiv = /*#__PURE__*/_styled("div", {
9
+ target: "enye6lh0"
10
+ })("background:", _ref => {
11
+ let {
12
+ theme
13
+ } = _ref;
14
+ return theme.colors.neutral.backgroundWeakElevated;
15
+ }, ";border:1px solid ", _ref2 => {
16
+ let {
17
+ theme
18
+ } = _ref2;
19
+ return theme.colors.neutral.border;
20
+ }, ";border-radius:", _ref3 => {
21
+ let {
22
+ theme
23
+ } = _ref3;
24
+ return theme.radii.default;
25
+ }, ";bottom:", _ref4 => {
26
+ let {
27
+ rank
28
+ } = _ref4;
29
+ return SPACING + rank * (HEIGHT + SPACING);
30
+ }, "px;box-shadow:", _ref5 => {
31
+ let {
32
+ theme
33
+ } = _ref5;
34
+ return theme.shadows.defaultShadow;
35
+ }, ";height:", HEIGHT, "px;left:50%;position:fixed;transform:translate(-50%, 0);width:600px;animation:", fadeIn, " 0.2s ease-in-out;");
36
+ const ActionBar = _ref6 => {
37
+ let {
38
+ children,
39
+ role = 'dialog',
40
+ rank = 0,
41
+ 'aria-modal': ariaModal = 'true',
42
+ className,
43
+ 'data-testid': dataTestId
44
+ } = _ref6;
45
+ return /*#__PURE__*/createPortal(jsx(StyledDiv, {
46
+ rank: rank,
47
+ role: role,
48
+ "aria-modal": ariaModal,
49
+ className: className,
50
+ "data-testid": dataTestId,
51
+ children: children
52
+ }), document.body);
53
+ };
54
+
55
+ export { ActionBar };
@@ -0,0 +1,144 @@
1
+ import _styled from '@emotion/styled/base';
2
+ import { css } from '@emotion/react';
3
+ import { useState } from 'react';
4
+ import { Button } from '../Button/index.js';
5
+ import { Icon } from '../Icon/index.js';
6
+ import { Stack } from '../Stack/index.js';
7
+ import { Text } from '../Text/index.js';
8
+ import { jsxs, jsx } from '@emotion/react/jsx-runtime';
9
+
10
+ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
11
+ const alertStyles = _ref => {
12
+ let {
13
+ theme,
14
+ sentiment
15
+ } = _ref;
16
+ const sentimentColor = theme.colors[sentiment];
17
+ return /*#__PURE__*/css("background-color:", sentimentColor.background, ";color:", sentimentColor.text, ";border-left:4px solid ", sentimentColor.borderWeak, ";");
18
+ };
19
+ const typesDefaultIcons = {
20
+ warning: 'alert',
21
+ info: 'information-outline',
22
+ success: 'checkbox-circle-outline',
23
+ danger: 'alert'
24
+ };
25
+ const StyledStackContainer = /*#__PURE__*/_styled(Stack, {
26
+ shouldForwardProp: prop => !['sentiment'].includes(prop),
27
+ target: "e17p0ih04"
28
+ })("border-radius:", _ref2 => {
29
+ let {
30
+ theme
31
+ } = _ref2;
32
+ return theme.radii.default;
33
+ }, ";padding:", _ref3 => {
34
+ let {
35
+ theme
36
+ } = _ref3;
37
+ return theme.space['2'];
38
+ }, ";", alertStyles, ";");
39
+ const TextStack = /*#__PURE__*/_styled(Stack, {
40
+ target: "e17p0ih03"
41
+ })("color:", _ref4 => {
42
+ let {
43
+ theme
44
+ } = _ref4;
45
+ return theme.colors.neutral.text;
46
+ }, ";flex-wrap:wrap;");
47
+ const WrapStack = /*#__PURE__*/_styled(Stack, {
48
+ target: "e17p0ih02"
49
+ })(process.env.NODE_ENV === "production" ? {
50
+ name: "1gaur4v",
51
+ styles: "flex-wrap:wrap;width:100%"
52
+ } : {
53
+ name: "1gaur4v",
54
+ styles: "flex-wrap:wrap;width:100%",
55
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
56
+ });
57
+ const StyledButton = /*#__PURE__*/_styled(Button, {
58
+ target: "e17p0ih01"
59
+ })("margin-left:", _ref5 => {
60
+ let {
61
+ theme
62
+ } = _ref5;
63
+ return theme.space['5'];
64
+ }, ";");
65
+ const CloseButton = /*#__PURE__*/_styled(Button, {
66
+ target: "e17p0ih00"
67
+ })(process.env.NODE_ENV === "production" ? {
68
+ name: "135vrw8",
69
+ styles: "align-self:start"
70
+ } : {
71
+ name: "135vrw8",
72
+ styles: "align-self:start",
73
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
74
+ });
75
+ const Alert = _ref6 => {
76
+ let {
77
+ children,
78
+ title,
79
+ sentiment = 'danger',
80
+ buttonText,
81
+ onClickButton,
82
+ closable,
83
+ onClose,
84
+ className,
85
+ disabled,
86
+ 'data-testid': dataTestId
87
+ } = _ref6;
88
+ const [opened, setOpened] = useState(true);
89
+ if (!opened) return null;
90
+ return jsxs(StyledStackContainer, {
91
+ gap: 1,
92
+ direction: "row",
93
+ sentiment: sentiment,
94
+ className: className,
95
+ "data-testid": dataTestId,
96
+ children: [jsxs(WrapStack, {
97
+ direction: "row",
98
+ alignItems: "center",
99
+ justifyContent: "space-between",
100
+ gap: 2,
101
+ children: [jsxs(Stack, {
102
+ alignItems: "start",
103
+ direction: "row",
104
+ gap: 2,
105
+ children: [jsx(Icon, {
106
+ name: typesDefaultIcons[sentiment],
107
+ size: 24,
108
+ "aria-hidden": "true"
109
+ }), jsxs(TextStack, {
110
+ gap: 0.5,
111
+ direction: "row",
112
+ children: [title ? jsx(Text, {
113
+ variant: "bodyStronger",
114
+ as: "span",
115
+ color: sentiment,
116
+ children: title
117
+ }) : null, typeof children === 'string' ? jsx(Text, {
118
+ variant: "body",
119
+ as: "p",
120
+ children: children
121
+ }) : children]
122
+ })]
123
+ }), buttonText ? jsx(StyledButton, {
124
+ sentiment: sentiment,
125
+ onClick: onClickButton,
126
+ size: "small",
127
+ disabled: disabled,
128
+ children: buttonText
129
+ }) : null]
130
+ }), closable || onClose ? jsx(CloseButton, {
131
+ variant: "ghost",
132
+ size: "small",
133
+ onClick: () => {
134
+ setOpened(false);
135
+ onClose?.();
136
+ },
137
+ icon: "close",
138
+ sentiment: "neutral",
139
+ "aria-label": "close"
140
+ }) : null]
141
+ });
142
+ };
143
+
144
+ export { Alert };
@@ -0,0 +1,90 @@
1
+ import _styled from '@emotion/styled/base';
2
+ import { Icon } from '../Icon/index.js';
3
+ import { jsx } from '@emotion/react/jsx-runtime';
4
+
5
+ const formatTextToAvatar = text => {
6
+ if (!text) return '';
7
+ if (text.length <= 2) {
8
+ return text.toUpperCase();
9
+ }
10
+ if (text.split(' ').length > 1) {
11
+ const [a, b] = text.split(' ');
12
+ return `${a[0]}${b[0]}`.toUpperCase();
13
+ }
14
+ return text.substring(0, 2).toUpperCase();
15
+ };
16
+ const StyledTextAvatar = /*#__PURE__*/_styled("span", {
17
+ target: "ec0473m1"
18
+ })("align-items:center;background-color:", _ref => {
19
+ let {
20
+ lock,
21
+ theme,
22
+ textBgColor
23
+ } = _ref;
24
+ return lock ? theme.colors.neutral.backgroundStrong : theme.colors[textBgColor]?.backgroundStrong || textBgColor;
25
+ }, ";border-radius:", _ref2 => {
26
+ let {
27
+ theme
28
+ } = _ref2;
29
+ return theme.radii.circle;
30
+ }, ";color:", _ref3 => {
31
+ let {
32
+ theme,
33
+ textColor
34
+ } = _ref3;
35
+ return theme.colors[textColor]?.textStronger || theme.colors[textColor]?.textStrong || textColor;
36
+ }, ";font-size:", _ref4 => {
37
+ let {
38
+ textSize
39
+ } = _ref4;
40
+ return textSize;
41
+ }, "px;display:flex;height:100%;justify-content:center;width:100%;");
42
+ const AvatarContainer = /*#__PURE__*/_styled("div", {
43
+ target: "ec0473m0"
44
+ })("height:", _ref5 => {
45
+ let {
46
+ size
47
+ } = _ref5;
48
+ return size;
49
+ }, "px;width:", _ref6 => {
50
+ let {
51
+ size
52
+ } = _ref6;
53
+ return size;
54
+ }, "px;");
55
+ const Avatar = _ref7 => {
56
+ let {
57
+ image,
58
+ size = 32,
59
+ text,
60
+ textBgColor = 'secondary',
61
+ textColor = 'neutral',
62
+ textSize = 10,
63
+ lock = false,
64
+ className,
65
+ 'data-testid': dataTestId
66
+ } = _ref7;
67
+ return jsx(AvatarContainer, {
68
+ size: size,
69
+ className: className,
70
+ "data-testid": dataTestId,
71
+ children: text || !text && !image ? jsx(StyledTextAvatar, {
72
+ lock: lock,
73
+ textBgColor: textBgColor,
74
+ textColor: textColor,
75
+ textSize: textSize,
76
+ children: lock ? jsx(Icon, {
77
+ name: "lock",
78
+ color: "neutral",
79
+ prominence: "weak"
80
+ }) : formatTextToAvatar(text)
81
+ }) : jsx("img", {
82
+ width: "100%",
83
+ height: "100%",
84
+ src: image ?? '',
85
+ alt: ""
86
+ })
87
+ });
88
+ };
89
+
90
+ export { Avatar };
@@ -0,0 +1,143 @@
1
+ import _styled from '@emotion/styled/base';
2
+ import { useTheme } from '@emotion/react';
3
+ import { useMemo } from 'react';
4
+ import { SENTIMENTS_WITHOUT_NEUTRAL } from '../../theme/index.js';
5
+ import capitalize from '../../utils/capitalize.js';
6
+ import { Icon } from '../Icon/index.js';
7
+ import { Text } from '../Text/index.js';
8
+ import { jsxs, jsx } from '@emotion/react/jsx-runtime';
9
+
10
+ const StyledText = /*#__PURE__*/_styled(Text, {
11
+ target: "ej33bna1"
12
+ })("text-transform:uppercase;font-size:", _ref => {
13
+ let {
14
+ fontSize
15
+ } = _ref;
16
+ return fontSize;
17
+ }, "px;color:inherit;");
18
+
19
+ // TODO: remove when typography has been created
20
+ const TEXT_SIZES = {
21
+ large: 14,
22
+ medium: 12,
23
+ small: 10
24
+ };
25
+ const SIZES = {
26
+ large: 32,
27
+ medium: 24,
28
+ small: 16
29
+ };
30
+ const PROMINENCES = {
31
+ default: 'default',
32
+ strong: 'strong'
33
+ };
34
+
35
+ /**
36
+ * Generate all styles available for badge based on prominence and sentiments
37
+ * @param prominence
38
+ * @param theme
39
+ */
40
+ const generateStyles = _ref2 => {
41
+ let {
42
+ prominence,
43
+ theme
44
+ } = _ref2;
45
+ const definedProminence = prominence === PROMINENCES.strong ? capitalize(PROMINENCES.strong) : '';
46
+ const text = `text${definedProminence}`;
47
+ const background = `background${definedProminence}`;
48
+ return {
49
+ ...SENTIMENTS_WITHOUT_NEUTRAL.reduce((reducer, sentiment) => ({
50
+ ...reducer,
51
+ [sentiment]: `
52
+ color: ${theme.colors[sentiment][text]};
53
+ background: ${theme.colors[sentiment][background]};
54
+ border: 1px solid ${theme.colors[sentiment][background]};
55
+ `
56
+ }), {}),
57
+ disabled: `
58
+ color: ${theme.colors.neutral.textWeak};
59
+ background: ${theme.colors.neutral.backgroundStrong};
60
+ border: none;
61
+ `,
62
+ neutral: `
63
+ color: ${prominence === PROMINENCES.strong ? theme.colors.neutral[text] : theme.colors.neutral.textWeak};
64
+ background: ${theme.colors.neutral.backgroundStrong};
65
+ border: 1px solid ${theme.colors.neutral.borderStrong};
66
+ `
67
+ };
68
+ };
69
+ const StyledBox = /*#__PURE__*/_styled('div', {
70
+ shouldForwardProp: prop => !['sentiment', 'size'].includes(prop),
71
+ target: "ej33bna0"
72
+ })("display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:", _ref3 => {
73
+ let {
74
+ theme
75
+ } = _ref3;
76
+ return theme.radii.xlarge;
77
+ }, ";padding:0 ", _ref4 => {
78
+ let {
79
+ theme,
80
+ size
81
+ } = _ref4;
82
+ return size === SIZES.small ? theme.space['1'] : theme.space['2'];
83
+ }, ";gap:", _ref5 => {
84
+ let {
85
+ theme,
86
+ size
87
+ } = _ref5;
88
+ return size === SIZES.small ? theme.space['0.5'] : theme.space['1'];
89
+ }, ";width:fit-content;height:", _ref6 => {
90
+ let {
91
+ size
92
+ } = _ref6;
93
+ return size;
94
+ }, "px;", _ref7 => {
95
+ let {
96
+ sentiment
97
+ } = _ref7;
98
+ return sentiment;
99
+ }, ";");
100
+ const Badge = _ref8 => {
101
+ let {
102
+ sentiment = 'neutral',
103
+ size = 'medium',
104
+ prominence = 'default',
105
+ icon,
106
+ disabled = false,
107
+ className,
108
+ children,
109
+ 'data-testid': dataTestId
110
+ } = _ref8;
111
+ const theme = useTheme();
112
+
113
+ /**
114
+ * Badge should display an aria-label if the status is not neutral or primary
115
+ */
116
+ const ariaLabel = useMemo(() => ['neutral', 'primary'].some(baseSentiment => baseSentiment === sentiment) ? undefined : sentiment, [sentiment]);
117
+ const generatedStyles = useMemo(() => generateStyles({
118
+ prominence,
119
+ theme
120
+ }), [prominence, theme]);
121
+ const sizeValue = SIZES[size];
122
+ return jsxs(StyledBox, {
123
+ role: "status",
124
+ "aria-label": ariaLabel,
125
+ as: "span",
126
+ sentiment: disabled ? generatedStyles['disabled'] : generatedStyles[sentiment],
127
+ size: sizeValue,
128
+ className: className,
129
+ "data-testid": dataTestId,
130
+ children: [icon && sizeValue !== SIZES.small ? jsx(Icon, {
131
+ name: icon,
132
+ size: 16
133
+ }) : null, jsx(StyledText, {
134
+ variant: "bodyStrong",
135
+ as: "p",
136
+ fontSize: TEXT_SIZES[size],
137
+ prominence: disabled ? 'weak' : 'default',
138
+ children: children
139
+ })]
140
+ });
141
+ };
142
+
143
+ export { Badge, PROMINENCES, SIZES };
@@ -0,0 +1,117 @@
1
+ import _styled from '@emotion/styled/base';
2
+ import { useState } from 'react';
3
+ import { Button } from '../Button/index.js';
4
+ import { Link } from '../Link/index.js';
5
+ import { Stack } from '../Stack/index.js';
6
+ import { Text } from '../Text/index.js';
7
+ import { jsxs, jsx } from '@emotion/react/jsx-runtime';
8
+
9
+ const Container = /*#__PURE__*/_styled('div', {
10
+ shouldForwardProp: prop => !['variant', 'size'].includes(prop),
11
+ target: "e1kdwp5x0"
12
+ })("padding:", _ref => {
13
+ let {
14
+ theme,
15
+ size
16
+ } = _ref;
17
+ return theme.space[size === 'small' ? '2' : '3'];
18
+ }, ";border-radius:", _ref2 => {
19
+ let {
20
+ theme
21
+ } = _ref2;
22
+ return theme.radii.large;
23
+ }, ";background:", _ref3 => {
24
+ let {
25
+ theme,
26
+ variant
27
+ } = _ref3;
28
+ return variant === 'intro' ? theme.colors.primary.background : theme.colors.primary.backgroundStrong;
29
+ }, ";display:flex;flex-direction:row;justify-content:space-between;gap:", _ref4 => {
30
+ let {
31
+ theme
32
+ } = _ref4;
33
+ return theme.space['2'];
34
+ }, ";>svg:first-child,>img{height:", _ref5 => {
35
+ let {
36
+ size
37
+ } = _ref5;
38
+ return size === 'medium' ? '140px' : '100px';
39
+ }, ";align-self:center;}");
40
+ const Banner = _ref6 => {
41
+ let {
42
+ variant = 'intro',
43
+ size = 'medium',
44
+ title,
45
+ children,
46
+ direction = 'column',
47
+ onClose,
48
+ buttonText,
49
+ onClickButton,
50
+ linkText,
51
+ linkHref,
52
+ image,
53
+ className
54
+ } = _ref6;
55
+ const [opened, setOpened] = useState(true);
56
+ if (!opened) return null;
57
+ return jsxs(Container, {
58
+ variant: variant,
59
+ size: size,
60
+ className: className,
61
+ children: [image, jsxs(Stack, {
62
+ direction: direction,
63
+ gap: 2,
64
+ justifyContent: "space-between",
65
+ alignItems: direction === 'column' ? 'start' : 'center',
66
+ style: {
67
+ flex: 1
68
+ },
69
+ children: [jsxs(Stack, {
70
+ gap: 0.5,
71
+ style: {
72
+ flex: 1
73
+ },
74
+ children: [jsx(Text, {
75
+ as: "p",
76
+ variant: size === 'medium' ? 'headingSmall' : 'bodyStronger',
77
+ color: "primary",
78
+ prominence: variant === 'intro' ? 'default' : 'strong',
79
+ children: title
80
+ }), jsx(Text, {
81
+ as: "p",
82
+ variant: "body",
83
+ color: "neutral",
84
+ prominence: variant === 'intro' ? 'default' : 'stronger',
85
+ children: children
86
+ })]
87
+ }), jsxs(Stack, {
88
+ direction: "row",
89
+ gap: 2,
90
+ children: [buttonText ? jsx(Button, {
91
+ size: "medium",
92
+ sentiment: variant === 'intro' ? 'primary' : 'neutral',
93
+ onClick: onClickButton,
94
+ children: buttonText
95
+ }) : null, linkText && direction === 'column' ? jsx(Link, {
96
+ sentiment: "primary",
97
+ size: "small",
98
+ target: "_blank",
99
+ href: linkHref ?? '',
100
+ prominence: variant === 'intro' ? 'default' : 'strong',
101
+ children: linkText
102
+ }) : null]
103
+ })]
104
+ }), jsx(Button, {
105
+ icon: "close",
106
+ size: "small",
107
+ variant: variant === 'intro' ? 'ghost' : 'filled',
108
+ sentiment: variant === 'intro' ? 'neutral' : 'primary',
109
+ onClick: () => {
110
+ setOpened(false);
111
+ onClose?.();
112
+ }
113
+ })]
114
+ });
115
+ };
116
+
117
+ export { Banner };