@lupinum/ginko-docs 0.4.0-rc.8 → 0.4.0

package/app/components/site/SiteLocaleSwitcher.vue

@@ -1,190 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from "vue";
-import { Button } from "#ginko-docs/components/ui/button";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from "#ginko-docs/components/ui/dropdown-menu";
-import { cn } from "#ginko-docs/utils";
-import { computed } from "vue";
-import { useI18n } from "#imports";
-import { useLocalizedRouteSwitch } from "#ginko-docs/composables/useLocalizedRouteSwitch";
-import { headerUtilityButtonClass } from "#ginko-docs/components/site/header-utils";
-import { locales as configuredLocales } from "../../../i18n/locales";
-
-type LocaleSwitcherVariant = "dropdown" | "menu-row";
-
-type LocaleEntry = {
-  code: string;
-  language?: string;
-  name?: string;
-  nativeName?: string;
-  shortLabel?: string;
-};
-
-const props = withDefaults(
-  defineProps<{
-    variant?: LocaleSwitcherVariant;
-    class?: HTMLAttributes["class"];
-  }>(),
-  {
-    variant: "dropdown",
-  },
-);
-
-const emit = defineEmits<{
-  navigate: [];
-}>();
-
-const { locale, locales, t } = useI18n();
-const { switchPath } = useLocalizedRouteSwitch();
-
-type ConfiguredLocale = (typeof configuredLocales)[number];
-
-const configuredLocaleMap: ReadonlyMap<string, ConfiguredLocale> = new Map(
-  configuredLocales.map((entry) => [entry.code, entry]),
-);
-
-function normalizeLocale(entry: string | LocaleEntry) {
-  if (typeof entry === "string") {
-    const configured: LocaleEntry | undefined = configuredLocaleMap.get(entry);
-    return {
-      code: entry,
-      language: configured?.language ?? entry,
-      name: configured?.name ?? entry.toUpperCase(),
-      nativeName: configured?.nativeName ?? configured?.name ?? entry.toUpperCase(),
-      shortLabel: configured?.shortLabel ?? entry.toUpperCase(),
-    };
-  }
-
-  const configured: LocaleEntry | undefined = configuredLocaleMap.get(entry.code);
-  return {
-    code: entry.code,
-    language: entry.language ?? configured?.language ?? entry.code,
-    name: entry.name ?? configured?.name ?? entry.code.toUpperCase(),
-    nativeName:
-      entry.nativeName ?? entry.name ?? configured?.nativeName ?? entry.code.toUpperCase(),
-    shortLabel: entry.shortLabel ?? configured?.shortLabel ?? entry.code.toUpperCase(),
-  };
-}
-
-const localeLinks = computed(() =>
-  locales.value.map((entry) => {
-    const normalized = normalizeLocale(entry as string | LocaleEntry);
-    return {
-      ...normalized,
-      to: switchPath(normalized.code) || "/",
-      current: locale.value === normalized.code,
-    };
-  }),
-);
-
-const currentLocale = computed(
-  () => localeLinks.value.find((entry) => entry.current) ?? localeLinks.value[0],
-);
-
-function trackLocaleNavigation(_entry: { code: string; current: boolean; to: unknown }) {
-  emit("navigate");
-}
-</script>
-
-<template>
-  <div
-    v-if="localeLinks.length > 1 && variant === 'dropdown'"
-    :class="cn('items-center', props.class)"
-  >
-    <ClientOnly>
-      <DropdownMenu>
-        <DropdownMenuTrigger as-child>
-          <button type="button" :class="headerUtilityButtonClass" :aria-label="t('nav.language')">
-            <Icon name="lucide:languages" class="size-[18px]" aria-hidden="true" />
-          </button>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent align="end" class="w-52">
-          <DropdownMenuItem v-for="entry in localeLinks" :key="entry.code" as-child>
-            <NuxtLink
-              :to="entry.to"
-              :hreflang="entry.language"
-              :lang="entry.code"
-              :aria-label="entry.name"
-              :aria-current="entry.current ? 'page' : undefined"
-              class="flex w-full items-center gap-3"
-              @click="trackLocaleNavigation(entry)"
-            >
-              <span class="w-7 text-xs font-semibold tracking-wide text-muted-foreground">{{
-                entry.shortLabel
-              }}</span>
-              <span class="flex-1">{{ entry.nativeName }}</span>
-              <Icon
-                v-if="entry.current"
-                name="lucide:check"
-                class="size-4 text-foreground"
-                aria-hidden="true"
-              />
-            </NuxtLink>
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
-
-      <template #fallback>
-        <span class="inline-flex size-9 shrink-0 rounded-lg" aria-hidden="true" />
-      </template>
-    </ClientOnly>
-  </div>
-
-  <div
-    v-else-if="localeLinks.length > 1 && variant === 'menu-row'"
-    :class="cn('items-center', props.class)"
-  >
-    <DropdownMenu>
-      <DropdownMenuTrigger as-child>
-        <Button
-          variant="ghost"
-          class="h-14 w-full justify-between rounded-none px-5 text-base font-semibold hover:bg-transparent"
-          :aria-label="t('nav.language')"
-        >
-          <span class="flex min-w-0 items-center gap-4">
-            <span
-              class="flex size-11 shrink-0 items-center justify-center rounded-lg bg-muted/60 text-foreground"
-            >
-              <Icon name="lucide:languages" class="size-5" aria-hidden="true" />
-            </span>
-            <span class="truncate">{{ t("nav.languageLabel") }}</span>
-          </span>
-          <span class="flex items-center gap-2 text-muted-foreground">
-            <span class="text-sm font-semibold text-foreground">{{
-              currentLocale?.nativeName
-            }}</span>
-            <Icon name="lucide:chevron-down" class="size-5" aria-hidden="true" />
-          </span>
-        </Button>
-      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" class="w-52" portal-disabled>
-        <DropdownMenuItem v-for="entry in localeLinks" :key="entry.code" as-child>
-          <NuxtLink
-            :to="entry.to"
-            :hreflang="entry.language"
-            :lang="entry.code"
-            :aria-label="entry.name"
-            :aria-current="entry.current ? 'page' : undefined"
-            class="flex w-full items-center gap-3"
-            @click="trackLocaleNavigation(entry)"
-          >
-            <span class="w-7 text-xs font-semibold tracking-wide text-muted-foreground">{{
-              entry.shortLabel
-            }}</span>
-            <span class="flex-1">{{ entry.nativeName }}</span>
-            <Icon
-              v-if="entry.current"
-              name="lucide:check"
-              class="size-4 text-foreground"
-              aria-hidden="true"
-            />
-          </NuxtLink>
-        </DropdownMenuItem>
-      </DropdownMenuContent>
-    </DropdownMenu>
-  </div>
-</template>

