@alphacifer/slidev-addon-theme 0.0.10 → 0.0.11

package/components/defense-in-depth/arc-did/ArcDiDLayer.vue

@@ -1,321 +0,0 @@
-<script setup lang="ts">
-import {
-  type ComputedRef,
-  computed,
-  Fragment,
-  inject,
-  onUnmounted,
-  provide,
-  ref,
-  useSlots,
-  type VNode,
-  watch,
-} from 'vue';
-
-import {
-  ARC_DID_LAYER_KEY,
-  ARC_DID_ROOT_KEY,
-  type IArcDiDLayerContext,
-  type IArcDiDRegisteredLayerData,
-  type IArcDiDRegisteredSectorData,
-} from '../../../utils/defenseInDepth/arcDid/context';
-import type {
-  IArcDiDPartGeometry,
-  IArcDiDPartItem,
-  IArcDiDSectorItem,
-} from '../../../utils/defenseInDepth/arcDid/types';
-import ArcDiDLayerPart from './ArcDiDLayerPart.vue';
-import ArcDiDLayerParts from './ArcDiDLayerParts.vue';
-import ArcDiDLayerSector from './ArcDiDLayerSector.vue';
-import ArcDiDLayerTitle from './ArcDiDLayerTitle.vue';
-
-defineOptions({
-  name: 'ArcDiDLayer',
-});
-
-export interface IArcDiDLayerProps {
-  readonly title?: string;
-  readonly color?: string;
-  readonly textColor?: string;
-  readonly index?: number;
-  readonly active?: boolean;
-}
-
-const props = withDefaults(defineProps<IArcDiDLayerProps>(), {
-  title: undefined,
-  color: undefined,
-  textColor: undefined,
-  index: undefined,
-  active: undefined,
-});
-
-const slots = useSlots();
-const rootContext = inject(ARC_DID_ROOT_KEY, undefined);
-
-interface INamedComponent {
-  readonly type?: {
-    readonly name?: string;
-    readonly displayName?: string;
-    readonly __name?: string;
-  };
-}
-
-function hasComponentName(type: unknown, targetName: string): boolean {
-  if (typeof type === 'object' && type !== null) {
-    const comp = type as INamedComponent['type'];
-    return (
-      comp?.name === targetName ||
-      comp?.displayName === targetName ||
-      comp?.__name === targetName
-    );
-  }
-  return false;
-}
-
-function flattenVNodes(nodes: VNode[]): VNode[] {
-  const result: VNode[] = [];
-  for (const node of nodes) {
-    if (node.type === Fragment && Array.isArray(node.children)) {
-      result.push(...flattenVNodes(node.children as VNode[]));
-    } else {
-      result.push(node);
-    }
-  }
-  return result;
-}
-
-const defaultNodes = computed(() => {
-  if (!slots.default) {
-    return [];
-  }
-  return flattenVNodes(slots.default());
-});
-
-const hasSlottedTitle = computed(() => {
-  return defaultNodes.value.some((node) =>
-    hasComponentName(node.type, 'ArcDiDLayerTitle'),
-  );
-});
-
-const hasSlottedParts = computed(() => {
-  if (registeredSectorTokens.value.length > 0) {
-    return true;
-  }
-  return defaultNodes.value.some(
-    (node) =>
-      hasComponentName(node.type, 'ArcDiDLayerParts') ||
-      hasComponentName(node.type, 'ArcDiDLayerPart') ||
-      hasComponentName(node.type, 'ArcDiDLayerSector'),
-  );
-});
-
-const currentTitle = ref<string | undefined>(props.title);
-watch(
-  () => props.title,
-  (val) => {
-    if (val !== undefined) {
-      currentTitle.value = val;
-    }
-  },
-);
-
-// Manage sector and part registrations within this layer
-const registeredSectorTokens = ref<symbol[]>([]);
-const registeredSectorData = ref<Map<symbol, IArcDiDRegisteredSectorData>>(
-  new Map(),
-);
-
-function registerSector(
-  token?: symbol,
-  sectorDataRef?: ComputedRef<IArcDiDRegisteredSectorData | undefined>,
-) {
-  const sToken = token ?? Symbol();
-  if (!registeredSectorTokens.value.includes(sToken)) {
-    registeredSectorTokens.value = [...registeredSectorTokens.value, sToken];
-  }
-
-  let stopWatch: (() => void) | undefined;
-  if (sectorDataRef) {
-    stopWatch = watch(
-      sectorDataRef,
-      (val) => {
-        const nextMap = new Map(registeredSectorData.value);
-        if (val) {
-          nextMap.set(sToken, val);
-        } else {
-          nextMap.delete(sToken);
-        }
-        registeredSectorData.value = nextMap;
-      },
-      { immediate: true },
-    );
-  }
-
-  const index = computed(() => registeredSectorTokens.value.indexOf(sToken));
-
-  return {
-    index,
-    unregister: () => {
-      stopWatch?.();
-      registeredSectorTokens.value = registeredSectorTokens.value.filter(
-        (t) => t !== sToken,
-      );
-      const nextMap = new Map(registeredSectorData.value);
-      nextMap.delete(sToken);
-      registeredSectorData.value = nextMap;
-    },
-  };
-}
-
-function registerPart(
-  token?: symbol,
-  partDataRef?: ComputedRef<IArcDiDPartItem | undefined>,
-) {
-  const pToken = token ?? Symbol();
-  const sectorDataRef = computed<IArcDiDRegisteredSectorData | undefined>(
-    () => {
-      const pData = partDataRef?.value;
-      if (!pData) return undefined;
-      return {
-        parts: [pData],
-        split: false,
-        angle: pData.angle,
-        span: pData.span,
-        color: pData.color,
-      };
-    },
-  );
-  return registerSector(pToken, sectorDataRef);
-}
-
-const registeredSectorsList = computed<IArcDiDSectorItem[]>(() => {
-  return registeredSectorTokens.value
-    .map((token) => registeredSectorData.value.get(token))
-    .filter((item): item is IArcDiDRegisteredSectorData => item !== undefined)
-    .map((data) => ({
-      parts: data.parts ?? [],
-      split: data.split,
-      angle: data.angle,
-      span: data.span,
-      color: data.color,
-    }));
-});
-
-const registeredPartsList = computed<IArcDiDPartItem[]>(() => {
-  return registeredSectorsList.value.flatMap(
-    (s) => s.parts as IArcDiDPartItem[],
-  );
-});
-
-const layerToken = Symbol();
-const layerRegistrationData = computed<IArcDiDRegisteredLayerData>(() => ({
-  title: currentTitle.value,
-  color: props.color,
-  sectors: registeredSectorsList.value,
-  parts: registeredPartsList.value,
-  index: props.index !== undefined ? Number(props.index) : undefined,
-}));
-
-const registration = rootContext?.registerLayer(
-  layerToken,
-  layerRegistrationData,
-);
-
-onUnmounted(() => {
-  registration?.unregister();
-});
-
-const resolvedIndex = computed<number>(() => {
-  if (props.index !== undefined) {
-    return Number(props.index);
-  }
-  return registration?.index.value ?? 0;
-});
-
-const layerGeo = computed(() => {
-  if (!rootContext) {
-    return undefined;
-  }
-  return rootContext.geo.value.layers[resolvedIndex.value];
-});
-
-const isActive = computed<boolean>(() => {
-  if (props.active !== undefined) {
-    return props.active;
-  }
-  if (!rootContext) {
-    return false;
-  }
-  return (
-    rootContext.activeIndex.value === -1 ||
-    rootContext.activeIndex.value === resolvedIndex.value
-  );
-});
-
-const effectiveColor = computed<string>(() => {
-  if (props.color) {
-    return props.color;
-  }
-  if (rootContext) {
-    return rootContext.getLayerColor(resolvedIndex.value);
-  }
-  return '#0ea5e9';
-});
-
-const layerContext: IArcDiDLayerContext = {
-  layerIndex: resolvedIndex,
-  layerGeo,
-  isActive,
-  color: effectiveColor,
-  textColor: computed(() => props.textColor),
-  title: computed(() => currentTitle.value),
-  setTitle: (title: string) => {
-    currentTitle.value = title;
-  },
-  partsCount: computed(() => registeredPartsList.value.length),
-  registerPart,
-  registerSector,
-};
-
-provide(ARC_DID_LAYER_KEY, layerContext);
-</script>
-
-<template>
-  <div
-    class="alpha-arc-did__layer contents"
-    :data-index="resolvedIndex"
-    :data-active="isActive"
-  >
-    <!-- Auto-render title if prop title provided but no slotted ArcDiDLayerTitle -->
-    <ArcDiDLayerTitle v-if="!hasSlottedTitle && currentTitle" :title="currentTitle" />
-
-    <!-- Default children slots -->
-    <slot />
-
-    <!-- Fallback parts from geometry if layer has no slotted parts and default geo parts/sectors exist -->
-    <ArcDiDLayerParts v-if="!hasSlottedParts && registeredSectorTokens.length === 0 && layerGeo && layerGeo.sectors.length > 0">
-      <template v-for="sector in layerGeo.sectors" :key="sector.index">
-        <ArcDiDLayerSector v-if="sector.parts.length > 1 || sector.split" :split="sector.split">
-          <ArcDiDLayerPart
-            v-for="part in sector.parts"
-            :key="part.index"
-            :label="part.label"
-            :index="part.index"
-            :position="part.position"
-            :angle="part.angle"
-            :radius="part.radius"
-          />
-        </ArcDiDLayerSector>
-        <ArcDiDLayerPart
-          v-else-if="sector.parts[0]"
-          :key="sector.parts[0].index"
-          :label="sector.parts[0].label"
-          :index="sector.parts[0].index"
-          :position="sector.parts[0].position"
-          :angle="sector.parts[0].angle"
-          :radius="sector.parts[0].radius"
-        />
-      </template>
-    </ArcDiDLayerParts>
-  </div>
-</template>

