@banyan_cloud/roots 1.0.2 → 1.0.4

package/dist/index.js

@@ -11747,8 +11747,8 @@ BreadCrumbs.defaultProps = {
   itemsAfterCollapse: 1
 };
 
-var css_248z$v = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Header-module_container__E1lPQ {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0rem 1.5625rem;\n}\n.Header-module_container__E1lPQ .Header-module_title__ZbNwD {\n  font-weight: 400;\n  font-size: 0.8rem;\n  color: var(--black);\n}\n.Header-module_container__E1lPQ .Header-module_left-arrow__TlFfv {\n  cursor: pointer;\n  transform: rotate(180deg);\n}\n.Header-module_container__E1lPQ .Header-module_right-arrow__dhGJ5 {\n  cursor: pointer;\n}";
-var styles$u = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","container":"Header-module_container__E1lPQ","title":"Header-module_title__ZbNwD","left-arrow":"Header-module_left-arrow__TlFfv","right-arrow":"Header-module_right-arrow__dhGJ5"};
+var css_248z$v = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Header-module_container__E1lPQ {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0rem 1.5625rem;\n}\n.Header-module_container__E1lPQ .Header-module_title__ZbNwD {\n  font-weight: 400;\n  font-size: 0.8rem;\n  color: var(--black);\n}\n.Header-module_container__E1lPQ .Header-module_icon__eW4zO {\n  width: 24px;\n  height: 24px;\n  stroke: #181818;\n  cursor: pointer;\n}";
+var styles$u = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","container":"Header-module_container__E1lPQ","title":"Header-module_title__ZbNwD","icon":"Header-module_icon__eW4zO"};
 styleInject(css_248z$v);
 
 var Header = function Header(props) {
@@ -11761,7 +11761,10 @@ var Header = function Header(props) {
         onMonthChange('prev');
       },
       className: styles$u['left-arrow'],
-      children: /*#__PURE__*/jsx(Arrow, {})
+      children: /*#__PURE__*/jsx(Chevron, {
+        className: classes(styles$u.icon),
+        position: "left"
+      })
     }), /*#__PURE__*/jsx("span", {
       className: styles$u.title,
       children: "".concat(selectedMonth.month, " ").concat(selectedMonth.year)
@@ -11770,7 +11773,10 @@ var Header = function Header(props) {
         onMonthChange('next');
       },
       className: styles$u['right-arrow'],
-      children: /*#__PURE__*/jsx(Arrow, {})
+      children: /*#__PURE__*/jsx(Chevron, {
+        className: classes(styles$u.icon),
+        position: "right"
+      })
     })]
   });
 };
@@ -13096,8 +13102,8 @@ CodeSnippet.defaultProps = {
   showIcon: true
 };
 
