How to reuse and compose shapes within the same file

[sonicsmooth]

I'd like to be able to reuse a hierarchy of shapes:
For example:

<def?> mycomponent: {
    the
    box
}

mc1: mycomponent
mc2: mycomponent

should result in

I can do this by defining mycomponent in another file and then using ...@filename, but I'd like to keep the component definition in the main file.

It seems like classes can be used to compose properties and styles, but not shapes.
eg https://github.com/terrastruct/d2/discussions/1087

This doesn't work:

classes: {
    mycomponent: {
        some
        thing
    }
}

x.class: mycomponent
y.class: mycomponent

It seems like vars can't contain shapes.

Perhaps I'm missing something obvious with these.

thanks

[alixander]

vars can do this. unless i'm misunderstanding, this is the same issue as #1891 (comment)

[sonicsmooth]

Thanks, that's close.
How do I use vars to collect a number of shapes+arrows into one thing, that can then get instantiated many times?

Like below, where I don't have to type dog1, dog3, etc., multiple times.

my-house: {
  ...${my-house}
  dog1 -- dog3: "Couple"
  dog1: ${dog1}
  dog3: ${dog3}

}

[alixander]

vars: {
  house: {
    cat -> dog
  }
}

mansion: {
  ...${house}
}

shed: {
  ...${house}
}

[sonicsmooth]

Thanks! This is the obvious thing I was missing :)
Can a var refer to another var in the same scope?

vars: {
    Apple: {
        shape:circle
        label:Granny Smith
    }
    Cherry: {
        shape:circle
        label:Rainier Cherry
    }
    SummerFruit: {
        xx: ${Apple}   # Could not resolve
        cc: ${Cherry}  # Could not resolve
        xx -> cc
    }
}

x: ${Apple}   # ok
c: ${Cherry}  # ok
x -> c
sf: ${SummerFruit} # doesn't get this far

[alixander]

It should, I made an issue: #2017