名前空間付きコンポーネント

Radix Vueのデザインパターンは各コンポーネントのプリミティブを作成し、ユーザーが自分の望み通りにコンポーネントを構築または構成できるようにすることです。

しかし、必要なコンポーネントをすべて1つずつインポートするのはかなりの作業になる可能性があり、ユーザーが重要なコンポーネントを誤って省略してしまう場合があります。

この問題を解決するために、名前空間付きコンポーネントをv1.2.0より導入しました。

使い方

まず、Vue コンポーネントで radix-vue/namespaced を介して名前空間コンポーネントをインポートする必要があります。

<script setup lang="ts">
import { Dialog, DropdownMenu } from 'radix-vue/namespaced'
</script>

次に、名前空間内のすべての関連コンポーネントを使用できます。

<script setup lang="ts">
import { Dialog } from 'radix-vue/namespaced'
</script>

<template>
  <Dialog.Root>
    <Dialog.Trigger>
      Trigger
    </Dialog.Trigger>
  </Dialog.Root>

  <Dialog.Portal>
    <Dialog.Overlay />
    <Dialog.Content>
      …
    </Dialog.Content>
  </Dialog.Portal>
</template>