Merge branch 'release/0.21.9'

src/classes/api/endpoints/class-tainacan-rest-background-processes-controller.php

@@ -192,8 +192,8 @@ class REST_Background_Processes_Controller extends REST_Controller {
         $process_type = '';
         if (isset($request['search'])) {
             $name = $request['search'];
-            $process_type = "AND name LIKE '%$name%'";
+            $search_term_like = '%' . $wpdb->esc_like($name) . '%';
-            $process_type = $wpdb->prepare($process_type);
+            $process_type = $wpdb->prepare("AND name LIKE %s", $search_term_like);
         }
 
 		$recent_q = '';

src/classes/entities/class-tainacan-item.php

@@ -587,6 +587,7 @@ class Item extends Entity {
 			'metadatum_index'		=> null
 		);
 		$args = wp_parse_args($args, $defaults);
+		
 		$item_metadata = array();
 		
 		// If a single metadata is passed, we use it instead of fetching more
@@ -749,6 +750,13 @@ class Item extends Entity {
 		);
 		$args = wp_parse_args($args, $defaults);
 
+		/**
+		 * Filter the arguments passed to the get_item_metadatum_as_html function
+		 * @param array $args The arguments passed to the function
+		 * @param object $metadata_section The Item Metadatum object
+		 */
+		$args = apply_filters( 'tainacan-get-item-metadatum-as-html-filter-args', $args, $item_metadatum );
+
 		if ($item_metadatum->has_value() || !$args['hide_empty']) {
 
 			// Gets the metadata type object to use it if we need the slug
@@ -1230,6 +1238,13 @@ class Item extends Entity {
 		);
 		$args = wp_parse_args($args, $defaults);
 
+		/**
+		 * Filter the arguments passed to the get_metadata_section_as_html function
+		 * @param array $args The arguments passed to the function
+		 * @param object $metadata_section The Metadata Section object
+		 */
+		$args = apply_filters( 'tainacan-get-metadata-section-as-html-filter-args', $args, $metadata_section );
+
 		// Gets the metadata section inner metadata list
 		$metadata_section_metadata_list = $metadata_section->get_metadata_object_list();
 		$has_metadata_list = (is_array($metadata_section_metadata_list) && count($metadata_section_metadata_list) > 0 );

src/classes/repositories/class-tainacan-filters.php

@@ -107,7 +107,7 @@ class Filters extends Repository {
 				'map'         => 'meta',
 				'title'       => __( 'Max of options', 'tainacan' ),
 				'type'        => ['integer', 'string'],
-				'description' => __( 'The max number of options to be showed in filter sidebar.', 'tainacan' ),
+				'description' => __( 'The maximum number of options to be loaded by default on the filter.', 'tainacan' ),
 				'validation'  => '',
 				'default'     => 4
 			],

src/classes/tainacan-creator.php

@@ -111,7 +111,7 @@ function tainacan_autoload($class_name) {
 		}
 
 		if( in_array('Metadata_Types', $class_path) || in_array('Filter_Types', $class_path) ){
-			$exceptions = ['taxonomytaginput','taxonomycheckbox'];
+			$exceptions = ['taxonomytaginput','taxonomycheckbox','taxonomyselectbox'];
 			if( in_array( strtolower( $class_name ), $exceptions) ){
 				$dir.= 'taxonomy/';
 			}else{

src/readme.txt

@@ -4,7 +4,7 @@ Tags: museums, archives, GLAM, collections, repository
 Requires at least: 5.9
 Tested up to: 6.6
 Requires PHP: 7.0
-Stable tag: 0.21.8
+Stable tag: 0.21.9
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-3.0.html
 

src/tainacan.php

@@ -5,17 +5,17 @@ Plugin URI: https://tainacan.org/
 Description: Open source, powerful and flexible repository platform for WordPress. Manage and publish you digital collections as easily as publishing a post to your blog, while having all the tools of a professional repository platform.
 Author: Tainacan.org
 Author URI: https://tainacan.org/
-Version: 0.21.8
+Version: 0.21.9
 Requires at least: 5.9
 Tested up to: 6.6
 Requires PHP: 7.0
-Stable tag: 0.21.8
+Stable tag: 0.21.9
 Text Domain: tainacan
 License: GPLv2 or later
 License URI: http://www.gnu.org/licenses/gpl-3.0.html
 */
 
-const TAINACAN_VERSION = '0.21.8';
+const TAINACAN_VERSION = '0.21.9';
 
 defined( 'ABSPATH' ) or die( 'No script kiddies please!' );
 $TAINACAN_BASE_URL = plugins_url('', __FILE__);

src/views/admin/components/edition/filter-edition-form.vue

@@ -179,7 +179,8 @@
                             v-model="form.max_options"
                             name="max_options"
                             type="number"
-                            step="1" />
+                            step="1"
+                            :max="maxOptionsLimit" />
                     <button
                             class="button is-white is-pulled-right"
                             @click.prevent="showEditMaxOptions = false">
@@ -327,7 +328,8 @@ export default {
             closedByForm: false,
             showEditMaxOptions: false,
             entityName: 'filter',
-            isLoading: false
+            isLoading: false,
+            maxOptionsLimit: tainacan_plugin.api_max_items_per_page && !isNaN(tainacan_plugin.api_max_items_per_page) ? Number(tainacan_plugin.api_max_items_per_page) : 96
         }
     },
     created() {

src/views/admin/components/edition/item-edition-form.vue

@@ -416,45 +416,45 @@
                                                         :message="metadataSection.description" />
                                             </span>
                                         </div>
-                                        <transition name="filter-item">
+                                        <div 
-                                            <div 
+                                                v-show="((metadataSectionCollapses[sectionIndex] || isMetadataNavigation) && !isSectionHidden(metadataSection.id))"
-                                                    v-show="(metadataSectionCollapses[sectionIndex] || isMetadataNavigation) && !isSectionHidden(metadataSection.id)"
+                                                class="metadata-section-metadata-list"
-                                                    class="metadata-section-metadata-list">
+                                                :class="((metadataSectionCollapses[sectionIndex] || isMetadataNavigation) && !isSectionHidden(metadataSection.id)) ? '' : 'is-section-content-hidden'">
-                                                <p
+                                            <p
-                                                        v-if="metadataSection.description && metadataSection.description_bellow_name == 'yes'"
+                                                    v-if="metadataSection.description && metadataSection.description_bellow_name == 'yes'"
-                                                        class="metadata-section-description-help-info metadatum-description-help-info">
+                                                    class="metadata-section-description-help-info metadatum-description-help-info">
-                                                    {{ metadataSection.description }}
+                                                {{ metadataSection.description }}
-                                                </p>
+                                            </p>
+
+                                            <template 
+                                                    v-for="(itemMetadatum, index) of itemMetadata"
+                                                    :key="index">
+                                                <tainacan-form-item
+                                                        v-if="itemMetadatum.metadatum.metadata_section_id == metadataSection.id"
+                                                        v-show="(!showOnlyRequiredMetadata || itemMetadatum.metadatum.required === 'yes') && (metadataNameFilterString == '' || filterByMetadatumName(itemMetadatum))"
+                                                        :id="'metadatum-index--' + index"      
+                                                        :ref="'tainacan-form-item--' + index"
+                                                        :class="{ 'is-metadata-navigation-active': isMetadataNavigation }"
+                                                        :item-metadatum="itemMetadatum"
+                                                        :metadata-name-filter-string="metadataNameFilterString"
+                                                        :is-collapsed="metadataCollapses[index]"
+                                                        :hide-collapses="$adminOptions.hideItemEditionCollapses || isMetadataNavigation || (collection && collection.item_enable_metadata_collapses === 'no')"
+                                                        :hide-metadata-types="hideMetadataTypes"
+                                                        :hide-help-buttons="false"
+                                                        :help-info-bellow-label="false"
+                                                        :is-mobile-screen="isMobileScreen"
+                                                        :enumerate-metadatum="metadataSections.length > 1 && collection && collection.item_enable_metadata_enumeration === 'yes' ? ( (Number(sectionIndex) + 1) + '.' + (Number(getMetadatumOrderInSection(sectionIndex, itemMetadatum.metadatum)) + 1) ) : false"
+                                                        :is-last-metadatum="index > 2 && (index == itemMetadata.length - 1)"
+                                                        :is-focused="focusedMetadatum === index"
+                                                        :is-metadata-navigation="isMetadataNavigation"
+                                                        @input="updateItemMetadataValue"
+                                                        @change-collapse="onChangeCollapse($event, index)"
+                                                        @touchstart="isMetadataNavigation ? setMetadatumFocus({ index: index, scrollIntoView: false }): ''"
+                                                        @mousedown="isMetadataNavigation ? setMetadatumFocus({ index: index, scrollIntoView: false }) : ''"
+                                                        @mobile-special-focus="setMetadatumFocus({ index: index, scrollIntoView: true })" />
+                                            </template>
+                                        </div>
                                     
-                                                <template 
-                                                        v-for="(itemMetadatum, index) of itemMetadata"
-                                                        :key="index">
-                                                    <tainacan-form-item
-                                                            v-if="itemMetadatum.metadatum.metadata_section_id == metadataSection.id"
-                                                            v-show="(!showOnlyRequiredMetadata || itemMetadatum.metadatum.required === 'yes') && (metadataNameFilterString == '' || filterByMetadatumName(itemMetadatum))"
-                                                            :id="'metadatum-index--' + index"      
-                                                            :ref="'tainacan-form-item--' + index"
-                                                            :class="{ 'is-metadata-navigation-active': isMetadataNavigation }"
-                                                            :item-metadatum="itemMetadatum"
-                                                            :metadata-name-filter-string="metadataNameFilterString"
-                                                            :is-collapsed="metadataCollapses[index]"
-                                                            :hide-collapses="$adminOptions.hideItemEditionCollapses || isMetadataNavigation || (collection && collection.item_enable_metadata_collapses === 'no')"
-                                                            :hide-metadata-types="hideMetadataTypes"
-                                                            :hide-help-buttons="false"
-                                                            :help-info-bellow-label="false"
-                                                            :is-mobile-screen="isMobileScreen"
-                                                            :enumerate-metadatum="metadataSections.length > 1 && collection && collection.item_enable_metadata_enumeration === 'yes' ? ( (Number(sectionIndex) + 1) + '.' + (Number(getMetadatumOrderInSection(sectionIndex, itemMetadatum.metadatum)) + 1) ) : false"
-                                                            :is-last-metadatum="index > 2 && (index == itemMetadata.length - 1)"
-                                                            :is-focused="focusedMetadatum === index"
-                                                            :is-metadata-navigation="isMetadataNavigation"
-                                                            @input="updateItemMetadataValue"
-                                                            @change-collapse="onChangeCollapse($event, index)"
-                                                            @touchstart="isMetadataNavigation ? setMetadatumFocus({ index: index, scrollIntoView: false }): ''"
-                                                            @mousedown="isMetadataNavigation ? setMetadatumFocus({ index: index, scrollIntoView: false }) : ''"
-                                                            @mobile-special-focus="setMetadatumFocus({ index: index, scrollIntoView: true })" />
-                                                </template>
-                                            </div>
-                                        </transition>
                                     </div>
 
                                     <!-- Hook for extra Form options -->
@@ -1696,13 +1696,10 @@ export default {
 
         },
         onChangeCollapse(event, index) {
-            if (event && !this.metadataCollapses[index] && this.itemMetadata[index].metadatum && this.itemMetadata[index].metadatum['metadata_type'] === "Tainacan\\Metadata_Types\\GeoCoordinate")
-                this.$emitter.emit('itemEditionFormResize');
-                
             this.metadataCollapses.splice(index, 1, event);
         },
         toggleMetadataSectionCollapse(sectionIndex) {
-            if (!this.isMetadataNavigation) 
+            if ( !this.isMetadataNavigation ) 
                 Object.assign( this.metadataSectionCollapses, { [sectionIndex]: (this.formErrorMessage ? true : !this.metadataSectionCollapses[sectionIndex]) });
         },
         onDeletePermanently() {

src/views/admin/components/filter-types/filter-type-helper/class-tainacan-filter-type-helper.php

@@ -42,6 +42,7 @@ class Filter_Type_Helper {
 		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\Numeric_Interval');
 		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\TaxonomyTaginput');
 		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\TaxonomyCheckbox');
+		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\TaxonomySelectbox');
 		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\Numeric_List_Interval');
 		$this->Tainacan_Filters->register_filter_type('Tainacan\Filter_Types\Numerics_Intersection');
 

src/views/admin/components/filter-types/selectbox/TainacanFilterSelectbox.vue

@@ -1,21 +1,20 @@
 <template>
-    <div 
+    <div class="block">
-            :class="{ 'skeleton': isLoadingOptions }"
-            class="block">
         <b-select
-                v-if="!isLoadingOptions"
+                :loading="isLoadingOptions"
+                :disabled="!isLoadingOptions && options.length <= 0"
                 :model-value="selected"
                 :aria-labelledby="'filter-label-id-' + filter.id"
                 :placeholder="filter.placeholder ? filter.placeholder : $i18n.get('label_selectbox_init')"
                 expanded
                 @update:model-value="($event) => { resetPage(); onSelect($event) }">
             <option value="">
-                {{ $i18n.get('label_selectbox_init') }}...
+                {{ filter.placeholder ? filter.placeholder : $i18n.get('label_selectbox_init') }}
             </option>
             <option
                     v-for="(option, index) in options"
                     :key="index"
-                    :label="option.label"
+                    :label="option.label + ( option.total_items ? (' (' + option.total_items + ')') : '' )"
                     :value="option.value">
                 {{ option.label }}
                 <span 
@@ -76,7 +75,9 @@
                 promise = this.getValuesPlainText({
                     metadatumId: this.metadatumId,
                     search: null,
-                    isRepositoryLevel: this.isRepositoryLevel
+                    isRepositoryLevel: this.isRepositoryLevel,
+                    number: this.filter.max_options,
+                    offset: 0
                 });
                 promise.request
                     .then((res) => {

src/views/admin/components/filter-types/selectbox/class-tainacan-selectbox.php

@@ -12,7 +12,7 @@ class Selectbox extends Filter_Type {
         $this->set_name( __('Select Box', 'tainacan') );
         $this->set_supported_types(['string', 'long_string']);
         $this->set_component('tainacan-filter-selectbox');
-        $this->set_use_max_options(false);
+        $this->set_use_max_options(true);
         $this->set_preview_template('
             <div>
                 <div class="control is-expanded">

src/views/admin/components/filter-types/tainacan-filter-item.vue

@@ -138,6 +138,7 @@
             TainacanFilterTaginput: defineAsyncComponent(() => import('./taginput/TainacanFilterTaginput.vue')),
             TainacanFilterTaxonomyCheckbox: defineAsyncComponent(() => import('./taxonomy/TainacanFilterCheckbox.vue')),
             TainacanFilterTaxonomyTaginput: defineAsyncComponent(() => import('./taxonomy/TainacanFilterTaginput.vue')),
+            TainacanFilterTaxonomySelectbox: defineAsyncComponent(() => import('./taxonomy/TainacanFilterSelectbox.vue')),
             TainacanFilterDateInterval: defineAsyncComponent(() => import('./date-interval/TainacanFilterDateInterval.vue')),
             TainacanFilterDatesIntersection: defineAsyncComponent(() => import('./dates-intersection/TainacanFilterDatesIntersection.vue')),
             TainacanFilterNumericInterval: defineAsyncComponent(() => import('./numeric-interval/TainacanFilterNumericInterval.vue')),

src/views/admin/components/filter-types/taxonomy/TainacanFilterSelectbox.vue

@@ -0,0 +1,210 @@
+<template>
+    <div class="block">
+        <b-select
+                :loading="isLoadingOptions"
+                :disabled="!isLoadingOptions && options.length <= 0"
+                :model-value="selected"
+                :aria-labelledby="'filter-label-id-' + filter.id"
+                :placeholder="filter.placeholder ? filter.placeholder : $i18n.get('label_selectbox_init')"
+                expanded
+                @update:model-value="($event) => { resetPage(); onSelect($event) }">
+            <option value="">
+                {{ filter.placeholder ? filter.placeholder : $i18n.get('label_selectbox_init') }}
+            </option>
+            <option
+                    v-for="(option, index) in options"
+                    :key="index"
+                    :label="option.label + ( option.total_items ? (' (' + option.total_items + ')') : '' )"
+                    :value="option.value">
+                <span 
+                        v-if="option.total_items != undefined"
+                        class="has-text-gray">{{ "(" + option.total_items + ")" }}</span>  
+            </option>
+        </b-select>
+    </div>
+</template>
+
+<script>
+    import qs from 'qs';
+    import { tainacanApi, CancelToken, isCancel } from '../../../js/axios';
+    import { mapGetters } from 'vuex';
+    import { filterTypeMixin } from '../../../js/filter-types-mixin';
+    
+    export default {
+        mixins: [ filterTypeMixin ],
+        emits: [
+            'input',
+            'update-parent-collapse'
+        ],
+        data(){
+            return {
+                isLoadingOptions: false,
+                getOptionsValuesCancel: undefined,
+                selected: '',
+                options: [],
+                taxonomy: '',
+                taxonomyId: ''
+            }
+        },
+        computed: {
+            ...mapGetters('search', {
+                'facetsFromItemSearch': 'getFacets'
+            }),
+        },
+        watch: {
+            facetsFromItemSearch: {
+                handler() {
+                    if (this.isUsingElasticSearch)
+                        this.loadOptions();
+                },
+                immediate: true,
+                deep:true
+            }, 
+            isLoadingItems: {
+                handler() {
+                    if ( this.isUsingElasticSearch )
+                        this.isLoadingOptions = this.isLoadingItems;
+                },
+                immediate: true
+            },
+            'query': {
+                handler() {
+                    this.updateSelectedValues();
+                },
+                deep: true
+            }
+        },
+        mounted() {
+            if (!this.isUsingElasticSearch)
+                this.loadOptions(); 
+        },
+        created() {
+            if (this.filter.metadatum && 
+                this.filter.metadatum.metadata_type_object && 
+                this.filter.metadatum.metadata_type_object.options &&
+                this.filter.metadatum.metadata_type_object.options.taxonomy &&
+                this.filter.metadatum.metadata_type_object.options.taxonomy_id
+            ) {
+                this.taxonomyId = this.filter.metadatum.metadata_type_object.options.taxonomy_id;
+                this.taxonomy = this.filter.metadatum.metadata_type_object.options.taxonomy;
+            }
+
+            this.$eventBusSearchEmitter.on('hasToReloadFacets', this.reloadOptions);
+        },
+        beforeUnmount() {
+                        
+            // Cancels previous Request
+            if (this.getOptionsValuesCancel != undefined)
+                this.getOptionsValuesCancel.cancel('Facet search Canceled.');
+
+            this.$eventBusSearchEmitter.off('hasToReloadFacets', this.reloadOptions); 
+        },
+        methods: {
+            reloadOptions(shouldReload) {
+                if ( !this.isUsingElasticSearch && shouldReload )
+                    this.loadOptions();
+            },
+            loadOptions() {
+                if (!this.isUsingElasticSearch) {
+                    let promise = null;
+                    const source = CancelToken.source();
+
+                    // Cancels previous Request
+                    if (this.getOptionsValuesCancel != undefined)
+                        this.getOptionsValuesCancel.cancel('Facet search Canceled.');
+
+                    this.isLoadingOptions = true;
+                    let query_items = { 'current_query': this.query };
+
+                    let route = '';
+                    
+                    if (this.isRepositoryLevel)
+                        route = `/facets/${this.metadatumId}?getSelected=1&order=asc&parent=0&number=${this.filter.max_options}&` + qs.stringify(query_items);
+                    else {
+                        if (this.filter.collection_id == 'default' && this.currentCollectionId)
+                            route = `/collection/${this.currentCollectionId}/facets/${this.metadatumId}?getSelected=1&order=asc&number=${this.filter.max_options}&` + qs.stringify(query_items);
+                        else
+                            route = `/collection/${this.filter.collection_id}/facets/${this.metadatumId}?getSelected=1&order=asc&number=${this.filter.max_options}&` + qs.stringify(query_items);
+                    }
+
+                    this.options = [];
+
+                    promise = new Object({
+                        request:
+                            new Promise((resolve, reject) => {
+                                tainacanApi.get(route, { cancelToken: source.token})
+                                    .then( res => {
+                                        resolve(res)
+                                    })
+                                    .catch(error => {
+                                        reject(error)
+                                    });
+                            }),
+                        source: source
+                    });
+                    promise.request
+                        .then((res) => {
+                            this.isLoadingOptions = false;
+                            this.prepareOptionsForTaxonomy(res.data.values ? res.data.values : res.data);
+
+                            if (res && res.data && res.data.values)
+                                this.$emit('update-parent-collapse', res.data.values.length > 0 );
+                        })
+                        .catch( error => {
+                            if (isCancel(error)) {
+                                this.$console.log('Request canceled: ' + error.message);
+                            } else {
+                                this.$console.log('Error on facets request: ', error);
+                                this.isLoadingOptions = false;
+                            }
+                        });
+                    
+                    // Search Request Token for cancelling
+                    this.getOptionsValuesCancel = promise.source;  
+
+                } else {
+                    for (const facet in this.facetsFromItemSearch) {
+                        if (facet == this.filter.id) {
+                            if (Array.isArray(this.facetsFromItemSearch[facet])) {
+                                this.prepareOptionsForTaxonomy(this.facetsFromItemSearch[facet]);
+                                this.$emit('update-parent-collapse', this.facetsFromItemSearch[facet].length > 0 );
+                            } else {
+                                this.prepareOptionsForTaxonomy(Object.values(this.facetsFromItemSearch[facet]));
+                                this.$emit('update-parent-collapse', Object.values(this.facetsFromItemSearch[facet]).length > 0 );
+                            }
+                        }    
+                    }
+                }
+            },
+            updateSelectedValues() {
+                
+                if ( !this.query || !this.query.taxquery || !Array.isArray( this.query.taxquery ) )
+                    return false;
+                    
+                // Cleared either way, we might be coming from a situation where all the filters were removed.
+                this.selected = '';
+
+                const index = this.query.taxquery.findIndex(newMetadatum => newMetadatum.taxonomy == this.taxonomy);
+                if (index >= 0) {
+                    const metadata = this.query.taxquery[ index ];
+                    if (this.selected != metadata.terms)
+                        this.selected = metadata.terms;
+                }
+            },
+            onSelect(selection) {
+                this.$emit('input', {
+                    filter: 'selectbox',
+                    taxonomy: this.taxonomy,
+                    metadatum_id: this.metadatumId,
+                    collection_id: this.collectionId,
+                    terms: selection
+                });
+            },
+            prepareOptionsForTaxonomy(items) {
+                this.options = [];
+                this.options = items.slice(); // copy array.
+                this.updateSelectedValues();
+            }
+        }
+    }
+</script>

src/views/admin/components/filter-types/taxonomy/class-tainacan-taxonomyselectbox.php

@@ -0,0 +1,27 @@
+<?php
+namespace Tainacan\Filter_Types;
+
+defined( 'ABSPATH' ) or die( 'No script kiddies please!' );
+
+/**
+ * Class TaxonomySelectbox
+ */
+class TaxonomySelectbox extends Filter_Type {
+
+    function __construct(){
+        $this->set_name( __('Selectbox', 'tainacan') );
+        $this->set_supported_types(['term']);
+        $this->set_component('tainacan-filter-taxonomy-selectbox');
+        $this->set_preview_template('
+            <div>
+                <div class="control is-expanded">
+                    <span class="select is-fullwidth">
+                        <select>
+                            <option value="someValue">' . __('Select here...') . '</option> 
+                        </select>
+                    </span>
+                </div>
+            </div>
+        ');
+    }
+}

src/views/admin/components/lists/items-list.vue

@@ -110,7 +110,9 @@
             </div>
         </div>
 
-        <div class="table-wrapper">
+        <div 
+                ref="tainacan-admin-items-list-wrapper"
+                class="table-wrapper">
 
             <!-- Context menu for right click selection -->
             <div
@@ -2744,11 +2746,27 @@ export default {
             }
         },
         onRightClickItem($event, item) {
-            if (!this.$adminOptions.itemsSearchSelectionMode) {
+            if ( !this.$adminOptions.itemsSearchSelectionMode ) {
                 $event.preventDefault();
 
-                this.cursorPosX = $event.clientX;
+                let wrapperOffsetX = 0;
-                this.cursorPosY = $event.clientY;
+                let wrapperOffsetY = 0;
+
+                // These elements have 'container-type: inline-size;', thus they need to be positioned relative to parent
+                if (    
+                    ( this.viewMode == 'masonry' || this.viewMode == 'records' ) &&
+                    this.$refs &&
+                    this.$refs['tainacan-admin-items-list-wrapper']
+                ) {
+                    const wrapperOffsets = this.$refs['tainacan-admin-items-list-wrapper'].getClientRects();
+                    if ( wrapperOffsets.length && wrapperOffsets[0].top && wrapperOffsets[0].left ) {
+                        wrapperOffsetX = wrapperOffsets[0].left;
+                        wrapperOffsetY = wrapperOffsets[0].top;        
+                    }
+                }
+
+                this.cursorPosX = $event.clientX - wrapperOffsetX;
+                this.cursorPosY = $event.clientY - wrapperOffsetY;
                 this.contextMenuItem = item;
             }
         },

src/views/admin/components/metadata-types/geocoordinate/TainacanGeoCoordinate.vue

@@ -124,6 +124,7 @@
                 latitude: -14.4086569,
                 longitude: -51.31668,
                 selected: [],
+                mapIntersectionObserver: null
             }
         },
         computed: {
@@ -193,25 +194,26 @@
             }
         },
         created() {
-            if (this.value && this.value != "")
+            if ( this.value && this.value != "" )
                 this.selected = Array.isArray(this.value) ? (this.value.length == 1 && this.value[0] == "" ? [] : this.value) : [this.value];
-            
-            // Listens to window resize event to update map bounds
-            // We need to pass mapComponentRef here instead of creating it inside the function
-            // otherwise the listener would conflict when multiple geo metadata are inserted.
-            const mapComponentRef = 'map--' + this.itemMetadatumIdentifier;
-            this.$emitter.on('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef));
         },
         mounted() {
             nextTick(() => {
                 const mapComponentRef = 'map--' + this.itemMetadatumIdentifier;
                 this.handleWindowResize(mapComponentRef);
+
+                // Intersection Observer to handle map resize
+                if ( this.$refs[mapComponentRef] && this.$refs[mapComponentRef]['$el'] ) {
+                    this.mapIntersectionObserver = new IntersectionObserver((entries) => {
+                        entries.forEach((entry) => {
+                            if (entry.isIntersecting)
+                                this.handleWindowResize(mapComponentRef);
+                        });
+                    }, { threshold: 0.1 });
+                    this.mapIntersectionObserver.observe(this.$refs[mapComponentRef]['$el']);
+                }
             });
         },
-        beforeUnmount() {
-            const mapComponentRef = 'map--' + this.itemMetadatumIdentifier;
-            this.$emitter.off('itemEditionFormResize', () => this.handleWindowResize(mapComponentRef));
-        },
         methods: {
             onUpdateFromLatitudeInput: _.debounce( function(value) {
                 let newLatitude = value;

src/views/admin/components/metadata-types/numeric/TainacanNumeric.vue

@@ -69,8 +69,11 @@
                 else
                     value = Number(value);
 
-                this.$emit('update:value', value);
+                this.changeValue(value);
             },
+            changeValue: _.debounce(function(value) {
+                this.$emit('update:value', value);
+            }, 800),
             onBlur() {
                 this.$emit('blur');
             },

src/views/admin/components/metadata-types/relationship/TainacanRelationship.vue

@@ -258,6 +258,7 @@
                                 });
                             }
 
+                            // Presets second tab as active to display selected items
                             if ( this.itemMetadatum.value.length > 0 && this.itemMetadatum.metadatum.multiple != 'yes' )
                                 this.activeTab = 1;
                         }

src/views/admin/components/metadata-types/tainacan-form-item.vue

@@ -77,7 +77,7 @@
                         :is-mobile-screen="isMobileScreen"
                         :is-focused="isFocused"
                         :is-metadata-navigation="isMetadataNavigation"
-                        @update:value="changeValue"
+                        @update:value="performValueChange"
                         @blur="performValueChange"
                         @mobile-special-focus="onMobileSpecialFocus" />
                 <template v-if="isMultiple && values.length > 1">
@@ -102,7 +102,7 @@
                                     :is-mobile-screen="isMobileScreen"
                                     :is-focused="isFocused"
                                     :is-metadata-navigation="isMetadataNavigation"
-                                    @update:value="changeValue"
+                                    @update:value="performValueChange"
                                     @blur="performValueChange"
                                     @mobile-special-focus="onMobileSpecialFocus" />
                             <a 
@@ -159,7 +159,7 @@
                         :is-focused="isFocused"
                         :is-metadata-navigation="isMetadataNavigation"
                         :enumerate-metadatum="enumerateMetadatum"
-                        @update:value="changeValue"
+                        @update:value="performValueChange"
                         @blur="performValueChange"
                         @mobile-special-focus="onMobileSpecialFocus" />
             </div>
@@ -285,9 +285,6 @@
                         this.itemMetadatum.value == null || this.itemMetadatum.value == undefined ? this.values = [] : this.values.push(this.itemMetadatum.value);
                 }
             },
-            changeValue: _.debounce(function() {
-                this.performValueChange();
-            }, 800),
             performValueChange() {
                 
                 // Compound metadata do not emit values, only their children.
@@ -353,11 +350,11 @@
             },
             addValue(){
                 this.values.push('');
-                this.changeValue();
+                this.performValueChange();
             },
             removeValue(index) {
                 this.values.splice(index, 1);
-                this.changeValue();
+                this.performValueChange();
             },
             onMobileSpecialFocus() {
                 if (this.isMobileScreen)

src/views/admin/components/metadata-types/text/TainacanText.vue

@@ -16,7 +16,7 @@
                     @input="($event) => getMask ? null : onInput($event.target.value)"
                     @blur="onBlur">
             <small
-                    v-if="getMaxlength"
+                    v-if="value && getMaxlength"
                     class="help counter"
                     :class="{ 'is-invisible': !isInputFocused }">
                 {{ value.length }} / {{ getMaxlength }}
@@ -127,8 +127,11 @@
                 if ( inputRef && this.getMaxlength && !inputRef.checkHtml5Validity() )
                     return;
 
-                this.$emit('update:value', value);
+                this.changeValue(value);
             },
+            changeValue: _.debounce(function(value) {
+                this.$emit('update:value', value);
+            }, 750),
             onBlur() {
                 this.isInputFocused = false;
                 this.$emit('blur');

src/views/admin/components/metadata-types/textarea/TainacanTextarea.vue

@@ -38,8 +38,11 @@
                 if ( inputRef && this.getMaxlength && !inputRef.checkHtml5Validity() )
                     return;
 
-                this.$emit('update:value', value);
+                this.changeValue(value);
             },
+            changeValue: _.debounce(function(value) {
+                this.$emit('update:value', value);
+            }, 750),
             onBlur() {
                 this.$emit('blur');
             },

src/views/admin/components/metadata-types/url/TainacanUrl.vue

@@ -47,8 +47,12 @@ export default {
         onInput(value) {
             this.isPreviewingHtml = false;
             this.singleHTMLPreview = '';
-            this.$emit('update:value', value);
+            
+            this.changeValue(value);
         },
+        changeValue: _.debounce(function(value) {
+            this.$emit('update:value', value);
+        }, 750),
         onBlur() {
             this.$emit('blur');
         },

src/views/admin/components/other/checkbox-radio-metadata-input.vue

@@ -443,6 +443,7 @@
                     this.initializeValues();
                 }
             });
+            
         },
         beforeUnmount() {
             // Cancels previous Request
@@ -795,6 +796,24 @@
                         this.createColumn(res, key, option ? option.label : null);
 
                         this.isColumnLoading = false;
+
+                        // If this is the first time loading, these will be undefined
+                        if (
+                            option === undefined &&
+                            key === undefined &&
+                            index === undefined
+                        ) {
+                            // Here we already have a value for the hasToDisplaySearchBar. Thus we can decide if we should
+                            // Preset the second tab as active to display selected values
+                            if ( 
+                                ( Array.isArray(this.selected) ? (this.selected.length) : this.selected ) &&
+                                this.metadatum.multiple != 'yes' &&
+                                this.hasToDisplaySearchBar
+                            ) {
+                                this.fetchSelectedLabels();
+                                this.activeTab = 1;
+                            }
+                        }
                     })
                     .catch(error => {
                         this.$console.log(error);

src/views/admin/js/store/modules/item/actions.js

@@ -45,7 +45,7 @@ export const fetchItemMetadata = ({ commit }, item_id) => {
 export const fetchCompoundFirstParentMetaId = ({ commit }, { item_id, metadatum_id }) => {
    
     return new Promise((resolve, reject) => {
-        axios.tainacanApi.put(`/item/${item_id}/metadata/${metadatum_id}`, { value: [] })
+        axios.tainacanApi.put(`/item/${item_id}/metadata/${metadatum_id}`, { values: [] })
             .then( res => {
                 const parentMetaId = res.data.parent_meta_id;
                 resolve(parentMetaId);

src/views/admin/scss/_view-mode-masonry.scss

@@ -5,7 +5,8 @@
         min-height: 50vh;
     }
 }
-.table-wrapper {
+.table-wrapper:has(.tainacan-masonry-container),
+.table-wrapper:has(.tainacan-masonry-container--skeleton) {
     @supports (contain: inline-size) {
         container-type: inline-size;
         container-name: tablewrapper; 

src/views/admin/scss/_view-mode-records.scss

@@ -5,7 +5,8 @@
         min-height: 50vh;
     }
 }
-.table-wrapper {
+.table-wrapper:has(.tainacan-records-container),
+.table-wrapper:has(.tainacan-records-container--skeleton) {
     @supports (contain: inline-size) {
         container-type: inline-size;
         container-name: tablewrapper; 

tests/test-filters.php

@@ -97,7 +97,7 @@ class Filters extends TAINACAN_UnitTestCase {
         $Tainacan_Filters = \Tainacan\Repositories\Filters::get_instance();
 
         $all_filter_types = $Tainacan_Filters->fetch_filter_types();
-        $this->assertEquals( 13, count( $all_filter_types ) );
+        $this->assertEquals( 14, count( $all_filter_types ) );
 
         $float_filters = $Tainacan_Filters->fetch_supported_filter_types('float');
         $this->assertTrue( count( $float_filters ) > 0 );