package/app/components/site/SiteLogoMark.vue

@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import { useSiteNavigation } from "#ginko-docs/composables/useSiteNavigation";
-
-const { site } = useSiteNavigation();
-</script>
-
-<template>
-  <span class="relative inline-flex h-7 shrink-0" aria-hidden="true">
-    <img :src="site.logo.light" alt="" class="h-7 w-auto dark:hidden" loading="eager" />
-    <img :src="site.logo.dark" alt="" class="hidden h-7 w-auto dark:block" loading="eager" />
-  </span>
-</template>

package/app/components/site/SiteSkipLink.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { useI18n } from "#imports";
-
-const { t } = useI18n();
-</script>
-
-<template>
-  <a
-    href="#main-content"
-    class="sr-only focus:not-sr-only focus:fixed focus:top-4 focus:left-4 focus:z-100 focus:rounded-md focus:border focus:border-border focus:bg-background focus:px-4 focus:py-2 focus:text-sm focus:font-medium focus:text-foreground focus:shadow-md"
-  >
-    {{ t("nav.skip") }}
-  </a>
-</template>

package/app/components/site/SiteSocialLinks.vue

@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import { useSiteNavigation } from "#ginko-docs/composables/useSiteNavigation";
-import { headerUtilityButtonClass } from "#ginko-docs/components/site/header-utils";
-
-const { socialLinks } = useSiteNavigation();
-
-defineEmits<{ navigate: [] }>();
-</script>
-
-<template>
-  <div v-if="socialLinks.length" class="flex items-center">
-    <NuxtLink
-      v-for="link in socialLinks"
-      :key="link.href"
-      :to="link.href"
-      target="_blank"
-      rel="noopener noreferrer"
-      :aria-label="link.label"
-      :class="headerUtilityButtonClass"
-      @click="$emit('navigate')"
-    >
-      <Icon :name="link.icon ?? 'lucide:link'" class="social-icon" aria-hidden="true" />
-    </NuxtLink>
-  </div>
-</template>
-
-<style scoped>
-.social-icon {
-  width: 1.25rem;
-  height: 1.25rem;
-  flex: none;
-}
-</style>

