Panoramica

generaltranslation@8.1.0 introduce formatCutoff(), una funzione di troncamento del testo che tiene conto dell'impostazione regionale e gestisce i limiti di caratteri con terminatori appropriati per le diverse lingue.

Motivazione

Il troncamento del testo dell'interfaccia utente si basa in genere su CSS text-overflow: ellipsis o su un semplice taglio della stringa, ma questi approcci non tengono conto delle convenzioni specifiche dell'impostazione regionale. Lingue diverse usano caratteri di ellissi, spaziature e regole di punteggiatura differenti quando il testo viene troncato.

Inoltre, quando le traduzioni IA sono soggette a limiti di caratteri, spesso è necessario far rispettare rigorosamente tali limiti sul lato client come fallback.

Utilizzo

formatCutoff() è disponibile sia come metodo d'istanza di GT sia come funzione autonoma:

import { GT, formatCutoff } from 'generaltranslation'

const gt = new GT({ targetLocale: 'en-US' })

// Troncamento di base
gt.formatCutoff('Hello, world!', { maxChars: 9 })
// Restituisce: 'Hello, w…'

// Funzione standalone
formatCutoff('Hello, world!', { 
  locales: 'fr-FR', 
  maxChars: 9 
})
// Restituisce: 'Hello, w\u202F…'  // Nota lo spazio stretto prima dei puntini di sospensione

maxChars negativo

I valori negativi troncano dalla fine e antepongono il terminatore:

gt.formatCutoff('Hello, world!', { maxChars: -4 })
// Restituisce: '…ld!'

Terminatori specifici per impostazione regionale

Le diverse impostazioni regionali usano stili diversi per i puntini di sospensione:

// Il cinese e il giapponese usano l'ellissi doppia
formatCutoff('你好世界', { locales: 'zh-CN', maxChars: 4 })
// Restituisce: '你好……'

// Il francese usa uno spazio unificatore stretto prima dell'ellissi  
formatCutoff('Bonjour', { locales: 'fr-FR', maxChars: 6 })
// Restituisce: 'Bonj\u202F…'

Terminatori personalizzati

Sovrascrivi il comportamento predefinito con terminatori e separatori personalizzati:

gt.formatCutoff('Long text here', {
  maxChars: 13,
  terminator: '...',
  separator: ' '
})
// Restituisce: 'Long text ...'

Nessun terminatore

Usa lo stile 'none' per troncare il testo senza alcun terminatore:

gt.formatCutoff('Hello, world!', {
  maxChars: 5,
  style: 'none'
})
// Restituisce: 'Hello'

Base per le librerie UI

Questa funzionalità costituisce il livello di base per le implementazioni specifiche dell'interfaccia utente in gt-react e gt-next, che esporranno sottoinsiemi di queste funzionalità adatti ai rispettivi framework.