add max-length-indicator to combo fields

This commit is contained in:
Martin Raifer
2022-11-25 18:18:51 +01:00
parent f931d447af
commit 2c0ca277bf
3 changed files with 13 additions and 2 deletions

View File

@@ -2338,6 +2338,7 @@ div.combobox {
.form-field-input-wrap > input:focus + span.length-indicator-wrap,
.form-field-input-wrap > textarea:focus + span.length-indicator-wrap,
.form-field-input-wrap > input:focus + div.combobox-caret + span.length-indicator-wrap,
.form-field-input-wrap > textarea:focus + div.combobox-caret + span.length-indicator-wrap {
visibility: visible;
}

View File

@@ -782,7 +782,7 @@ en:
foot: ft
# abbreviation of inches
inch: in
max_length_reached: "Please keep in mind that texts cannot be longer than a maximum of {maxChars} characters. Anything exceeding that length will be truncated."
max_length_reached: "This string is longer than the maximum length of {maxChars} characters. Anything exceeding that length will be truncated."
background:
title: Background
description: Background Settings

View File

@@ -12,6 +12,7 @@ import { svgIcon } from '../../svg/icon';
import { utilKeybinding } from '../../util/keybinding';
import { utilArrayUniq, utilGetSetValue, utilNoAuto, utilRebind, utilTotalExtent, utilUnicodeCharsCount } from '../../util';
import { uiLengthIndicator } from '../length_indicator';
export {
uiFieldCombo as uiFieldManyCombo,
@@ -52,6 +53,7 @@ export function uiFieldCombo(field, context) {
var _container = d3_select(null);
var _inputWrap = d3_select(null);
var _input = d3_select(null);
var _lengthIndicator = uiLengthIndicator(context.maxCharsForTagValue());
var _comboData = [];
var _multiData = [];
var _entityIDs = [];
@@ -447,6 +449,8 @@ export function uiFieldCombo(field, context) {
.call(initCombo, selection)
.merge(_input);
_container.call(_lengthIndicator);
if (_isNetwork) {
var extent = combinedEntityExtent();
var countryCode = extent && countryCoder.iso1A2Code(extent.center());
@@ -457,7 +461,9 @@ export function uiFieldCombo(field, context) {
.on('change', change)
.on('blur', change)
.on('input', function() {
updateIcon(utilGetSetValue(_input));
const val = utilGetSetValue(_input);
updateIcon(val);
_lengthIndicator.update(val);
});
_input
@@ -688,6 +694,10 @@ export function uiFieldCombo(field, context) {
if (!Array.isArray(tags[field.key])) {
updateIcon(tags[field.key]);
}
if (!isMixed) {
_lengthIndicator.update(tags[field.key]);
}
}
};