fix issues

pixijs · Oct 20, 2023 · 723efc2 · 723efc2
1 parent be8d2dd
commit 723efc2
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/src/Input.ts b/src/Input.ts
@@ -15,6 +15,7 @@ export type InputOptions = {
     maxLength?: number;
     align?: 'left' | 'center' | 'right';
     padding?: Padding;
+    cleanOnFocus?: boolean;
 };
 
 /**
@@ -167,7 +168,7 @@ export class Input extends Container
         this._bg.cursor = 'text';
         this._bg.interactive = true;
 
-        this.addChild(this._bg);
+        this.addChildAt(this._bg, 0);
 
         if (!this.inputField)
         {
@@ -195,7 +196,7 @@ export class Input extends Container
 
         this._cursor.mask = this.inputMask;
 
-        this.addChild(this.inputMask);
+        this.addChildAt(this.inputMask, 0);
     }
 
     get bg(): Container | string
@@ -233,6 +234,11 @@ export class Input extends Container
 
     protected _startEditing(): void
     {
+        if (this.options.cleanOnFocus)
+        {
+            this.value = '';
+        }
+
         this.tick = 0;
         this.editing = true;
         this.placeholder.visible = false;

diff --git a/src/stories/input/InputGraphics.stories.ts b/src/stories/input/InputGraphics.stories.ts
@@ -24,6 +24,7 @@ const args = {
     paddingRight: 0,
     paddingBottom: 0,
     paddingLeft: 0,
+    cleanOnFocus: true,
     onChange: action('Change')
 };
 
@@ -45,7 +46,8 @@ export const UseGraphics = ({
     paddingRight,
     paddingBottom,
     paddingLeft,
-    onChange
+    onChange,
+    cleanOnFocus
 }: any) =>
 {
     const view = new List({ type: 'vertical', elementsMargin: 10 });
@@ -72,18 +74,13 @@ export const UseGraphics = ({
             align,
             placeholder,
             value: text,
-            padding: [paddingTop, paddingRight, paddingBottom, paddingLeft]
+            padding: [paddingTop, paddingRight, paddingBottom, paddingLeft],
+            cleanOnFocus
         });
 
         input.onEnter.connect((val) =>
         {
             onChange(`Input ${i + 1} (${val})`);
-
-            input.bg = new Graphics()
-                .beginFill('red')
-                .drawRoundedRect(0, 0, width, height, radius + border)
-                .beginFill('green')
-                .drawRoundedRect(border, border, width - (border * 2), height - (border * 2), radius);
         });
 
         view.addChild(input);