Remove View::id prop in favor of NameTrait::name

README.md

@@ -61,7 +61,6 @@ $app = new \Atk4\Ui\App();
 $app->initLayout([\Atk4\Ui\Layout\Centered::class]);
 
 $form = \Atk4\Ui\Form::addTo($app);
-
 $form->addField('email');
 $form->onSubmit(function (Form $form) {
     // implement subscribe here
@@ -93,7 +92,8 @@ $app = new \Atk4\Ui\App('hello world');
 $app->initLayout([\Atk4\Ui\Layout\Admin::class]);
 $app->db = \Atk4\Data\Persistence::connect('mysql://user:pass@localhost/atk');
 
-\Atk4\Ui\Crud::addTo($app)->setModel(new User($app->db));
+\Atk4\Ui\Crud::addTo($app)
+    ->setModel(new User($app->db));
 ```
 
 ATK Data allows you to set up relations between models:
@@ -104,7 +104,7 @@ class User extends Model {
         parent::init();
 
         $this->addField('name');
-        $this->addField('gender', ['enum' => 'female','male','other']);
+        $this->addField('gender', ['enum' => 'female', 'male', 'other']);
         $this->hasMany('Purchases', ['model' => [Purchase::class]]);
     }
 }
@@ -117,10 +117,10 @@ use \Atk4\Mastercrud\MasterCrud;
 
 // set up $app here
 
-$master_crud = MasterCrud::addTo($app);
-$master_crud->setModel(new User($app->db), [
-    'Purchases' => []
-]);
+$master_crud = MasterCrud::addTo($app)
+    ->setModel(new User($app->db), [
+        'Purchases' => [],
+    ]);
 
 ```
 
@@ -136,7 +136,7 @@ As of version 2.0 - Agile Toolkit offers support for User Actions. Those are eas
 
 ``` php
 $this->addAction('archive', function (Model $m) {
-    $m->get('is_archived') = true;
+    $m->set('is_archived', true);
     $this->saveAndUnload();
 });
 ```
@@ -159,15 +159,17 @@ $tabs = \Atk4\Ui\Tabs::addTo($app);
 $tabs->addTab('Users', function (\Atk4\Ui\VirtualPage $p) use ($app) {
     // this tab is loaded dynamically, but also contains dynamic component
 
-    \Atk4\Ui\Crud::addTo($p)->setModel(new User($app->db));
+    \Atk4\Ui\Crud::addTo($p)
+        ->setModel(new User($app->db));
 });
 
 $tabs->addTab('Settings', function (\Atk4\Ui\VirtualPage $p) use ($app) {
     // second tab contains an AJAX form that stores itself back to DB
 
     $m = new Settings($app->db);
     $m = $m->load(2);
-    \Atk4\Ui\Form::addTo($p)->setModel($m);
+    \Atk4\Ui\Form::addTo($p)
+        ->setModel($m);
 });
 ```
 
@@ -210,7 +212,8 @@ class User extends \Atk4\Data\Model {
     }
 }
 
-\Atk4\Ui\Crud::addTo($app)->setModel(new User($app->db));
+\Atk4\Ui\Crud::addTo($app)
+    ->setModel(new User($app->db));
 ```
 
 The result is here:
@@ -221,7 +224,7 @@ The result is here:
 
 Agile UI comes with many built-in components:
 
-_All components can be view using the [demos](ui.agiletoolkit.org/demos) application._
+_All components can be view using the [demos](https://ui.agiletoolkit.org/demos/) application._
 
 | Component                                                    | Description                                                  | Introduced |
 | ------------------------------------------------------------ | ------------------------------------------------------------ | ---------- |

demos/_unit-test/scope-builder.php

@@ -40,7 +40,7 @@
 
 $form->onSubmit(function (Form $form) use ($model) {
     $message = $form->model->get('qb')->toWords($model);
-    $view = (new \Atk4\Ui\View(['id' => false]))->addClass('atk-scope-builder-response');
+    $view = (new \Atk4\Ui\View(['name' => false]))->addClass('atk-scope-builder-response');
     $view->invokeInit();
 
     $view->set($message);

demos/basic/columns.php

@@ -23,7 +23,7 @@
 }
 ');
 
-$page = \Atk4\Ui\View::addTo($app, ['id' => 'example']);
+$page = \Atk4\Ui\View::addTo($app, ['name' => 'example']);
 
 \Atk4\Ui\Header::addTo($page, ['Basic Usage']);
 

demos/collection/card-deck.php

@@ -6,6 +6,7 @@
 
 use Atk4\Ui\Button;
 use Atk4\Ui\Header;
+use Atk4\Ui\UserAction\ExecutorFactory;
 
 /** @var \Atk4\Ui\App $app */
 require_once __DIR__ . '/../init-app.php';
@@ -24,7 +25,7 @@
 ]);
 
 // Create custom button for this action in card.
-$app->getExecutorFactory()->registerTrigger($app->getExecutorFactory()::CARD_BUTTON, [Button::class, null, 'blue', 'icon' => 'plane'], $action);
+$app->getExecutorFactory()->registerTrigger(ExecutorFactory::CARD_BUTTON, [Button::class, null, 'blue', 'icon' => 'plane'], $action);
 
 $action->args = [
     'email' => ['type' => 'string', 'required' => true, 'caption' => 'Please let us know your email address:'],

demos/data-action/jsactionsgrid.php

@@ -7,6 +7,7 @@
 use Atk4\Core\Factory;
 use Atk4\Data\Model\UserAction;
 use Atk4\Ui\Icon;
+use Atk4\Ui\UserAction\ExecutorFactory;
 use Atk4\Ui\View;
 
 /** @var \Atk4\Ui\App $app */
@@ -20,22 +21,22 @@
 
 // creating special menu item for multi_step action.
 $multiAction = $country->getUserAction('multi_step');
-$specialItem = Factory::factory([View::class], ['id' => false, 'class' => ['item'], 'content' => 'Multi Step']);
+$specialItem = Factory::factory([View::class], ['name' => false, 'class' => ['item'], 'content' => 'Multi Step']);
 Icon::addTo($specialItem, ['content' => 'window maximize outline']);
 // register this menu item in factory.
-$app->getExecutorFactory()->registerTrigger($app->getExecutorFactory()::TABLE_MENU_ITEM, $specialItem, $multiAction);
+$app->getExecutorFactory()->registerTrigger(ExecutorFactory::TABLE_MENU_ITEM, $specialItem, $multiAction);
 
 \Atk4\Ui\Header::addTo($app, ['Execute model action from Grid menu items', 'subHeader' => 'Setting grid menu items in order to execute model actions or javascript.']);
 
 $grid = \Atk4\Ui\Grid::addTo($app, ['menu' => false]);
 $grid->setModel($country);
 
-$divider = Factory::factory([View::class], ['id' => false, 'class' => ['divider'], 'content' => '']);
+$divider = Factory::factory([View::class], ['name' => false, 'class' => ['divider'], 'content' => '']);
 
-$modelHeader = Factory::factory([View::class], ['id' => false, 'class' => ['header'], 'content' => 'Model Actions']);
+$modelHeader = Factory::factory([View::class], ['name' => false, 'class' => ['header'], 'content' => 'Model Actions']);
 Icon::addTo($modelHeader, ['content' => 'database']);
 
-$jsHeader = Factory::factory([View::class], ['id' => false, 'class' => ['header'], 'content' => 'Js Actions']);
+$jsHeader = Factory::factory([View::class], ['name' => false, 'class' => ['header'], 'content' => 'Js Actions']);
 Icon::addTo($jsHeader, ['content' => 'file code']);
 
 $grid->addActionMenuItem($jsHeader);

demos/javascript/js.php

@@ -19,7 +19,7 @@
 $b->js(true)->hide();
 
 // This button hides when clicked
-$b = Button::addTo($app, ['id' => 'b2'])->set('Hide on click Button');
+$b = Button::addTo($app, ['name' => 'b2'])->set('Hide on click Button');
 $b->js('click')->hide();
 
 Button::addTo($app, ['Redirect'])->on('click', null, $app->jsRedirect(['foo' => 'bar']));

docs/render.rst

@@ -91,7 +91,7 @@ will create its own tree independent from the main one.
 Agile UI sometimes uses the following approach to render element on the outside:
 
 1. Create new instance of $sub_view.
-2. Set $sub_view->id = false;
+2. Set $sub_view->name = false;
 3. Calls $view->add($sub_view);
 4. executes $sub_view->renderHtml()
 

docs/view.rst

@@ -203,12 +203,12 @@ If you happen to pass more key/values to the constructor or as second argument
 to add() they will be treated as default values for the properties of that
 specific view::
 
-    $view = View::addTo($app, ['ui' => 'segment', 'id' => 'test-id']);
+    $view = View::addTo($app, ['ui' => 'segment', 'name' => 'test-id']);
 
 For a more IDE-friendly format, however, I recommend to use the following syntax::
 
     $view = View::addTo($app, ['ui' => 'segment']);
-    $view->id = 'test-id';
+    $view->name = 'test-id';
 
 You must be aware of a difference here - passing array to constructor will
 override default property before call to `init()`. Most of the components
@@ -222,7 +222,7 @@ If you are don't specify key for the properties, they will be considered an
 extra class for a view::
 
     $view = View::addTo($app, ['inverted', 'orange', 'ui' => 'segment']);
-    $view->id = 'test-id';
+    $view->name = 'test-id';
 
 You can either specify multiple classes one-by-one or as a single string
 "inverted orange".
@@ -407,9 +407,9 @@ Unique ID tag
 
     ID to be used with the top-most element.
 
-Agile UI will maintain unique ID for all the elements. The tag is set through 'id' property::
+Agile UI will maintain unique ID for all the elements. The tag is set through 'name' property::
 
-    $b = new \Atk4\Ui\Button(['id' => 'my-button3']);
+    $b = new \Atk4\Ui\Button(['name' => 'my-button3']);
     echo $b->render();
 
 Outputs:

src/Card.php

@@ -26,6 +26,7 @@
 
 use Atk4\Core\Factory;
 use Atk4\Data\Model;
+use Atk4\Ui\UserAction\ExecutorFactory;
 
 class Card extends View
 {
@@ -285,7 +286,7 @@ public function addClickAction(Model\UserAction $action, Button $button = null,
     {
         $defaults = [];
 
-        $btn = $this->addButton($button ?? $this->getExecutorFactory()->createTrigger($action, $this->getExecutorFactory()::CARD_BUTTON));
+        $btn = $this->addButton($button ?? $this->getExecutorFactory()->createTrigger($action, ExecutorFactory::CARD_BUTTON));
 
         // Setting arg for model id. $args[0] is consider to hold a model id, i.e. as a js expression.
         if ($this->model && $this->model->isLoaded() && !isset($args[0])) {

src/CardDeck.php

@@ -10,6 +10,7 @@
 use Atk4\Core\Factory;
 use Atk4\Data\Model;
 use Atk4\Ui\Component\ItemSearch;
+use Atk4\Ui\UserAction\ExecutorFactory;
 use Atk4\Ui\UserAction\ExecutorInterface;
 
 class CardDeck extends View
@@ -327,7 +328,7 @@ protected function addExecutorMenuButton(ExecutorInterface $executor): AbstractV
             $defaults['args'] = $args;
         }
 
-        $btn = $this->btns->add($this->getExecutorFactory()->createTrigger($executor->getAction(), $this->getExecutorFactory()::CARD_BUTTON));
+        $btn = $this->btns->add($this->getExecutorFactory()->createTrigger($executor->getAction(), ExecutorFactory::CARD_BUTTON));
         if ($executor->getAction()->enabled === false) {
             $btn->addClass('disabled');
         }

src/Crud.php

@@ -6,6 +6,7 @@
 
 use Atk4\Core\Factory;
 use Atk4\Data\Model;
+use Atk4\Ui\UserAction\ExecutorFactory;
 
 /**
  * Implements a more sophisticated and interactive Data-Table component.
@@ -118,7 +119,7 @@ public function setModel(Model $model, array $fields = null): void
                 if ($action->enabled) {
                     $executor = $this->initActionExecutor($action);
                     $this->menuItems[$k]['item'] = $this->menu->addItem(
-                        $this->getExecutorFactory()->createTrigger($action, $this->getExecutorFactory()::MENU_ITEM)
+                        $this->getExecutorFactory()->createTrigger($action, ExecutorFactory::MENU_ITEM)
                     );
                     $this->menuItems[$k]['executor'] = $executor;
                 }

src/Form/Control.php

@@ -157,7 +157,7 @@ public function onChange($expr, $default = [])
             $default['stopPropagation'] = $default;
         }
 
-        $this->on('change', '#' . $this->id . '_input', $expr, $default);
+        $this->on('change', '#' . $this->name . '_input', $expr, $default);
     }
 
     /**
@@ -170,7 +170,7 @@ public function onChange($expr, $default = [])
      */
     public function jsInput($when = null, $action = null)
     {
-        return $this->js($when, $action, '#' . $this->id . '_input');
+        return $this->js($when, $action, '#' . $this->name . '_input');
     }
 
     /**

src/Form/Control/Calendar.php

@@ -105,7 +105,7 @@ public function onChange($expr, $default = [])
      */
     public function getJsInstance(): JsExpression
     {
-        return (new Jquery('#' . $this->id . '_input'))->get(0)->_flatpickr;
+        return (new Jquery('#' . $this->name . '_input'))->get(0)->_flatpickr;
     }
 
     private function expandPhpDtFormat(string $phpFormat): string

src/Form/Control/Dropdown.php

@@ -134,7 +134,7 @@ public function getInput()
         return $this->getApp()->getTag('input', array_merge([
             'name' => $this->short_name,
             'type' => $this->inputType,
-            'id' => $this->id . '_input',
+            'id' => $this->name . '_input',
             'value' => $this->getValue(),
             'readonly' => $this->readonly ? 'readonly' : false,
             'disabled' => $this->disabled ? 'disabled' : false,

src/Form/Control/Input.php

@@ -9,6 +9,7 @@
 use Atk4\Ui\Form;
 use Atk4\Ui\Icon;
 use Atk4\Ui\Label;
+use Atk4\Ui\UserAction\ExecutorFactory;
 use Atk4\Ui\UserAction\JsCallbackExecutor;
 
 /**
@@ -109,7 +110,7 @@ public function getInput()
             'name' => $this->short_name,
             'type' => $this->inputType,
             'placeholder' => $this->placeholder,
-            'id' => $this->id . '_input',
+            'id' => $this->name . '_input',
             'value' => $this->getValue(),
             'readonly' => $this->readonly ? 'readonly' : false,
             'disabled' => $this->disabled ? 'disabled' : false,
@@ -155,7 +156,7 @@ protected function prepareRenderButton($button, $spot)
         }
         if ($button instanceof UserAction || $button instanceof JsCallbackExecutor) {
             $executor = ($button instanceof UserAction)
-                ? $this->getExecutorFactory()->create($button, $this, $this->getExecutorFactory()::JS_EXECUTOR)
+                ? $this->getExecutorFactory()->create($button, $this, ExecutorFactory::JS_EXECUTOR)
                 : $button;
             $button = $this->add($this->getExecutorFactory()->createTrigger($executor->getAction()), $spot);
             $this->addClass('action');

src/Form/Control/Lookup.php

@@ -344,7 +344,7 @@ public function getInput()
         return $this->getApp()->getTag('input', array_merge([
             'name' => $this->short_name,
             'type' => 'hidden',
-            'id' => $this->id . '_input',
+            'id' => $this->name . '_input',
             'value' => $this->getValue(),
             'readonly' => $this->readonly ? 'readonly' : false,
             'disabled' => $this->disabled ? 'disabled' : false,

src/Form/Control/Textarea.php

@@ -26,7 +26,7 @@ public function getInput()
                 'type' => $this->inputType,
                 'rows' => $this->rows,
                 'placeholder' => $this->placeholder,
-                'id' => $this->id . '_input',
+                'id' => $this->name . '_input',
                 'readonly' => $this->readonly ? 'readonly' : false,
                 'disabled' => $this->disabled ? 'disabled' : false,
             ], $this->inputAttr),

src/Form/Control/TreeItemSelector.php

@@ -46,9 +46,16 @@ class TreeItemSelector extends Form\Control
      *
      * Each item may have it's own children by adding nodes children to it.
      *   $items = [
-     *       ['name' => 'Electronics', 'id' => 'P100', 'nodes' => [['name' => 'Phone', 'id' => 'P100', 'nodes' => [['name' => 'iPhone', 'id' => 502], ['name' => 'Google Pixels', 'id' => 503]]], ['name' => 'Tv' , 'id' => 501], ['name' => 'Radio' , 'id' => 601]]],
+     *       ['name' => 'Electronics', 'id' => 'P100', 'nodes' => [
+     *           ['name' => 'Phone', 'id' => 'P100', 'nodes' => [
+     *               ['name' => 'iPhone', 'id' => 502],
+     *               ['name' => 'Google Pixels', 'id' => 503],
+     *           ]],
+     *           ['name' => 'Tv' , 'id' => 501],
+     *           ['name' => 'Radio' , 'id' => 601],
+     *       ]],
      *       ['name' => 'Cleaner' , 'id' => 201],
-     *       ['name' => 'Appliances' , 'id' => 301]
+     *       ['name' => 'Appliances' , 'id' => 301],
      *   ];
      *
      * When adding nodes array into an item, it will automatically be treated as a group unless empty.

src/Form/Layout.php

@@ -198,7 +198,7 @@ protected function recursiveRender(): void
             // Controls get extra pampering
             $template->dangerouslySetHtml('Input', $element->getHtml());
             $template->trySet('label', $label);
-            $template->trySet('label_for', $element->id . '_input');
+            $template->trySet('label_for', $element->name . '_input');
             $template->set('control_class', $element->getControlClass());
 
             if ($element->entityField->getField()->required) {
@@ -211,7 +211,7 @@ protected function recursiveRender(): void
 
             if ($element->hint && $template->hasTag('Hint')) {
                 $hint = Factory::factory($this->defaultHint);
-                $hint->id = $element->id . '_hint';
+                $hint->name = $element->name . '_hint';
                 if (is_object($element->hint) || is_array($element->hint)) {
                     $hint->add($element->hint);
                 } else {