Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

View class steroids 馃檶馃徑 #580

Open
fadrian06 opened this issue Apr 24, 2024 · 1 comment
Open

View class steroids 馃檶馃徑 #580

fadrian06 opened this issue Apr 24, 2024 · 1 comment

Comments

@fadrian06
Copy link
Contributor

fadrian06 commented Apr 24, 2024

Componetization syntax

Current:

<div>
  <?php View::render('myComponent', [
    'attr' => 'value'
  ] ?>
</div>

Requested馃檶馃徑馃敟

<div>
  <f-MyComponent attr="value" />
</div>
  • f prefix can be customizable
  • components folder must be defined first or /views/components is taken by default and map functions or classes
function MyComponent(array $props): string {
  return <<<html
  <div>{$props['attr']}</div>
  html;
}

// or

class MyComponentClass {
  function __construct(array $props) {
    // initialize properties, call preparation methods or whatever
  }

  function render(): string {
    // return html code
  }
}
@fadrian06
Copy link
Contributor Author

Component classes can optionally declare methods styles() that returns css in string for that component and it only be applied one time when component be used multiple times

class MyComponent {
  function render(): string {
    // render html
  }

  function styles(): string {
    return <<<css
    body {
      color-scheme: light dark;
    }
    css;

    /* or if you want to link and external file, or you want to add attributes to the <style> or <link>
    return <<<html
    <style media="print">
    </style>
    html
    */
  }
}

Add the same as styles but for JS scripts

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant