レスポンシブなサイトでよくある、タップ（クリック）することでメニューが開きもう一度タップすることで閉じるというボタンを実装します。
SVG icon と連携することで、動作時にアニメーションしながらクローズボタンに見た目を変えるハンバーガーメニューを実装することができます。
Options
const radix = new Radix({
toggleNav: {
active: false, // 機能のオン、オフ（boolean）
trigger: '', // 開閉ボタン（CSSセレクタ）
target: '' // 対象のメニュー（CSSセレクタ）
class: 'opened', // 追加するクラス（string）
preventScroll: false // ナビゲーション展開時、ページ全体のスクロールを制限するか（boolean）
}
});デフォルトでは active プロパティが false であるため、機能を利用するには true に変更する必要があります。
実装内容としては、trigger で選択したエレメントをクリック時に trigger, target それぞれのエレメントに class プロパティの css クラスを追加します。このクラスをフラグとして、CSSで開閉それぞれのスタイルを定義してください。
trigger, target はCSSセレクタで選択できます。ですので、, （カンマ）区切りで複数の指定方法を記述することも可能です。
preventScroll を true にすることで、ナビゲーションが開いている状態のときに body に overflow-y: hidden を追加し、ページ全体のスクロールをできないようにします。
SVG icon の hamburger が trigger の中にあると、trigger に opened クラスがついたときにクローズボタンへアニメーションしながら変化します。
Example
このページをスマートフォンで表示するか、画面幅を 850px 以下になるようにブラウザを狭めて閲覧して頂くと、ハンバーガーメニューが表示されます。
API
/**
* ナビゲーション開閉
* @param {boolean | string} mode 開ける(false)か閉じる(true)か
*/
radix.toggleNav();ナビゲーションの開閉動作を行います。引数に true を渡すとナビゲーションを閉じ、 false を渡すと開きます。
引数は省略可能で、省略した場合、 radix.navState に基づいて現在の開閉状態を判断し、開閉を行います。