<commit_before><template>
    <div class="field" :class="[rootClasses, fieldType()]">
        <div
            v-if="horizontal"
            class="field-label is-normal"
            :class="customClass">
            <label
                v-if="label"
                :for="labelFor"
                class="label" >
                {{ label }}
            </label>
        </div>
        <template v-else>
            <label
                v-if="label"
                :for="labelFor"
                :class="customClass"
                class="label">
                {{ label }}
            </label>
        </template>
        <b-field-body
            v-if="horizontal"
            :message="newMessage ? formattedMessage : ''"
            :type="newType">
            <slot/>
        </b-field-body>
        <template v-else>
            <slot/>
        </template>
        <p
            v-if="newMessage && !horizontal"
            v-html="formattedMessage"
            class="help"
            :class="newType"
        />
    </div>
</template>

<script>
    import FieldBody from './FieldBody.vue'

    export default {
        name: 'BField',
        components: {
            'b-field-body': FieldBody
        },
        props: {
            type: String,
            label: String,
            labelFor: String,
            message: [String, Array],
            grouped: Boolean,
            groupMultiline: Boolean,
            position: String,
            expanded: Boolean,
            horizontal: Boolean,
            addons: {
                type: Boolean,
                default: true
            },
            customClass: String
        },
        data() {
            return {
                newType: this.type,
                newMessage: this.message,
                _isField: true // Used internally by Input and Select
            }
        },
        computed: {
            rootClasses() {
                return [this.newPosition, {
                    'is-expanded': this.expanded,
                    'is-grouped-multiline': this.groupMultiline,
                    'is-horizontal': this.horizontal
                }]
            },
            /**
             * Correct Bulma class for the side of the addon or group.
             *
             * This is not kept like the others (is-small, etc.),
             * because since 'has-addons' is set automatically it
             * doesn't make sense to teach users what addons are exactly.
             */
            newPosition() {
                if (this.position === undefined) return

                const position = this.position.split('-')
                if (position.length < 1) return

                const prefix = this.grouped
                    ? 'is-grouped-'
                    : 'has-addons-'

                if (this.position) return prefix + position[1]
            },
            /**
             * Formatted message in case it's an array
             * (each element is separated by <br> tag)
             */
            formattedMessage() {
                if (this.newMessage) {
                    if (Array.isArray(this.newMessage)) {
                        return this.newMessage.filter((value) => {
                            if (value) {
                                return value
                            }
                        }).join(' <br> ')
                    } else {
                        return this.newMessage
                    }
                } else {
                    return this.newMessage
                }
            }
        },
        watch: {
            /**
             * Set internal type when prop change.
             */
            type(value) {
                this.newType = value
            },

            /**
             * Set internal message when prop change.
             */
            message(value) {
                this.newMessage = value
            }
        },
        methods: {
            /**
             * Field has addons if there are more than one slot
             * (element / component) in the Field.
             * Or is grouped when prop is set.
             * Is a method to be called when component re-render.
             */
            fieldType() {
                if (this.grouped) return 'is-grouped'

                let renderedNode = 0
                if (this.$slots.default) {
                    renderedNode = this.$slots.default
                                        .reduce((i, node) => node.tag ? i + 1 : i, 0)
                }
                if (
                    renderedNode > 1 &&
                    this.addons &&
                    !this.horizontal
                ) {
                    return 'has-addons'
                }
            }
        }
    }

</script><commit_msg>Fix #852 check field content when horizontal<commit_after><template>
    <div class="field" :class="[rootClasses, fieldType()]">
        <div
            v-if="horizontal"
            class="field-label"
            :class="[customClass, fieldLabelSize]">
            <label
                v-if="label"
                :for="labelFor"
                class="label" >
                {{ label }}
            </label>
        </div>
        <template v-else>
            <label
                v-if="label"
                :for="labelFor"
                :class="customClass"
                class="label">
                {{ label }}
            </label>
        </template>
        <b-field-body
            v-if="horizontal"
            :message="newMessage ? formattedMessage : ''"
            :type="newType">
            <slot/>
        </b-field-body>
        <template v-else>
            <slot/>
        </template>
        <p
            v-if="newMessage && !horizontal"
            v-html="formattedMessage"
            class="help"
            :class="newType"
        />
    </div>
</template>

<script>
    import FieldBody from './FieldBody.vue'

    export default {
        name: 'BField',
        components: {
            'b-field-body': FieldBody
        },
        props: {
            type: String,
            label: String,
            labelFor: String,
            message: [String, Array],
            grouped: Boolean,
            groupMultiline: Boolean,
            position: String,
            expanded: Boolean,
            horizontal: Boolean,
            addons: {
                type: Boolean,
                default: true
            },
            customClass: String
        },
        data() {
            return {
                newType: this.type,
                newMessage: this.message,
                fieldLabelSize: null,
                _isField: true // Used internally by Input and Select
            }
        },
        computed: {
            rootClasses() {
                return [this.newPosition, {
                    'is-expanded': this.expanded,
                    'is-grouped-multiline': this.groupMultiline,
                    'is-horizontal': this.horizontal
                }]
            },
            /**
             * Correct Bulma class for the side of the addon or group.
             *
             * This is not kept like the others (is-small, etc.),
             * because since 'has-addons' is set automatically it
             * doesn't make sense to teach users what addons are exactly.
             */
            newPosition() {
                if (this.position === undefined) return

                const position = this.position.split('-')
                if (position.length < 1) return

                const prefix = this.grouped
                    ? 'is-grouped-'
                    : 'has-addons-'

                if (this.position) return prefix + position[1]
            },
            /**
             * Formatted message in case it's an array
             * (each element is separated by <br> tag)
             */
            formattedMessage() {
                if (this.newMessage) {
                    if (Array.isArray(this.newMessage)) {
                        return this.newMessage.filter((value) => {
                            if (value) {
                                return value
                            }
                        }).join(' <br> ')
                    } else {
                        return this.newMessage
                    }
                } else {
                    return this.newMessage
                }
            }
        },
        watch: {
            /**
             * Set internal type when prop change.
             */
            type(value) {
                this.newType = value
            },

            /**
             * Set internal message when prop change.
             */
            message(value) {
                this.newMessage = value
            }
        },
        methods: {
            /**
             * Field has addons if there are more than one slot
             * (element / component) in the Field.
             * Or is grouped when prop is set.
             * Is a method to be called when component re-render.
             */
            fieldType() {
                if (this.grouped) return 'is-grouped'

                let renderedNode = 0
                if (this.$slots.default) {
                    renderedNode = this.$slots.default
                                        .reduce((i, node) => node.tag ? i + 1 : i, 0)
                }
                if (
                    renderedNode > 1 &&
                    this.addons &&
                    !this.horizontal
                ) {
                    return 'has-addons'
                }
            }
        },
        mounted() {
            if (this.horizontal) {
                // Bulma docs: .is-normal for any .input or .button
                const elements = this.$el.querySelectorAll('.input, .select, .button, .textarea')
                if (elements.length > 0) {
                    this.fieldLabelSize = 'is-normal'
                }
            }
        }
    }

</script>
{'fraction_non_alphanumeric': 0.09964200477326969, 'fraction_numerical': 0.0015910898965791568, 'mean_word_length': 0.9288454161871883, 'pattern_counts': {'":': 0, '<': 51, '<?xml version=': 0, '>': 56, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4015769', 'n_tokens_mistral': 2477, 'n_tokens_neox': 2326, 'n_words': 587}