package/app/components/site/header-utils.ts

@@ -1,3 +0,0 @@
-/** Shared ghost geometry for header utility controls (theme, locale, social). */
-export const headerUtilityButtonClass =
-  "inline-flex size-9 shrink-0 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring outline-none";

package/app/components/site/mode-toggle.utils.ts

@@ -1,18 +0,0 @@
-export type RenderedColorMode = "light" | "dark";
-/**
- * Next stored preference for a two-state theme toggle.
- *
- * The page follows the operating system until the first interaction. After
- * that interaction, the reader's explicit light or dark choice remains fixed.
- */
-export function nextColorModePreference(currentRendered: RenderedColorMode): RenderedColorMode {
-  return currentRendered === "dark" ? "light" : "dark";
-}
-
-export function themeToggleIcon(isDark: boolean) {
-  return isDark ? "lucide:moon" : "lucide:sun";
-}
-
-export function themeToggleLabelKey(isDark: boolean) {
-  return isDark ? "theme.switchToLight" : "theme.switchToDark";
-}

package/app/components/ui/badge/Badge.vue

@@ -1,28 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import type { BadgeVariants } from ".";
-import { reactiveOmit } from "@vueuse/core";
-import { Primitive } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-import { badgeVariants } from ".";
-
-const props = defineProps<
-  PrimitiveProps & {
-    variant?: BadgeVariants["variant"];
-    class?: HTMLAttributes["class"];
-  }
->();
-
-const delegatedProps = reactiveOmit(props, "class");
-</script>
-
-<template>
-  <Primitive
-    data-slot="badge"
-    :class="cn(badgeVariants({ variant: props.variant }), props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </Primitive>
-</template>

package/app/components/ui/badge/index.ts

@@ -1,24 +0,0 @@
-import type { VariantProps } from "class-variance-authority";
-import { cva } from "class-variance-authority";
-
-export { default as Badge } from "./Badge.vue";
-
-export const badgeVariants = cva(
-  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default: "border-transparent bg-brand text-brand-foreground [a&]:hover:bg-brand/90",
-        secondary:
-          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-        destructive:
-          "border-transparent bg-destructive text-destructive-foreground [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
-        outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  },
-);
-export type BadgeVariants = VariantProps<typeof badgeVariants>;

package/app/components/ui/button/Button.vue

@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import type { ButtonVariants } from ".";
-import { Primitive } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-import { buttonVariants } from ".";
-
-interface Props extends PrimitiveProps {
-  variant?: ButtonVariants["variant"];
-  size?: ButtonVariants["size"];
-  class?: HTMLAttributes["class"];
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  as: "button",
-});
-</script>
-
-<template>
-  <Primitive
-    data-slot="button"
-    :data-variant="variant"
-    :data-size="size"
-    :as="as"
-    :as-child="asChild"
-    :class="cn(buttonVariants({ variant, size }), props.class)"
-  >
-    <slot />
-  </Primitive>
-</template>

package/app/components/ui/button/index.ts

