{"version":3,"sources":["dropdown-menu/dropdown-menu.scss","dropdown-menu/_variables.scss","dropdown-menu/dropdown-menu-title.scss","dropdown-menu/dropdown-menu-item.scss","dropdown-menu/dropdown-menu-option.scss"],"names":[],"mappings":"AAEA,uBACE,wBAAA,CAAA,qBAAA,CAAA,oBAAA,CAAA,gBAAA,CAEA,4BAIE,kECJ6B,CDK7B,kFCHuB,CDGvB,0ECHuB,CDAvB,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,uCCJmB,CDEnB,iBCCuB,CDKvB,oCACE,uCCPkB,CCJxB,6BAEE,kBAAA,CACA,wBAAA,CAAA,qBAAA,CACA,uBAAA,CAAA,oBAAA,CADA,0BAAA,CAAA,kBAAA,CAGA,cAAA,CALA,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,cAAA,CAAA,UAAA,CAAA,MAAA,CAEA,8BAAA,CAAA,sBAAA,CACA,WACA,CAEA,oCACE,0EDEiC,CCEjC,8CACE,SAAA,CAGF,6EACE,qEDL+B,CCUjC,2EACE,oFDZ6B,CCc7B,iFACE,kEAAA,CAMJ,+EACE,eAAA,CACA,gCAAA,CAAA,4BAAA,CAAA,wBAAA,CAIJ,sCAEE,6BAAA,CAAA,qBAAA,CAKA,8EDtCwB,CCoCxB,mDDrC4B,CCsC5B,6EDnC8B,CCgC9B,cAAA,CACA,mEDlC0B,CC+B1B,iBDhCwB,CCwCxB,4CAME,gBAAA,CAEA,oFAAA,CAHA,UAAA,CADA,gBAAA,CAKA,UAAA,CARA,iBAAA,CAEA,UAAA,CADA,OAAA,CAQA,gCAAA,CAAA,4BAAA,CAAA,wBAAA,CC1DN,4BAGE,MAAA,CAEA,eAAA,CAJA,cAAA,CACA,OAAA,CAEA,oFACA,CAEA,kCACE,aAAA,CACA,mBAAA,CAGF,gCACE,KAAA,CAGF,kCACE,QAAA,CAGF,qCAGE,kHFN4C,CEM5C,0GFN4C,CEK5C,2DFNoC,CEKpC,iBFJ4C,CGjBhD,8BACE,eAAA,CAKE,gHACE,qFHY8B,CGRlC,oCACE,aAAA,CACA,mBAAA","file":"index.css","sourcesContent":["@import \"./variables\";\n\n.#{$component-prefix}dropdown-menu {\n  user-select: none;\n\n  &__bar {\n    position: relative;\n    display: flex;\n    height: $dropdown-menu-height;\n    background: $dropdown-menu-background-color;\n    box-shadow: $dropdown-menu-box-shadow;\n\n    &--opened {\n      z-index: $dropdown-menu-z-index;\n    }\n  }\n}\n","@import \"../styles/prefix\";\n@import \"../styles/variables\";\n\n// dropdown-menu\n$dropdown-menu-height: var(--dropdown-menu-height, 48px * $hd);\n$dropdown-menu-background-color: var(--dropdown-menu-background-color, var(--white, $white));\n$dropdown-menu-z-index: var(--dropdown-menu-z-index, 11);\n$dropdown-menu-box-shadow: var(--dropdown-menu-box-shadow, 0 2px * $hd 12px * $hd rgba(100, 101, 102, 0.12));\n// dropdown-menu title\n$dropdown-menu-title-font-size: var(--dropdown-menu-title-font-size, 15px * $hd);\n$dropdown-menu-title-color: var(--dropdown-menu-title-color, var(--text-color, $text-color));\n$dropdown-menu-title-padding: var(--dropdown-menu-title-padding, 0 var(--padding-xs, $padding-xs));\n$dropdown-menu-title-line-height: var(--dropdown-menu-title-line-height, var(--line-height-lg, $line-height-lg));\n$dropdown-menu-title-active-opacity: var(--dropdown-menu-title-active-opacity, var(--active-opacity, $active-opacity));\n$dropdown-menu-title-active-color: var(--dropdown-menu-title-active-color, var(--danger-color, $danger-color));\n$dropdown-menu-title-disabled-color: var(--dropdown-menu-title-disabled-color, var(--gray-6, $gray-6));\n//\n$dropdown-menu-item-z-index: var(--dropdown-menu-item-z-index, calc(#{$dropdown-menu-z-index} - 1));\n$dropdown-menu-item-content-max-height: var(--dropdown-menu-item-content-max-height, 80%);\n$dropdown-menu-item-content-animation-duration: var(--dropdown-menu-item-content-animation-duration, var(--animation-duration-fast, $animation-duration-fast));\n//\n$dropdown-menu-option-active-color: var(--dropdown-menu-option-active-color, var(--danger-color, $danger-color));\n","@import \"./variables\";\n\n.#{$component-prefix}dropdown-menu-title {\n  display: flex;\n  flex: 1;\n  align-items: center;\n  justify-content: center;\n  min-width: 0; // hack for flex ellipsis\n  cursor: pointer;\n\n  &:active {\n    opacity: $dropdown-menu-title-active-opacity;\n  }\n\n  &--disabled {\n    &:active {\n      opacity: 1;\n    }\n\n    .#{$component-prefix}dropdown-menu-title__content {\n      color: $dropdown-menu-title-disabled-color;\n    }\n  }\n\n  &--active {\n    .#{$component-prefix}dropdown-menu-title__content {\n      color: $dropdown-menu-title-active-color;\n\n      &::after {\n        border-color: transparent transparent currentColor currentColor;\n      }\n    }\n  }\n\n  &--down {\n    .#{$component-prefix}dropdown-menu-title__content::after {\n      margin-top: -1px * $hd;\n      transform: rotate(135deg);\n    }\n  }\n\n  &__content {\n    position: relative;\n    box-sizing: border-box;\n    max-width: 100%;\n    padding: $dropdown-menu-title-padding;\n    font-size: $dropdown-menu-title-font-size;\n    line-height: $dropdown-menu-title-line-height;\n    color: $dropdown-menu-title-color;\n\n    &::after {\n      position: absolute;\n      top: 50%;\n      right: -4px * $hd;\n      margin-top: -5px * $hd;\n      content: '';\n      border: 3px * $hd solid;\n      // TODO Use scss vars\n      border-color: transparent transparent var(--gray-4, $gray-4) var(--gray-4, $gray-4);\n      opacity: 0.8;\n      transform: rotate(-45deg);\n    }\n  }\n}\n","@import \"./variables\";\n\n.#{$component-prefix}dropdown-menu-item {\n  position: fixed;\n  right: 0;\n  left: 0;\n  z-index: $dropdown-menu-item-z-index;\n  overflow: hidden;\n\n  &__icon {\n    display: block;\n    line-height: inherit;\n  }\n\n  &--up {\n    top: 0;\n  }\n\n  &--down {\n    bottom: 0;\n  }\n\n  &__content {\n    position: absolute;\n    max-height: $dropdown-menu-item-content-max-height;\n    animation-duration: $dropdown-menu-item-content-animation-duration;\n  }\n}\n","@import \"./variables\";\n\n.#{$component-prefix}dropdown-menu-option {\n  text-align: left;\n\n  &--active {\n    color: $dropdown-menu-option-active-color;\n\n    .#{$component-prefix}dropdown-menu-option__icon {\n      color: $dropdown-menu-option-active-color;\n    }\n  }\n\n  &__icon {\n    display: block;\n    line-height: inherit;\n  }\n\n}\n"]}