ActionMenu

デフォルト more-vertical · src 差し替え · カスタム trigger

Preview

デフォルト

src 差し替え

カスタム trigger

操作

HTML

<tw-action-menu>
  <button type="button">編集</button>
  <button type="button">複製</button>
  <button type="button">アーカイブ</button>
  <button type="button">削除</button>
</tw-action-menu>

<tw-action-menu id="…">
  <button type="button">完了にする</button>
  <button type="button">担当者を変更</button>
  <button type="button">キャンセル</button>
</tw-action-menu>

<tw-action-menu>
  <tw-button slot="trigger" variant="stroke">操作</tw-button>
  <button type="button">共有</button>
  <button type="button">エクスポート（CSV）</button>
  <button type="button">印刷</button>
</tw-action-menu>

import "@b4moss/the-wheels";
import checkUrl from "@b4moss/the-wheels-components/assets/check.svg?url";

const swap = document.getElementById("src-swap");
if (swap) swap.setAttribute("src", checkUrl);

import "@b4moss/the-wheels";
import checkUrl from "@b4moss/the-wheels-components/assets/check.svg?url";

const swap = document.getElementById("src-swap");
if (swap) swap.setAttribute("src", checkUrl);