package/components/defense-in-depth/arc-did/ArcDiDLayerParts.vue

@@ -1,11 +0,0 @@
-<script setup lang="ts">
-defineOptions({
-  name: 'ArcDiDLayerParts',
-});
-</script>
-
-<template>
-  <div class="alpha-arc-did__layer-parts contents pointer-events-none">
-    <slot />
-  </div>
-</template>

package/components/facets/tetrad/rect-orbit-tetrad/RectOrbitTetradCenter.vue

@@ -1,53 +0,0 @@
-<script setup lang="ts">
-defineOptions({
-  name: 'RectOrbitTetradCenter',
-});
-
-export interface IRectOrbitTetradCenterProps {
-  readonly title?: string;
-  readonly radius?: number;
-  readonly subtitle?: string;
-}
-
-const props = withDefaults(defineProps<IRectOrbitTetradCenterProps>(), {
-  title: undefined,
-  subtitle: undefined,
-  radius: 58,
-});
-</script>
-
-<template>
-  <div
-    class="alpha-rect-orbit-tetrad-center absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-20 rounded-full bg-white flex flex-col items-center justify-center text-center shadow-lg pointer-events-auto select-none"
-    :style="{
-      width: `${props.radius * 2}px`,
-      height: `${props.radius * 2}px`,
-      boxShadow: '0 4px 18px rgba(0, 0, 0, 0.12)',
-      fontFamily: 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, sans-serif',
-    }"
-  >
-    <slot>
-      <slot name="title">
-        <span
-          v-if="props.title"
-          :class="[
-            'text-[23px] font-extrabold text-slate-800 tracking-tight leading-none',
-            { 'mb-2': props.subtitle },
-          ]"
-          style="font-family: inherit;"
-        >
-          {{ props.title }}
-        </span>
-      </slot>
-      <slot name="subtitle">
-        <span
-          v-if="props.subtitle"
-          class="text-[13px] font-medium text-slate-400 tracking-normal leading-none"
-          style="font-family: inherit;"
-        >
-          {{ props.subtitle }}
-        </span>
-      </slot>
-    </slot>
-  </div>
-</template>