@@ -1,35 +0,0 @@
-import type { VariantProps } from "class-variance-authority";
-import { cva } from "class-variance-authority";
-
-export { default as Button } from "./Button.vue";
-
-export const buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-  {
-    variants: {
-      variant: {
-        default: "bg-brand text-brand-foreground hover:bg-brand/90",
-        destructive:
-          "bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
-        outline:
-          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline",
-      },
-      size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
-        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
-        icon: "size-9",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-);
-export type ButtonVariants = VariantProps<typeof buttonVariants>;

package/app/components/ui/collapsible/Collapsible.vue

@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import type { CollapsibleRootEmits, CollapsibleRootProps } from "reka-ui";
-import { CollapsibleRoot, useForwardPropsEmits } from "reka-ui";
-
-const props = defineProps<CollapsibleRootProps>();
-const emits = defineEmits<CollapsibleRootEmits>();
-
-const forwarded = useForwardPropsEmits(props, emits);
-</script>
-
-<template>
-  <CollapsibleRoot v-bind="forwarded">
-    <slot />
-  </CollapsibleRoot>
-</template>

package/app/components/ui/collapsible/CollapsibleContent.vue

@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import type { CollapsibleContentProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import { reactiveOmit } from "@vueuse/core";
-import { CollapsibleContent } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-
-const props = defineProps<CollapsibleContentProps & { class?: HTMLAttributes["class"] }>();
-
-const delegatedProps = reactiveOmit(props, "class");
-</script>
-
-<template>
-  <CollapsibleContent
-    v-bind="delegatedProps"
-    :class="
-      cn(
-        'overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </CollapsibleContent>
-</template>

package/app/components/ui/collapsible/CollapsibleTrigger.vue

@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import type { CollapsibleTriggerProps } from "reka-ui";
-import { CollapsibleTrigger } from "reka-ui";
-
-const props = defineProps<CollapsibleTriggerProps>();
-</script>
-
-<template>
-  <CollapsibleTrigger v-bind="props">
-    <slot />
-  </CollapsibleTrigger>
-</template>

package/app/components/ui/collapsible/index.ts

@@ -1,3 +0,0 @@
-export { default as Collapsible } from "./Collapsible.vue";
-export { default as CollapsibleTrigger } from "./CollapsibleTrigger.vue";
-export { default as CollapsibleContent } from "./CollapsibleContent.vue";

package/app/components/ui/dropdown-menu/DropdownMenu.vue

@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuRootEmits, DropdownMenuRootProps } from "reka-ui";
-import { DropdownMenuRoot, useForwardPropsEmits } from "reka-ui";
-
-const props = defineProps<DropdownMenuRootProps>();
-const emits = defineEmits<DropdownMenuRootEmits>();
-
-const forwarded = useForwardPropsEmits(props, emits);
-</script>
-
-<template>
-  <DropdownMenuRoot v-slot="slotProps" data-slot="dropdown-menu" v-bind="forwarded">
-    <slot v-bind="slotProps" />
-  </DropdownMenuRoot>
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuContent.vue

@@ -1,50 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuContentEmits, DropdownMenuContentProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import { reactiveOmit } from "@vueuse/core";
-import { DropdownMenuContent, DropdownMenuPortal, useForwardPropsEmits } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-
-defineOptions({
-  inheritAttrs: false,
-});
-
-const props = withDefaults(
-  defineProps<
-    DropdownMenuContentProps & {
-      class?: HTMLAttributes["class"];
-      /**
-       * Render in place instead of teleporting to body. Required inside modal
-       * dialogs (e.g. the mobile menu sheet), where body-level portals are
-       * blocked by the dialog's pointer-events lock.
-       */
-      portalDisabled?: boolean;
-    }
-  >(),
-  {
-    sideOffset: 4,
-  },
-);
-const emits = defineEmits<DropdownMenuContentEmits>();
-
-const delegatedProps = reactiveOmit(props, "class", "portalDisabled");
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits);
-</script>
-
-<template>
-  <DropdownMenuPortal :disabled="props.portalDisabled">
-    <DropdownMenuContent
-      data-slot="dropdown-menu-content"
-      v-bind="{ ...$attrs, ...forwarded }"
-      :class="
-        cn(
-          'z-50 max-h-(--reka-dropdown-menu-content-available-height) min-w-[8rem] origin-(--reka-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95',
-          props.class,
-        )
-      "
-    >
-      <slot />
-    </DropdownMenuContent>
-  </DropdownMenuPortal>
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuItem.vue

@@ -1,41 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuItemProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import { reactiveOmit } from "@vueuse/core";
-import { DropdownMenuItem, useForwardProps } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-
-const props = withDefaults(
-  defineProps<
-    DropdownMenuItemProps & {
-      class?: HTMLAttributes["class"];
-      inset?: boolean;
-      variant?: "default" | "destructive";
-    }
-  >(),
-  {
-    variant: "default",
-  },
-);
-
-const delegatedProps = reactiveOmit(props, "inset", "variant", "class");
-
-const forwardedProps = useForwardProps(delegatedProps);
-</script>
-
-<template>
-  <DropdownMenuItem
-    data-slot="dropdown-menu-item"
-    :data-inset="inset ? '' : undefined"
-    :data-variant="variant"
-    v-bind="forwardedProps"
-    :class="
-      cn(
-        'relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 [&_svg:not([class*=\'text-\'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:!text-destructive',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </DropdownMenuItem>
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue

@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuRadioGroupEmits, DropdownMenuRadioGroupProps } from "reka-ui";
-import { DropdownMenuRadioGroup, useForwardPropsEmits } from "reka-ui";
-
-const props = defineProps<DropdownMenuRadioGroupProps>();
-const emits = defineEmits<DropdownMenuRadioGroupEmits>();
-
-const forwarded = useForwardPropsEmits(props, emits);
-</script>
-
-<template>
-  <DropdownMenuRadioGroup data-slot="dropdown-menu-radio-group" v-bind="forwarded">
-    <slot />
-  </DropdownMenuRadioGroup>
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuRadioItem.vue

@@ -1,37 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuRadioItemEmits, DropdownMenuRadioItemProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import { reactiveOmit } from "@vueuse/core";
-import { DropdownMenuItemIndicator, DropdownMenuRadioItem, useForwardPropsEmits } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-
-const props = defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes["class"] }>();
-
-const emits = defineEmits<DropdownMenuRadioItemEmits>();
-
-const delegatedProps = reactiveOmit(props, "class");
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits);
-</script>
-
-<template>
-  <DropdownMenuRadioItem
-    data-slot="dropdown-menu-radio-item"
-    v-bind="forwarded"
-    :class="
-      cn(
-        'relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
-        props.class,
-      )
-    "
-  >
-    <span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
-      <DropdownMenuItemIndicator>
-        <slot name="indicator-icon">
-          <Icon name="lucide:circle" class="size-2 fill-current" aria-hidden="true" />
-        </slot>
-      </DropdownMenuItemIndicator>
-    </span>
-    <slot />
-  </DropdownMenuRadioItem>
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuSeparator.vue

@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuSeparatorProps } from "reka-ui";
-import type { HTMLAttributes } from "vue";
-import { reactiveOmit } from "@vueuse/core";
-import { DropdownMenuSeparator } from "reka-ui";
-import { cn } from "#ginko-docs/utils";
-
-const props = defineProps<
-  DropdownMenuSeparatorProps & {
-    class?: HTMLAttributes["class"];
-  }
->();
-
-const delegatedProps = reactiveOmit(props, "class");
-</script>
-
-<template>
-  <DropdownMenuSeparator
-    data-slot="dropdown-menu-separator"
-    v-bind="delegatedProps"
-    :class="cn('-mx-1 my-1 h-px bg-border', props.class)"
-  />
-</template>

package/app/components/ui/dropdown-menu/DropdownMenuTrigger.vue

@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import type { DropdownMenuTriggerProps } from "reka-ui";
-import { DropdownMenuTrigger, useForwardProps } from "reka-ui";
-
-const props = defineProps<DropdownMenuTriggerProps>();
-
-const forwardedProps = useForwardProps(props);
-</script>
-
-<template>
-  <DropdownMenuTrigger data-slot="dropdown-menu-trigger" v-bind="forwardedProps">
-    <slot />
-  </DropdownMenuTrigger>
-</template>