@aurigma/ui-framework/docs/reference/classes/auwidgetoption.md

A platform which allows building print product personalization editors based on Aurigma's Customer's Canvas.

# Class: AuWidgetOption

A widget that is used to select product options provided by an e-commerce system such as paper types, colors, sizes, etc.

For details, you can refer to the [Option widget](https://customerscanvas.com/dev/editors/ui-framework/widgets/option.html) topic.
```
{
  "widgets": [
    {
      "title": "Book Size (Inches)",
      "name": "books",
      "type": "option",
      "params": {
        "type": "list",
        "title": "Book Size (Inches)",
        "initWithEmptyValue": true,
        "placeholderText": "Select a book size",
        "values": []
      }
    },
    {
      "title": "Type of Pages",
      "name": "pages",
      "type": "option",
      "params": {
        "type": "radio",
        "subType": "compact",
        "title": "Type of Pages",
        "initWithEmptyValue": true,
        "placeholderText": "Select a type",
        "values": []
      }
    }
  ]
}
```

## Hierarchy

  ↳ [AuAbstractOption](auabstractoption.md)

  ↳ **AuWidgetOption**

## Implements

* [IWidget](../interfaces/iwidget.md)
* [IRestorableWidget](../interfaces/irestorablewidget.md)

## Index

### Properties

* [_definitionPromise](auwidgetoption.md#_definitionpromise)
* [_firstTimeInit](auwidgetoption.md#_firsttimeinit)
* [_onChange](auwidgetoption.md#_onchange)
* [definition](auwidgetoption.md#definition)
* [element](auwidgetoption.md#element)
* [order](auwidgetoption.md#order)
* [params](auwidgetoption.md#params)
* [placeholderText](auwidgetoption.md#placeholdertext)

### Accessors

* [_](auwidgetoption.md#_)
* [selected](auwidgetoption.md#selected)

### Methods

* [_manageEmptyValuesText](auwidgetoption.md#_manageemptyvaluestext)
* [checkInitDependenciesWidgets](auwidgetoption.md#checkinitdependencieswidgets)
* [clearSelection](auwidgetoption.md#clearselection)
* [exportWidgetData](auwidgetoption.md#exportwidgetdata)
* [resetPreloaderState](auwidgetoption.md#resetpreloaderstate)
* [restoreWidgetFromData](auwidgetoption.md#restorewidgetfromdata)
* [showPreloader](auwidgetoption.md#showpreloader)
* [showToast](auwidgetoption.md#showtoast)

## Properties

###  _definitionPromise

• **_definitionPromise**: *Promise‹any›* =  Promise.resolve()

*Inherited from [AuAbstractOption](auabstractoption.md).[_definitionPromise](auabstractoption.md#_definitionpromise)*

___

###  _firstTimeInit

• **_firstTimeInit**: *boolean* = true

*Inherited from [AuAbstractOption](auabstractoption.md).[_firstTimeInit](auabstractoption.md#_firsttimeinit)*

___

###  _onChange

• **_onChange**: *Function*

*Inherited from [AuAbstractOption](auabstractoption.md).[_onChange](auabstractoption.md#_onchange)*

___

###  definition

• **definition**: *IOption*

An option definition obtained from the e-commerce driver.

___

###  element

• **element**: *[AuOptionBase](auoptionbase.md)*

*Inherited from [AuAbstractOption](auabstractoption.md).[element](auabstractoption.md#element)*

An option obtained from the e-commerce driver.

___

###  order

• **order**: *IOrder*

*Inherited from [AuAbstractOption](auabstractoption.md).[order](auabstractoption.md#order)*

An order obtained from the e-commerce driver.

___

###  params

• **params**: *any*

*Implementation of [IWidget](../interfaces/iwidget.md).[params](../interfaces/iwidget.md#optional-params)*

*Inherited from [AuBaseWidget](aubasewidget.md).[params](aubasewidget.md#params)*

Compiled widget configuration.

___

###  placeholderText

• **placeholderText**: *string*

*Inherited from [AuAbstractOption](auabstractoption.md).[placeholderText](auabstractoption.md#placeholdertext)*

## Accessors

###  _

• **get _**(): *string | IOptionValue & SelectedOption*

*Inherited from [AuAbstractOption](auabstractoption.md).[_](auabstractoption.md#_)*

*Overrides [AuBaseSelectorWidget](aubaseselectorwidget.md).[_](aubaseselectorwidget.md#_)*

Returns the selected value.

**Returns:** *string | IOptionValue & SelectedOption*

___

###  selected

• **get selected**(): *string | [IWidgetOptionValue](../interfaces/iwidgetoptionvalue.md) & SelectedOption*

*Inherited from [AuAbstractOption](auabstractoption.md).[selected](auabstractoption.md#selected)*

Returns the selected value.

**Returns:** *string | [IWidgetOptionValue](../interfaces/iwidgetoptionvalue.md) & SelectedOption*

## Methods

###  _manageEmptyValuesText

▸ **_manageEmptyValuesText**(`applyEmptyValues`: boolean): *void*

*Inherited from [AuAbstractOption](auabstractoption.md).[_manageEmptyValuesText](auabstractoption.md#_manageemptyvaluestext)*

**Parameters:**

Name | Type |
------ | ------ |
`applyEmptyValues` | boolean |

**Returns:** *void*

___

###  checkInitDependenciesWidgets

▸ **checkInitDependenciesWidgets**(): *string[]*

*Inherited from [AuBaseWidget](aubasewidget.md).[checkInitDependenciesWidgets](aubasewidget.md#checkinitdependencieswidgets)*

Returns an array of widget names, due to which the current widget cannot receive parameters.

**Returns:** *string[]*

___

###  clearSelection

▸ **clearSelection**(): *void*

*Inherited from [AuAbstractOption](auabstractoption.md).[clearSelection](auabstractoption.md#clearselection)*

*Overrides [AuBaseSelectorWidget](aubaseselectorwidget.md).[clearSelection](aubaseselectorwidget.md#abstract-clearselection)*

Sets the value of the option to `null`.

**Returns:** *void*

___

###  exportWidgetData

▸ **exportWidgetData**(`force`: boolean): *Promise‹OptionsData›*

*Implementation of [IRestorableWidget](../interfaces/irestorablewidget.md)*

**Parameters:**

Name | Type |
------ | ------ |
`force` | boolean |

**Returns:** *Promise‹OptionsData›*

___

###  resetPreloaderState

▸ **resetPreloaderState**(): *void*

*Inherited from [AuBaseWidget](aubasewidget.md).[resetPreloaderState](aubasewidget.md#resetpreloaderstate)*

**Returns:** *void*

___

###  restoreWidgetFromData

▸ **restoreWidgetFromData**(`widgetData`: OptionsData, `force`: boolean): *Promise‹void›*

**Parameters:**

Name | Type |
------ | ------ |
`widgetData` | OptionsData |
`force` | boolean |

**Returns:** *Promise‹void›*

___

###  showPreloader

▸ **showPreloader**(`isPreload`: boolean, `message`: string | string[], `timeout`: number): *void*

*Inherited from [AuBaseWidget](aubasewidget.md).[showPreloader](aubasewidget.md#showpreloader)*

Shows a preloader.

```
"onClick": [
  "{{#function main.showPreloader(true, 'Creating print files...')}}",
  "{{#function $['editor'].getHiResImages(800,800)}}",
  "{{#function main.showPreloader(false)}}"
]
```

**Parameters:**

Name | Type | Default | Description |
------ | ------ | ------ | ------ |
`isPreload` | boolean | - | If `true`, enables the preloader. |
`message` | string | string[] |  [""] | A text message that appears next to the preloader.  |
`timeout` | number | 5 | - |

**Returns:** *void*

___

###  showToast

▸ **showToast**(`data?`: string, `duration?`: number): *void*

*Inherited from [AuBaseWidget](aubasewidget.md).[showToast](aubasewidget.md#showtoast)*

Shows a toast.

```
return editor.loadUserInfo(data)
    .catch(err => {
        this.widget.showToast("Error: Invalid data");
        console.log(err);
    });
```

**Parameters:**

Name | Type | Description |
------ | ------ | ------ |
`data?` | string | A string message to display in the toast. |
`duration?` | number | Defines how long to show the toast for.  |

**Returns:** *void*