text: "use strict";
  Object.defineProperty(exports, "__esModule", { value: true });
  exports.useSearchStyles = exports.useButtonStyles = void 0;
  const react_make_styles_1 = require("@fluentui/react-make-styles");
  const index_1 = require("../TextField/index");
  const react_tabster_1 = require("@fluentui/react-tabster");
  exports.useButtonStyles = react_make_styles_1.makeStyles({
      container: (theme) => ({
          position: 'relative',
          height: 'auto',
          width: 'auto',
          display: 'flex',
          justifyContent: 'center',
          alignContent: 'center',
          flexDirection: 'column',
          color: 'black',
          alignItems: 'center',
          whiteSpace: 'nowrap',
          flexShrink: 0,
          padding: '0px 10px',
          boxSizing: 'border-box',
          fontFamily: theme.fonts.fontFamily.base,
          fontSize: '18px',
      }),
      focusIndicator: react_tabster_1.createFocusIndicatorStyleRule((theme) => ({
          '& .pongoai-Search-clear-button': {
              ':after': {
                  top: '0px',
                  right: '0px',
                  bottom: '0px',
                  left: '0px',
                  background: 'black',
                  border: `none`,
                  opacity: '.2',
                  zIndex: '-1',
                  borderRadius: '999px',
              },
          },
      }), { selector: 'focus-within' }),
      icon: {
          '& .pongoai-Search-clear-button': {
              minWidth: '34px',
              height: '34px',
              tabIndex: 1,
          },
      },
      passwordIconVisible: {
          visibility: 'hidden',
      },
      lowerTextAlignment: {
          paddingTop: '15px',
      },
      disabled: (theme) => ({
          color: theme.palette.inheritDisabled,
      }),
  });
  const useSearchStyles = (state) => {
      const rootStyles = index_1.useRootStyles();
      const inputStyles = index_1.useInputStyles();
      const inputWrapperStyles = index_1.useInputWrapperStyles();
      const textFieldBorderStyles = index_1.useTextFieldBorderStyles();
      const labelStyles = index_1.useLabelStyles();
      const textFieldLegendStyles = index_1.useTextFieldLegendStyles();
      const textFieldWrapperStyles = index_1.useTextFieldWrapperStyles();
      const buttonStyles = exports.useButtonStyles();
      const helperTextStyles = index_1.useHelperTextStyles();
      state.root.className = react_make_styles_1.mergeClasses(rootStyles.root, rootStyles.focusIndicator, !state.error && !state.disabled && rootStyles.inputFocus, state.label !== undefined && rootStyles[state.appearance], state.root.className);
      state.input.className = react_make_styles_1.mergeClasses(inputStyles.input, inputStyles.suffix, inputStyles.prefix, (state.appearance === 'filled' || state.appearance === 'standard') && inputStyles.lowerTextAlignment, state.disabled && inputStyles.disabled, state.input.className);
      state.searchIconWrapper.className = react_make_styles_1.mergeClasses(buttonStyles.container, (state.appearance === 'filled' || state.appearance === 'standard') && inputStyles.lowerTextAlignment, state.disabled && buttonStyles.disabled, state.searchIconWrapper.className);
      state.clearIconWrapper.className = react_make_styles_1.mergeClasses(buttonStyles.container, (state.appearance === 'filled' || state.appearance === 'standard') && buttonStyles.lowerTextAlignment, state.disabled && buttonStyles.disabled, buttonStyles.focusIndicator, buttonStyles.icon, state.clearIconWrapper.className);
      state.textFieldWrapper.className = react_make_styles_1.mergeClasses(textFieldWrapperStyles.wrapper, state.textFieldWrapper.className);
      state.textFieldHelperText.className = react_make_styles_1.mergeClasses(helperTextStyles.helperText, state.disabled ? helperTextStyles.disabled : helperTextStyles.enabled, state.error && helperTextStyles.error, state.textFieldHelperText.className);
      state.inputWrapper.className = react_make_styles_1.mergeClasses(inputWrapperStyles.inputWrapper, state.inputWrapper.className);
      state.textFieldBorder.className = react_make_styles_1.mergeClasses(index_1.textFieldBorderClassName, textFieldBorderStyles.textFieldBorder, textFieldBorderStyles[state.appearance], state.disabled && textFieldBorderStyles.disabled, state.error && textFieldBorderStyles.error, state.textFieldBorder.className);
      state.textFieldLabel.className = react_make_styles_1.mergeClasses(index_1.labelClassName, labelStyles.label, !state.disabled ? labelStyles.enabled : labelStyles.disabled, state.error && labelStyles.error, state.label !== undefined ? labelStyles[state.appearance] : labelStyles.placeholder, state.textFieldLabel.className);
      state.textFieldLegend.className = react_make_styles_1.mergeClasses(index_1.legendClassName, textFieldLegendStyles.textFieldLegend, textFieldLegendStyles.active, state.textFieldLegend.className);
  };
  exports.useSearchStyles = useSearchStyles;
  //# sourceMappingURL=useSearchStyles.js.map