chore(text-anchor): decouple from FAST Foundation (VIV-2252) (#2051)

Decouple fast foundation
Vonage · Dec 6, 2024 · 03aa44c · 03aa44c
1 parent 731882e
commit 03aa44c
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 23 deletions.
diff --git a/libs/components/src/lib/text-anchor/text-anchor.ts b/libs/components/src/lib/text-anchor/text-anchor.ts
@@ -1,7 +1,9 @@
-import { Anchor, applyMixins } from '@microsoft/fast-foundation';
 import { attr, ViewTemplate } from '@microsoft/fast-element';
+import { FoundationElement } from '@microsoft/fast-foundation';
 import { Appearance, Connotation } from '../enums';
 import { AffixIcon } from '../../shared/patterns/affix';
+import { applyMixins } from '../../shared/foundation/utilities/apply-mixins';
+import { Anchor } from '../../shared/foundation/anchor/anchor';
 
 /**
  * Types of text anchor connotation.
@@ -27,7 +29,7 @@ export type TextAnchorAppearance = Extract<
  * @component text-anchor
  * @slot icon - Add an icon to the component.
  */
-export class TextAnchor extends Anchor {
+export class TextAnchor extends FoundationElement {
 	/**
 	 * Indicates the text anchor's text.
 	 *
@@ -64,5 +66,5 @@ export class TextAnchor extends Anchor {
 	}
 }
 
-export interface TextAnchor extends AffixIcon {}
-applyMixins(TextAnchor, AffixIcon);
+export interface TextAnchor extends AffixIcon, Anchor {}
+applyMixins(TextAnchor, AffixIcon, Anchor);
diff --git a/libs/components/src/shared/foundation/anchor/anchor.ts b/libs/components/src/shared/foundation/anchor/anchor.ts
@@ -1,6 +1,6 @@
 import { attr } from '@microsoft/fast-element';
-import { applyMixins } from '@microsoft/fast-foundation';
 import { ARIAGlobalStatesAndProperties } from '../patterns/aria-global';
+import { applyMixins } from '../utilities/apply-mixins';
 
 /**
  * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a | <a> element }.
@@ -85,6 +85,11 @@ export class Anchor {
 	@attr
 	// @ts-expect-error Type is incorrectly non-optional
 	type: string;
+
+	/**
+	 * References the root element
+	 */
+	control: HTMLAnchorElement | undefined;
 }
 
 /**

diff --git a/libs/wrapper-gen/src/generator/customElementDeclarations.ts b/libs/wrapper-gen/src/generator/customElementDeclarations.ts
@@ -283,6 +283,21 @@ const resolveComponentDeclaration = (
 				...declaration._localTypeDefs,
 			};
 		}
+
+		// Apply vivid mixins
+		if (declaration.vividComponent) {
+			const mixins = extractVividMixins(className, declaration._modulePath);
+			for (const mixinName of mixins) {
+				if (!(mixinName in VividMixins)) {
+					throw new Error(`Unknown mixin ${mixinName}`);
+				}
+				declaration.attributes = inheritItems(
+					getAttributeName,
+					VividMixins[mixinName],
+					declaration.attributes
+				);
+			}
+		}
 	}
 
 	return declaration;
@@ -505,24 +520,7 @@ export const getClassNameOfVividComponent = (name: string): string => {
 export const getVividComponentDeclaration = (
 	name: string,
 	className: string
-): Declaration => {
-	const declaration = resolveComponentDeclaration(vividDeclarations, className);
-
-	// Apply vivid mixins
-	const mixins = extractVividMixins(className, declaration._modulePath);
-	for (const mixinName of mixins) {
-		if (!(mixinName in VividMixins)) {
-			throw new Error(`Unknown mixin ${mixinName}`);
-		}
-		declaration.attributes = inheritItems(
-			getAttributeName,
-			VividMixins[mixinName],
-			declaration.attributes
-		);
-	}
-
-	return declaration;
-};
+): Declaration => resolveComponentDeclaration(vividDeclarations, className);
 
 /**
  * Lists all public components from Vivid. E.g. 'accordion-item'.