feat: popover macro

CHANGELOG.md

@@ -5,6 +5,25 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+<!-- insertion marker -->
+## Unreleased
+
+<small>[Compare with latest](https://github.com/DataShades/ckanext-nswdesignsystem/compare/v0.1.6...HEAD)</small>
+
+### Features
+
+- update nswdesignsystem to v3.11.2 ([89b0e35](https://github.com/DataShades/ckanext-nswdesignsystem/commit/89b0e357f71da317a85baca0299bd51bf3f5e2fc) by Sergey Motornyuk).
+- add empty_label to facet macro ([4b43df6](https://github.com/DataShades/ckanext-nswdesignsystem/commit/4b43df629e4b425747bc7c432b400747c2a5e917) by Sergey Motornyuk).
+- dialog macros ([a46d569](https://github.com/DataShades/ckanext-nswdesignsystem/commit/a46d569c2af7653d7ee21c10ad4d8c0fc02fe8d5) by Sergey Motornyuk).
+- in-page-alert macros ([9efe927](https://github.com/DataShades/ckanext-nswdesignsystem/commit/9efe927ee5f118bf30b742787a14ca45d8e79dd6) by Sergey Motornyuk).
+- update nsw-design-system to v3.10.0 ([d5cb25c](https://github.com/DataShades/ckanext-nswdesignsystem/commit/d5cb25c3d1b097d1d06383713441bea5a92dbccd) by Sergey Motornyuk).
+- NavDict.open property for keeping inactive sidebar sections open ([023fb3a](https://github.com/DataShades/ckanext-nswdesignsystem/commit/023fb3a9dbafa0eed9ab2600c4dfde3bd843cd21) by Sergey Motornyuk).
+
+### Bug Fixes
+
+- header search redirects to search page ([dff8bb1](https://github.com/DataShades/ckanext-nswdesignsystem/commit/dff8bb1cde09d408fa97e7365fd1ebe656178937) by Sergey Motornyuk).
+- fix expand label on accordion ([b0a710f](https://github.com/DataShades/ckanext-nswdesignsystem/commit/b0a710f8bfc0e67a7a02477e0057cdf827e738db) by Sergey Motornyuk).
+
 <!-- insertion marker -->
 ## [v0.1.6](https://github.com/DataShades/ckanext-nswdesignsystem/releases/tag/v0.1.6) - 2023-08-17
 

ckanext/nswdesignsystem/helpers.py

@@ -87,7 +87,7 @@ def nswdesignsystem_demo_links() -> list[types.NavDict]:
         "footer", "header", "main_navigation", "masthead", "side_navigation", "tabs", "accordion",
         "breadcrumbs", "buttons", "callout", "cards", "content_blocks", "dialog", "file_upload", "filters",
         "forms", "global_alert", "hero_banner", "hero_search", "in_page_alert", "in_page_navigation",
-        "link_list", "list_item", "loader", "pagination", "progress_indicator", "results_bar",
+        "link_list", "list_item", "loader", "pagination", "popover", "progress_indicator", "results_bar",
         "select", "status_labels", "steps", "table", "tags", "tooltip",
 
     ]

ckanext/nswdesignsystem/templates/macros/nswdesignsystem/popover.html

@@ -0,0 +1,23 @@
+{% macro popover(id, label=null, position="top", gap=10, style="dark-outline") %}
+    {% with trigger = caller("trigger")|trim %}
+        <button type="button" class="nsw-button nsw-button--{{ style }} js-popover" aria-controls="{{ id }}"
+                data-popover-position="{{ position }}" data-popover-class="" data-popover-gap="{{ gap }}">
+
+            {% if trigger %}
+                {{ trigger }}
+
+            {% else %}
+                <span class="material-icons nsw-material-icons" focusable="false" aria-hidden="true">info</span>
+                <span>{{ label }}</span>
+
+            {% endif %}
+        </button>
+
+
+    {% endwith %}
+
+    <div id="{{ id }}" class="nsw-popover">
+        {{ caller("popover") }}
+    </div>
+
+{% endmacro %}

ckanext/nswdesignsystem/templates/nswdesignsystem/demo/popover.preview.html

@@ -0,0 +1,92 @@
+{% from "macros/nswdesignsystem/popover.html" import popover with context  %}
+
+<div class="nsw-list nsw-list--8">
+
+{% call(part) popover("popover-top", "Open top", "top") %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-top-start", "Open top start", "top-start", style="danger") %}
+{% if part == "trigger" %}
+    <span>Custom trigger</span>
+    <span class="material-icons nsw-material-icons">star</span>
+{% elif part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-top-end", "Open top end", "top-end", style="dark") %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-left", "Open left", "left") %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-right", "Open right", "right") %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-bottom", "Open bottom", "bottom") %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+{% call(part) popover("popover-gap", "Open with gap", gap=100) %}
+{% if part == "popover" %}
+    <div class="nsw-p-sm">
+        <h4>Family rebate</h4>
+        <p>Helps families with dependants to pay their energy bills. Applications opening late July for the 2019-20 rebate.</p>
+        <p><a class="js-link" href="https://digital.nsw.gov.au">
+            <span>Get started</span><span class="material-icons nsw-material-icons" title="(opens in new window)">open_in_new</span>
+        </a></p>
+    </div>
+{% endif %}
+{% endcall %}
+
+</div>