@alphacifer/slidev-addon-theme 0.0.10 → 0.0.11

package/utils/pyramid/square-pyramid/createSquarePyramidGeometry.ts

@@ -2,8 +2,6 @@ import {
   clampPyramidCount,
   computePyramidStacking,
   DEFAULT_PYRAMID_COLOR,
-  darkenColor,
-  lightenColor,
   MAX_PYRAMID_COUNT,
   MIN_PYRAMID_COUNT,
   resolvePyramidPalette,
@@ -17,19 +15,17 @@ import type {
 
 export const DEFAULT_SQUARE_PYRAMID_COLOR = DEFAULT_PYRAMID_COLOR;
 export const DEFAULT_SQUARE_PYRAMID_STACK_COLORS: readonly string[] = [
-  '#ec4899', // 0: Pink (matches top slab)
-  '#8b5cf6', // 1: Purple (matches 2nd slab)
-  '#3b82f6', // 2: Blue (matches 3rd slab)
-  '#06b6d4', // 3: Cyan (matches 4th slab)
-  '#14b8a6', // 4: Teal (matches 5th slab)
-  '#f59e0b', // 5: Amber (warm accent)
+  'var(--alpha-square-pyramid-stack-1-color)',
+  'var(--alpha-square-pyramid-stack-2-color)',
+  'var(--alpha-square-pyramid-stack-3-color)',
+  'var(--alpha-square-pyramid-stack-4-color)',
+  'var(--alpha-square-pyramid-stack-5-color)',
+  'var(--alpha-square-pyramid-stack-6-color)',
 ] as const;
 
 export const MIN_SQUARE_COUNT = MIN_PYRAMID_COUNT;
 export const MAX_SQUARE_COUNT = MAX_PYRAMID_COUNT;
 
-export { darkenColor, lightenColor };
-
 export function clampSquareCount(count?: number): number {
   return clampPyramidCount(count);
 }

package/utils/useDiagramAutoScale.ts

@@ -46,7 +46,7 @@ function resolveValue<T>(val: Ref<T> | (() => T) | undefined, fallback: T): T {
 
 /**
  * Automatically computes a scale factor (via CSS transform: scale)
- * so that diagram components (ArrowTriad, RectOrbitTetrad, ArcArrowProcess, etc.)
+ * so that diagram components (ArrowTriad, RectangleOrbitTetrad, ArcArrowProcess, etc.)
  * fit comfortably inside the available slide canvas without clipping or overlaying pagination.
  */
 export function useDiagramAutoScale(
@@ -156,16 +156,14 @@ export function useDiagramAutoScale(
         pagyEl && window.getComputedStyle(pagyEl).display !== 'none';
       const clearance = isPagyVisible ? pagyClearance : 16;
 
-      // Check for internal component header inside el (e.g. ArcDiD, GearTriad, HexTriad)
+      // Check for internal component header inside el (e.g. ArcDefenseInDepth, GearTriad, HexagonTriad)
       let internalHeaderH = 0;
       for (let i = 0; i < el.children.length; i++) {
         const child = el.children[i];
         if (
           child instanceof HTMLElement &&
           (child.tagName === 'HEADER' ||
-            child.classList.contains('alpha-arc-did__header') ||
-            child.classList.contains('alpha-gear-triad__header') ||
-            child.classList.contains('alpha-hex-triad__header'))
+            child.classList.contains('alpha-arc-defense-in-depth__header'))
         ) {
           internalHeaderH += child.offsetHeight;
           const cs = window.getComputedStyle(child);
@@ -201,7 +199,11 @@ export function useDiagramAutoScale(
                   (Number.parseFloat(cs.marginBottom) || 0);
               }
             }
-            if (p === slideEl) break;
+
+            if (p === slideEl) {
+              break;
+            }
+
             curr = p;
           }
         }

package/utils/useMergedUnoAttrs.ts

@@ -1,12 +1,12 @@
 import { useAttrs } from 'vue';
 
-import { mergeUno } from './mergeUno';
-import type { TUnoClassValue } from './mergeUno/types';
+import { mergeUno } from './merge-uno';
+import type { TUnoClassValue } from './merge-uno/types';
 
 type TUnoClassSource = TUnoClassValue | (() => TUnoClassValue);
 
 interface IUseMergedUnoAttrsResult {
-  readonly className: () => string;
+  readonly className: (...extraDefaults: TUnoClassValue[]) => string;
   readonly forwardedAttrs: () => Record<string, unknown>;
 }
 
@@ -20,11 +20,15 @@ export function useMergedUnoAttrs(
 ): IUseMergedUnoAttrsResult {
   const attrs = useAttrs();
 
-  const className = (): string => {
+  const className = (...extraDefaults: TUnoClassValue[]): string => {
     const resolvedDefaults =
       typeof defaultClasses === 'function' ? defaultClasses() : defaultClasses;
 
-    return mergeUno(resolvedDefaults, attrs.class as TUnoClassValue);
+    return mergeUno(
+      resolvedDefaults,
+      ...extraDefaults,
+      attrs.class as TUnoClassValue,
+    );
   };
 
   const forwardedAttrs = (): Record<string, unknown> => {

package/components/card/chevron-card/ChevronCardHeading.vue

@@ -1,39 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { CHEVRON_CARD_KEY } from '../../../utils/chevronCard';
-
-defineOptions({
-  name: 'ChevronCardHeading',
-});
-
-export interface IChevronCardHeadingProps {
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IChevronCardHeadingProps>(), {
-  color: undefined,
-});
-
-const cardContext = inject(CHEVRON_CARD_KEY, undefined);
-
-const headingColor = computed(() => {
-  return props.color ?? cardContext?.titleColor.value ?? '#4b5563';
-});
-</script>
-
-<template>
-  <div
-    class="alpha-chevron-card-heading font-bold text-[1.25rem] uppercase tracking-wider leading-tight select-none font-sans"
-    :style="{
-      color: headingColor,
-      padding: 0,
-      fontSize: '1.25rem',
-      fontFamily:
-        'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, sans-serif',
-      marginBottom: '0.25rem',
-    }"
-  >
-    <slot />
-  </div>
-</template>

package/components/card/horiz-card/HorizCardHeading.vue

@@ -1,47 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { HORIZ_CARD_KEY } from '../../../utils/horizCard';
-import { useMergedUnoAttrs } from '../../../utils/useMergedUnoAttrs';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'HorizCardHeading',
-});
-
-export interface IHorizCardHeadingProps {
-  /**
-   * Title text color. Overrides context titleColor.
-   */
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IHorizCardHeadingProps>(), {
-  color: undefined,
-});
-
-const context = inject(HORIZ_CARD_KEY, undefined);
-
-const headingColor = computed(() => {
-  return (
-    props.color ??
-    context?.titleColor.value ??
-    context?.color.value ??
-    '#ea583a'
-  );
-});
-
-const { className, forwardedAttrs } = useMergedUnoAttrs(
-  'alpha-horiz-card-heading font-sans font-bold text-xl tracking-tight leading-tight',
-);
-</script>
-
-<template>
-  <h3
-    v-bind="forwardedAttrs()"
-    :class="className()"
-    :style="{ color: headingColor }"
-  >
-    <slot>Lorem Ipsum</slot>
-  </h3>
-</template>

package/components/card/vert-card/VertCardHeading.vue

@@ -1,68 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { useMergedUnoAttrs } from '../../../utils/useMergedUnoAttrs';
-import { VERT_CARD_KEY } from '../../../utils/vertCard';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'VertCardHeading',
-});
-
-export interface IVertCardHeadingProps {
-  /**
-   * Title text color. Overrides context titleColor.
-   */
-  readonly color?: string;
-  /**
-   * Whether to render the decorative horizontal line with center dot below the title.
-   * @default true
-   */
-  readonly hasDivider?: boolean;
-}
-
-const props = withDefaults(defineProps<IVertCardHeadingProps>(), {
-  color: undefined,
-  hasDivider: true,
-});
-
-const context = inject(VERT_CARD_KEY, undefined);
-
-const headingColor = computed(() => {
-  return (
-    props.color ??
-    context?.titleColor.value ??
-    context?.color.value ??
-    '#ea583a'
-  );
-});
-
-const { className, forwardedAttrs } = useMergedUnoAttrs(
-  'alpha-vert-card-heading font-sans font-bold text-xl tracking-tight leading-tight text-center',
-);
-</script>
-
-<template>
-  <div class="flex flex-col items-center w-full">
-    <h3
-      v-bind="forwardedAttrs()"
-      :class="className()"
-      :style="{ color: headingColor }"
-    >
-      <slot>Lorem Ipsum</slot>
-    </h3>
-    <div
-      v-if="props.hasDivider"
-      class="mt-2.5 flex items-center justify-center w-32 relative"
-    >
-      <div
-        class="w-full h-[1.5px]"
-        :style="{ backgroundColor: headingColor }"
-      />
-      <span
-        class="absolute w-2 h-2 rounded-full"
-        :style="{ backgroundColor: headingColor }"
-      />
-    </div>
-  </div>
-</template>

package/components/card/vert-card/VertCardTitle.vue

@@ -1,76 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import { useMergedUnoAttrs } from '../../../utils/useMergedUnoAttrs';
-import { VERT_CARD_KEY } from '../../../utils/vertCard';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'VertCardTitle',
-});
-
-export interface IVertCardTitleProps {
-  /**
-   * Title text color. Overrides context titleColor.
-   */
-  readonly color?: string;
-  /**
-   * Whether to render the decorative horizontal line with center dot below the title.
-   * Defaults to context hasDivider, or true.
-   */
-  readonly hasDivider?: boolean;
-}
-
-const props = withDefaults(defineProps<IVertCardTitleProps>(), {
-  color: undefined,
-  hasDivider: undefined,
-});
-
-const context = inject(VERT_CARD_KEY, undefined);
-
-const headingColor = computed(() => {
-  return (
-    props.color ??
-    context?.titleColor.value ??
-    context?.color.value ??
-    '#ea583a'
-  );
-});
-
-const isDividerVisible = computed(() => {
-  if (props.hasDivider !== undefined) {
-    return props.hasDivider;
-  }
-
-  return context?.hasDivider?.value ?? true;
-});
-
-const { className, forwardedAttrs } = useMergedUnoAttrs(
-  'alpha-vert-card-title font-sans font-bold text-xl tracking-tight leading-tight text-center',
-);
-</script>
-
-<template>
-  <div class="flex flex-col items-center w-full">
-    <h3
-      v-bind="forwardedAttrs()"
-      :class="className()"
-      :style="{ color: headingColor }"
-    >
-      <slot>Lorem Ipsum</slot>
-    </h3>
-    <div
-      v-if="isDividerVisible"
-      class="mt-2.5 flex items-center justify-center w-32 relative"
-    >
-      <div
-        class="w-full h-[1.5px]"
-        :style="{ backgroundColor: headingColor }"
-      />
-      <span
-        class="absolute w-2 h-2 rounded-full"
-        :style="{ backgroundColor: headingColor }"
-      />
-    </div>
-  </div>
-</template>

