# inviqa/mx-widgetcomponent

> Inviqa - MX Widget Component

`composer require inviqa/mx-widgetcomponent`

Canonical URL: https://packagento.com/inviqa/mx-widgetcomponent

## At a glance

- **Vendor**: inviqa (https://packagento.com/inviqa.md)
- **Latest version**: 3.0.1 — released 2020-09-15
- **Pricing**: Free
- **Package type**: Magento 2 module
- **Status**: active, accepting new buyers

## Installation

Packagento is licence-gated, so even free packages need a licence on a project before Composer can resolve them.

1. **Sign in or create an account** at https://packagento.com/customer/account/.

2. **Add the package to your account.** Open https://packagento.com/inviqa/mx-widgetcomponent and complete the free checkout. A licence is minted automatically.

3. **Create or pick a project, then activate the licence on it.**
   - Projects represent the Magento installs you deploy to. Manage them at https://packagento.com/projects/.
   - Activate the new licence on the project you'll deploy this package to. Activation is what generates the Composer credentials scoped to that project.

4. **Add the project credentials to your Magento codebase.**

   Grab the project's public + private key from https://packagento.com/projects/ (open the project, then its Credentials tab), and add them to `auth.json`:

   ```json
   {
     "http-basic": {
       "packagento.com": {
         "username": "ppk_live_...",
         "password": "psk_live_..."
       }
     }
   }
   ```

   Add the Packagento Composer repository to `composer.json`:

   ```json
   {
     "repositories": [
       { "type": "composer", "url": "https://packagento.com" }
     ]
   }
   ```

5. **Install and apply.**

   ```bash
   composer require inviqa/mx-widgetcomponent:*
   bin/magento setup:upgrade
   bin/magento setup:di:compile
   bin/magento cache:flush
   ```

## What it does

Inviqa - MX Widget Component

## README

The module provides useful widget components to be able to create complex widgets in Magento 2.

### List of available components

#### Image Picker
Allows to use the cms image uploader on the widget forms, which makes it easy to upload/select an image for the widget.

Features of this component:
- Upload cms image
- Select already uploaded cms image
- Configurable image choose button label
- Restrict the allowed images by with/height
- Restrict the allowed images by file size
- (allowed file types are configured in the cms module OOB)

#### Video Picker
Allows to use the cms uploader on the widget forms, which makes it easy to upload/select an video for the widget.

Features of this component:
- Upload cms video
- Select already uploaded cms video
- Configurable video choose button label
- Restrict the allowed videos by file size
- (allowed file types are configured in the specific xml file)

#### Date Picker
Allows to pick date using the default datepicker js component.

Features of this component:
- Date format is configurable
- Time format is configurable (if not provided only date chooser will appear)
- Image of the date-picker component is configurable
- Date field can be configured to be disabled (read-only)

#### Datetime Picker
Same as the datepicker component, just comes with a pre-configured time format, so it will appear as a date-time chooser by default.

#### Textarea
Allows to use textarea on the widget forms.

Features of this component:
- Visible width of a text area (cols) is configurable
- Visible number of lines in a text area (rows) is configurable
- Maximum number of characters allowed (maxlenght) is configurable
- Dinamically shows the number of characters remaining if maxlength configured

#### Checkbox
Allows to use checkboxes on the widget form. Useful for replacing the Yes/No select which usually used.

Features of this component:
- The checkbox value is configurable (by default it is '1' when checked)

#### SubWidget
Allows to embed a widget into another widget. Useful to create custom reusable widget components. E.g. a link sub-widget which is a combination of 3 fields: url, link text and 'should open in new window' can be reused in many widget.

Features of this component:
- The label of the sub-widget cofiguration button is configurable
- Allows to embed widget in any depth (sub-widget can also have a sub-widget)


For more information please see the Usage section.

### Compatibility
Magento 2.X (tested in magento 2.0.10, 2.1.2, 2.2.3)

### Usage

#### Image Picker

```xml
<parameter name="my_param" xsi:type="block" visible="true" required="false">
    <label translate="true">Image</label>
    <block class="MX\WidgetComponent\Block\Adminhtml\Component\ImagePicker">
        <!-- Optional configuration parameters -->
        <data>
            <item name="dimension" xsi:type="array">
                <item name="max-width" xsi:type="string">500</item>
                <item name="max-height" xsi:type="string">500</item>
            </item>
            <item name="max-size" xsi:type="string">50000</item>
            <item name="button" xsi:type="array">
                <item name="open" xsi:type="string">Select Image...</item>
            </item>
        </data>
        <!-- Optional configuration parameters -->
    </block>
</parameter>

```

#### Video Picker

```xml
<parameter name="my_param" xsi:type="block" visible="true" required="false">
    <label translate="true">Video</label>
    <block class="MX\WidgetComponent\Block\Adminhtml\Component\VideoPicker">
        <!-- Optional configuration parameters -->
        <data>
            <item name="max-size" xsi:type="string">500000</item>
            <item name="button" xsi:type="array">
                <item name="open" xsi:type="string">Select Video...</item>
            </item>
        </data>
        <!-- Optional configuration parameters -->
    </block>
</parameter>

```

#### Date Picker

```xml
<parameter name="my_param" xsi:type="block" visible="true" required="false">
    <label translate="true">Date</label>
    <block class="MX\WidgetComponent\Block\Adminhtml\Component\DatePicker">
        <!-- Optional configuration parameters -->
        <data>
            <item name="dateFormat" xsi:type="string">yyyy-MM-dd</item>
            <item name="timeFormat" xsi:type="string">HH:mm:ss</item>
            <item name="image" xsi:type="string">path-to/url</item>
            <item name="disabled" xsi:type="boolean">true</item>
        </data>
        <!-- Optional configuration parameters -->
    </block>
</parameter>
```

#### Datetime Picker

```xml
<parameter name="my_param" xsi:type="block" visible="true" required="false">
    <label translate="true">Datetime</label>
    <block class="MX\WidgetComponent\Block\Adminhtml\Component\DateTimePicker">
        <!-- Optional configuration parameters -->
        <data>
            <item name="dateFormat" xsi:type="string">yyyy-MM-dd</item>
            <item name="timeFormat" xsi:type="string">HH:mm:ss</item>
            <item name="image" xsi:type="string">path-to/url</item>
            <item name="disabled" xsi:type="boolean">true</item>
        </data>
        <!-- Optional configuration parameters -->
    </block>
</parameter>
```

#### Textarea

```xml
<parameter name="my_param" xsi:type="block" visible="true" required="false">
    <label translate="true">Textarea</label>
    <block class="MX\WidgetComponent\Block\Adminhtml\Component\Textarea">
        <!-- Optional configuration parameters -->
        <data>
            <item name="cols" xsi:type="string">visible width of a text area</item>
            <item name="rows" xsi:type="string">visible number of lines in a text area</item>
            <item name="maxlength" xsi:type="string">maximum number of characters allowed in the text area</item>
        </data>
        <!-- Optional configuration parameters -->
    </block>
</parameter>
```

#### Checkbox

_(README truncated for .md surface. Full README on https://packagento.com/inviqa/mx-widgetcomponent.)_

## Recent Versions

| Version | Released |
|---|---|
| 3.0.1 | 2020-09-15 |
| 3.0.0 | 2020-06-15 |
| 2.2.1 | 2018-05-11 |
| 2.2.0 | 2018-05-11 |
| 2.1.0 | 2018-04-25 |
| 2.0.1 | 2018-02-28 |
| 2.0.0 | 2017-05-26 |
| 1.6.1 | 2017-04-21 |
| 1.6.0 | 2017-04-20 |
| 1.5.0 | 2017-04-07 |

Showing 10 of 18 versions. Full release history on https://packagento.com/inviqa/mx-widgetcomponent.

## Dependencies

### Require

| Package | Constraint |
|---|---|
| magento/framework | ^100.1\|^101.0\|^102.0\|^103.0 |
| magento/module-backend | ^100.1\|^100.2\|^101.0\|^102.0 |
| magento/module-catalog | ^101.0\|^102.0\|^103.0\|^104.0 |
| magento/module-cms | ^101.0\|^102.0\|^103.0\|^104.0 |
| magento/module-ui | ^100.1\|^101.0 |
| php | >=5.5 |
| symfony/yaml | ~2.1\|~3.0\|^4.4 |

## Quality

Latest release (3.0.1) fails the Packagento QA pipeline. Verdicts below are per-cell (Magento line × PHP version) for the matrixed tools, and run-once for the static / security tiers.


### Compatibility

Each Magento line is installed on its supported PHP versions, then the module is built (DI compile + static-content deploy). Cells show passed / failed / untested; staircase gaps render as `–`.

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | 1 | 1 | – | – |
| 2.4.8 | – | not tested | not tested | – |
| 2.4.9 | – | – | not tested | not tested |


### Code Quality

Advisory checks against the module's source. Never affect the Compatibility verdict — a phpcs finding can't make a module incompatible.

#### Static Analysis

Coding standards (phpcs), mess detection (phpmd), copy-pasted code (cpd), PHP cross-version compatibility, composer.json validity. Each runs once for the whole module.

| Tool | Status | Findings | Summary |
|---|---|---|---|
| PHPCS | Fail | 73 | 9 errors, 64 warnings (ruleset: Magento2) — 15 auto-fixable with phpcbf |
| PHPMD | Warning | 12 | 12 rule violations (MissingImport:6, UnusedFormalParameter:4, IfStatementAssignment:2) |
| Cpd | Warning | 2 | 2 duplicated chunks spanning 99 total lines (min-lines=5, min-tokens=70) |
| Composer validate | Info | 1 | valid; 1 advisory note (composer validate --strict) |

#### PHPStan

Type-checks the module against a real Magento install. Re-runs per Magento + PHP version because resolvable symbols differ between releases.

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | Error | Error | – | – |
| 2.4.8 | – | Error | Error | – |
| 2.4.9 | – | – | Error | Error |


### Tests

Unit and integration suites run per Magento + PHP cell. Test failures speak to the module's behaviour, not its compatibility with a line, so they're reported here separately.

#### Unit Tests

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | – | – |
| 2.4.8 | – | N/A | N/A | – |
| 2.4.9 | – | – | N/A | N/A |

#### Integration Tests

| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | – | – |
| 2.4.8 | – | N/A | N/A | – |
| 2.4.9 | – | – | N/A | N/A |


### Security

Dependency-advisory audit (composer audit) plus a source malware scan. A malware detection fails the version outright.

| Tool | Status | Findings | Summary |
|---|---|---|---|
| Composer audit | N/A | 0 | no resolvable dependency tree to audit — Your requirements could not be resolved to an installable set of packages. Problem 1 |
| Malware scan | Pass | 0 |  |

## Licence and pricing

Free. A licence is still minted on checkout and bound to your project for Composer access — no payment step.

Refundable within 14 days of first purchase via https://packagento.com/account/refunds/.

## Install via Claude Code or any MCP client

The Packagento MCP server can run the licence + project + Composer steps above in one tool call:

```
purchase_and_install_packages(
  composer_names=["inviqa/mx-widgetcomponent"],
  project_id="proj_xxx"
)
```

This handles cart, checkout, licence minting, project activation, and writes auth.json credentials. Connect a client with `claude mcp add packagento https://mcp.packagento.com`. Full setup at https://packagento.com/docs/mcp-setup.

## Vendor

inviqa is a Magento 2 vendor on Packagento. See https://packagento.com/inviqa.md for their full catalogue.