-var css_248z$o = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.DatePicker-module_root__pWgbK {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n  gap: 0.5rem;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_label__TaavL {\n  font-weight: 400;\n  font-size: 0.75rem;\n  color: var(--black);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n  background: var(--white);\n  border: 0.0625rem solid #d9d9d9;\n  border-radius: 0.25rem;\n  border: 0.0625rem solid var(--grey5);\n  padding: 0.75rem 1rem;\n  cursor: pointer;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_placeholder__bJ4zY {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--grey1);\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_value__Dzh9C {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--black);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_value__Dzh9C span {\n  font-weight: 500;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_input__Xnk6R {\n  display: none;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_down-arrow__Bsna6 {\n  transform: rotate(270deg);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_up-arrow__yjk9M {\n  transform: rotate(90deg);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n  background: var(--grey10);\n  border: 0.0625rem solid #d9d9d9;\n  border-radius: 0.25rem;\n  border: 0.0625rem solid var(--grey5);\n  padding: 0.75rem 1rem;\n  cursor: pointer;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH .DatePicker-module_down-arrow__Bsna6 {\n  transform: rotate(270deg);\n  fill: var(--grey3);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH .DatePicker-module_placeholder__bJ4zY {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--grey3);\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.DatePicker-module_root__pWgbK.DatePicker-module_open__7ff-- {\n  border-color: var(--highlight);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_error__mp88e {\n  border: 0.0938rem solid var(--error);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_error-text__wxtb- {\n  font-weight: 400;\n  font-size: 0.75rem;\n  line-height: 0.9375rem;\n  color: var(--error);\n}\n\n.DatePicker-module_popper__EFyrT {\n  display: none;\n  background: var(--white);\n  border: 0.0625rem solid #d9d9d9;\n  box-shadow: 0px 0.5rem 1.25rem rgba(24, 24, 24, 0.08);\n  border-radius: 0.25rem;\n  overflow: auto;\n}\n.DatePicker-module_popper__EFyrT.DatePicker-module_open__7ff-- {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n  position: absolute;\n}";
-var styles$n = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"DatePicker-module_error__mp88e","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"DatePicker-module_root__pWgbK","label":"DatePicker-module_label__TaavL","container":"DatePicker-module_container__mDxYJ","placeholder":"DatePicker-module_placeholder__bJ4zY","value":"DatePicker-module_value__Dzh9C","input":"DatePicker-module_input__Xnk6R","down-arrow":"DatePicker-module_down-arrow__Bsna6","up-arrow":"DatePicker-module_up-arrow__yjk9M","disabled":"DatePicker-module_disabled__lloGH","open":"DatePicker-module_open__7ff--","error-text":"DatePicker-module_error-text__wxtb-","popper":"DatePicker-module_popper__EFyrT"};
+var css_248z$o = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.DatePicker-module_root__pWgbK {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n  gap: 0.5rem;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_label__TaavL {\n  font-weight: 400;\n  font-size: 0.75rem;\n  color: var(--black);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n  background: var(--white);\n  border: 0.0625rem solid #d9d9d9;\n  border-radius: 0.25rem;\n  border: 0.0625rem solid var(--grey5);\n  padding: 0.75rem 1rem;\n  cursor: pointer;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_placeholder__bJ4zY {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--grey1);\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_value__Dzh9C {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--black);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_value__Dzh9C span {\n  font-weight: 500;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_input__Xnk6R {\n  display: none;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_icon__-P8w2 {\n  width: 24px;\n  height: 24px;\n  stroke: #181818;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_down__QF2xc {\n  transform: rotate(270deg);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_container__mDxYJ .DatePicker-module_up__1dCIH {\n  transform: rotate(90deg);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  position: relative;\n  background: var(--grey10);\n  border: 0.0625rem solid #d9d9d9;\n  border-radius: 0.25rem;\n  border: 0.0625rem solid var(--grey5);\n  padding: 0.75rem 1rem;\n  cursor: pointer;\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH .DatePicker-module_down-arrow__Bsna6 {\n  transform: rotate(270deg);\n  fill: var(--grey3);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_disabled__lloGH .DatePicker-module_placeholder__bJ4zY {\n  font-weight: 400;\n  font-size: 1rem;\n  color: var(--grey3);\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.DatePicker-module_root__pWgbK.DatePicker-module_open__7ff-- {\n  border-color: var(--highlight);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_error__mp88e {\n  border: 0.0938rem solid var(--error);\n}\n.DatePicker-module_root__pWgbK .DatePicker-module_error-text__wxtb- {\n  font-weight: 400;\n  font-size: 0.75rem;\n  line-height: 0.9375rem;\n  color: var(--error);\n}\n\n.DatePicker-module_popper__EFyrT {\n  display: none;\n  background: var(--white);\n  border: 0.0625rem solid #d9d9d9;\n  box-shadow: 0px 0.5rem 1.25rem rgba(24, 24, 24, 0.08);\n  border-radius: 0.25rem;\n  overflow: auto;\n}\n.DatePicker-module_popper__EFyrT.DatePicker-module_open__7ff-- {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n  position: absolute;\n}";
+var styles$n = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"DatePicker-module_error__mp88e","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"DatePicker-module_root__pWgbK","label":"DatePicker-module_label__TaavL","container":"DatePicker-module_container__mDxYJ","placeholder":"DatePicker-module_placeholder__bJ4zY","value":"DatePicker-module_value__Dzh9C","input":"DatePicker-module_input__Xnk6R","icon":"DatePicker-module_icon__-P8w2","down":"DatePicker-module_down__QF2xc","up":"DatePicker-module_up__1dCIH","disabled":"DatePicker-module_disabled__lloGH","down-arrow":"DatePicker-module_down-arrow__Bsna6","open":"DatePicker-module_open__7ff--","error-text":"DatePicker-module_error-text__wxtb-","popper":"DatePicker-module_popper__EFyrT"};
 styleInject(css_248z$o);
 
 var isMaxRangeExceeded = function isMaxRangeExceeded(_ref) {
@@ -13248,8 +13254,9 @@ var DatePicker = function DatePicker(props) {
       }), /*#__PURE__*/jsx("input", {
         className: styles$n.input,
         value: displayValue
-      }), /*#__PURE__*/jsx(Arrow, {
-        className: classes(open ? styles$n['up-arrow'] : styles$n['down-arrow'])
+      }), /*#__PURE__*/jsx(Chevron, {
+        className: classes(styles$n.icon),
+        position: open ? 'top' : 'bottom'
       })]
     })), error && /*#__PURE__*/jsx("div", {
       className: styles$n['error-text'],
@@ -13720,8 +13727,8 @@ Radio.defaultProps = {
   onChange: function onChange() {}
 };
 
-var css_248z$i = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Dropdown-module_root__mkOMI {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  gap: 0.5rem;\n  position: relative;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  max-width: 100%;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_label__YkFsR {\n  font-size: 0.75rem;\n  color: var(--grey);\n  width: auto;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  max-width: 100%;\n  position: relative;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  width: 25rem;\n  max-width: 100%;\n  gap: 0.5rem;\n  background: var(--white);\n  outline: none;\n  border: 1px solid var(--grey5);\n  border-radius: 0.25rem;\n  padding: 0.75rem 0.75rem 0.75rem 1rem;\n  cursor: pointer;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y .Dropdown-module_placeholder__B2kmJ {\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  color: var(--black);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y .Dropdown-module_icon__YsokN {\n  width: 1.5rem;\n  height: 1.5rem;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_input__LYIeG {\n  position: absolute;\n  opacity: 0;\n  width: 1px;\n  height: 1px;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_input__LYIeG:focus + .Dropdown-module_select__Thb6Y {\n  border-color: var(--highlight);\n}\n.Dropdown-module_root__mkOMI.Dropdown-module_open__dEH0H .Dropdown-module_header__EOpC- {\n  border-color: var(--highlight);\n}\n.Dropdown-module_root__mkOMI.Dropdown-module_disabled__eLZhs .Dropdown-module_select__Thb6Y {\n  background: var(--grey10);\n  cursor: not-allowed;\n}\n\n.Dropdown-module_body__BDZmr {\n  display: none;\n  position: absolute;\n  top: calc(100% + 0.5rem);\n  z-index: 999;\n  background: var(--white);\n  width: auto;\n  border: 0.063rem solid var(--grey5);\n  box-shadow: 0rem 0.5rem 1.25rem rgba(24, 24, 24, 0.08);\n  border-radius: 0.25rem;\n  padding: 1rem;\n  overflow-y: auto;\n  min-height: 4rem;\n  outline: none;\n}\n.Dropdown-module_body__BDZmr.Dropdown-module_open__dEH0H {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n}";
-var styles$h = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"Dropdown-module_root__mkOMI","label":"Dropdown-module_label__YkFsR","header":"Dropdown-module_header__EOpC-","select":"Dropdown-module_select__Thb6Y","placeholder":"Dropdown-module_placeholder__B2kmJ","icon":"Dropdown-module_icon__YsokN","input":"Dropdown-module_input__LYIeG","open":"Dropdown-module_open__dEH0H","disabled":"Dropdown-module_disabled__eLZhs","body":"Dropdown-module_body__BDZmr"};
+var css_248z$i = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Dropdown-module_root__mkOMI {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  gap: 0.5rem;\n  position: relative;\n  width: -webkit-fit-content;\n  width: -moz-fit-content;\n  width: fit-content;\n  max-width: 100%;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_label__YkFsR {\n  font-size: 0.75rem;\n  color: var(--grey);\n  width: auto;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  max-width: 100%;\n  position: relative;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_input__LYIeG {\n  position: absolute;\n  opacity: 0;\n  width: 1px;\n  height: 1px;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_input__LYIeG:focus + .Dropdown-module_select__Thb6Y {\n  border-color: var(--highlight);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_input__LYIeG:focus + .Dropdown-module_select__Thb6Y.Dropdown-module_feedback-error__FD-hZ {\n  border-color: var(--error);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  width: 25rem;\n  max-width: 100%;\n  gap: 0.5rem;\n  background: var(--white);\n  outline: none;\n  border: 1px solid var(--grey5);\n  border-radius: 0.25rem;\n  padding: 0.75rem 0.75rem 0.75rem 1rem;\n  cursor: pointer;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y .Dropdown-module_placeholder__B2kmJ {\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n  color: var(--black);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y .Dropdown-module_icon__YsokN {\n  width: 1.5rem;\n  height: 1.5rem;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_header__EOpC- .Dropdown-module_select__Thb6Y.Dropdown-module_feedback-error__FD-hZ {\n  border-color: var(--error);\n}\n.Dropdown-module_root__mkOMI.Dropdown-module_open__dEH0H .Dropdown-module_header__EOpC- {\n  border-color: var(--highlight);\n}\n.Dropdown-module_root__mkOMI.Dropdown-module_disabled__eLZhs .Dropdown-module_select__Thb6Y {\n  background: var(--grey10);\n  cursor: not-allowed;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: flex-start;\n  min-height: 2rem;\n  width: 100%;\n  gap: 1rem;\n  color: var(--grey3);\n  font-size: 0.75rem;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc .Dropdown-module_feedback__0VQS6 {\n  flex: 1;\n  margin-right: auto;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc .Dropdown-module_feedback__0VQS6.Dropdown-module_feedback-error__FD-hZ {\n  color: var(--error);\n  fill: var(--error);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc .Dropdown-module_feedback__0VQS6.Dropdown-module_feedback-success__3QnZd {\n  color: var(--success);\n  fill: var(--success);\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc .Dropdown-module_count__tIbln {\n  text-align: right;\n  margin-left: auto;\n}\n.Dropdown-module_root__mkOMI .Dropdown-module_bottom__InVTc .Dropdown-module_count__tIbln.Dropdown-module_exceeded__n1R-W {\n  color: var(--error);\n}\n\n.Dropdown-module_body__BDZmr {\n  display: none;\n  position: absolute;\n  top: calc(100% + 0.5rem);\n  z-index: 999;\n  background: var(--white);\n  width: auto;\n  border: 0.063rem solid var(--grey5);\n  box-shadow: 0rem 0.5rem 1.25rem rgba(24, 24, 24, 0.08);\n  border-radius: 0.25rem;\n  padding: 1rem;\n  overflow-y: auto;\n  min-height: 4rem;\n  outline: none;\n}\n.Dropdown-module_body__BDZmr.Dropdown-module_open__dEH0H {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: stretch;\n}";
+var styles$h = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"Dropdown-module_root__mkOMI","label":"Dropdown-module_label__YkFsR","header":"Dropdown-module_header__EOpC-","input":"Dropdown-module_input__LYIeG","select":"Dropdown-module_select__Thb6Y","feedback-error":"Dropdown-module_feedback-error__FD-hZ","placeholder":"Dropdown-module_placeholder__B2kmJ","icon":"Dropdown-module_icon__YsokN","open":"Dropdown-module_open__dEH0H","disabled":"Dropdown-module_disabled__eLZhs","bottom":"Dropdown-module_bottom__InVTc","feedback":"Dropdown-module_feedback__0VQS6","feedback-success":"Dropdown-module_feedback-success__3QnZd","count":"Dropdown-module_count__tIbln","exceeded":"Dropdown-module_exceeded__n1R-W","body":"Dropdown-module_body__BDZmr"};
 styleInject(css_248z$i);
 
 var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
@@ -13731,11 +13738,15 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
     popperClassName = props.popperClassName,
     value = props.value,
     onChange = props.onChange,
+    onBlur = props.onBlur,
     children = props.children,
     label = props.label,
     placeholder = props.placeholder,
     multi = props.multi,
-    disabled = props.disabled;
+    disabled = props.disabled,
+    id = props.id,
+    name = props.name,
+    feedback = props.feedback;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -13814,16 +13825,27 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
       index = dataset.index,
       selected = dataset.selected,
       elem = dataset.elem;
+
+    // to support form libraries which require name and value on the event
+    var nativeEvent = event.nativeEvent || event;
+    var clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
+    Object.defineProperty(clonedEvent, 'target', {
+      writable: true,
+      value: {
+        value: itemValue,
+        name: name
+      }
+    });
     if (elem === 'dropdown-item') {
       setSelectedIndex(parseInt(index, 10));
       if (multi) {
         if (isControlled) {
           if (selected === 'true') {
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, value.filter(function (val) {
+            onChange === null || onChange === void 0 ? void 0 : onChange(clonedEvent, value.filter(function (val) {
               return val !== itemValue;
             }));
           } else {
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, [].concat(_toConsumableArray(value !== null && value !== void 0 ? value : []), [itemValue]));
+            onChange === null || onChange === void 0 ? void 0 : onChange(clonedEvent, [].concat(_toConsumableArray(value !== null && value !== void 0 ? value : []), [itemValue]));
           }
         } else {
           // eslint-disable-next-line no-lonely-if
@@ -13837,7 +13859,7 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
         }
       } else {
         if (isControlled) {
-          onChange(event, itemValue.toString());
+          onChange(clonedEvent, itemValue.toString());
         } else {
           setUncontrolledValue(itemValue.toString());
         }
@@ -13924,6 +13946,8 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
       ref: reference
     }, getReferenceProps()), {}, {
       children: [/*#__PURE__*/jsx("input", {
+        id: id,
+        name: name,
         ref: inputRef,
         disabled: disabled,
         tabIndex: 0,
@@ -13934,13 +13958,14 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
             setOpen(true);
           }
         },
+        onBlur: onBlur,
         value: selectedOptions === null || selectedOptions === void 0 ? void 0 : (_selectedOptions$map = selectedOptions.map(function (option) {
           return option === null || option === void 0 ? void 0 : option.value;
         })) === null || _selectedOptions$map === void 0 ? void 0 : _selectedOptions$map.join(', ')
       }), /*#__PURE__*/jsxs("div", {
         "data-elem": "select",
         role: "button",
-        className: styles$h.select,
+        className: classes(styles$h.select, feedback != null ? styles$h["feedback-".concat(feedback === null || feedback === void 0 ? void 0 : feedback.type)] : ''),
         children: [/*#__PURE__*/jsx("span", {
           "data-elem": "placeholder",
           className: styles$h.placeholder,
@@ -13976,6 +14001,13 @@ var Dropdown = /*#__PURE__*/forwardRef(function Dropdown(props, inputRef) {
           children: items
         }))
       })
+    }), feedback != null && /*#__PURE__*/jsx("div", {
+      className: styles$h.bottom,
+      children: /*#__PURE__*/jsx("div", {
+        "data-elem": "feedback",
+        className: classes(styles$h.feedback, styles$h["feedback-".concat(feedback.type)]),
+        children: feedback.text
+      })
     })]
   });
 });
@@ -13989,7 +14021,12 @@ Dropdown.propTypes = {
   // search: PropTypes.bool,
   // max: PropTypes.number,
   multi: propTypes$1.exports.bool,
-  onChange: propTypes$1.exports.func
+  onChange: propTypes$1.exports.func,
+  onBlur: propTypes$1.exports.func,
+  feedback: propTypes$1.exports.shape({
+    text: propTypes$1.exports.node,
+    type: propTypes$1.exports.oneOf(['error', 'success', 'default'])
+  })
 };
 Dropdown.defaultProps = {
   popperClassName: '',
@@ -14001,7 +14038,9 @@ Dropdown.defaultProps = {
   // search: false,
   // max: null,
   multi: false,
-  onChange: null
+  onChange: null,
+  onBlur: null,
+  feedback: null
 };
 
 var css_248z$h = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.DropdownItem-module_root__su9HU {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  gap: 0.75rem;\n  width: 100%;\n  padding: 0.75rem 1rem;\n  border-radius: 0.25rem;\n  cursor: pointer;\n  color: var(--grey);\n  outline: none;\n}\n.DropdownItem-module_root__su9HU:hover, .DropdownItem-module_root__su9HU:focus {\n  background: var(--grey6);\n}\n.DropdownItem-module_root__su9HU.DropdownItem-module_selected__Iwplc {\n  background: var(--info-bg);\n}";
@@ -14620,7 +14659,7 @@ var css_248z$b = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-gr
 var styles$b = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"TableCell-module_root__0-5fC","cell-text":"TableCell-module_cell-text__MqZRq","header-cell":"TableCell-module_header-cell__cDXlM","body-cell":"TableCell-module_body-cell__Z2M7H","multi-line":"TableCell-module_multi-line__8cWJW","sticky-left":"TableCell-module_sticky-left__clzyD","sticky-right":"TableCell-module_sticky-right__U9Kgq"};
 styleInject(css_248z$b);
 
-var TableCell = function TableCell(props) {
+var TableCell = /*#__PURE__*/forwardRef(function TableCell(props, ref) {
   var className = props.className,
     size = props.size,
     flexible = props.flexible,
@@ -14637,6 +14676,7 @@ var TableCell = function TableCell(props) {
     cellTitle = props.cellTitle,
     sticky = props.sticky;
   return /*#__PURE__*/jsx(BaseCell, {
+    ref: ref,
     className: classes(styles$b.root, className, styles$b["".concat(type, "-cell")], styles$b["sticky-".concat(sticky)]),
     attrs: _objectSpread2({
       style: style
@@ -14657,7 +14697,7 @@ var TableCell = function TableCell(props) {
     RootDOM: RootDOM,
     radius: radius
   });
-};
+});
 TableCell.propTypes = _objectSpread2(_objectSpread2({}, BaseCell.propTypes), {}, {
   title: propTypes$1.exports.string,
   id: propTypes$1.exports.string,
@@ -14676,7 +14716,7 @@ TableCell.defaultProps = _objectSpread2(_objectSpread2({}, BaseCell.defaultProps
   cellTitle: null
 });
 
-var css_248z$a = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.TableRow-module_root__tyJjH {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n}\n.TableRow-module_root__tyJjH.TableRow-module_header-row__p3gQZ {\n  background: var(--grey6);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB {\n  background: var(--white);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB:hover > [data-elem=base-cell] {\n  background: var(--info-bg);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB.TableRow-module_selected__GJlEC > [data-elem=base-cell] {\n  background: var(--background);\n}";
+var css_248z$a = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.TableRow-module_root__tyJjH {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n}\n.TableRow-module_root__tyJjH.TableRow-module_header-row__p3gQZ {\n  background: var(--grey6);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB {\n  background: var(--white);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB:hover > [data-elem=base-cell] {\n  background: var(--info-bg);\n}\n.TableRow-module_root__tyJjH.TableRow-module_body-row__BzIwB.TableRow-module_selected__GJlEC > [data-elem=base-cell] {\n  background: var(--background);\n}\n.TableRow-module_root__tyJjH > [data-elem=base-cell]:first-child {\n  padding-left: 1rem;\n}\n.TableRow-module_root__tyJjH > [data-elem=base-cell]:last-child {\n  padding-right: 1rem;\n}";
 var styles$a = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"TableRow-module_root__tyJjH","header-row":"TableRow-module_header-row__p3gQZ","body-row":"TableRow-module_body-row__BzIwB","selected":"TableRow-module_selected__GJlEC"};
 styleInject(css_248z$a);
 
@@ -14693,7 +14733,7 @@ var TableRow = function TableRow(props) {
     "data-elem": "table-row",
     className: classes(className, styles$a.root, selected ? styles$a.selected : '', styles$a["".concat(type, "-row")]),
     children: headerData === null || headerData === void 0 ? void 0 : (_headerData$map = headerData.map) === null || _headerData$map === void 0 ? void 0 : _headerData$map.call(headerData, function (item) {
-      var _customCells$type;
+      var _getCustomCell;
       var cellContent = null;
       if (type === 'header') {
         cellContent = item.title;
@@ -14708,7 +14748,8 @@ var TableRow = function TableRow(props) {
         cellTitle: cellContent,
         type: type
       });
-      var CustomCell = customCells === null || customCells === void 0 ? void 0 : (_customCells$type = customCells[type]) === null || _customCells$type === void 0 ? void 0 : _customCells$type[item.id];
+      var getCustomCell = customCells === null || customCells === void 0 ? void 0 : customCells[type];
+      var CustomCell = typeof getCustomCell === 'function' ? (_getCustomCell = getCustomCell()) === null || _getCustomCell === void 0 ? void 0 : _getCustomCell[item.id] : null;
       if (CustomCell != null) {
         // eslint-disable-next-line react/jsx-key
         return /*#__PURE__*/jsx(CustomCell, _objectSpread2({}, cellProps));
@@ -14726,8 +14767,8 @@ TableRow.propTypes = {
   type: propTypes$1.exports.oneOf(['header', 'body']),
   datum: propTypes$1.exports.object,
   customCells: propTypes$1.exports.shape({
-    header: propTypes$1.exports.object,
-    body: propTypes$1.exports.object
+    header: propTypes$1.exports.func,
+    body: propTypes$1.exports.func
   }),
   headerData: propTypes$1.exports.arrayOf(propTypes$1.exports.shape({
     title: propTypes$1.exports.string,
@@ -14848,8 +14889,8 @@ TableHeader.propTypes = {
     multiLine: propTypes$1.exports.bool
   })),
   customCells: propTypes$1.exports.shape({
-    header: propTypes$1.exports.object,
-    body: propTypes$1.exports.object
+    header: propTypes$1.exports.func,
+    body: propTypes$1.exports.func
   })
 };
 TableHeader.defaultProps = {
@@ -14910,8 +14951,8 @@ BaseTable.propTypes = {
   activeData: propTypes$1.exports.object,
   setActiveData: propTypes$1.exports.func,
   customCells: propTypes$1.exports.shape({
-    header: propTypes$1.exports.object,
-    body: propTypes$1.exports.object
+    header: propTypes$1.exports.func,
+    body: propTypes$1.exports.func
   })
 };
 BaseTable.defaultProps = {
@@ -15300,11 +15341,11 @@ TableFilters.defaultProps = {
   onSearch: function onSearch() {},
   searchValue: null,
   filterValue: {
-    applied: 4
+    applied: null
   }
 };
 
-var css_248z$2 = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Table-module_root__dLWEm {\n  position: relative;\n  border-style: solid;\n  border-color: var(--grey4);\n  border-width: 1px 1px 0px 1px;\n  border-radius: 0.25rem;\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n}\n.Table-module_root__dLWEm .Table-module_table__Oh-P6 {\n  height: calc(100% - 6rem);\n  padding-bottom: 3.5rem;\n}\n.Table-module_root__dLWEm .Table-module_pagination__DBIS0 {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n}\n.Table-module_root__dLWEm .Table-module_pagination__DBIS0.Table-module_floating__x8-m7 {\n  bottom: 1rem;\n}\n.Table-module_root__dLWEm .Table-module_chips__BY-oI,\n.Table-module_root__dLWEm .Table-module_filters__RUDdW,\n.Table-module_root__dLWEm .Table-module_table__Oh-P6 > [data-elem=table-header] {\n  position: -webkit-sticky;\n  position: sticky;\n  z-index: 1;\n  top: 0;\n}";
+var css_248z$2 = ":root {\n  --white: #ffffff;\n  --black: #000000;\n  --dark-grey: #333333;\n  --dark-grey-o-85: rgba(51, 51, 51, 0.85);\n  --grey: #737373;\n  --grey1: #888888;\n  --grey2: #a6a6a6;\n  --grey3: #bbbbbb;\n  --grey4: #c4c4c4;\n  --grey5: #dddddd;\n  --grey6: #e8e8e8;\n  --grey7: #eeeeee;\n  --grey8: #f2f2f2;\n  --grey9: #eff0f0;\n  --grey10: #f7f7f7;\n  --highlight: #0f62fe;\n  --dark-blue: #001833;\n  --background: #d0e2ff;\n  --banyan-blue: #00037c;\n  --banyan-orange: #ff892a;\n  --banyan-pink: #ff1597;\n  --banyan-gradient: linear-gradient(\n  \t84.71deg,\n  \tvar(--banyan-pink) 0.48%,\n  \tvar(--banyan-orange) 99.57%\n  );\n  --error: #da1e28;\n  --error-bg: #fff1f1;\n  --error-outline: rgba(218, 30, 40, 0.08);\n  --success: #24a148;\n  --success-bg: #defbe6;\n  --success-outline: rgba(36, 161, 72, 0.08);\n  --warning: #f1c21b;\n  --warning-bg: #fff8e1;\n  --warning-outline: rgba(203, 160, 6, 0.08);\n  --info: #0043ce;\n  --info-bg: #edf5ff;\n  --info-outline: #2864db98;\n}\n\n.Table-module_root__dLWEm {\n  position: relative;\n  border-style: solid;\n  border-color: var(--grey4);\n  border-width: 1px 1px 0px 1px;\n  border-radius: 0.25rem;\n  width: 100%;\n  max-width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.Table-module_root__dLWEm .Table-module_table__Oh-P6 {\n  height: calc(100% - 6rem);\n  padding-bottom: 3.5rem;\n}\n.Table-module_root__dLWEm .Table-module_pagination__DBIS0 {\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translateX(-50%);\n}\n.Table-module_root__dLWEm .Table-module_pagination__DBIS0.Table-module_floating__x8-m7 {\n  bottom: 1rem;\n}\n.Table-module_root__dLWEm .Table-module_chips__BY-oI,\n.Table-module_root__dLWEm .Table-module_filters__RUDdW,\n.Table-module_root__dLWEm .Table-module_table__Oh-P6 > [data-elem=table-header] {\n  position: -webkit-sticky;\n  position: sticky;\n  z-index: 1;\n  top: 0;\n}";
 var styles$2 = {"white":"var(--white)","black":"var(--black)","dark-grey":"var(--dark-grey)","dark-grey-o-85":"var(--dark-grey-o-85)","grey":"var(--grey)","grey1":"var(--grey1)","grey2":"var(--grey2)","grey3":"var(--grey3)","grey4":"var(--grey4)","grey5":"var(--grey5)","grey6":"var(--grey6)","grey7":"var(--grey7)","grey8":"var(--grey8)","grey9":"var(--grey9)","grey10":"var(--grey10)","highlight":"var(--highlight)","dark-blue":"var(--dark-blue)","background":"var(--background)","banyan-blue":"var(--banyan-blue)","banyan-orange":"var(--banyan-orange)","banyan-pink":"var(--banyan-pink)","banyan-gradient":"var(--banyan-gradient)","error":"var(--error)","error-bg":"var(--error-bg)","error-outline":"var(--error-outline)","success":"var(--success)","success-bg":"var(--success-bg)","success-outline":"var(--success-outline)","warning":"var(--warning)","warning-bg":"var(--warning-bg)","warning-outline":"var(--warning-outline)","info":"var(--info)","info-bg":"var(--info-bg)","info-outline":"var(--info-outline)","root":"Table-module_root__dLWEm","table":"Table-module_table__Oh-P6","pagination":"Table-module_pagination__DBIS0","floating":"Table-module_floating__x8-m7","chips":"Table-module_chips__BY-oI","filters":"Table-module_filters__RUDdW"};
 styleInject(css_248z$2);
 
@@ -15315,6 +15356,7 @@ for (var i = 0; i < INTERSECTION; i += STEP) {
   THRESHOLD.push(i);
 }
 var Table = function Table(props) {
+  var _chipsData$chips;
   var className = props.className,
     headerData = props.headerData,
     tableData = props.tableData,
@@ -15398,7 +15440,7 @@ var Table = function Table(props) {
   }, [headerData]);
   return /*#__PURE__*/jsxs("div", {
     className: classes(styles$2.root, className),
-    children: [chipsData != null && /*#__PURE__*/jsx(TableChips, _objectSpread2({
+    children: [chipsData != null && ((chipsData === null || chipsData === void 0 ? void 0 : (_chipsData$chips = chipsData.chips) === null || _chipsData$chips === void 0 ? void 0 : _chipsData$chips.length) > 0 || (chipsData === null || chipsData === void 0 ? void 0 : chipsData.showBack) != null) && /*#__PURE__*/jsx(TableChips, _objectSpread2({
       className: styles$2.chips
     }, chipsData)), filtersData != null && /*#__PURE__*/jsx(TableFilters, _objectSpread2({
       className: styles$2.filters
@@ -15439,8 +15481,8 @@ Table.propTypes = {
   activeData: propTypes$1.exports.object,
   setActiveData: propTypes$1.exports.func,
   customCells: propTypes$1.exports.shape({
-    header: propTypes$1.exports.object,
-    body: propTypes$1.exports.object
+    header: propTypes$1.exports.func,
+    body: propTypes$1.exports.func
   }),
   chipsData: propTypes$1.exports.shape(_objectSpread2({}, TableChips.propTypes)),
   filtersData: propTypes$1.exports.shape(_objectSpread2({}, TableFilters.propTypes)),

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@banyan_cloud/roots",
-	"version": "1.0.2",
+	"version": "1.0.4",
 	"description": "Design System Library which drives the Banyan Cloud products",
 	"main": "dist/cjs/index.js",
 	"module": "dist/esm/index.js",
@@ -82,12 +82,12 @@
 		"eslint-plugin-react-hooks": "^4.3.0",
 		"prettier": "^2.7.1",
 		"prop-types": "^15.8.1",
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0",
 		"sass": "^1.55.0",
 		"sass-loader": "^13.1.0",
 		"storybook-addon-designs": "^6.3.1",
-		"storybook-dark-mode": "^1.1.2",
-		"react": "^18.2.0",
-		"react-dom": "^18.2.0"
+		"storybook-dark-mode": "^1.1.2"
 	},
 	"scripts": {
 		"test": "echo \"Error: no test specified\" && exit 1",