package/components/facets/tetrad/rect-orbit-tetrad/RectOrbitTetradContent.vue

@@ -1,39 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { RECT_ORBIT_TETRAD_CALLOUT_KEY } from '../../../../utils/rectOrbitTetrad';
-
-defineOptions({
-  name: 'RectOrbitTetradContent',
-});
-
-export interface IRectOrbitTetradContentProps {
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IRectOrbitTetradContentProps>(), {
-  color: undefined,
-});
-
-const calloutContext = inject(RECT_ORBIT_TETRAD_CALLOUT_KEY, undefined);
-
-const contentColor = computed(() => {
-  return props.color ?? calloutContext?.item.value.textColor ?? '#555555';
-});
-</script>
-
-<template>
-  <div
-    class="alpha-rect-orbit-tetrad-content text-[1rem] leading-[1.38] font-normal tracking-tight m-0 p-0 select-none"
-    :style="{
-      color: contentColor,
-      margin: 0,
-      padding: 0,
-      fontSize: '1rem',
-      fontFamily:
-        'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, Helvetica, Arial, sans-serif',
-    }"
-  >
-    <slot />
-  </div>
-</template>

package/components/facets/tetrad/rect-orbit-tetrad/RectOrbitTetradHeading.vue

@@ -1,44 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { RECT_ORBIT_TETRAD_CALLOUT_KEY } from '../../../../utils/rectOrbitTetrad';
-
-defineOptions({
-  name: 'RectOrbitTetradHeading',
-});
-
-export interface IRectOrbitTetradHeadingProps {
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IRectOrbitTetradHeadingProps>(), {
-  color: undefined,
-});
-
-const calloutContext = inject(RECT_ORBIT_TETRAD_CALLOUT_KEY, undefined);
-
-const headingColor = computed(() => {
-  return (
-    props.color ??
-    calloutContext?.item.value.titleColor ??
-    calloutContext?.item.value.color ??
-    '#f29e4b'
-  );
-});
-</script>
-
-<template>
-  <div
-    class="alpha-rect-orbit-tetrad-heading font-bold text-[1.25rem] leading-tight tracking-tight m-0 p-0 select-none"
-    :style="{
-      color: headingColor,
-      margin: 0,
-      padding: 0,
-      fontSize: '1.25rem',
-      fontFamily:
-        'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, Helvetica, Arial, sans-serif',
-    }"
-  >
-    <slot />
-  </div>
-</template>

package/components/facets/triad/gear-triad/GearTriadContents.vue

@@ -1,111 +0,0 @@
-<script setup lang="ts">
-import { computed, inject, onBeforeUpdate, provide, useSlots } from 'vue';
-
-import {
-  GEAR_TRIAD_CONTENTS_KEY,
-  GEAR_TRIAD_ROOT_KEY,
-  getDefaultGearTriadItem,
-  type IResolvedGearTriadItem,
-} from '../../../../utils/gearTriad';
-
-defineOptions({
-  name: 'GearTriadContents',
-});
-
-export interface IGearTriadContentsProps {
-  readonly title?: string;
-  readonly description?: string;
-  readonly option?: number;
-}
-
-const props = withDefaults(defineProps<IGearTriadContentsProps>(), {
-  title: undefined,
-  description: undefined,
-  option: undefined,
-});
-
-const slots = useSlots();
-const rootContext = inject(GEAR_TRIAD_ROOT_KEY, undefined);
-rootContext?.registerContents();
-
-let contentCounter = 0;
-const optionCounters: Record<number, number> = {};
-onBeforeUpdate(() => {
-  contentCounter = 0;
-  for (const k in optionCounters) {
-    optionCounters[k] = 0;
-  }
-});
-
-const registerContent = (option?: number) => {
-  if (option !== undefined) {
-    optionCounters[option] = (optionCounters[option] ?? 0) + 1;
-    return { index: optionCounters[option] - 1 };
-  }
-  const idx = contentCounter++;
-  return { index: idx };
-};
-
-const resolvedOptionIndex = computed(() => {
-  if (props.option !== undefined) {
-    return Math.max(0, props.option - 1);
-  }
-  return rootContext?.activeOptionIndex.value ?? 0;
-});
-
-const activeItem = computed<IResolvedGearTriadItem>(() => {
-  if (rootContext?.items.value) {
-    const item = rootContext.items.value[resolvedOptionIndex.value];
-    if (item) {
-      return item;
-    }
-  }
-  return getDefaultGearTriadItem(resolvedOptionIndex.value);
-});
-
-provide(GEAR_TRIAD_CONTENTS_KEY, {
-  activeItem,
-  activeOptionIndex: resolvedOptionIndex,
-  registerContent,
-});
-
-const isVisible = computed(() => {
-  if (!rootContext?.isShifted.value) {
-    return false;
-  }
-  if (props.option !== undefined) {
-    return props.option - 1 === rootContext.activeOptionIndex.value;
-  }
-  return true;
-});
-</script>
-
-<template>
-  <div
-    class="alpha-gear-triad-contents absolute right-2.5 top-1/2 -translate-y-1/2 w-[490px] flex flex-col select-none box-border pointer-events-auto transition-all duration-500 ease-out"
-    :class="[
-      isVisible
-        ? 'opacity-100 translate-x-0 delay-200'
-        : 'opacity-0 pointer-events-none translate-x-8',
-    ]"
-  >
-    <!-- Header: Option Title -->
-    <slot name="title">
-      <h3 class="alpha-gear-triad-contents__title text-2xl font-bold font-sans tracking-tight text-slate-900 mb-2">
-        {{ props.title ?? activeItem.title }}
-      </h3>
-    </slot>
-    <!-- Header: Option Description -->
-    <slot name="description">
-      <p class="alpha-gear-triad-contents__desc text-sm font-sans text-slate-500 leading-relaxed mb-6">
-        {{ props.description ?? activeItem.description }}
-      </p>
-    </slot>
-    <!-- Body: List of GearTriadContent items -->
-    <div class="alpha-gear-triad-contents__items flex flex-col gap-3.5">
-      <slot v-if="$slots[String(resolvedOptionIndex + 1)]" :name="String(resolvedOptionIndex + 1)" />
-      <slot v-else-if="$slots[`option-${resolvedOptionIndex + 1}`]" :name="`option-${resolvedOptionIndex + 1}`" />
-      <slot v-else />
-    </div>
-  </div>
-</template>

package/components/facets/triad/gear-triad/GearTriadDescription.vue

@@ -1,38 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { GEAR_TRIAD_CALLOUT_KEY } from '../../../../utils/gearTriad';
-
-defineOptions({
-  name: 'GearTriadDescription',
-});
-
-export interface IGearTriadDescriptionProps {
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IGearTriadDescriptionProps>(), {
-  color: undefined,
-});
-
-const calloutContext = inject(GEAR_TRIAD_CALLOUT_KEY, undefined);
-
-const descriptionColor = computed(() => {
-  return props.color ?? calloutContext?.item.value.textColor ?? '#64748b';
-});
-</script>
-
-<template>
-  <div
-    class="alpha-gear-triad-description text-[0.92rem] leading-[1.45] font-normal select-none"
-    :style="{
-      color: descriptionColor,
-      fontFamily:
-        'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, sans-serif',
-    }"
-  >
-    <slot>
-      {{ calloutContext?.item.value.description }}
-    </slot>
-  </div>
-</template>

package/components/facets/triad/hex-triad/HexTriadCenterBadge.vue

@@ -1,51 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue';
-
-defineOptions({
-  name: 'HexTriadCenterBadge',
-});
-
-export interface IHexTriadCenterBadgeProps {
-  readonly x: number;
-  readonly y: number;
-  readonly text: string | number;
-  readonly color: string;
-  readonly filter?: string;
-  readonly radius: number;
-}
-
-const props = withDefaults(defineProps<IHexTriadCenterBadgeProps>(), {
-  filter: 'url(#hex-badge-shadow)',
-});
-
-const transform = computed(() => {
-  return `translate(${props.x}, ${props.y})`;
-});
-</script>
-
-<template>
-  <g class="alpha-hex-triad-center-badge" :transform="transform" :filter="filter">
-    <circle class="alpha-hex-triad-center-badge__outer" cx="0" cy="0" :r="radius + 4" fill="#ffffff" />
-    <circle class="alpha-hex-triad-center-badge__circle" cx="0" cy="0" :r="radius" :fill="color" />
-    <circle
-      class="alpha-hex-triad-center-badge__ring"
-      cx="0"
-      cy="0"
-      :r="radius - 4"
-      fill="none"
-      stroke="#ffffff"
-      stroke-width="1.2"
-      :style="{ opacity: 0.65 }"
-    />
-    <text
-      class="alpha-hex-triad-center-badge__text font-black text-lg select-none"
-      x="0"
-      y="6.5"
-      text-anchor="middle"
-      fill="#ffffff"
-      font-family="system-ui, -apple-system, sans-serif"
-    >
-      {{ text }}
-    </text>
-  </g>
-</template>

package/components/facets/triad/hex-triad/HexTriadContent.vue

@@ -1,20 +0,0 @@
-<script setup lang="ts">
-defineOptions({
-  name: 'HexTriadContent',
-});
-</script>
-
-<template>
-  <p
-    class="alpha-hex-triad-content mt-0 mb-0 text-[1rem] leading-relaxed max-w-[240px]"
-    :style="{
-      margin: 0,
-      fontSize: '1rem',
-      fontFamily: 'system-ui, -apple-system, BlinkMacSystemFont, sans-serif',
-    }"
-  >
-    <slot>
-      Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod sed diam nonummy nibh
-    </slot>
-  </p>
-</template>