package/components/comparisons/arc-comparison/ArcComparisonContents.vue

@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import ArcOrbitContents from '../../core/arc-orbit/ArcOrbitContents.vue';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'ArcComparisonContents',
-});
-</script>
-
-<template>
-  <ArcOrbitContents
-    v-bind="$attrs"
-    class="alpha-arc-comparison-contents"
-  >
-    <slot />
-  </ArcOrbitContents>
-</template>

package/components/comparisons/arc-comparison/ArcComparisonTitle.vue

@@ -1,29 +0,0 @@
-<script setup lang="ts">
-import ArcOrbitTitle, {
-  type IArcOrbitTitleProps,
-} from '../../core/arc-orbit/ArcOrbitTitle.vue';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'ArcComparisonTitle',
-});
-
-export interface IArcComparisonTitleProps extends IArcOrbitTitleProps {}
-
-const props = defineProps<IArcComparisonTitleProps>();
-</script>
-
-<template>
-  <ArcOrbitTitle
-    v-if="$slots.default"
-    v-bind="{ ...props, ...$attrs }"
-    class="alpha-arc-comparison-title"
-  >
-    <slot />
-  </ArcOrbitTitle>
-  <ArcOrbitTitle
-    v-else
-    v-bind="{ ...props, ...$attrs }"
-    class="alpha-arc-comparison-title"
-  />
-</template>

