@hyphen/hyphen-components 2.19.2 → 2.21.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 (6) hide show
  1. package/dist/css/index.css +1 -1
  2. package/dist/css/utilities.css +19 -1
  3. package/dist/css/variables.css +6 -2
  4. package/dist/lib/tokens.d.ts +4 -4
  5. package/package.json +2 -2
  6. package/src/components/Modal/Modal.module.scss +1 -1
package/dist/css/index.css CHANGED
@@ -23,7 +23,7 @@
23
23
  .SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_disabled__gKmV4,.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:disabled{background-color:var(--color-background-disabled);color:var(--color-font-disabled);-webkit-text-fill-color:var(--color-font-disabled);opacity:1}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_disabled__gKmV4:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_disabled__gKmV4:before,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_disabled__gKmV4:hover,.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:disabled:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:disabled:before,.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:hover:disabled{cursor:not-allowed}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z,.SelectInputNative-module_size-sm__7Ql4z{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z>select,.SelectInputNative-module_size-sm__7Ql4z>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--size-spacing-2xl) calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z:before,.SelectInputNative-module_size-sm__7Ql4z:after,.SelectInputNative-module_size-sm__7Ql4z:before{height:2px;top:calc(var(--size-spacing-sm) + 12px);width:8px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z:before,.SelectInputNative-module_size-sm__7Ql4z:before{right:calc(var(--size-spacing-sm) + 8px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm__7Ql4z:after,.SelectInputNative-module_size-sm__7Ql4z:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh,.SelectInputNative-module_size-md__ofleh{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh>select,.SelectInputNative-module_size-md__ofleh>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--size-spacing-3xl) calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh:before,.SelectInputNative-module_size-md__ofleh:after,.SelectInputNative-module_size-md__ofleh:before{top:calc(var(--size-spacing-md) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh:before,.SelectInputNative-module_size-md__ofleh:before{right:calc(var(--size-spacing-sm) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md__ofleh:after,.SelectInputNative-module_size-md__ofleh:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6,.SelectInputNative-module_size-lg__ewS-6{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6>select,.SelectInputNative-module_size-lg__ewS-6>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--size-spacing-3xl) calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6:before,.SelectInputNative-module_size-lg__ewS-6:after,.SelectInputNative-module_size-lg__ewS-6:before{height:2px;top:calc(var(--size-spacing-md) + 9px);width:10px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6:before,.SelectInputNative-module_size-lg__ewS-6:before{right:calc(var(--size-spacing-sm) + 11px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg__ewS-6:after,.SelectInputNative-module_size-lg__ewS-6:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm{background-color:var(--form-control-background-color,var(--INTERNAL_form-control-background-color));border:1px solid var(--form-control-border-color,var(--INTERNAL_form-control-border-color));font-family:var(--form-control-font-family,var(--INTERNAL_form-control-font-family));position:relative}.SelectInputNative-module_select-input-native-wrapper__-vvFm:focus-within{border:1px solid var(--color-border-active);box-shadow:var(--form-control-box-shadow,var(--INTERNAL_form-control-box-shadow-focus));outline:none}.SelectInputNative-module_select-input-native-wrapper__-vvFm:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm:before{background:var(--color-base-grey-300);border-radius:100px;content:"";height:2px;pointer-events:none;position:absolute;width:10px}.SelectInputNative-module_select-input-native-wrapper__-vvFm:before{right:calc(var(--size-spacing-sm) + 7px);transform:rotate(42deg);transform-origin:50% 50%;z-index:1}.SelectInputNative-module_select-input-native-wrapper__-vvFm:after{right:calc(var(--size-spacing-sm) + 1px);transform:rotate(-42deg);transform-origin:50% 50%}.SelectInputNative-module_select-input-native-wrapper__-vvFm>select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;box-sizing:border-box;line-height:var(--form-control-line-height,var(--INTERNAL_form-control-line-height));transition-duration:.3s;transition-property:border,background-color;transition-timing-function:cubic-bezier(.2,.8,.4,1);width:100%}.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:focus{border-color:var(--form-control-border-color-focus,var(--INTERNAL_form-control-border-color-focus));outline:none}.SelectInputNative-module_select-input-native-wrapper__-vvFm>select:disabled{background-color:transparent}@media (min-width:680px){.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--size-spacing-2xl) calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA:before{height:2px;top:calc(var(--size-spacing-sm) + 12px);width:8px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA:before{right:calc(var(--size-spacing-sm) + 8px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-tablet__3wbFA:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--size-spacing-3xl) calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t:before{top:calc(var(--size-spacing-md) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t:before{right:calc(var(--size-spacing-sm) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-tablet__nLo2t:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--size-spacing-3xl) calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T:before{height:2px;top:calc(var(--size-spacing-md) + 9px);width:10px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T:before{right:calc(var(--size-spacing-sm) + 11px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-tablet__fLu2T:after{right:calc(var(--size-spacing-sm) + 3px)}}@media (min-width:992px){.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--size-spacing-2xl) calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D:before{height:2px;top:calc(var(--size-spacing-sm) + 12px);width:8px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D:before{right:calc(var(--size-spacing-sm) + 8px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-desktop__aUL7D:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--size-spacing-3xl) calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc:before{top:calc(var(--size-spacing-md) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc:before{right:calc(var(--size-spacing-sm) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-desktop__s1uoc:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--size-spacing-3xl) calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka:before{height:2px;top:calc(var(--size-spacing-md) + 9px);width:10px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka:before{right:calc(var(--size-spacing-sm) + 11px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-desktop__Ri2Ka:after{right:calc(var(--size-spacing-sm) + 3px)}}@media (min-width:1280px){.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--size-spacing-2xl) calc(var(--form-control-size-sm-padding, var(--INTERNAL_form-control-size-sm-padding))) var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G:before{height:2px;top:calc(var(--size-spacing-sm) + 12px);width:8px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G:before{right:calc(var(--size-spacing-sm) + 8px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-sm-hd__RVm4G:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--size-spacing-3xl) calc(var(--form-control-size-md-padding, var(--INTERNAL_form-control-size-md-padding))) var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf:before{top:calc(var(--size-spacing-md) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf:before{right:calc(var(--size-spacing-sm) + 10px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-md-hd__m4Rqf:after{right:calc(var(--size-spacing-sm) + 3px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b>select{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--size-spacing-3xl) calc(var(--form-control-size-lg-padding, var(--INTERNAL_form-control-size-lg-padding)) - 1px) var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b:after,.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b:before{height:2px;top:calc(var(--size-spacing-md) + 9px);width:10px}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b:before{right:calc(var(--size-spacing-sm) + 11px)}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_size-lg-hd__V6i8b:after{right:calc(var(--size-spacing-sm) + 3px)}}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_error__RBOZT{background-color:var(--form-control-border-color-error,var(--INTERNAL_form-control-background-color-error));border-color:var(--form-control-border-color-error,var(--INTERNAL_form-control-border-color-error))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_error__RBOZT:focus-within{background-color:var(--form-control-background-color,var(--INTERNAL_form-control-background-color));border:1px solid var(--color-border-active);color:var(--form-control-font-color,var(--INTERNAL_form-control-font-color));outline:none}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_error__RBOZT select{color:var(--form-control-font-color,var(--INTERNAL_form-control-input-color-error))}.SelectInputNative-module_select-input-native-wrapper__-vvFm.SelectInputNative-module_error__RBOZT select:focus{background-color:transparent;color:var(--form-control-font-color,var(--INTERNAL_form-control-label-color));outline:none}.SelectInputNative-module_text-input-label__-YjDc{margin-bottom:var(--form-control-label-margin,var(--INTERNAL_form-control-label-margin))}
24
24
  .TextareaInput-module_size-sm__-YCcV,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm__-YCcV{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.TextareaInput-module_size-sm__-YCcV>textarea,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm__-YCcV>textarea{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));padding:var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.TextareaInput-module_size-md__uPOvN,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md__uPOvN{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.TextareaInput-module_size-md__uPOvN>textarea,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md__uPOvN>textarea{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));padding:var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.TextareaInput-module_size-lg__P5SYv,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg__P5SYv{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.TextareaInput-module_size-lg__P5SYv>textarea,.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg__P5SYv>textarea{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea:disabled{background-color:var(--color-background-disabled);color:var(--color-font-disabled);-webkit-text-fill-color:var(--color-font-disabled);opacity:1}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea:hover:disabled{cursor:not-allowed}.TextareaInput-module_textarea-input-wrapper__mJBZN{border:1px solid var(--form-control-border-color,var(--INTERNAL_form-control-border-color));font-family:var(--form-control-font-family,var(--INTERNAL_form-control-font-family))}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea{background-color:var(--form-control-background-color,var(--INTERNAL_form-control-background-color));border:none;color:var(--form-control-font-color,var(--INTERNAL_form-control-font-color));line-height:var(--form-control-line-height,var(--INTERNAL_form-control-line-height));transition-duration:.3s;transition-property:border,background-color;transition-timing-function:cubic-bezier(.2,.8,.4,1);width:100%}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea::-moz-placeholder{color:var(--color-font-placeholder);opacity:1}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea::placeholder{color:var(--color-font-placeholder);opacity:1}.TextareaInput-module_textarea-input-wrapper__mJBZN>textarea:focus{border-color:var(--form-control-border-color-focus,var(--INTERNAL_form-control-border-color-focus));outline:none}@media (min-width:680px){.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-tablet__rYP2T{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-tablet__rYP2T>textarea{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));padding:var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-tablet__D1PYq{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-tablet__D1PYq>textarea{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));padding:var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-tablet__N-UED{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-tablet__N-UED>textarea{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}}@media (min-width:992px){.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-desktop__Z-Zdg{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-desktop__Z-Zdg>textarea{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));padding:var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-desktop__W3jIm{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-desktop__W3jIm>textarea{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));padding:var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-desktop__XLwk0{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-desktop__XLwk0>textarea{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}}@media (min-width:1280px){.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-hd__KP21d{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));font-size:var(--form-control-size-sm-font-size,var(--INTERNAL_form-control-size-sm-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-sm-hd__KP21d>textarea{border-radius:var(--form-control-size-sm-border-radius,var(--INTERNAL_form-control-size-sm-border-radius));padding:var(--form-control-size-sm-padding,var(--INTERNAL_form-control-size-sm-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-hd__3me0R{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));font-size:var(--form-control-size-md-font-size,var(--INTERNAL_form-control-size-md-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-md-hd__3me0R>textarea{border-radius:var(--form-control-size-md-border-radius,var(--INTERNAL_form-control-size-md-border-radius));padding:var(--form-control-size-md-padding,var(--INTERNAL_form-control-size-md-padding))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-hd__BcgC-{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));font-size:var(--form-control-size-lg-font-size,var(--INTERNAL_form-control-size-lg-font-size))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_size-lg-hd__BcgC->textarea{border-radius:var(--form-control-size-lg-border-radius,var(--INTERNAL_form-control-size-lg-border-radius));padding:var(--form-control-size-lg-padding,var(--INTERNAL_form-control-size-lg-padding))}}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_error__JpCpt>textarea{background-color:var(--form-control-border-color-focus,var(--INTERNAL_form-control-background-color-error));border-color:var(--form-control-border-color-focus,var(--INTERNAL_form-control-border-color-error));color:var(--form-control-font-color,var(--INTERNAL_form-control-input-color-error))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_error__JpCpt textarea:focus{background-color:transparent;outline:none}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_error__JpCpt:focus-within{background-color:var(--form-control-background-color,var(--INTERNAL_form-control-background-color));border-color:var(--form-control-border-color-focus,var(--INTERNAL_form-control-border-color-focus))}.TextareaInput-module_textarea-input-wrapper__mJBZN.TextareaInput-module_error__JpCpt:focus-within>textarea{color:var(--form-control-font-color,var(--INTERNAL_form-control-font-color))}.TextareaInput-module_textarea-input-wrapper__mJBZN:focus-within{border:1px solid var(--color-border-active);box-shadow:var(--form-control-box-shadow-focus,var(--INTERNAL_form-control-box-shadow-focus));outline:none}.TextareaInput-module_textarea-input-label__1zb77{margin-bottom:var(--form-control-label-margin,var(--INTERNAL_form-control-label-margin))}.TextareaInput-module_textarea-resize-both__Gn3Zh{resize:both}.TextareaInput-module_textarea-resize-horizontal__0aRED{resize:horizontal}.TextareaInput-module_textarea-resize-vertical__DbKar{resize:vertical}.TextareaInput-module_textarea-resize-none__l6dRF{resize:none}
25
25
  .Toggle-module_thumb-size-sm__GeodE{height:calc(var(--size-spacing-2xl) - 4px);width:calc(var(--size-spacing-2xl) - 4px)}.Toggle-module_thumb-size-md__hZP-v{height:calc(var(--size-spacing-3xl) - 4px);width:calc(var(--size-spacing-3xl) - 4px)}.Toggle-module_thumb-size-lg__vTfiF{height:calc(var(--size-spacing-4xl) - 4px);width:calc(var(--size-spacing-4xl) - 4px)}.Toggle-module_track-size-sm__9H8xR{height:var(--size-spacing-2xl);min-width:2rem;width:2rem}.Toggle-module_track-size-md__7tLlO{height:var(--size-spacing-3xl);min-width:2.5rem;width:2.5rem}.Toggle-module_track-size-lg__9drMt{height:var(--size-spacing-4xl);min-width:3.5rem;width:3.5rem}@media (min-width:680px){.Toggle-module_thumb-size-sm-tablet__pbksf{height:calc(var(--size-spacing-2xl) - 4px);width:calc(var(--size-spacing-2xl) - 4px)}.Toggle-module_thumb-size-md-tablet__-TDJj{height:calc(var(--size-spacing-3xl) - 4px);width:calc(var(--size-spacing-3xl) - 4px)}.Toggle-module_thumb-size-lg-tablet__Q0isC{height:calc(var(--size-spacing-4xl) - 4px);width:calc(var(--size-spacing-4xl) - 4px)}.Toggle-module_track-size-sm-tablet__vpDN9{height:var(--size-spacing-2xl);min-width:2rem;width:2rem}.Toggle-module_track-size-md-tablet__jBAOT{height:var(--size-spacing-3xl);min-width:2.5rem;width:2.5rem}.Toggle-module_track-size-lg-tablet__MLRv2{height:var(--size-spacing-4xl);min-width:3.5rem;width:3.5rem}}@media (min-width:992px){.Toggle-module_thumb-size-sm-desktop__8a93z{height:calc(var(--size-spacing-2xl) - 4px);width:calc(var(--size-spacing-2xl) - 4px)}.Toggle-module_thumb-size-md-desktop__VaAlw{height:calc(var(--size-spacing-3xl) - 4px);width:calc(var(--size-spacing-3xl) - 4px)}.Toggle-module_thumb-size-lg-desktop__c9vh7{height:calc(var(--size-spacing-4xl) - 4px);width:calc(var(--size-spacing-4xl) - 4px)}.Toggle-module_track-size-sm-desktop__LqFN-{height:var(--size-spacing-2xl);min-width:2rem;width:2rem}.Toggle-module_track-size-md-desktop__3ClrR{height:var(--size-spacing-3xl);min-width:2.5rem;width:2.5rem}.Toggle-module_track-size-lg-desktop__ruWSF{height:var(--size-spacing-4xl);min-width:3.5rem;width:3.5rem}}@media (min-width:1280px){.Toggle-module_thumb-size-sm-hd__m5Lwq{height:calc(var(--size-spacing-2xl) - 4px);width:calc(var(--size-spacing-2xl) - 4px)}.Toggle-module_thumb-size-md-hd__4VcAY{height:calc(var(--size-spacing-3xl) - 4px);width:calc(var(--size-spacing-3xl) - 4px)}.Toggle-module_thumb-size-lg-hd__L-oay{height:calc(var(--size-spacing-4xl) - 4px);width:calc(var(--size-spacing-4xl) - 4px)}.Toggle-module_track-size-sm-hd__0m-1g{height:var(--size-spacing-2xl);min-width:2rem;width:2rem}.Toggle-module_track-size-md-hd__S19uj{height:var(--size-spacing-3xl);min-width:2.5rem;width:2.5rem}.Toggle-module_track-size-lg-hd__Go0mj{height:var(--size-spacing-4xl);min-width:3.5rem;width:3.5rem}}.Toggle-module_disabled__sxlCk{cursor:not-allowed;opacity:.4}.Toggle-module_toggle-thumb__6hl8Y{background-color:var(--color-base-white);border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,.45);display:block;transition:transform .25s ease}.Toggle-module_toggle-track__Jv1qD{background-color:var(--toggle-background-color,var(--color-base-grey-200));border-radius:9999em;cursor:pointer;display:block;padding:2px;transition:background-color .25s ease}.Toggle-module_toggle-track__Jv1qD.Toggle-module_error__f1tIX{background-color:var(--toggle-background-color-error,var(--color-base-red-500))}.Toggle-module_toggle-input__sNnss{position:absolute;clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;white-space:nowrap;width:1px}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD{background-color:var(--toggle-background-color-checked,var(--color-base-green-500))}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD.Toggle-module_error__f1tIX{background-color:var(--toggle-background-color-error,var(--color-base-red-500))}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-sm__GeodE{transform:translateX(.75rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-md__hZP-v{transform:translateX(1rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-lg__vTfiF{transform:translateX(1.5rem)}@media (min-width:680px){.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-sm-tablet__pbksf{transform:translateX(.5rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-md-tablet__-TDJj{transform:translateX(1rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-lg-tablet__Q0isC{transform:translateX(1.5rem)}}@media (min-width:992px){.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-sm-desktop__8a93z{transform:translateX(.5rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-md-desktop__VaAlw{transform:translateX(1rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-lg-desktop__c9vh7{transform:translateX(1.5rem)}}@media (min-width:1280px){.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-sm-hd__m5Lwq{transform:translateX(.5rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-md-hd__4VcAY{transform:translateX(1rem)}.Toggle-module_toggle-input__sNnss:checked+.Toggle-module_toggle-track__Jv1qD .Toggle-module_toggle-thumb__6hl8Y.Toggle-module_thumb-size-lg-hd__L-oay{transform:translateX(1.5rem)}}.Toggle-module_toggle-input__sNnss:focus+.Toggle-module_toggle-track__Jv1qD{box-shadow:var(--form-control-box-shadow-focus,var(--INTERNAL_form-control-box-shadow-focus));outline:0}.Toggle-module_toggle-input__sNnss:focus-visible+.Toggle-module_toggle-track__Jv1qD{box-shadow:var(--form-control-box-shadow-focus,var(--INTERNAL_form-control-box-shadow-focus));outline:0}.Toggle-module_toggle-input__sNnss:focus:not(:focus-visible)+.Toggle-module_toggle-track__Jv1qD{box-shadow:none;outline:0}
26
- .Modal-module_modal-close__1YmMa{background:transparent;border:none;border-radius:var(--size-border-radius-sm);cursor:pointer;line-height:var(--size-line-height-base);padding:var(--size-spacing-xs)}.Modal-module_modal-close__1YmMa,.Modal-module_modal-close__1YmMa:hover{color:var(--color-font-secondary)}.Modal-module_modal-close__1YmMa:focus-visible{box-shadow:var(--modal-close-button-box-shadow-focus,0 0 0 4px var(--color-base-grey-200));outline:0}.Modal-module_modal-close__1YmMa:focus:not(:focus-visible){box-shadow:none;outline:0}.Modal-module_modal__yNG-7{align-items:flex-end;animation:fadeIn .2s;background:rgba(0,0,0,.33);background-color:rgba(0,0,0,.6);bottom:0;display:flex;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:var(--size-z-index-overlay)}.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{animation:slideInUp .3s;background-color:var(--color-background-primary);border-radius:var(--size-border-radius-md) var(--size-border-radius-md) 0 0;bottom:0;display:flex;flex-direction:column;grid-column:1;grid-row:1;margin:0;padding:0;position:absolute;width:100%;z-index:var(--size-z-index-modal)}@media (min-width:680px){.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{animation:fadeInUp .2s ease-out;border-radius:var(--size-border-radius-md);box-shadow:var(--modal-box-shadow,var(--size-box-shadow-md));grid-column:2;grid-row:2;margin:auto;max-height:calc(100vh - 80px);min-height:unset;outline:none;position:static;width:70vw}}@media (min-width:992px){.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{width:50vw}}.fullscreen .Modal-module_modal-content__GMtBm{border-radius:0;bottom:env(safe-area-inset-bottom,0);left:env(safe-area-inset-left,0);position:fixed;right:env(safe-area-inset-right,0);top:env(safe-area-inset-top,0)}@media (min-width:680px){.fullscreen{align-items:center;display:grid;grid-template-columns:var(--size-spacing-2xl) auto var(--size-spacing-2xl);grid-template-rows:minmax(var(--size-spacing-2xl),1fr) auto minmax(var(--size-spacing-2xl),1fr);overflow:hidden}.fullscreen .Modal-module_modal-content__GMtBm{animation:fadeInUp .2s ease-out;border-radius:var(--size-border-radius-md);box-shadow:var(--size-box-shadow-md);grid-column:2;grid-row:2;margin:auto;max-height:calc(100vh - 80px);min-height:unset;outline:none;position:unset;width:70vw}}@media (min-width:680px) and (min-width:992px){.fullscreen .Modal-module_modal-content__GMtBm{width:50vw}}
26
+ .Modal-module_modal-close__1YmMa{background:transparent;border:none;border-radius:var(--size-border-radius-sm);cursor:pointer;line-height:var(--size-line-height-base);padding:var(--size-spacing-xs)}.Modal-module_modal-close__1YmMa,.Modal-module_modal-close__1YmMa:hover{color:var(--color-font-secondary)}.Modal-module_modal-close__1YmMa:focus-visible{box-shadow:var(--modal-close-button-box-shadow-focus,0 0 0 4px var(--color-base-grey-200));outline:0}.Modal-module_modal-close__1YmMa:focus:not(:focus-visible){box-shadow:none;outline:0}.Modal-module_modal__yNG-7{align-items:flex-end;animation:fadeIn .2s;background:rgba(0,0,0,.33);background-color:rgba(0,0,0,.6);bottom:0;display:flex;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:var(--size-z-index-overlay)}.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{animation:slideInUp .3s;background-color:var(--color-background-modal);border-radius:var(--size-border-radius-md) var(--size-border-radius-md) 0 0;bottom:0;display:flex;flex-direction:column;grid-column:1;grid-row:1;margin:0;padding:0;position:absolute;width:100%;z-index:var(--size-z-index-modal)}@media (min-width:680px){.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{animation:fadeInUp .2s ease-out;border-radius:var(--size-border-radius-md);box-shadow:var(--modal-box-shadow,var(--size-box-shadow-md));grid-column:2;grid-row:2;margin:auto;max-height:calc(100vh - 80px);min-height:unset;outline:none;position:static;width:70vw}}@media (min-width:992px){.Modal-module_modal__yNG-7 .Modal-module_modal-content__GMtBm{width:50vw}}.fullscreen .Modal-module_modal-content__GMtBm{border-radius:0;bottom:env(safe-area-inset-bottom,0);left:env(safe-area-inset-left,0);position:fixed;right:env(safe-area-inset-right,0);top:env(safe-area-inset-top,0)}@media (min-width:680px){.fullscreen{align-items:center;display:grid;grid-template-columns:var(--size-spacing-2xl) auto var(--size-spacing-2xl);grid-template-rows:minmax(var(--size-spacing-2xl),1fr) auto minmax(var(--size-spacing-2xl),1fr);overflow:hidden}.fullscreen .Modal-module_modal-content__GMtBm{animation:fadeInUp .2s ease-out;border-radius:var(--size-border-radius-md);box-shadow:var(--size-box-shadow-md);grid-column:2;grid-row:2;margin:auto;max-height:calc(100vh - 80px);min-height:unset;outline:none;position:unset;width:70vw}}@media (min-width:680px) and (min-width:992px){.fullscreen .Modal-module_modal-content__GMtBm{width:50vw}}
27
27
  .RangeInput-module_slider__Z6D68{-moz-appearance:none;appearance:none;-webkit-appearance:none;background-color:var(--color-base-grey-700);border:none;border-radius:2.5rem;height:var(--size-spacing-sm);overflow:visible;padding:0!important}.RangeInput-module_slider__Z6D68::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background-color:var(--color-base-white);border:.125rem solid #0f172a;border-radius:var(--size-percentage-50);cursor:pointer;height:var(--size-spacing-2xl);width:var(--size-spacing-2xl)}.RangeInput-module_disabled__gyu72{cursor:not-allowed;opacity:.5}
28
28
  .Table-module_container__BsXT7{position:relative}.Table-module_container__BsXT7 .Table-module_loading-mask__qoRPG{align-items:center;background:var(--color-background-primary);bottom:0;display:flex;justify-content:center;left:0;opacity:.5;position:absolute;right:0;top:0}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T .Table-module_table__-ZPCW{background-color:var(--color-background-primary);border-collapse:collapse;border-spacing:0;cursor:default;margin-top:1px;white-space:normal;width:100%}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T .Table-module_table__-ZPCW.Table-module_auto__1R8wm{table-layout:auto}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T .Table-module_table__-ZPCW.Table-module_fixed__T-EXg{table-layout:fixed}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T .Table-module_borderless__BbsqE{border:none}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T.Table-module_scrollable__Apjbs{display:block;-webkit-overflow-scrolling:touch}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T.Table-module_scrollable__Apjbs.Table-module_scrollable-x__mguJX{overflow-x:auto}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T.Table-module_scrollable__Apjbs.Table-module_scrollable-y__292qB{height:100%;overflow-y:auto}.Table-module_container__BsXT7 .Table-module_scroll-container__5WV5T.Table-module_scrollable__Apjbs>.Table-module_table-bordered__wM9u-{border:0}.Table-module_container__BsXT7.Table-module_full-height__MlrSg{height:100%}
29
29
  .TableBody-module_table-body__Y5WbD.TableBody-module_hover__2CRgY tr:hover td,.TableBody-module_table-body__Y5WbD.TableBody-module_hover__2CRgY tr:hover th,.TableBody-module_table-body__Y5WbD.TableBody-module_striped__5MlEr tr:nth-of-type(odd) td,.TableBody-module_table-body__Y5WbD.TableBody-module_striped__5MlEr tr:nth-of-type(odd) th{background-color:var(--color-background-secondary)}
package/dist/css/utilities.css CHANGED
@@ -3,7 +3,7 @@
3
3
  \***************************************************************************************************************************/
4
4
  /**
5
5
  * Do not edit directly
6
- * Generated on Fri, 11 Oct 2024 15:47:07 GMT
6
+ * Generated on Thu, 31 Oct 2024 00:26:05 GMT
7
7
  */
8
8
 
9
9
  .font-family-monospace { font-family: var(--assets-font-family-monospace); }
@@ -150,6 +150,12 @@
150
150
 
151
151
  .focus\:background-color-button-danger-active:focus { background: var(--color-background-button-danger-active); }
152
152
 
153
+ .background-color-modal { background: var(--color-background-modal); }
154
+
155
+ .hover\:background-color-modal:hover { background: var(--color-background-modal); }
156
+
157
+ .focus\:background-color-modal:focus { background: var(--color-background-modal); }
158
+
153
159
  .background-color-toast { background: var(--color-background-toast); }
154
160
 
155
161
  .hover\:background-color-toast:hover { background: var(--color-background-toast); }
@@ -270,6 +276,12 @@
270
276
 
271
277
  .focus\:background-color-chart-3:focus { background: var(--color-background-chart-3); }
272
278
 
279
+ .background-color-black { background: var(--color-background-black); }
280
+
281
+ .hover\:background-color-black:hover { background: var(--color-background-black); }
282
+
283
+ .focus\:background-color-black:focus { background: var(--color-background-black); }
284
+
273
285
  .background-color-white { background: var(--color-background-white); }
274
286
 
275
287
  .hover\:background-color-white:hover { background: var(--color-background-white); }
@@ -504,6 +516,12 @@
504
516
 
505
517
  .focus\:font-color-grey:focus { color: var(--color-font-grey); }
506
518
 
519
+ .font-color-black { color: var(--color-font-black); }
520
+
521
+ .hover\:font-color-black:hover { color: var(--color-font-black); }
522
+
523
+ .focus\:font-color-black:focus { color: var(--color-font-black); }
524
+
507
525
  .font-color-white { color: var(--color-font-white); }
508
526
 
509
527
  .hover\:font-color-white:hover { color: var(--color-font-white); }
package/dist/css/variables.css CHANGED
@@ -3,7 +3,7 @@
3
3
  \*********************************************************************************************************************/
4
4
  /**
5
5
  * Do not edit directly
6
- * Generated on Fri, 11 Oct 2024 15:47:07 GMT
6
+ * Generated on Thu, 31 Oct 2024 00:26:05 GMT
7
7
  */
8
8
 
9
9
  :root {
@@ -33,6 +33,7 @@
33
33
  --color-background-button-danger: #ef4444;
34
34
  --color-background-button-danger-hover: #dc2626;
35
35
  --color-background-button-danger-active: #b91c1c;
36
+ --color-background-modal: #ffffff;
36
37
  --color-background-toast: #262626;
37
38
  --color-background-toast-error: #ef4444;
38
39
  --color-background-brand-gradient: linear-gradient(60deg, #eab308 0%, #fa0a64 100%);
@@ -53,6 +54,7 @@
53
54
  --color-background-chart-1: #1d4ed8;
54
55
  --color-background-chart-2: #93c5fd;
55
56
  --color-background-chart-3: #3b82f6;
57
+ --color-background-black: #000000;
56
58
  --color-background-white: #ffffff;
57
59
  --color-base-black: #000000;
58
60
  --color-base-white: #ffffff;
@@ -165,6 +167,7 @@
165
167
  --color-font-secondary: #737373;
166
168
  --color-font-tertiary: #a3a3a3;
167
169
  --color-font-grey: #404040;
170
+ --color-font-black: #000000;
168
171
  --color-font-white: #ffffff;
169
172
  --color-font-inverse: #e5e5e5;
170
173
  --color-font-disabled: #a3a3a3;
@@ -311,7 +314,7 @@
311
314
  \*******************************************************************************************************************************/
312
315
  /**
313
316
  * Do not edit directly
314
- * Generated on Fri, 11 Oct 2024 15:47:07 GMT
317
+ * Generated on Thu, 31 Oct 2024 00:26:05 GMT
315
318
  */
316
319
 
317
320
  :root.dark {
@@ -338,6 +341,7 @@
338
341
  --color-background-button-danger: #ef4444;
339
342
  --color-background-button-danger-hover: #dc2626;
340
343
  --color-background-button-danger-active: #b91c1c;
344
+ --color-background-modal: #262626;
341
345
  --color-background-toast: #f5f5f5;
342
346
  --color-border-default: #525252;
343
347
  --color-border-subtle: #404040;
package/dist/lib/tokens.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import { BorderRadiusSize, Breakpoint, BreakpointSizeWithBase } from '../types';
2
- export declare const ICON_NAMES: ("add" | "alarm-disable" | "alarm" | "analytics" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "arrows-maximize" | "at" | "ban" | "block" | "blocks" | "c-add" | "c-check" | "c-delete" | "c-in-progress" | "c-info" | "c-question" | "c-remove" | "c-warning" | "calendar-create" | "calendar" | "camera" | "caret-down" | "caret-left" | "caret-right" | "caret-sm-down" | "caret-sm-left" | "caret-sm-right" | "caret-sm-up" | "caret-up" | "chart-bar" | "chart-line" | "chat" | "check" | "checkbox-btn-checked" | "checkbox-btn-indeterminate" | "checkbox-btn" | "circle-filled" | "circle" | "clipboard" | "cloud" | "contact" | "copy-document" | "dashboard" | "database" | "document" | "dots" | "download" | "electricity-bolt" | "exclamation-mark" | "eye-slash" | "eye" | "filter" | "flag" | "gear" | "grab" | "hash-mark" | "heart-o" | "heart" | "home" | "info" | "integrations" | "key" | "launch-app" | "lightbulb" | "link" | "list" | "lock" | "logo-env" | "logo-link" | "logo-toggle" | "mail" | "menu" | "minus" | "moon" | "paperclip" | "path-intersect" | "pause" | "pc" | "pencil" | "phone" | "photo" | "play" | "radio-btn-checked" | "radio-btn-unchecked" | "refresh" | "remove" | "rewind" | "search" | "send" | "settings" | "skip" | "stack" | "star-o" | "star" | "stopwatch" | "subtract" | "sun" | "t-warning" | "tag" | "time-alarm" | "time-clock" | "trash" | "unlocked" | "upload" | "user-create" | "user" | "users" | "wifi-off" | "wifi" | "zoom-in" | "zoom-out")[];
2
+ export declare const ICON_NAMES: ("add" | "alarm-disable" | "alarm" | "analytics" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "arrows-maximize" | "at" | "ban" | "block" | "blocks" | "book-open" | "c-add" | "c-check" | "c-delete" | "c-in-progress" | "c-info" | "c-question" | "c-remove" | "c-warning" | "calendar-create" | "calendar" | "camera" | "caret-down" | "caret-left" | "caret-right" | "caret-sm-down" | "caret-sm-left" | "caret-sm-right" | "caret-sm-up" | "caret-up" | "chart-bar" | "chart-line" | "chat" | "check" | "checkbox-btn-checked" | "checkbox-btn-indeterminate" | "checkbox-btn" | "circle-filled" | "circle" | "clipboard" | "cloud" | "contact" | "copy-document" | "dashboard" | "database" | "document" | "dots" | "download" | "electricity-bolt" | "exclamation-mark" | "eye-slash" | "eye" | "filter" | "flag" | "gear" | "grab" | "hash-mark" | "heart-o" | "heart" | "home" | "info" | "integrations" | "key" | "launch-app" | "lightbulb" | "link" | "list" | "lock" | "logo-env" | "logo-link" | "logo-toggle" | "mail" | "menu" | "minus" | "moon" | "paperclip" | "path-intersect" | "pause" | "pc" | "pencil" | "phone" | "photo" | "play" | "radio-btn-checked" | "radio-btn-unchecked" | "refresh" | "remove" | "rewind" | "search" | "send" | "settings" | "skip" | "stack" | "star-o" | "star" | "stopwatch" | "subtract" | "sun" | "t-warning" | "tag" | "terminal" | "time-alarm" | "time-clock" | "trash" | "unlocked" | "upload" | "user-create" | "user" | "users" | "wifi-off" | "wifi" | "zoom-in" | "zoom-out")[];
3
3
  export declare const BORDER_RADIUS_OPTIONS: BorderRadiusSize[];
4
4
  export declare const BORDER_SIZE_OPTIONS: ("0" | "sm" | "md" | "lg")[];
5
5
  export declare const BREAKPOINT_OPTIONS: BreakpointSizeWithBase[];
6
6
  export declare const BREAKPOINTS: Breakpoint[];
7
7
  export declare const BASE_COLOR_OPTIONS: ("black" | "white" | "magenta" | "primary-50" | "primary-100" | "primary-200" | "primary-300" | "primary-400" | "primary-500" | "primary-600" | "primary-700" | "primary-800" | "primary-900" | "green-50" | "green-100" | "green-200" | "green-300" | "green-400" | "green-500" | "green-600" | "green-700" | "green-800" | "green-900" | "blue-50" | "blue-100" | "blue-200" | "blue-300" | "blue-400" | "blue-500" | "blue-600" | "blue-700" | "blue-800" | "blue-900" | "purple-50" | "purple-100" | "purple-200" | "purple-300" | "purple-400" | "purple-500" | "purple-600" | "purple-700" | "purple-800" | "purple-900" | "yellow-50" | "yellow-100" | "yellow-200" | "yellow-300" | "yellow-400" | "yellow-500" | "yellow-600" | "yellow-700" | "yellow-800" | "yellow-900" | "red-50" | "red-100" | "red-200" | "red-300" | "red-400" | "red-500" | "red-600" | "red-700" | "red-800" | "red-900" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-400" | "grey-500" | "grey-600" | "grey-700" | "grey-800" | "grey-900")[];
8
8
  export declare const BASE_COLOR_NAMES: ("black" | "white" | "magenta" | "primary" | "green" | "blue" | "purple" | "yellow" | "red" | "grey")[];
9
- export declare const FONT_COLOR_OPTIONS: ("info" | "base" | "white" | "grey" | "secondary" | "tertiary" | "inverse" | "disabled" | "success" | "success-disabled" | "warn" | "warn-disabled" | "danger" | "danger-input" | "danger-disabled" | "button-primary" | "button-primary-hover" | "button-primary-active" | "button-secondary" | "button-secondary-hover" | "button-secondary-active" | "button-tertiary" | "button-tertiary-hover" | "button-tertiary-active" | "button-danger" | "button-danger-hover" | "button-danger-active" | "toast" | "toast-error" | "placeholder" | "brand-yellow" | "brand-orange" | "brand-magenta" | "brand-dark-grey" | "brand-cyan" | "brand-pink" | "brand-light-purple" | "brand-medium-purple" | "brand-dark-purple")[];
10
- export declare const BACKGROUND_COLOR_OPTIONS: ("info" | "white" | "primary" | "secondary" | "tertiary" | "inverse" | "disabled" | "success" | "danger" | "button-primary" | "button-primary-hover" | "button-primary-active" | "button-secondary" | "button-secondary-hover" | "button-secondary-active" | "button-tertiary" | "button-tertiary-hover" | "button-tertiary-active" | "button-danger" | "button-danger-hover" | "button-danger-active" | "toast" | "toast-error" | "brand-yellow" | "brand-orange" | "brand-magenta" | "brand-dark-grey" | "brand-cyan" | "brand-pink" | "brand-light-purple" | "brand-medium-purple" | "brand-dark-purple" | "error" | "warning" | "transparent" | "brand-gradient" | "brand-gradient-reverse" | "brand-gradient-purple" | "brand-gradient-purple-reverse" | "brand-gradient-cyan" | "brand-gradient-cyan-reverse" | "chart-1" | "chart-2" | "chart-3")[];
9
+ export declare const FONT_COLOR_OPTIONS: ("info" | "base" | "black" | "white" | "grey" | "secondary" | "tertiary" | "inverse" | "disabled" | "success" | "success-disabled" | "warn" | "warn-disabled" | "danger" | "danger-input" | "danger-disabled" | "button-primary" | "button-primary-hover" | "button-primary-active" | "button-secondary" | "button-secondary-hover" | "button-secondary-active" | "button-tertiary" | "button-tertiary-hover" | "button-tertiary-active" | "button-danger" | "button-danger-hover" | "button-danger-active" | "toast" | "toast-error" | "placeholder" | "brand-yellow" | "brand-orange" | "brand-magenta" | "brand-dark-grey" | "brand-cyan" | "brand-pink" | "brand-light-purple" | "brand-medium-purple" | "brand-dark-purple")[];
10
+ export declare const BACKGROUND_COLOR_OPTIONS: ("info" | "black" | "white" | "primary" | "secondary" | "tertiary" | "inverse" | "disabled" | "success" | "danger" | "button-primary" | "button-primary-hover" | "button-primary-active" | "button-secondary" | "button-secondary-hover" | "button-secondary-active" | "button-tertiary" | "button-tertiary-hover" | "button-tertiary-active" | "button-danger" | "button-danger-hover" | "button-danger-active" | "toast" | "toast-error" | "brand-yellow" | "brand-orange" | "brand-magenta" | "brand-dark-grey" | "brand-cyan" | "brand-pink" | "brand-light-purple" | "brand-medium-purple" | "brand-dark-purple" | "error" | "warning" | "transparent" | "modal" | "brand-gradient" | "brand-gradient-reverse" | "brand-gradient-purple" | "brand-gradient-purple-reverse" | "brand-gradient-cyan" | "brand-gradient-cyan-reverse" | "chart-1" | "chart-2" | "chart-3")[];
11
11
  export declare const BORDER_COLOR_OPTIONS: ("info" | "inverse" | "danger" | "button-secondary" | "button-secondary-hover" | "button-secondary-active" | "button-tertiary" | "button-tertiary-hover" | "button-tertiary-active" | "toast" | "toast-error" | "brand-yellow" | "brand-orange" | "brand-magenta" | "brand-dark-grey" | "brand-cyan" | "brand-pink" | "brand-light-purple" | "brand-medium-purple" | "brand-dark-purple" | "warning" | "default" | "subtle" | "hover" | "active")[];
12
12
  export declare const FONT_SIZE_OPTIONS: ("xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "base" | "2xs" | "4xl" | "5xl" | "6xl" | "7xl")[];
13
13
  export declare const FONT_FAMILY_OPTIONS: ("monospace" | "body" | "brand")[];
@@ -17,6 +17,6 @@ export declare const HEIGHT_OPTIONS: ("0" | "xs" | "sm" | "md" | "lg" | "xl" | "
17
17
  export declare const LINE_HEIGHT_OPTIONS: ("base" | "input" | "heading" | "text")[];
18
18
  export declare const SPACING_OPTIONS: ("0" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "2xs" | "4xl" | "5xl" | "auto")[];
19
19
  export declare const WIDTH_OPTIONS: ("0" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "2xs" | "4xl" | "5xl" | "6xl" | "7xl" | "8xl" | "9xl" | "10xl" | "10" | "15" | "20" | "25" | "30" | "33" | "34" | "40" | "50" | "60" | "70" | "75" | "80" | "90" | "100")[];
20
- export declare const Z_INDEX_OPTIONS: ("0" | "popover" | "modal" | "overlay" | "drawer" | "sticky")[];
20
+ export declare const Z_INDEX_OPTIONS: ("0" | "modal" | "popover" | "overlay" | "drawer" | "sticky")[];
21
21
  export declare const Z_INDEX_VALUES: any;
22
22
  export declare const BOX_SHADOW_OPTIONS: ("0" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "2xs")[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hyphen/hyphen-components",
3
- "version": "2.19.2",
3
+ "version": "2.21.0",
4
4
  "license": "MIT",
5
5
  "author": {
6
6
  "name": "@hyphen"
@@ -121,7 +121,7 @@
121
121
  "@rollup/rollup-linux-x64-gnu": "^4.21.2"
122
122
  },
123
123
  "dependencies": {
124
- "@hyphen/hyphen-design-tokens": "^4.11.0",
124
+ "@hyphen/hyphen-design-tokens": "^4.14.0",
125
125
  "@popperjs/core": "^2.11.8",
126
126
  "@types/react-modal": "^3.16.3",
127
127
  "classnames": "^2.5.1",
package/src/components/Modal/Modal.module.scss CHANGED
@@ -58,7 +58,7 @@
58
58
  grid-column: 1;
59
59
  z-index: var(--size-z-index-modal);
60
60
  margin: 0;
61
- background-color: var(--color-background-primary);
61
+ background-color: var(--color-background-modal);
62
62
  padding: 0;
63
63
  width: 100%;
64
64
  border-radius: var(--size-border-radius-md) var(--size-border-radius-md) 0 0;