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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: slots #427

Closed
mbrodala opened this issue Feb 14, 2019 · 4 comments
Closed

Feature: slots #427

mbrodala opened this issue Feb 14, 2019 · 4 comments

Comments

@mbrodala
Copy link
Contributor

The contentAs argument provided by Fluid is very useful to pass arbitrary content as variable to a partial/section.

However, this is limited to a single variable, if multiple pieces of content should be passed, one has to e.g. resort to doing inline f:render calls within arguments instead.

A nice solution to this would be a system similar to Vue.js component slots.

Basic example

Example.html template:

<f:render partial="Foo" arguments="{as: 'usual'}">
Some content with<f:if condition="{lie}">out</f:if> regular Fluid.
</f:render>

Foo.html partial:

Just the {as}:
<f:slot/>

Named slots example

Example.html template:

<f:render partial="BaseLayout">
  <f:template slot="header">
    <h1>Here might be a page title</h1>
  </f:template>

  <p>A paragraph for the main content.</p>
  <p>And another one.</p>

  <f:template slot="footer">
    <p>Here's some contact info</p>
  </f:template>
</f:render>

BaseLayout.html partial:

<div class="container">
  <header>
    <f:slot name="header"/>
  </header>
  <main>
    <!-- Slot without name renders the content not encapsulated in `f:template` -->
    <f:slot/>
  </main>
  <footer>
    <f:slot name="footer"/>
  </footer>
</div>

If we stick to the same naming or use something like argument is up to discussion of course as is this feature in general.

@NamelessCoder
Copy link
Contributor

Perhaps easier implemented and understood if using f:variable - hypothetical and unsupported currently:

<f:render partial="Something">
   <f:variable name="arg1">Special value for arg1 variable</f:variable>
   <f:variable name="arg2">Special value for arg2 variable</f:variable>
</f:render>

The result being that in addition to, or instead of, assigning these variables only when rendering the content and then clearing them before actually rendering the partial or whatnot - the variables would be redirected to be collected as arguments for calling the partial.

This could be implemented with very little effort (toggle set in ViewHelperVariableContainer by f:render and respected by f:variable then extracting variables before sub-rendering) and has the benefit that it only uses already supported features but makes them work slightly different when used in f:render.

Bonus: it becomes excessively easy to declare long-winded, non-inline, HTML-carrying, not-escaped variables this way since this would work regardless of contentAs and for any type of render statement as a means to expand arguments.

Bonus-bonus: we avoid known issues with recursive regexp in huge inline array expressions.

@NamelessCoder
Copy link
Contributor

PoC coming right up, actually.

NamelessCoder added a commit to NamelessCoder/Fluid that referenced this issue Feb 14, 2019
This patch allows you to define arguments that get passed to
f:render by using f:variable in the tag contents.

```xml
<f:render partial="Something">
   <f:variable name="arg1">Special value for arg1 variable</f:variable>
   <f:variable name="arg2">Special value for arg2 variable</f:variable>
</f:render>
```

Any argument specified with f:variable this way will override
the argument of the same name if it was passed in the “arguments”
array as well. The combined result will be used as variables for the
sub-rendering call.

References: TYPO3#427
NamelessCoder added a commit to NamelessCoder/Fluid that referenced this issue Feb 14, 2019
This patch allows you to define arguments that get passed to
f:render by using f:variable in the tag contents.

```xml
<f:render partial="Something">
   <f:variable name="arg1">Special value for arg1 variable</f:variable>
   <f:variable name="arg2">Special value for arg2 variable</f:variable>
</f:render>
```

Any argument specified with f:variable this way will override
the argument of the same name if it was passed in the “arguments”
array as well. The combined result will be used as variables for the
sub-rendering call.

References: TYPO3#427
NamelessCoder added a commit to NamelessCoder/Fluid that referenced this issue Feb 14, 2019
This patch allows you to define arguments that get passed to
f:render by using f:variable in the tag contents.

```xml
<f:render partial="Something">
   <f:variable name="arg1">Special value for arg1 variable</f:variable>
   <f:variable name="arg2">Special value for arg2 variable</f:variable>
</f:render>
```

Any argument specified with f:variable this way will override
the argument of the same name if it was passed in the “arguments”
array as well. The combined result will be used as variables for the
sub-rendering call.

References: TYPO3#427
NamelessCoder added a commit to NamelessCoder/Fluid that referenced this issue Feb 20, 2019
This patch allows you to define arguments that get passed to
f:render by using f:argument inside the tag contents.

```xml
<f:render partial="Something">
   <f:argument name="arg1">Special value for arg1 variable</f:argument>
   <f:argument name="arg2">Special value for arg2 variable</f:argument>
</f:render>
```

Any argument specified with f:variable this way will override
the argument of the same name if it was passed in the “arguments”
array as well. The combined result will be used as variables for the
sub-rendering call.

References: TYPO3#427
NamelessCoder added a commit to NamelessCoder/Fluid that referenced this issue Feb 20, 2019
This patch allows you to define arguments that get passed to
f:render by using f:argument inside the tag contents.

```xml
<f:render partial="Something">
   <f:argument name="arg1">Special value for arg1 variable</f:argument>
   <f:argument name="arg2">Special value for arg2 variable</f:argument>
</f:render>
```

Any argument specified with f:variable this way will override
the argument of the same name if it was passed in the “arguments”
array as well. The combined result will be used as variables for the
sub-rendering call.

References: TYPO3#427
sascha-egerer added a commit to sascha-egerer/Fluid that referenced this issue May 18, 2021
Add a new `f:argument` viewhelper to be able to add
arguments to a node by using `f:argument` as child node.

Usage example:
```
<my:node>
	<f:argument name="content">Hello World</f:argument>
</my:node>
```

The sequencer does now put validation errors into a stack
so we are able to revalidate a node before it is closed but
children have been parsed. So we can still show the initial
problem if e.g. a required property was not defined.

Resolves TYPO3#427
@sascha-egerer
Copy link
Contributor

sascha-egerer commented May 18, 2021

I've added an implementation for Fluid 3 in my pull request. Would be cool to get some feedback.

sascha-egerer added a commit to sascha-egerer/Fluid that referenced this issue May 18, 2021
Add a new `f:argument` viewhelper to be able to add
arguments to a node by using `f:argument` as child node.

Usage example:
```
<my:node>
	<f:argument name="content">Hello World</f:argument>
</my:node>
```

The sequencer does now put validation errors into a stack
so we are able to revalidate a node before it is closed but
children have been parsed. So we can still show the initial
problem if e.g. a required property was not defined.

Resolves TYPO3#427
@lolli42
Copy link
Member

lolli42 commented May 12, 2022

Hey.
As outlined in #591, we'll close v3 related issues for now.
I hope this is fine with you, and we may catch up on v3 codebase later again, in case development continues to happen on it.

@lolli42 lolli42 closed this as completed May 12, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants