Panoramica

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

Motivazioni

Il troncamento del testo dell’interfaccia utente (UI) in genere si basa su CSS text-overflow: ellipsis o su un semplice ritaglio delle stringhe, ma questi approcci non tengono conto delle convenzioni specifiche del singolo locale. Lingue diverse utilizzano caratteri di ellissi, spaziatura e regole di punteggiatura differenti quando il testo viene interrotto.

Inoltre, quando le traduzioni generate dall’AI sono soggette a limiti di caratteri, spesso è necessario far rispettare rigorosamente tali limiti lato client come meccanismo di fallback.

Utilizzo

formatCutoff() è disponibile sia come metodo di un'istanza GT che come funzione indipendente:

import { GT, formatCutoff } from 'generaltranslation'

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

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

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

maxChars negativi

I valori negativi tagliano dalla fine e aggiungono il terminatore all’inizio:

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

Terminatori specifici per locale

Diversi locali utilizzano stili di puntini di sospensione differenti:

// Il cinese e il giapponese utilizzano i puntini di sospensione doppi
formatCutoff('你好世界', { locales: 'zh-CN', maxChars: 4 })
// Restituisce: '你好……'

// Il francese utilizza uno spazio unificatore stretto prima dei puntini di sospensione  
formatCutoff('Bonjour', { locales: 'fr-FR', maxChars: 5 })
// Restituisce: 'Bonj\u202F…'

Terminatori personalizzati

Sostituisci il comportamento predefinito con terminatori e separatori personalizzati:

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

Nessun terminatore

Usa lo stile 'none' per troncare senza aggiungere alcun terminatore:

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

Base per le librerie UI

Questa funzionalità costituisce lo strato di base per le implementazioni specifiche della UI in gt-react e gt-next, che esporranno un sottoinsieme di queste funzionalità adatto al rispettivo framework.