All files / ext.wikilambda.edit/components/default-view-types ZFunctionCall.vue

100% Statements 18/18
100% Branches 4/4
100% Functions 5/5
100% Lines 18/18

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 8725x 25x 25x 25x     25x                           7x                     13x               13x       25x   25x     25x 25x 25x       13x 13x 13x             1x     25x                                        
<!--
	WikiLambda Vue component for Z7/Function Call objects.
 
	@copyright 2020– Abstract Wikipedia team; see AUTHORS.txt
	@license MIT
-->
<template>
	<div class="ext-wikilambda-function-call">
		<cdx-icon
			:icon="icon"
			:class="iconClass"
		></cdx-icon>
		<wl-z-object-to-string
			:row-id="rowId"
			data-testid="z-object-to-string"
			@expand="$emit( 'expand', true )"
		></wl-z-object-to-string>
	</div>
</template>
 
<script>
const CdxIcon = require( '@wikimedia/codex' ).CdxIcon,
	ZObjectToString = require( './ZObjectToString.vue' ),
	icons = require( '../../../lib/icons.json' ),
	mapGetters = require( 'vuex' ).mapGetters;
 
// @vue/component
module.exports = exports = {
	name: 'wl-z-function-call',
	components: {
		'wl-z-object-to-string': ZObjectToString,
		'cdx-icon': CdxIcon
	},
	props: {
		rowId: {
			type: Number,
			required: false,
			default: 0
		}
	},
	data: function () {
		return {
			icon: icons.cdxIconFunction
		};
	},
	computed: $.extend( mapGetters( [
		'getZFunctionCallFunctionId'
	] ), {
		/**
		 * Returns the value of the function call or undefined
		 *
		 * @return {string|undefined}
		 */
		value: function () {
			return this.getZFunctionCallFunctionId( this.rowId );
		},
		/**
		 * Returns a special class name when the function call is undefined
		 *
		 * @return {string}
		 */
		iconClass: function () {
			return !this.value ? 'ext-wikilambda-function-call-undefined' : '';
		}
	} )
};
</script>
 
<style lang="less">
@import '../../ext.wikilambda.edit.variables.less';
 
.ext-wikilambda-function-call {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	gap: @spacing-25;
 
	.cdx-icon {
		color: @color-progressive;
 
		&.ext-wikilambda-function-call-undefined {
			color: @color-error;
		}
	}
}
</style>