Custom:Button-Card - Time based custom field?

Ok, I’ve been searching my butt off to try and get this to work…
However, it seems I can’t find the right solution.

I want to create a custom card template as follow:

welcome:
  tap_action:
    action: "none"
  show_icon: false
  show_label: true
  show_name: true
  styles:
    card:
      - background-color: "none"
      - box-shadow: "none"
      - height: "auto"
      - width: "auto"
      - margin-top: "6px"
      - margin-bottom: "0px"
      - padding: "1em"
      - border: "none"
    grid:
      - grid-template-areas: "'welcome' 'l'"
      - grid-template-columns: "1fr"
      - grid-template-rows: "min-content min-content"
    name:
      - justify-self: "start"
      - font-weight: "bold"
      - font-size: "2rem"
      - font-family: "Merriweather"
      - white-space: "normal"
    label:
      - justify-self: "start"
      - font-size: "1rem"
      - opacity: "0.4"
      - font-family: "Arial"
    custom_fields:
      welcome:
        - justify-self: "start"
        - font-weight: "bold"
        - font-size: "2rem"
        - font-family: "Merriweather"
        - white-space: "normal"
  custom_fields:
    welcome: |
      [[[
        if (now().hour < 12)
          return `Good morning.`
        else if (now().hour < 18)
          return `Good afternoon.`
        else if (now().hour < 23)
          return `Good evening.`
        else
        return `Good night.`
      ]]]

But it is not showing up …
image

Replacing

| 
with
|- or > or >-

doesn’t do anything.

if I replace

|
      [[[
        if (now().hour < 12)
          return `Good morning.`
        else if (now().hour < 18)
          return `Good afternoon.`
        else if (now().hour < 23)
          return `Good evening.`
        else
        return `Good night.`
      ]]]

with a simple “test”, then it shows up.’
image

Can anyone help me figure out how I can get this to work?
any guidance would be very helpful!