<commit_before>import View from '!view!./hover.html?style=./hover.styl';
import { Api } from 'game-jolt-frontend-lib/components/api/api.service';
import { Screen } from 'game-jolt-frontend-lib/components/screen/screen-service';
import Vue from 'vue';
import { Component, Prop, Watch } from 'vue-property-decorator';
import { AppPopper } from '../../../popper/popper';
import { User } from '../../user.model';
import { AppUserCard } from '../card';

@View
@Component({
	components: {
		AppPopper,
		AppUserCard,
	},
})
export class AppUserCardHover extends Vue {
	@Prop(User)
	user?: User;

	@Prop(Boolean)
	block?: boolean;

	isShowing = false;
	isLoaded = false;

	get isDisabled() {
		return Screen.isXs || GJ_IS_CLIENT;
	}

	get shouldShow() {
		return !!this.user && this.isShowing;
	}

	get component() {
		return this.isDisabled ? 'span' : AppPopper;
	}

	get componentProps() {
		return this.isDisabled
			? {}
			: {
					placement: 'top',
					trigger: 'hover',
					delay: { show: 500, hide: 0 },
					openGroup: 'user-card-hover',
					block: this.block,
			  };
	}

	get componentOn() {
		return this.isDisabled
			? {}
			: {
					show: () => this.onShow(),
					hide: () => this.onHide(),<commit_msg>Make all user card hovers block-level.<commit_after>import View from '!view!./hover.html?style=./hover.styl';
import { Api } from 'game-jolt-frontend-lib/components/api/api.service';
import { Screen } from 'game-jolt-frontend-lib/components/screen/screen-service';
import Vue from 'vue';
import { Component, Prop, Watch } from 'vue-property-decorator';
import { AppPopper } from '../../../popper/popper';
import { User } from '../../user.model';
import { AppUserCard } from '../card';

@View
@Component({
	components: {
		AppPopper,
		AppUserCard,
	},
})
export class AppUserCardHover extends Vue {
	@Prop(User)
	user?: User;

	isShowing = false;
	isLoaded = false;

	get isDisabled() {
		return Screen.isXs || GJ_IS_CLIENT;
	}

	get shouldShow() {
		return !!this.user && this.isShowing;
	}

	get component() {
		return this.isDisabled ? 'span' : AppPopper;
	}

	get componentProps() {
		return this.isDisabled
			? {}
			: {
					placement: 'top',
					trigger: 'hover',
					delay: { show: 500, hide: 0 },
					openGroup: 'user-card-hover',
					block: true,
			  };
	}

	get componentOn() {
		return this.isDisabled
			? {}
			: {
					show: () => this.onShow(),
					hide: () => this.onHide(),
{'fraction_non_alphanumeric': 0.17039800995024876, 'fraction_numerical': 0.003316749585406302, 'mean_word_length': 3.240773286467487, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3292832', 'n_tokens_mistral': 945, 'n_tokens_neox': 839, 'n_words': 191}