Anonymous Components: "Leading dot" includes from "resources/views" (skips "components" folder)

[camya]

This idea helps to organise "Anonymous Components" in the "resources/views/" folder (omiting the "components" folder).

A component tag included in a blade file, e.g <x-web.shared.component.form.input-toggle />, loads its component class or template from a "components" subfolder.

It's impossible (without a class) to start above the "components" folder in order to organise the project files outside it .

Example for a favoured structure in "resources/views/" (Not possible with Anonymous Components)

auth/
...
web/
    shared/
        component/
            form
                input-toggle.blade.php
    frontend/
        component/
            widget
                call-to-action.blade.php
    backend/
        component/
            statistic.php
...

FEATURE REQUEST: Component include with leading dot "."

<x-.web.shared.component.form.input-toggle />

Omits component folder and starts from resources/views/ or app/View/.

I know, that this looks ugly as hell, but this is not a breaking change. (See future idea to make it less ugly)

resources/views/web/shared/component/form/input-toggle.blade.php
app/View/Web/Shared/Component/Form/InputToggle.php

Component include (current, default)

<x-web.shared.component.form.input-toggle />

Starts from resources/views/components/ or app/View/Components/.

resources/views/components/web/shared/component/form/input-toggle.blade.php
app/View/Component/Web/Shared/Components/Form/InputToggle.php

Future idea (Not part of this feature request)

This is a feature requests only for the "leading dot" syntax for Anonymous Components. The following is only a future idea.

All files are loaded from resources/views/ and app/View/ by default.

<component:web.shared.component.form.input-toggle />

<component c:view="web/shared/component/form.input-toggle" />

<component::package-name:web.shared.component.form.input-toggle />

Possible special component parameters: c:package, c:class, c:view, ...

This is a bit like the <livewire:component-name wire:model=""> syntax.

It makes it more obvious that it's a component compared to the using of the <x-component-name /> syntax.

[camya]

Implementation prototype idea only. (Not tested fully, needs changes to work with packages for sure.)

File: src/Illuminate/View/Compilers/ComponentTagCompiler.php

public function guessClassName(string $component)
{
    $componentNamespaceElement = 'Components\\';

    // Detect leading dot. Allows class path from app/View/.
    if (str_starts_with($component, '.')) {
        $componentNamespaceElement = '';
        $component = ltrim($component, '.');
    }

    $namespace = Container::getInstance()
        ->make(Application::class)
        ->getNamespace();

    $class = $this->formatClassName($component);

    return $namespace.'View\\'.$componentNamespaceElement.$class;
}

public function guessViewName($name)
{
    // Detect leading dot. Allows view path from resources/View/.
    if (str_starts_with($name, '.')) {
        return ltrim($name, '.');
    }

    $prefix = 'components.';

    $delimiter = ViewFinderInterface::HINT_PATH_DELIMITER;

    if (Str::contains($name, $delimiter)) {
        return Str::replaceFirst($delimiter, $delimiter.$prefix, $name);
    }

    return $prefix.$name;
}

[camya]

At the moment, it's possible to use the @component() syntax, which omits the components subfolder too. (Not in the latest Components documentation, deprecated? Last mentioned in Laravel 6 docs)

Unfortunately this is a completely different syntax, and the HTML-Tag syntax is much more readable.

@component('web.shared.component.form.input-toggle')@endcomponent

Loads: resources/views/web/shared/component/form/input-toggle.blade.php