diff options
author | 2022-03-02 12:09:43 -0800 | |
---|---|---|
committer | 2022-03-02 12:09:43 -0800 | |
commit | d5ced6d0d18af666c6546db7d0df5166b81f01ee (patch) | |
tree | 0a0d53d493b3e0c1c609cbfa1f201c1ba1998d82 /smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx | |
parent | f957e46724a10d200be7f3a63463c9306a95d8e8 (diff) | |
download | astro-d5ced6d0d18af666c6546db7d0df5166b81f01ee.tar.gz astro-d5ced6d0d18af666c6546db7d0df5166b81f01ee.tar.zst astro-d5ced6d0d18af666c6546db7d0df5166b81f01ee.zip |
[ci] update smoke tests (remote) (#2699)
Co-authored-by: FredKSchott <FredKSchott@users.noreply.github.com>
Diffstat (limited to 'smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx')
-rw-r--r-- | smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx | 24 |
1 files changed, 24 insertions, 0 deletions
diff --git a/smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx b/smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx new file mode 100644 index 000000000..13fc8f74c --- /dev/null +++ b/smoke/docs-main/src/components/LeftSidebar/SidebarSectionToggle.tsx @@ -0,0 +1,24 @@ +import { h } from 'preact'; +import { useState } from 'preact/hooks'; +import './SidebarSectionToggle.css'; + +const SidebarSectionToggle = ({ defaultActiveTab }) => { + const [activeTab, setActiveTab] = useState(defaultActiveTab); + function toggleType(type: 'learn' | 'api') { + document.querySelectorAll(`li.nav-group`).forEach((el) => el.classList.remove('active')); + document.querySelectorAll(`li.nav-group.${type}`).forEach((el) => el.classList.add('active')); + setActiveTab(type); + } + return ( + <div class="SidebarSectionToggle"> + <button class={activeTab === 'learn' ? 'active' : ''} onClick={() => toggleType('learn')}> + Learn + </button> + <button class={activeTab === 'api' ? 'active' : ''} onClick={() => toggleType('api')}> + API + </button> + </div> + ); +}; + +export default SidebarSectionToggle; |