ConfigurableComponentInterface

Type
Interface
Namespace
craft\base
Extends
craft\base\ComponentInterface
Implemented by
craft\base\ConfigurableComponent, craft\base\ElementAction, craft\base\ElementActionInterface, craft\base\Field, craft\base\Fs, craft\base\SavableComponent, craft\base\SavableComponentInterface, craft\base\Widget, craft\elements\actions\CopyReferenceTag, craft\elements\actions\CopyUrl, craft\elements\actions\Delete, craft\elements\actions\DeleteAssets, craft\elements\actions\DeleteForSite, craft\elements\actions\DeleteUsers, craft\elements\actions\DownloadAssetFile, craft\elements\actions\Duplicate, craft\elements\actions\Edit, craft\elements\actions\EditImage, craft\elements\actions\MoveAssets, craft\elements\actions\NewChild, craft\elements\actions\NewSiblingAfter, craft\elements\actions\NewSiblingBefore, craft\elements\actions\PreviewAsset, craft\elements\actions\RenameFile, craft\elements\actions\ReplaceFile, craft\elements\actions\Restore, craft\elements\actions\SetStatus, craft\elements\actions\SuspendUsers, craft\elements\actions\UnsuspendUsers, craft\elements\actions\View, craft\fields\Assets, craft\fields\BaseOptionsField, craft\fields\BaseRelationField, craft\fields\Categories, craft\fields\Checkboxes, craft\fields\Color, craft\fields\Country, craft\fields\Date, craft\fields\Dropdown, craft\fields\Email, craft\fields\Entries, craft\fields\Lightswitch, craft\fields\Matrix, craft\fields\MissingField, craft\fields\Money, craft\fields\MultiSelect, craft\fields\Number, craft\fields\PlainText, craft\fields\RadioButtons, craft\fields\Table, craft\fields\Tags, craft\fields\Time, craft\fields\Url, craft\fields\Users, craft\fs\Local, craft\fs\MissingFs, craft\fs\Temp, craft\mail\transportadapters\BaseTransportAdapter, craft\mail\transportadapters\Gmail, craft\mail\transportadapters\Sendmail, craft\mail\transportadapters\Smtp, craft\mail\transportadapters\TransportAdapterInterface, craft\widgets\CraftSupport, craft\widgets\Feed, craft\widgets\MissingWidget, craft\widgets\MyDrafts, craft\widgets\NewUsers, craft\widgets\QuickPost, craft\widgets\RecentEntries, craft\widgets\Updates
Since
3.5.0

ConfigurableComponentInterface defines the common interface to be implemented by Craft component classes which are configurable.

A class implementing this interface should extend craft\base\Model.

View source (opens new window)

# Public Methods

Method Description
displayName() Returns the display name of this class.
extraFields() (opens new window) Returns the list of additional fields that can be returned by toArray() (opens new window) in addition to those listed in fields() (opens new window).
fields() (opens new window) Returns the list of fields that should be returned by default by toArray() (opens new window) when no specific fields are specified.
getSettings() Returns an array of the component’s settings.
getSettingsHtml() Returns the component’s settings HTML.
instance() (opens new window) Returns static class instance, which can be used to obtain meta information.
isSelectable() Returns whether the component should be selectable in component Type selects.
settingsAttributes() Returns the list of settings attribute names.
toArray() (opens new window) Converts the object into an array.

# getSettings()

Returns an array of the component’s settings.

View source (opens new window)

Returns

array (opens new window) – The component’s settings.

# getSettingsHtml()

Returns the component’s settings HTML.

An extremely simple implementation would be to directly return some HTML:

return '<textarea name="foo">'.$this->foo.'</textarea>';

For more complex settings, you might prefer to create a template, and render it via craft\web\View::renderTemplate(). For example, the following code would render a template located at src/templates/_settings.html, passing the settings to it:

return Craft::$app->view->renderTemplate('plugin-handle/_widget-settings', [
    'widget' => $this
]);

If you need to tie any JavaScript code to your settings, it’s important to know that any name and id attributes within the returned HTML will probably get namespaced, however your JavaScript code will be left untouched. For example, if getSettingsHtml() returns the following HTML:

<textarea id="foo" name="foo"></textarea>
<script type="text/javascript">
  var textarea = document.getElementById('foo');
</script>

…then it might actually look like this before getting output to the browser:

<textarea id="namespace-foo" name="namespace[foo]"></textarea>
<script type="text/javascript">
  var textarea = document.getElementById('foo');
</script>

As you can see, that JavaScript code will not be able to find the textarea, because the textarea’s id attribute was changed from foo to namespace-foo. Before you start adding namespace- to the beginning of your element ID selectors, keep in mind that the actual namespace is going to change depending on the context. Often they are randomly generated. So it’s not quite that simple.

Thankfully, Craft provides a couple handy methods that can help you deal with this:

So here’s what a getSettingsHtml() method that includes field-targeting JavaScript code might look like:

public function getSettingsHtml(): ?string
{
    // Figure out what the ID is going to be namespaced into
    $id = 'foo';
    $namespacedId = Craft::$app->view->namespaceInputId($id);
    // Render and return the input template
    return Craft::$app->view->renderTemplate('plugin-handle/_widget-settings', [
        'id' => $id,
        'namespacedId' => $namespacedId,
        'widget' => $this,
    ]);
}

And the _widget-settings.twig template might look like this:

<textarea id="{{ id }}" name="foo">{{ widget.foo }}</textarea>
<script type="text/javascript">
  var textarea = document.getElementById('{{ namespacedId }}');
</script>

The same principles also apply if you’re including your JavaScript code with craft\web\View::registerJs().

View source (opens new window)

Returns

string (opens new window), null (opens new window)

# settingsAttributes()

Returns the list of settings attribute names.

By default, this method returns all public non-static properties that were defined on the called class. You may override this method to change the default behavior.

See also getSettings() View source (opens new window)

Returns

string (opens new window)[] – The list of settings attribute names