Add subtle inverse recipes to Designer plugin (#251)

* Add subtle inverse recipes to Designer plugin
* Fix string comparison casing issues

Author: bheston

change/@adaptive-web-adaptive-ui-designer-core-289da1f2-dd15-46e7-b788-14bff1e6223a.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Add subtle inverse recipes to Designer plugin",
+  "packageName": "@adaptive-web/adaptive-ui-designer-core",
+  "email": "47367562+bheston@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

change/@adaptive-web-adaptive-ui-designer-figma-4e1269e6-8c1d-48af-8d6e-6e1d944d1ebf.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Fix string comparison casing issues",
+  "packageName": "@adaptive-web/adaptive-ui-designer-figma",
+  "email": "47367562+bheston@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

packages/adaptive-ui-designer-core/src/registry/recipes.ts

@@ -6,6 +6,7 @@ import {
     accentFillReadable,
     accentFillStealth,
     accentFillSubtle,
+    accentFillSubtleInverse,
     accentStrokeDiscernible,
     accentStrokeReadable,
     accentStrokeSafety,
@@ -22,6 +23,7 @@ import {
     criticalFillReadable,
     criticalFillStealth,
     criticalFillSubtle,
+    criticalFillSubtleInverse,
     criticalStrokeDiscernible,
     criticalStrokeReadable,
     criticalStrokeSafety,
@@ -54,6 +56,7 @@ import {
     highlightFillReadable,
     highlightFillStealth,
     highlightFillSubtle,
+    highlightFillSubtleInverse,
     highlightStrokeDiscernible,
     highlightStrokeReadable,
     highlightStrokeSafety,
@@ -65,6 +68,7 @@ import {
     infoFillReadable,
     infoFillStealth,
     infoFillSubtle,
+    infoFillSubtleInverse,
     infoStrokeDiscernible,
     infoStrokeReadable,
     infoStrokeSafety,
@@ -94,6 +98,7 @@ import {
     neutralFillReadable,
     neutralFillStealth,
     neutralFillSubtle,
+    neutralFillSubtleInverse,
     neutralStrokeDiscernible,
     neutralStrokeReadable,
     neutralStrokeSafety,
@@ -112,6 +117,7 @@ import {
     successFillReadable,
     successFillStealth,
     successFillSubtle,
+    successFillSubtleInverse,
     successStrokeDiscernible,
     successStrokeReadable,
     successStrokeSafety,
@@ -141,6 +147,7 @@ import {
     warningFillReadable,
     warningFillStealth,
     warningFillSubtle,
+    warningFillSubtleInverse,
     warningStrokeDiscernible,
     warningStrokeReadable,
     warningStrokeSafety,
@@ -223,42 +230,49 @@ const colorTokens: DesignTokenOrGroupStore = [
     accentBaseColor,
     accentFillStealth,
     accentFillSubtle,
+    accentFillSubtleInverse,
     accentFillIdeal,
     accentFillDiscernible,
     accentFillReadable,
     highlightBaseColor,
     highlightFillStealth,
     highlightFillSubtle,
+    highlightFillSubtleInverse,
     highlightFillIdeal,
     highlightFillDiscernible,
     highlightFillReadable,
     criticalBaseColor,
     criticalFillStealth,
     criticalFillSubtle,
+    criticalFillSubtleInverse,
     criticalFillIdeal,
     criticalFillDiscernible,
     criticalFillReadable,
     warningBaseColor,
     warningFillStealth,
     warningFillSubtle,
+    warningFillSubtleInverse,
     warningFillIdeal,
     warningFillDiscernible,
     warningFillReadable,
     successBaseColor,
     successFillStealth,
     successFillSubtle,
+    successFillSubtleInverse,
     successFillIdeal,
     successFillDiscernible,
     successFillReadable,
     infoBaseColor,
     infoFillStealth,
     infoFillSubtle,
+    infoFillSubtleInverse,
     infoFillIdeal,
     infoFillDiscernible,
     infoFillReadable,
     neutralBaseColor,
     neutralFillStealth,
     neutralFillSubtle,
+    neutralFillSubtleInverse,
     neutralFillIdeal,
     neutralFillDiscernible,
     neutralFillReadable,

packages/adaptive-ui-designer-figma-plugin/src/figma/node.ts

@@ -288,11 +288,11 @@ export class FigmaPluginNode extends PluginNode {
         }
 
         if (this._node.type === "COMPONENT") {
-            const disabled: string | null = this._node.variantProperties ? this._node.variantProperties[disabledVariant] : null;
+            const disabled: string | null = this._node.variantProperties ? this._node.variantProperties[disabledVariant]?.toLowerCase() : null;
             const state: State | undefined = this._node.variantProperties ? this._node.variantProperties[stateVariant] as State : undefined;
             this._state = disabled === "true" ? "Disabled" : state;
         } else if (this._node.type === "INSTANCE") {
-            const disabled: string | null = this._node.componentProperties[disabledVariant]?.value as string;
+            const disabled: string | null = (this._node.componentProperties[disabledVariant]?.value as string)?.toLowerCase();
             const state: State = this._node.componentProperties[stateVariant]?.value as State;
             this._state = disabled === "true" ? "Disabled" : state;
         }

packages/adaptive-ui-designer-figma-plugin/src/ui/ui-controller-code.ts

@@ -21,7 +21,7 @@ export class CodeController {
      */
     public selectedNodesChanged() {
         this.supportsCodeGen = this.controller.selectedNodes.length === 1 &&
-            this.controller.selectedNodes[0].additionalData.get(AdditionalDataKeys.supportsCodeGen) === "true";
+            this.controller.selectedNodes[0].additionalData.get(AdditionalDataKeys.supportsCodeGen).toLowerCase() === "true";
         // console.log("change", this.supportsCodeGen);
     }
 

packages/adaptive-ui-designer-figma/src/lib/anatomy.ts

@@ -234,7 +234,7 @@ function isContextNode(node: PluginUINodeData, componentName: string): boolean {
 }
 
 function walkNode(node: PluginUINodeData, componentName: string, condition: Record<string, string | boolean> | undefined, anatomy: Anatomy): void {
-    if (node.name === "Focus indicator") {
+    if (node.name.toLowerCase() === "focus indicator") {
         // Ignore for now
         return;
     }