Fixing Twig Filters

alter-twig.php

@@ -5,30 +5,17 @@
  * @param $config - Config of `@basalt/twig-renderer`
  */
 function addCustomExtension(\Twig_Environment &$env, $config) {
-
-  /**
-   * @example `<h1>Hello {{ customTwigFunctionThatSaysWorld() }}!</h1>` => `<h1>Hello Custom World</h1>`
-   */
-//  $env->addFunction(new \Twig_SimpleFunction('customTwigFunctionThatSaysWorld', function () {
-//    return 'Custom World';
-//  }));
-
-  /*
-   * Reverse a string
-   * @param string $theString
-   * @example `<p>{{ reverse('abc') }}</p>` => `<p>cba</p>`
-   */
-//  $env->addFunction(new \Twig_SimpleFunction('reverse', function ($theString) {
-//    return strrev($theString);
-//  }));
-
-
-//  $env->addExtension(new \My\CustomExtension());
-
-//  `{{ foo }}` => `bar`
-//  $env->addGlobal('foo', 'bar');
-
-  // example of enabling the Twig debug mode extension (ex. {{ dump(my_variable) }} to check out the template's available data) -- comment out to disable
-  // $env->addExtension(new \Twig_Extension_Debug());
-
-}
+    $env->addFunction(new Twig_SimpleFunction('link', function ($title, $url, $attributes) {
+      if (isset($attributes) && isset($attributes['class'])) {
+        $classes = join(' ', $attributes['class']);
+        return '<a href="' . $url . '" class="' . $classes . '">' . $title . '</a>';
+      }
+      else {
+        return '<a href="' . $url . '">' . $title . '</a>';
+      }
+    }, array('is_safe' => array('html'))));
+
+    $env->addFilter(new Twig_SimpleFilter('render', function ($string) {
+      return $string;
+    }));
+}

src/_patterns/00-nds/02-molecules/navigation/navigation-local/_navigation-local-main.twig

@@ -0,0 +1,105 @@
+{#
+    ---
+    title: Navigation Local
+    ---
+    Type: Molecules -> Navigation
+    Description:
+        Local navigation allows users to move between pages of a website that fall under the same section. The navigation is located on the left side of the page for easy access. The current active page is highlighted.
+    Dependencies:
+        In order to use this component, you must include the following libraries in addition to the NDS Global JS:
+            - Bootstrap 5
+    Parameters:
+        navigation_local_classes: Additional classes for the navigation local component.
+        navigation_local_id: The local navigation ID.
+        navigation_local_items: An array of local navigation items. Please refer to the demo pattern for parameters.
+        navigation_local_item_attributes: Additional item attributes that are used with Drupal. If not using Drupal, this field can be left empty.
+        navigation_local_heading_text: The title of the local navigation section.
+        navigation_local_heading_href: An optional URL for the local navigation title.
+        navigation_local_sticky: A boolean to determine if the navigation is sticky. Default: "true".
+    Last Updated: August 17, 2021
+#}
+
+{% set navigation_local_classes = navigation_local_classes|default() %}
+{% set navigation_local_id = navigation_local_id|default('local-navigation') %}
+{% set navigation_local_items = navigation_local_items|default() %}
+{% set navigation_local_item_attributes = navigation_local_item_attributes|default({}) %}
+{% set navigation_local_heading_text = navigation_local_heading_text|default() %}
+{% set navigation_local_heading_href = navigation_local_heading_href|default() %}
+{% set navigation_local_sticky = navigation_local_sticky|default("true") %}
+
+{% import _self as menus %}
+
+{% macro menu_links(items, attributes, parent_id, menu_level) %}
+    {% import _self as menus %}
+    {% if items %}
+        {% set parent_id = parent_id * 1000 %}
+        <div id="LN-accordion-{{ parent_id }}">
+            {% for item in items %}
+                {% set accordion_index = parent_id + loop.index %}
+                <div class="card cardlevel-{{ menu_level }}">
+                    {% set classes = "card-header level-" ~ menu_level %}
+                    {% if item.active is defined and item.active %}
+                        {% set classes = classes ~ " is-active" %}
+                    {% endif %}
+                    {% if item.in_active_trail == "true" or item.attributes.hasClass('active-trail') %}
+                        {% set classes = classes ~ " active-trail" %}
+                        {% set expanded = "true" %}
+                    {% else %}
+                        {% set expanded = "false" %}
+                    {% endif %}
+                    {% if item.below %}
+                        {% set id = 'LN-sec-' ~ accordion_index %}
+                        <div class="{{ classes ~ " cursor-pointer" }}" id="{{ id }}" data-bs-toggle="collapse" data-bs-target="#LN-clps-{{ accordion_index }}" aria-expanded="{{ expanded }}" aria-label="Open {{ item.title }} Menu" aria-controls="LN-clps-{{ accordion_index }}" tabindex="0">
+                    {% else %}
+                        <div class="{{ classes }}">
+                    {% endif %}
+                        <div class="card-header-text d-inline-flex">
+                            <div class="p-card-header">
+                                {% if item.url|render|striptags|trim is not empty %}
+                                    {{ link(item.title, item.url, {'onclick' : ['event.stopPropagation();']}) }}
+                                {% else %}
+                                    <p>{{ item.title }}</p>
+                                {% endif %}
+                            </div>
+                        </div>
+                        {% if item.below %}
+                            <div class="card-header-button">
+                                <div class="arrow">
+                                    <div class="accordion-arrow"></div>
+                                </div>
+                            </div>
+                        {% endif %}
+                    {% if item.below %}
+                        </div>
+                            {% set show = (expanded == "true") ? 'show' %}
+                            <div id="LN-clps-{{ accordion_index }}" class="collapse {{ show }}" aria-labelledby="LN-sec-{{ accordion_index }}" data-bs-parent="#LN-accordion-{{ parent_id }}">
+                                <div class="card-body">
+                                    {{ menus.menu_links(item.below, attributes, accordion_index, (menu_level + 1)) }}
+                                </div>
+                            </div>
+                    {% else %}
+                        </div>
+                    {% endif %}
+                </div>
+            {% endfor %}
+        </div>
+    {% endif %}
+{% endmacro %}
+
+<div class="navigation-nds navigation--local {{ navigation_local_classes }}" id="{{ navigation_local_id }}" data-sticky={{ navigation_local_sticky }}>
+    {% include "@nds/01-atoms/buttons/button-default/_button-default-main.twig" with
+        {
+            "button_default_classes": "navigation--local__button",
+            "button_default_type": "secondary",
+            "button_default_label": "Open the " ~ navigation_local_heading_text ~ " Menu",
+            "button_default_attributes": 'data-bs-toggle="collapse" data-bs-target="#navigation--local__content" aria-expanded="false" aria-controls="navigation--local__content"'
+        }
+    %}
+    <div id="navigation--local__content" class="navigation--local__content collapse" aria-labelledby="navigation--local__button" data-bs-parent="#{{ navigation_local_id }}">
+        {% if navigation_local_heading_text is not empty %}
+            <h2 class="navigation--local__content__title">{% if navigation_local_heading_href is not empty %}<a href="{{ navigation_local_heading_href }}">{% endif %}{{ navigation_local_heading_text }}{% if navigation_local_heading_href is not empty %}</a>{% endif %}</h2>
+            <hr>
+        {% endif %}
+        {{ menus.menu_links(navigation_local_items, navigation_local_item_attributes, 1, 0) }}
+    </div>
+</div>