/*

Feathers UI

Copyright 2026 Bowler Hat LLC. All Rights Reserved.

This program is free software. You can redistribute and/or modify it in

accordance with the terms of the accompanying license agreement.

*/

package feathers.controls;

import feathers.core.IFocusObject;

import feathers.core.IHTMLTextControl;

import feathers.core.IMeasureObject;

import feathers.core.IStateObserver;

import feathers.core.ITextControl;

import feathers.core.IUIControl;

import feathers.core.IValidating;

import feathers.events.TriggerEvent;

import feathers.layout.HorizontalAlign;

import feathers.layout.ILayoutObject;

import feathers.layout.Measurements;

import feathers.layout.RelativePosition;

import feathers.layout.VerticalAlign;

import feathers.skins.IProgrammaticSkin;

import feathers.text.TextFormat;

import feathers.utils.MeasurementsUtil;

import openfl.display.DisplayObject;

import openfl.events.Event;

import openfl.events.FocusEvent;

import openfl.events.KeyboardEvent;

import openfl.events.MouseEvent;

import openfl.text.AntiAliasType;

import openfl.text.GridFitType;

import openfl.text.TextField;

import openfl.ui.Keyboard;

#if (openfl >= "9.2.0")

import openfl.text.StyleSheet;

#elseif flash

import flash.text.StyleSheet;

#end

/**

A push button control that may be triggered when pressed and released.

The following example creates a button, gives it a label and listens

for when the button is triggered:

```haxe

var button = new Button();

button.text = "Click Me";

button.addEventListener(TriggerEvent.TRIGGER, (event) -> {

trace("button triggered!");

});

this.addChild(button);

```

@see [Tutorial: How to use the Button component](https://feathersui.com/learn/haxe-openfl/button/)

@since 1.0.0

**/

@defaultXmlProperty("text")

@:styleContext

