PHP code example of tekton / components

1. Go to this page and download the library: Download tekton/components library. Choose the download type require.

2. Extract the ZIP file and open the index.php.

3. Add this code to the index.php.
    
        
<?php
require_once('vendor/autoload.php');

/* Start to develop here. Best regards https://php-download.com/ */

    

tekton / components example snippets


use Tekton\Components\ComponentManager;
use Tekton\Components\ComponentCompiler;

$cacheDir = __DIR__.'/cache';
$compiler = new ComponentCompiler($cacheDir);
$compiler->registerTags('template', new TemplateTag);
$compiler->registerTags('style', new StyleTag);
$compiler->registerTags('script', new ScriptTag);

$manager = new ComponentManager($compiler);

$manager->register('button.vue');

// Register by list of components where keys are the name to register
$manager->register([
    'button' => [
        'template' => 'cache/button.html',
        'style' => 'cache/button.css',
        'script' => 'cache/button.js',
    ]
    // ...
]);

// If non-associative array is passed then it must be component files and not
// array of resources. The second argument can optionally be set to specify
// the base directory so that components in sub-dirs don't create naming conflicts
$manager->register([
    'button.vue',        // will be named "button"
    'contact/button.vue' // will be named "contact.button"
    // ...
], __DIR__);

// Register by name and component instance
$manager->register('button', new Component(['template' => 'cache/button.html']));

// Register by component path and optional base path
$manager->register('components/button.vue', 'components/');

// Register component by name and resources array
$manager->register('button', [
    'template' => 'cache/button.html',
    'style' => 'cache/button.css',
    'script' => 'cache/button.js',
]);

// From the compiler
$components = $compiler->getComponentMap();

// Or
$components = $manager->find('cache/', [
    'template' => ['html', 'php'], // Priority goes from end to beginning
    'scripts' => 'js',
    'style' => 'css',
]); // Passing (bool) true as the third argument registers them directly

$manager->register($components);

$compiler->setIgnoreCacheTime(true);

$manager->

// Combine all script files and only make one http request
$cacheScripts = $cacheDir.'/components.js';

if (! file_exists($cacheScripts)) {
    $files = $manager->resources('script');
    $combined = concat_files($files);

    file_put_contents($cacheScripts, $combined);
}

echo '<script src="'.$cacheScripts.'"></script>';

// You can validate your combined script by comparing modification time with...
$mtime = $compiler->getLastCacheUpdate();

// Or 

use Tekton\Components\ComponentManager;
use Tekton\Components\ComponentCompiler;
use Tekton\Components\Filters\ScssFilter;

$styleTag = (new StyleTag)->addPostFilter(new ScssFilter);

$cacheDir = __DIR__.'/cache';
$compiler = new ComponentCompiler($cacheDir);
$compiler->registerTags('style', $styleTag);

$manager = new ComponentManager($compiler);

use Tekton\Components\ComponentManager;
use Tekton\Components\ComponentCompiler;

use Tekton\Components\Tags\StyleTag;
use Tekton\Components\Tags\ScriptTag;
use Tekton\Components\Tags\TemplateTag;
use Tekton\Components\Filters\StyleScope;
use Tekton\Components\Filters\ScriptScope;
use Tekton\Components\Filters\TemplateScope;

$cacheDir = __DIR__.DS.'cache';
$compiler = new ComponentCompiler($cacheDir);
$compiler->registerTags('template', (new TemplateTag)->addPostFilter(new TemplateScope));
$compiler->registerTags('style', (new StyleTag)->addPostFilter(new StyleScope));
$compiler->registerTags('script', (new ScriptTag)->addPostFilter(new ScriptScope));

$manager = new ComponentManager($compiler);

// Either set it when creating the ComponentManager
$manager = new ComponentManager($compiler, MyCustomComponent::class);

// Or after
$manager->setComponentClass(MyCustomComponent::class);
html
<template lang="php">
    <div class="button">
         if (true): 
html
<section id="<?= $this->getId()