diff --git a/platform/wab/src/wab/client/ProjectDependencyManager.ts b/platform/wab/src/wab/client/ProjectDependencyManager.ts index 385bf635e52..cdcf9f163f3 100644 --- a/platform/wab/src/wab/client/ProjectDependencyManager.ts +++ b/platform/wab/src/wab/client/ProjectDependencyManager.ts @@ -113,17 +113,17 @@ export class ProjectDependencyManager { }); // We no longer plan to make any updates to plume site. So its unnecessary to re-fetch it if it has already been fetched. - if (!this.plumeSite) { - const bundler = new FastBundler(); - // Get Plume site - const plumePkg = await this._sc.appCtx.api.getPlumePkg(); - const plumeSite = unbundleProjectDependency( - bundler, - plumePkg.pkg, - plumePkg.depPkgs - ).projectDependency.site; - this.plumeSite = this.inlineAssets(plumeSite); - } + // if (!this.plumeSite) { + // const bundler = new FastBundler(); + // // Get Plume site + // const plumePkg = await this._sc.appCtx.api.getPlumePkg(); + // const plumeSite = unbundleProjectDependency( + // bundler, + // plumePkg.pkg, + // plumePkg.depPkgs + // ).projectDependency.site; + // this.plumeSite = this.inlineAssets(plumeSite); + // } } /** diff --git a/platform/wab/src/wab/client/components/canvas/site-ops.tsx b/platform/wab/src/wab/client/components/canvas/site-ops.tsx index 4672ded6a63..38839e8f936 100644 --- a/platform/wab/src/wab/client/components/canvas/site-ops.tsx +++ b/platform/wab/src/wab/client/components/canvas/site-ops.tsx @@ -1494,8 +1494,11 @@ export class SiteOps { ); } - removeStyleVariantIfEmptyAndUnused(component: Component, variant: Variant) { - this.tplMgr.removeStyleVariantIfEmptyAndUnused(component, variant); + removeRegisteredVariantIfEmptyAndUnused( + component: Component, + variant: Variant + ) { + this.tplMgr.removeRegisteredVariantIfEmptyAndUnused(component, variant); this.studioCtx.ensureComponentStackFramesHasOnlyValidVariants(component); this.studioCtx.pruneInvalidViewCtxs(); } diff --git a/platform/wab/src/wab/client/components/sidebar-tabs/private-style-variants-section.tsx b/platform/wab/src/wab/client/components/sidebar-tabs/private-style-variants-section.tsx index 008a8fbe551..2a4c772f9a6 100644 --- a/platform/wab/src/wab/client/components/sidebar-tabs/private-style-variants-section.tsx +++ b/platform/wab/src/wab/client/components/sidebar-tabs/private-style-variants-section.tsx @@ -144,7 +144,7 @@ export const PrivateStyleVariantsPanel = observer( studioCtx.changeUnsafe(() => { studioCtx .siteOps() - .removeStyleVariantIfEmptyAndUnused( + .removeRegisteredVariantIfEmptyAndUnused( component, variant ); diff --git a/platform/wab/src/wab/client/components/variants/VariantsPanel.tsx b/platform/wab/src/wab/client/components/variants/VariantsPanel.tsx index 948b3e7c19b..fee68c76da1 100644 --- a/platform/wab/src/wab/client/components/variants/VariantsPanel.tsx +++ b/platform/wab/src/wab/client/components/variants/VariantsPanel.tsx @@ -1039,7 +1039,7 @@ const ComponentStyleVariantRow = observer( studioCtx.change(({ success }) => { studioCtx .siteOps() - .removeStyleVariantIfEmptyAndUnused(component, variant); + .removeRegisteredVariantIfEmptyAndUnused(component, variant); return success(); }) } diff --git a/platform/wab/src/wab/client/components/variants/variant-menu.tsx b/platform/wab/src/wab/client/components/variants/variant-menu.tsx index 6e5089d8984..f471f1cbbdf 100644 --- a/platform/wab/src/wab/client/components/variants/variant-menu.tsx +++ b/platform/wab/src/wab/client/components/variants/variant-menu.tsx @@ -5,6 +5,7 @@ import { ClickStopper } from "@/wab/client/components/widgets"; import { StudioCtx } from "@/wab/client/studio-ctx/StudioCtx"; import { ensure, spawn } from "@/wab/shared/common"; import { + allCodeComponentVariants, allComponentStyleVariants, allPrivateStyleVariants, } from "@/wab/shared/core/components"; @@ -33,6 +34,7 @@ import { import { getBaseVariant, isBaseVariant, + isCodeComponentVariant, isPrivateStyleVariant, isScreenVariantGroup, isStandaloneVariantGroup, @@ -86,7 +88,10 @@ export function makeVariantMenu(opts: { builder.genSection(undefined, (push) => { push( - Edit interaction selectors + Edit{" "} + {isCodeComponentVariant(variant) + ? "registered keys" + : "interaction selectors"} ); }); @@ -189,6 +194,10 @@ function genCopyToVariantMenu( > {isStyleVariant(variant) ? (
{variant.selectors.join(", ")}
+ ) : isCodeComponentVariant(variant) ? ( +
+ {variant.codeComponentVariantKeys.join(", ")} +
) : ( variant.name )} @@ -227,6 +236,12 @@ function genCopyToVariantMenu( ); }); + builder.genSection(`Registered Variants`, (push2) => { + allCodeComponentVariants(component).forEach((v) => + genMenuForVariant(v, push2) + ); + }); + component.variantGroups.forEach((vg) => genMenuForVariantGroup(vg, push)); }); } diff --git a/platform/wab/src/wab/shared/TplMgr.ts b/platform/wab/src/wab/shared/TplMgr.ts index 29ed284206d..4020ffa9823 100644 --- a/platform/wab/src/wab/shared/TplMgr.ts +++ b/platform/wab/src/wab/shared/TplMgr.ts @@ -48,6 +48,7 @@ import { hasScreenVariant, hasStyleVariant, isBaseVariant, + isCodeComponentVariant, isGlobalVariant, isGlobalVariantGroup, isRegisteredVariant, @@ -601,10 +602,22 @@ export class TplMgr { }); } - removeStyleVariantIfEmptyAndUnused(component: Component, variant: Variant) { - assert(isStyleVariant(variant), "Given variant should be a style variant"); + removeRegisteredVariantIfEmptyAndUnused( + component: Component, + variant: Variant + ) { + assert( + isRegisteredVariant(variant), + "Given variant should be a registered variant" + ); + + if (isStyleVariant(variant) && variant.selectors.length > 0) { + return; + } + if ( - ensure(variant.selectors, "Style variant must have selectors").length > 0 + isCodeComponentVariant(variant) && + variant.codeComponentVariantKeys.length > 0 ) { return; } @@ -2257,8 +2270,8 @@ export class TplMgr { this.renameVariant(newVariant, newVariant.name); } else { assert( - isStyleVariant(variant), - "Variant with no parent is expected to be a style variant" + isRegisteredVariant(variant), + "Variant with no parent is expected to be a registered variant" ); component.variants.push(newVariant); }