Docs(web-twig): Introduce Tabs story refs #DS-247

lmc-eu · Apr 4, 2023 · df1dcf7 · df1dcf7
1 parent 2c75004
commit df1dcf7
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 0 deletions.
diff --git a/packages/web-twig/src/Resources/components/Tabs/Tabs.stories.twig b/packages/web-twig/src/Resources/components/Tabs/Tabs.stories.twig
@@ -0,0 +1,8 @@
+{% extends 'layout/default.html.twig' %}
+
+{% block content %}
+
+{# Tabs Default #}
+{% include '@components/Tabs/stories/TabsDefault.twig' %}
+
+{% endblock %}
diff --git a/packages/web-twig/src/Resources/components/Tabs/stories/TabsDefault.twig b/packages/web-twig/src/Resources/components/Tabs/stories/TabsDefault.twig
@@ -0,0 +1,16 @@
+<TabList>
+    <TabItem>
+        <TabLink isSelected id="pane1-tab" target="pane1">Item 1</TabLink>
+    </TabItem>
+    <TabItem>
+        <TabLink id="pane2-tab" target="pane2">Item 2</TabLink>
+    </TabItem>
+    <TabItem>
+        <TabLink href="https://www.example.com">Item link</TabLink>
+    </TabItem>
+    <TabItem class="d-none d-desktop-block">
+        <TabLink href="https://www.example.com">Item link, Desktop Only</TabLink>
+    </TabItem>
+</TabList>
+<TabPane id="pane1" isSelected label="pane1-tab">Pane 1 content</TabPane>
+<TabPane id="pane2" label="pane2-tab">Pane 2 content</TabPane>