@leafer-ui/text 1.0.0-beta.9 → 1.0.0-rc.3

package/package.json

@@ -1,12 +1,15 @@
 {
   "name": "@leafer-ui/text",
-  "version": "1.0.0-beta.9",
+  "version": "1.0.0-rc.3",
   "description": "@leafer-ui/text",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
   "main": "src/index.ts",
+  "types": "types/index.d.ts",
   "files": [
-    "src"
+    "src",
+    "types",
+    "dist"
   ],
   "repository": {
     "type": "git",
@@ -19,10 +22,10 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer-ui/core": "1.0.0-beta.9"
+    "@leafer-ui/core": "1.0.0-rc.3"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-beta.9",
-    "@leafer-ui/interface": "1.0.0-beta.9"
+    "@leafer/interface": "1.0.0-rc.3",
+    "@leafer-ui/interface": "1.0.0-rc.3"
   }
 }

package/src/TextConvert.ts

@@ -1,6 +1,6 @@
 import { MathHelper, Platform } from '@leafer/core'
 
-import { ITextData, ITextDrawData } from '@leafer-ui/interface'
+import { ITextConvertModule, ITextData, ITextDrawData } from '@leafer-ui/interface'
 
 import { createRows } from './TextRows'
 import { layoutChar } from './CharLayout'
@@ -9,16 +9,18 @@ import { clipText } from './TextClip'
 import { decorationText } from './TextDecoration'
 
 
-export const TextConvert = {
+export const TextConvert: ITextConvertModule = {
 
     getDrawData(content: string, style: ITextData): ITextDrawData {
 
         if (typeof content !== 'string') content = String(content)
 
         let x = 0, y = 0
-        let { width, height, padding } = style
-        const { textDecoration, textOverflow, __font } = style
-        if (!width) width = 0
+
+        let width = style.__getInput('width') || 0
+        let height = style.__getInput('height') || 0
+
+        const { textDecoration, textOverflow, __font, padding } = style
 
         if (padding) {
             const [top, right, bottom, left] = MathHelper.fourNumber(padding)

package/src/TextLayout.ts

@@ -4,32 +4,30 @@ import { ITextData, ITextDrawData, ITextRowData } from '@leafer-ui/interface'
 export function layoutText(drawData: ITextDrawData, style: ITextData): void {
 
     const { rows, bounds } = drawData
-    const { __lineHeight, __baseLine, textAlign, verticalAlign, paraSpacing, textOverflow } = style
+    const { __lineHeight, __baseLine, __letterSpacing, textAlign, verticalAlign, paraSpacing, textOverflow } = style
 
     let { x, y, width, height } = bounds, realHeight = __lineHeight * rows.length + (paraSpacing ? paraSpacing * (drawData.paraNumber - 1) : 0)
     let starY: number = __baseLine
 
     // verticalAlign
 
-    if (height) {
-        if (textOverflow !== 'show' && realHeight > height) {
-            realHeight = Math.max(height, __lineHeight)
-            drawData.overflow = rows.length
-        } else {
-            switch (verticalAlign) {
-                case 'middle':
-                    y += (height - realHeight) / 2
-                    break
-                case 'bottom':
-                    y += (height - realHeight)
-            }
+    if (textOverflow !== 'show' && realHeight > height) {
+        realHeight = Math.max(height, __lineHeight)
+        drawData.overflow = rows.length
+    } else {
+        switch (verticalAlign) {
+            case 'middle':
+                y += (height - realHeight) / 2
+                break
+            case 'bottom':
+                y += (height - realHeight)
         }
-        starY += y
     }
+    starY += y
 
     // textAlign
 
-    let row: ITextRowData
+    let row: ITextRowData, rowX: number, rowWidth: number
 
     for (let i = 0, len = rows.length; i < len; i++) {
         row = rows[i]
@@ -54,7 +52,22 @@ export function layoutText(drawData: ITextDrawData, style: ITextData): void {
             drawData.overflow = i + 1
         }
 
-        if (row.width > bounds.width) bounds.width = row.width
+        rowX = row.x
+        rowWidth = row.width
+
+        if (__letterSpacing < 0) { // letterSpacing < 0, like -20% -100%
+            if (row.width < 0) {
+                rowWidth = -row.width + style.fontSize + __letterSpacing
+                rowX -= rowWidth
+                rowWidth += style.fontSize
+            } else {
+                rowWidth -= __letterSpacing
+            }
+        }
+
+        if (rowX < bounds.x) bounds.x = rowX
+        if (rowWidth > bounds.width) bounds.width = rowWidth
+
     }
 
     bounds.y = y

package/src/TextRows.ts

@@ -11,7 +11,7 @@ const { trimRight } = TextRowHelper
 const { Letter, Single, Before, After, Symbol, Break } = CharType
 
 let word: ITextWordData, row: ITextRowData, wordWidth: number, rowWidth: number, realWidth: number
-let char: string, charWidth: number, charType: CharType, lastCharType: CharType, langBreak: boolean, afterBreak: boolean, paraStart: boolean
+let char: string, charWidth: number, startCharSize: number, charSize: number, charType: CharType, lastCharType: CharType, langBreak: boolean, afterBreak: boolean, paraStart: boolean
 let textDrawData: ITextDrawData, rows: ITextRowData[] = [], bounds: IBoundsData
 
 export function createRows(drawData: ITextDrawData, content: string, style: ITextData): void {
@@ -29,7 +29,7 @@ export function createRows(drawData: ITextDrawData, content: string, style: ITex
 
         paraStart = true
         lastCharType = null
-        wordWidth = rowWidth = 0
+        startCharSize = charWidth = charSize = wordWidth = rowWidth = 0
         word = { data: [] }, row = { words: [] }
 
         for (let i = 0, len = content.length; i < len; i++) {
@@ -51,7 +51,10 @@ export function createRows(drawData: ITextDrawData, content: string, style: ITex
                 if (charType === Letter && textCase !== 'none') char = getTextCase(char, textCase, !wordWidth)
 
                 charWidth = canvas.measureText(char).width
-                if (__letterSpacing) charWidth += __letterSpacing
+                if (__letterSpacing) {
+                    if (__letterSpacing < 0) charSize = charWidth
+                    charWidth += __letterSpacing
+                }
 
                 langBreak = (charType === Single && (lastCharType === Single || lastCharType === Letter)) || (lastCharType === Single && charType !== After) // break  U字 文字 or 字U  字（  字*  exclude 字。
                 afterBreak = ((charType === Before || charType === Single) && (lastCharType === Symbol || lastCharType === After)) // split >(  =文 。哈  ;文
@@ -121,6 +124,7 @@ export function createRows(drawData: ITextDrawData, content: string, style: ITex
 
 
 function addChar(char: string, width: number): void {
+    if (charSize && !startCharSize) startCharSize = charSize
     word.data.push({ char, width })
     wordWidth += width
 }
@@ -139,6 +143,13 @@ function addRow(): void {
         row.paraStart = true
         paraStart = false
     }
+
+    if (charSize) { // letterSpacing < 0, like -20% -100%
+        row.startCharSize = startCharSize
+        row.endCharSize = charSize
+        startCharSize = 0
+    }
+
     row.width = rowWidth
     if (bounds.width) trimRight(row)
     rows.push(row)

package/types/index.d.ts

@@ -0,0 +1,5 @@
+import { ITextConvertModule } from '@leafer-ui/interface';
+
+declare const TextConvert: ITextConvertModule;
+
+export { TextConvert };