text: define(["require", "exports", "../../Styling"], function (require, exports, Styling_1) {
      "use strict";
      Object.defineProperty(exports, "__esModule", { value: true });
      var GlobalClassNames = {
          root: 'ms-BasePicker',
          text: 'ms-BasePicker-text',
          itemsWrapper: 'ms-BasePicker-itemsWrapper',
          input: 'ms-BasePicker-input'
      };
      function getStyles(props) {
          var _a;
          var className = props.className, theme = props.theme, isFocused = props.isFocused, inputClassName = props.inputClassName, disabled = props.disabled;
          if (!theme) {
              throw new Error('theme is undefined or null in base BasePicker getStyles function.');
          }
          var semanticColors = theme.semanticColors, effects = theme.effects, fonts = theme.fonts;
          var inputBorder = semanticColors.inputBorder, inputBorderHovered = semanticColors.inputBorderHovered, inputFocusBorderAlt = semanticColors.inputFocusBorderAlt;
          var classNames = Styling_1.getGlobalClassNames(GlobalClassNames, theme);
          // The following lines are to create a semi-transparent color overlay for the disabled state with designer's approval.
          // @todo: investigate the performance cost of the calculation below and apply if negligible. Replacing with a static color for now.
          // const rgbColor: IRGB | undefined = cssColor(palette.neutralQuaternaryAlt);
          // const disabledOverlayColor = rgbColor ? `rgba(${rgbColor.r}, ${rgbColor.g}, ${rgbColor.b}, 0.29)` : 'transparent';
          var disabledOverlayColor = 'rgba(218, 218, 218, 0.29)';
          return {
              root: [classNames.root, className],
              text: [
                  classNames.text,
                  {
                      display: 'flex',
                      position: 'relative',
                      flexWrap: 'wrap',
                      alignItems: 'center',
                      boxSizing: 'border-box',
                      minWidth: 180,
                      minHeight: 30,
                      border: "1px solid " + inputBorder,
                      borderRadius: effects.roundedCorner2
                  },
                  !isFocused &&
                      !disabled && {
                      selectors: {
                          ':hover': {
                              borderColor: inputBorderHovered
                          }
                      }
                  },
                  isFocused &&
                      !disabled && {
                      borderColor: inputFocusBorderAlt
                  },
                  disabled && {
                      borderColor: 'transparent',
                      selectors: (_a = {
                              ':after': {
                                  content: '""',
                                  position: 'absolute',
                                  top: 0,
                                  right: 0,
                                  bottom: 0,
                                  left: 0,
                                  background: disabledOverlayColor
                              }
                          },
                          _a[Styling_1.HighContrastSelector] = {
                              borderColor: 'GrayText',
                              selectors: {
                                  ':after': {
                                      background: 'none'
                                  }
                              }
                          },
                          _a)
                  }
              ],
              itemsWrapper: [
                  classNames.itemsWrapper,
                  {
                      display: 'flex',
                      flexWrap: 'wrap',
                      maxWidth: '100%'
                  }
              ],
              input: [
                  classNames.input,
                  fonts.medium,
                  {
                      height: 30,
                      border: 'none',
                      flexGrow: 1,
                      outline: 'none',
                      padding: '0 6px 0',
                      alignSelf: 'flex-end',
                      borderRadius: effects.roundedCorner2,
                      backgroundColor: 'transparent',
                      color: semanticColors.inputText
                  },
                  inputClassName
              ],
              screenReaderText: Styling_1.hiddenContentStyle
          };
      }
      exports.getStyles = getStyles;
  });
  //# sourceMappingURL=BasePicker.styles.js.map