"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.UserHintWrapper = exports.StyledSearchField = exports.TreeListWrapper = exports.StyledDialogContent = void 0;
const FormHelperText_1 = require("@mui/material/FormHelperText");
const Dialog_1 = require("../../Dialog");
const DialogContent_1 = require("../../DialogContent");
const SearchField_1 = require("../../SearchField");
const styled_1 = require("../../styled");
const Tree_1 = require("../../Tree");
exports.StyledDialogContent = (0, styled_1.styled)(DialogContent_1.DialogContent, {
    shouldForwardProp: (prop) => !['$size'].includes(prop),
}) `
  display: grid;
  grid-template-columns: 100%;
  grid-template-rows: max-content 1fr;
  gap: ${({ theme }) => theme.spacing(4)};

  width: ${({ $size }) => Dialog_1.DIALOG_SIZES[$size].minWidth};
  height: ${({ $size }) => Dialog_1.DIALOG_SIZES[$size].minWidth};
  
  ${({ theme }) => theme.breakpoints.down('sm')} {
    width: auto;
  }
`;
exports.TreeListWrapper = styled_1.styled.div `
    overflow: auto;

    height: 100%;
  
  & .${Tree_1.treeListClassnames.list} {
    width: auto;
    min-width: max-content;
  }
`;
exports.StyledSearchField = (0, styled_1.styled)(SearchField_1.SearchField) `
  & .${FormHelperText_1.formHelperTextClasses.root} {
    display: flex;

    margin-top: ${({ theme }) => theme.spacing(2)};
    
    color: ${({ theme }) => theme.palette.grey[500]};
  }
`;
exports.UserHintWrapper = styled_1.styled.div `
  display: flex;
  align-items: center;
  justify-content: center;

  height: 36px;
`;