package/components/core/arc-orbit/ArcOrbitContents.vue

@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import { useMergedUnoAttrs } from '../../../utils/useMergedUnoAttrs';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'ArcOrbitContents',
-});
-
-const { className, forwardedAttrs } = useMergedUnoAttrs(
-  'alpha-arc-orbit-contents absolute inset-0 w-full h-full pointer-events-none',
-);
-</script>
-
-<template>
-  <div v-bind="forwardedAttrs()" :class="className()">
-    <slot />
-  </div>
-</template>

package/components/core/arc-orbit/ArcOrbitTitle.vue

@@ -1,50 +0,0 @@
-<script setup lang="ts">
-import { computed, inject } from 'vue';
-
-import {
-  ARC_ORBIT_ROOT_KEY,
-  DEFAULT_ARC_ORBIT_COLOR,
-} from '../../../utils/arcOrbit';
-import { useMergedUnoAttrs } from '../../../utils/useMergedUnoAttrs';
-
-defineOptions({
-  inheritAttrs: false,
-  name: 'ArcOrbitTitle',
-});
-
-export interface IArcOrbitTitleProps {
-  readonly color?: string;
-}
-
-const props = withDefaults(defineProps<IArcOrbitTitleProps>(), {
-  color: undefined,
-});
-
-const rootContext = inject(ARC_ORBIT_ROOT_KEY, undefined);
-
-const titleColor = computed(() => {
-  return props.color ?? rootContext?.color.value ?? DEFAULT_ARC_ORBIT_COLOR;
-});
-
-const titleStyle = computed(() => {
-  return {
-    color: titleColor.value,
-    fontFamily:
-      'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
-  };
-});
-
-const { className, forwardedAttrs } = useMergedUnoAttrs(
-  'alpha-arc-orbit-title font-bold text-center px-2 leading-tight flex items-center justify-center select-none text-[1.125rem] tracking-tight whitespace-pre-line',
-);
-</script>
-
-<template>
-  <div
-    v-bind="forwardedAttrs()"
-    :class="className()"
-    :style="titleStyle"
-  >
-    <slot>{{ rootContext?.title.value ?? 'Add Topic\nTitle' }}</slot>
-  </div>
-</template>