class Button extends BasicButton implements ITextControl implements IHTMLTextControl implements IFocusObject {

/**

A variant used to style the button in a more prominent style to indicate

its greater importance than other nearby buttons. Variants allow themes

to provide an assortment of different appearances for the same type of

UI component.

The following example uses this variant:

```haxe

var button = new Button();

button.variant = Button.VARIANT_PRIMARY;

```

@see `feathers.style.IVariantStyleObject.variant`

@see [Feathers UI User Manual: Themes](https://feathersui.com/learn/haxe-openfl/themes/)

@since 1.0.0

**/

public static final VARIANT_PRIMARY = "primary";

/**

A variant used to style the button in a style that indicates that

performing the action is considered dangerous. Variants allow themes to

provide an assortment of different appearances for the same type of UI

component.

The following example uses this variant:

```haxe

var button = new Button();

button.variant = Button.VARIANT_DANGER;

```

@see `feathers.style.IVariantStyleObject.variant`

@see [Feathers UI User Manual: Themes](https://feathersui.com/learn/haxe-openfl/themes/)

@since 1.0.0

**/

public static final VARIANT_DANGER = "danger";

/**

A variant used to style the button in a less prominent style — typically

hiding the background skin until interaction. Variants allow themes to

provide an assortment of different appearances for the same type of UI

component.

The following example uses this variant:

```haxe

var button = new Button();

button.variant = Button.VARIANT_QUIET;

```

@see `feathers.style.IVariantStyleObject.variant`

@see [Feathers UI User Manual: Themes](https://feathersui.com/learn/haxe-openfl/themes/)

@since 1.4.0

**/

public static final VARIANT_QUIET = "quiet";

/**

Creates a new `Button` object.

@since 1.0.0

**/

public function new(?text:String, ?triggerListener:(TriggerEvent) -> Void) {

initializeButtonTheme();

super(triggerListener);

this.text = text;

this.tabEnabled = true;

this.tabChildren = false;

this.focusRect = false;

this.addEventListener(KeyboardEvent.KEY_DOWN, button_keyDownHandler);

this.addEventListener(FocusEvent.FOCUS_IN, button_focusInHandler);

this.addEventListener(FocusEvent.FOCUS_OUT, button_focusOutHandler);

}

private var textField:TextField;

private var _previousText:String = null;

private var _previousHTMLText:String = null;

private var _previousTextFormat:TextFormat = null;

private var _previousSimpleTextFormat:openfl.text.TextFormat = null;

private var _updatedTextStyles = false;

private var _text:String;

/**

The text displayed by the button.

The following example sets the button's text:

```haxe

button.text = "Click Me";

```

Note: If the `htmlText` property is not `null`, the `text` property will

be ignored.

@default null

@see `Button.htmlText`

@see `Button.textFormat`

@since 1.0.0

**/

@:inspectable

public var text(get, set):String;

private function get_text():String {

return this._text;

}

private function set_text(value:String):String {

if (this._text == value) {

return this._text;

}

this._text = value;

this.setInvalid(DATA);

return this._text;

}

private var _htmlText:String = null;

/**

Text displayed by the button that is parsed as a simple form of HTML.

The following example sets the button's HTML text:

```haxe

button.htmlText = "<b>Hello</b> <i>World</i>";

```

@default null

@see `Button.text`

@see [`openfl.text.TextField.htmlText`](https://api.openfl.org/openfl/text/TextField.html#htmlText)

@since 1.0.0

**/

public var htmlText(get, set):String;

private function get_htmlText():String {

return this._htmlText;

}

private function set_htmlText(value:String):String {

if (this._htmlText == value) {

return this._htmlText;

}

this._htmlText = value;

this.setInvalid(DATA);

return this._htmlText;

}

/**

@see `feathers.core.ITextControl.baseline`

**/

public var baseline(get, never):Float;

private function get_baseline():Float {

if (this.textField == null) {

return 0.0;

}

// usually, hasText doesn't check the length, but TextField height may

// not be accurate with an empty string

var hasText = this._text != null && this._text.length > 0;

var hasHTMLText = this._htmlText != null && this._htmlText.length > 0;

if (!this.showText || (!hasText && !hasHTMLText)) {

var textFieldY = this.textField.y;

if (!this.showText || (this._text == null && this._htmlText == null)) {

// this is a little strange, but measure the baseline as if

// there were text so that instances of the same component have

// the same baseline, even if some have text and others do not.

if (this._currentIcon != null

&& (!(this._currentIcon is ILayoutObject) || (cast this._currentIcon : ILayoutObject).includeInLayout)) {

textFieldY = this._currentIcon.y + (this._currentIcon.height - this._textMeasuredHeight) / 2.0;

} else if (this._currentBackgroundSkin != null) {

textFieldY = (this._currentBackgroundSkin.height - this._textMeasuredHeight) / 2.0;

} else {

// we don't have anything to measure against

return 0.0;

}

}

this.textField.text = "\u200b";

var textFieldBaseline = textFieldY + this.textField.getLineMetrics(0).ascent;

this.textField.text = "";

return textFieldBaseline;

}

return this.textField.y + this.textField.getLineMetrics(0).ascent;

}

/**

The font styles used to render the button's text.

In the following example, the button's text formatting is customized:

```haxe

button.textFormat = new TextFormat("Helvetica", 20, 0xcc0000);

```

@see `Button.text`

@see `Button.getTextFormatForState()`

@see `Button.setTextFormatForState()`

@see `Button.embedFonts`

@since 1.0.0

**/

@:style

public var textFormat:AbstractTextFormat = null;

#if (openfl >= "9.2.0" || flash)

/**

A custom stylesheet to use with `htmlText`.

If the `styleSheet` style is not `null`, the `textFormat` style will

be ignored.

@see `Button.htmlText`

@since 1.0.0

**/

@:style

public var styleSheet:StyleSheet = null;

#end

/**

The font styles used to render the button's text when the button is

disabled.

In the following example, the button's disabled text formatting is

customized:

```haxe

button.enabled = false;

button.disabledTextFormat = new TextFormat("Helvetica", 20, 0xee0000);

```

@see `Button.textFormat`

@since 1.0.0

**/

@:style

public var disabledTextFormat:AbstractTextFormat = null;

/**

Determines if an embedded font is used or not.

In the following example, the button uses embedded fonts:

```haxe

button.embedFonts = true;

```

@see `Button.textFormat`

@since 1.0.0

**/

@:style

public var embedFonts:Bool = false;

/**

Configures the `alpha` value of the button's text.

In the following example, the button's text alpha is customized:

```haxe

button.textAlpha = 0.5;

```

@see `Button.textFormat`

@see `Button.disabledTextAlpha`

@since 1.4.0

**/

@:style

@:inspectable(minValue = "0.0", maxValue = "1.0", verbose = "1")

public var textAlpha:Float = 1.0;

/**

When `disabledTextAlpha` is not `null`, sets the `alpha` property of the

text to this value when the the `enabled` property is set to `false`.

In the following example, the button's disabled text alpha is customized:

```haxe

button.disabledTextAlpha = 0.5;

```

@see `Button.textAlpha`

@since 1.4.0

**/

@:style

@:inspectable(minValue = "0.0", maxValue = "1.0", verbose = "1")

public var disabledTextAlpha:Null<Float> = null;

/**

Determines the type of anti-aliasing used for embedded fonts.

In the following example, the button uses advanced anti-aliasing:

```haxe

button.embedFonts = true;

button.antiAliasType = ADVANCED;

```

@see `Button.embedFonts`

@see `Button.gridFitType`

@since 1.4.0

**/

@:style

public var antiAliasType:AntiAliasType = NORMAL;

/**

Determines the type of anti-aliasing used for embedded fonts.

In the following example, the button uses sub-pixel grid fitting:

```haxe

button.embedFonts = true;

button.antiAliasType = ADVANCED;

button.gridFitType = SUBPIXEL;

```

@see `Button.antiAliasType`

@see `Button.embedFonts`

@since 1.4.0

**/

@:style

public var gridFitType:GridFitType = PIXEL;

/**

Determines if the text is displayed on a single line, or if it wraps.

In the following example, the button's text wraps at 150 pixels:

```haxe

button.width = 150.0;

button.wordWrap = true;

```

@default false

@since 1.0.0

**/

@:style

public var wordWrap:Bool = false;

#if (openfl >= "9.2.0" || flash)

/**

Determines if the whitespace in the `htmlText` is condensed or affects

the text layout.

In the following example, the button's HTML text whitespace is condensed:

```haxe

button.htmlText = "<p>Hello</p>\n<p>World</p>";

button.condenseWhite = true;

```

@default false

@see `Button.htmlText`

@since 1.4.0

**/

@:style

public var condenseWhite:Bool = false;

#end

private var _stateToIcon:Map<ButtonState, DisplayObject> = new Map();

private var _iconMeasurements:Measurements = null;

private var _currentIcon:DisplayObject = null;

private var _ignoreIconResizes:Bool = false;

/**

The display object to use as the button's icon.

To render a different icon depending on the button's current state,

pass additional icons to `setIconForState()`.

The following example gives the button an icon:

```haxe

button.icon = new Bitmap(bitmapData);

```

To change the position of the icon relative to the button's text, see

`iconPosition` and `gap`.

```haxe

button.icon = new Bitmap(bitmapData);

button.iconPosition = RIGHT;

button.gap = 20.0;

```

@see `Button.getIconForState()`

@see `Button.setIconForState()`

@see `Button.iconPosition`

@see `Button.gap`

@since 1.0.0

**/

@:style

public var icon:DisplayObject = null;

/**

The minimum space, in pixels, between the button's top edge and the

button's content.

In the following example, the button's top padding is set to 20 pixels:

```haxe

button.paddingTop = 20.0;

```

@since 1.0.0

**/

@:style

public var paddingTop:Float = 0.0;

/**

The minimum space, in pixels, between the button's right edge and the

button's content.

In the following example, the button's right padding is set to 20

pixels:

```haxe

button.paddingRight = 20.0;

```

@since 1.0.0

**/

@:style

public var paddingRight:Float = 0.0;

/**

The minimum space, in pixels, between the button's bottom edge and the

button's content.

In the following example, the button's bottom padding is set to 20

pixels:

```haxe

button.paddingBottom = 20.0;

```

@since 1.0.0

**/

@:style

public var paddingBottom:Float = 0.0;

/**

The minimum space, in pixels, between the button's left edge and the

button's content.

In the following example, the button's left padding is set to 20

pixels:

```haxe

button.paddingLeft = 20.0;

```

@since 1.0.0

**/

@:style

public var paddingLeft:Float = 0.0;

/**

How the content is positioned horizontally (along the x-axis) within the

button.

The following example aligns the button's content to the left:

```haxe

button.verticalAlign = LEFT;

```

**Note:** The `HorizontalAlign.JUSTIFY` constant is not supported by this

component.

@see `feathers.layout.HorizontalAlign.LEFT`

@see `feathers.layout.HorizontalAlign.CENTER`

@see `feathers.layout.HorizontalAlign.RIGHT`

@since 1.0.0

**/

@:style

public var horizontalAlign:HorizontalAlign = CENTER;

/**

How the content is positioned vertically (along the y-axis) within the

button.

The following example aligns the button's content to the top:

```haxe

button.verticalAlign = TOP;

```

**Note:** The `VerticalAlign.JUSTIFY` constant is not supported by this

component.

@see `feathers.layout.VerticalAlign.TOP`

@see `feathers.layout.VerticalAlign.MIDDLE`

@see `feathers.layout.VerticalAlign.BOTTOM`

@since 1.0.0

**/

@:style

public var verticalAlign:VerticalAlign = MIDDLE;

/**

The location of the button's icon, relative to its text.

The following example positions the icon to the right of the text:

```haxe

button.text = "Click Me";

button.icon = new Bitmap(texture);

button.iconPosition = RIGHT;

```

@see `Button.icon`

@since 1.0.0

**/

@:style

public var iconPosition:RelativePosition = LEFT;

/**

The space, measured in pixels, between the button's icon and its text.

Applies to either horizontal or vertical spacing, depending on the value

of `iconPosition`.

If the `gap` is set to `Math.POSITIVE_INFINITY`, the icon and the text

will be positioned as far apart as possible. In other words, they will

be positioned at the edges of the button (adjusted for padding).

The following example creates a gap of 20 pixels between the icon and

the text:

```haxe

button.text = "Click Me";

button.icon = new Bitmap(bitmapData);

button.gap = 20.0;

```

@see `Button.minGap`

@since 1.0.0

**/

@:style

public var gap:Float = 0.0;

/**

If the value of the `gap` property is `Math.POSITIVE_INFINITY`, meaning

that the gap will fill as much space as possible and position the icon

and text on the edges of the button, the final calculated value of the

gap will not be smaller than the value of the `minGap` property.

The following example ensures that the gap is never smaller than 20

pixels:

```haxe

button.gap = Math.POSITIVE_INFINITY;

button.minGap = 20.0;

```

@see `Button.gap`

@since 1.0.0

**/

@:style

public var minGap:Float = 0.0;

/**

Offsets the x position of the icon by a certain number of pixels.

This does not affect the measurement of the button. The button's width

will not get smaller or larger when the icon is offset from its default

x position.

The following example offsets the x position of the button's icon by

20 pixels:

```haxe

button.iconOffsetX = 20.0;

```

@see `Button.iconOffsetY`

@since 1.0.0

**/

@:style

public var iconOffsetX:Float = 0.0;

/**

Offsets the y position of the icon by a certain number of pixels.

This does not affect the measurement of the button. The button's height

will not get smaller or larger when the icon is offset from its default

y position.

The following example offsets the y position of the button's icon by

20 pixels:

```haxe

button.iconOffsetY = 20.0;

```

@see `Button.iconOffsetX`

@since 1.0.0

**/

@:style

public var iconOffsetY:Float = 0.0;

/**

Offsets the x position of the text by a certain number of pixels.

This does not affect the measurement of the button. The button's width

will not get smaller or larger when the text is offset from its default

x position. Nor does it change the size of the text, so the text may

appear outside of the button's bounds if the offset is large enough.

The following example offsets the x position of the button's text by

20 pixels:

```haxe

button.textOffsetX = 20.0;

```

@see `Button.textOffsetY`

@since 1.0.0

**/

@:style

public var textOffsetX:Float = 0.0;

/**

Offsets the y position of the text by a certain number of pixels.

This does not affect the measurement of the button. The button's height

will not get smaller or larger when the text is offset from its default

y position. Nor does it change the size of the text, so the text may

appear outside of the button's bounds if the offset is large enough.

The following example offsets the y position of the button's text by

20 pixels:

```haxe

button.textOffsetY = 20.0;

```

@see `Button.textOffsetX`

@since 1.0.0

**/

@:style

public var textOffsetY:Float = 0.0;

/**

Shows or hides the button text. If the text is hidden, it will not

affect the layout of other children, such as the icon.

@since 1.0.0

**/

@:style

public var showText:Bool = true;

private var _textMeasuredWidth:Float;

private var _textMeasuredHeight:Float;

private var _wrappedOnMeasure:Bool = false;

private var _stateToTextFormat:Map<ButtonState, AbstractTextFormat> = new Map();

override public function dispose():Void {

if (this._previousTextFormat != null) {

this._previousTextFormat.removeEventListener(Event.CHANGE, button_textFormat_changeHandler);

this._previousTextFormat = null;

}

super.dispose();

}

/**

Gets the text format to be used by the button when its `currentState`

property matches the specified state value.

If a text format is not defined for a specific state, returns `null`.

@see `Button.setTextFormatForState()`

@see `Button.textFormat`

@see `Button.currentState`

@see `feathers.controls.ButtonState`

@since 1.0.0

**/

public function getTextFormatForState(state:ButtonState):AbstractTextFormat {

return this._stateToTextFormat.get(state);

}

/**

Set the text format to be used by the button when its `currentState`

property matches the specified state value.

If a text format is not defined for a specific state, the value of the

`textFormat` property will be used instead.

@see `Button.getTextFormatForState()`

@see `Button.textFormat`

@see `Button.currentState`

@see `feathers.controls.ButtonState`

@since 1.0.0

**/

@style

public function setTextFormatForState(state:ButtonState, textFormat:AbstractTextFormat):Void {

if (!this.setStyle("setTextFormatForState", state)) {

return;

}

if (textFormat == null) {

this._stateToTextFormat.remove(state);

} else {

this._stateToTextFormat.set(state, textFormat);

}

this.setInvalid(STYLES);

}

/**

Gets the icon to be used by the button when its `currentState` property

matches the specified state value.

If an icon is not defined for a specific state, returns `null`.

@see `Button.setIconForState()`

@see `Button.icon`

@see `Button.currentState`

@see `feathers.controls.ButtonState`

@since 1.0.0

**/

public function getIconForState(state:ButtonState):DisplayObject {

return this._stateToIcon.get(state);

}

/**

Set the icon to be used by the button when its `currentState` property

matches the specified state value.

If an icon is not defined for a specific state, the value of the

`textFormat` property will be used instead.

@see `Button.getIconForState()`

@see `Button.icon`

@see `Button.currentState`

@see `feathers.controls.ButtonState`

@since 1.0.0

**/

@style

public function setIconForState(state:ButtonState, icon:DisplayObject):Void {

if (!this.setStyle("setIconForState", state)) {

return;

}

var oldIcon = this._stateToIcon.get(state);

if (oldIcon != null && oldIcon == this._currentIcon) {

this.removeCurrentIcon(oldIcon);

this._currentIcon = null;

}

if (icon == null) {

this._stateToIcon.remove(state);

} else {

this._stateToIcon.set(state, icon);

}

this.setInvalid(STYLES);

}

/**

Sets all four padding properties to the same value.

@see `Button.paddingTop`

@see `Button.paddingRight`

@see `Button.paddingBottom`

@see `Button.paddingLeft`

@since 1.0.0

**/

public function setPadding(value:Float):Void {

this.paddingTop = value;

this.paddingRight = value;

this.paddingBottom = value;

this.paddingLeft = value;

}

private function initializeButtonTheme():Void {

#if !feathersui_disable_default_theme

feathers.themes.steel.components.SteelButtonStyles.initialize();

#end

}

override private function initialize():Void {

super.initialize();

if (this.textField == null) {

this.textField = new TextField();

this.textField.selectable = false;

this.textField.multiline = true;

this.addChild(this.textField);

}

}

override private function commitChanges():Void {

super.commitChanges();

var dataInvalid = this.isInvalid(DATA);

var sizeInvalid = this.isInvalid(SIZE);

var stateInvalid = this.isInvalid(STATE);

var stylesInvalid = this.isInvalid(STYLES);

this._updatedTextStyles = false;

if (stylesInvalid || stateInvalid) {

this.refreshIcon();

}

if (stylesInvalid || stateInvalid) {

this.refreshTextStyles();

}

if (dataInvalid || stylesInvalid || stateInvalid || sizeInvalid) {

this.refreshText(sizeInvalid);

}

}

override private function measure():Bool {

var needsWidth = this.explicitWidth == null;

var needsHeight = this.explicitHeight == null;

var needsMinWidth = this.explicitMinWidth == null;

var needsMinHeight = this.explicitMinHeight == null;

var needsMaxWidth = this.explicitMaxWidth == null;

var needsMaxHeight = this.explicitMaxHeight == null;

if (!needsWidth && !needsHeight && !needsMinWidth && !needsMinHeight && !needsMaxWidth && !needsMaxHeight) {

return false;

}

var hasText = this.showText && this._text != null;

var hasHTMLText = this.showText && this._htmlText != null && this._htmlText.length > 0;

if (hasText || hasHTMLText) {

this.refreshTextFieldDimensions(true);

}

if (this._currentBackgroundSkin != null) {

MeasurementsUtil.resetFluidlyWithParent(this._backgroundSkinMeasurements, this._currentBackgroundSkin, this);

}

var measureSkin:IMeasureObject = null;

if ((this._currentBackgroundSkin is IMeasureObject)) {

measureSkin = cast this._currentBackgroundSkin;

}

if ((this._currentBackgroundSkin is IValidating)) {

(cast this._currentBackgroundSkin : IValidating).validateNow();

}

if ((this._currentIcon is IValidating)) {

var oldIgnoreIconResizes = this._ignoreIconResizes;

this._ignoreIconResizes = true;

(cast this._currentIcon : IValidating).validateNow();

this._ignoreIconResizes = oldIgnoreIconResizes;

}

var newWidth = this.explicitWidth;

if (needsWidth) {

newWidth = this.measureContentWidth();

newWidth += this.paddingLeft + this.paddingRight;

if (this._currentBackgroundSkin != null) {

newWidth = Math.max(this._currentBackgroundSkin.width, newWidth);

}

}

var newHeight = this.explicitHeight;

if (needsHeight) {

newHeight = this.measureContentHeight();

newHeight += this.paddingTop + this.paddingBottom;

if (this._currentBackgroundSkin != null) {

newHeight = Math.max(this._currentBackgroundSkin.height, newHeight);

}

}

var newMinWidth = this.explicitMinWidth;

if (needsMinWidth) {

newMinWidth = this.measureContentMinWidth();

newMinWidth += this.paddingLeft + this.paddingRight;

if (measureSkin != null) {

newMinWidth = Math.max(measureSkin.minWidth, newMinWidth);

} else if (this._backgroundSkinMeasurements != null && this._backgroundSkinMeasurements.minWidth != null) {

newMinWidth = Math.max(this._backgroundSkinMeasurements.minWidth, newMinWidth);

}

}

var newMinHeight = this.explicitMinHeight;

if (needsMinHeight) {

newMinHeight = this.measureContentMinHeight();

newMinHeight += this.paddingTop + this.paddingBottom;

if (measureSkin != null) {

newMinHeight = Math.max(measureSkin.minHeight, newMinHeight);

} else if (this._backgroundSkinMeasurements != null && this._backgroundSkinMeasurements.minHeight != null) {

newMinHeight = Math.max(this._backgroundSkinMeasurements.minHeight, newMinHeight);

}

}

var newMaxWidth = this.explicitMaxWidth;

if (needsMaxWidth) {

if (measureSkin != null) {

newMaxWidth = measureSkin.maxWidth;

} else if (this._backgroundSkinMeasurements != null && this._backgroundSkinMeasurements.maxWidth != null) {

newMaxWidth = this._backgroundSkinMeasurements.maxWidth;

} else {

newMaxWidth = 1.0 / 0.0; // Math.POSITIVE_INFINITY bug workaround for swf

}

}

var newMaxHeight = this.explicitMaxHeight;

if (needsMaxHeight) {

if (measureSkin != null) {

newMaxHeight = measureSkin.maxHeight;

} else if (this._backgroundSkinMeasurements != null && this._backgroundSkinMeasurements.maxHeight != null) {

newMaxHeight = this._backgroundSkinMeasurements.maxHeight;

} else {

newMaxHeight = 1.0 / 0.0; // Math.POSITIVE_INFINITY bug workaround for swf

}

}