@@ -21,7 +22,7 @@ import type { CoercableComponent } from "features/feature";
import type { FeatureNode } from "game/layers";
import type { Persistent } from "game/persistence";
import player from "game/player";
-import { computeComponent, processedPropType, wrapRef } from "util/vue";
+import { computeComponent, computeOptionalComponent, processedPropType, wrapRef } from "util/vue";
import type { PropType, Ref } from "vue";
import { computed, defineComponent, nextTick, toRefs, unref, watch } from "vue";
import Context from "./Context.vue";
@@ -41,6 +42,7 @@ export default defineComponent({
type: processedPropType(Object, String, Function),
required: true
},
+ minimizedDisplay: processedPropType(Object, String, Function),
minimized: {
type: Object as PropType>,
required: true
@@ -61,9 +63,10 @@ export default defineComponent({
}
},
setup(props) {
- const { display, index, minimized, minWidth, tab } = toRefs(props);
+ const { display, index, minimized, minWidth, tab, minimizedDisplay } = toRefs(props);
const component = computeComponent(display);
+ const minimizedComponent = computeOptionalComponent(minimizedDisplay);
const showGoBack = computed(
() => projInfo.allowGoBack && index.value > 0 && !minimized.value
);
@@ -106,6 +109,7 @@ export default defineComponent({
return {
component,
+ minimizedComponent,
showGoBack,
updateNodes,
unref,
@@ -155,7 +159,7 @@ export default defineComponent({
background-color: transparent;
}
-.layer-tab.minimized div {
+.layer-tab.minimized > * {
margin: 0;
writing-mode: vertical-rl;
padding-left: 10px;
diff --git a/src/game/layers.tsx b/src/game/layers.tsx
index 404d72c..5435a2d 100644
--- a/src/game/layers.tsx
+++ b/src/game/layers.tsx
@@ -109,7 +109,7 @@ export interface LayerOptions {
color?: Computable;
/**
* The layout of this layer's features.
- * When the layer is open in {@link game/player.PlayerData.tabs}, this is the content that is display.
+ * When the layer is open in {@link game/player.PlayerData.tabs}, this is the content that is displayed.
*/
display: Computable;
/** An object of classes that should be applied to the display. */
@@ -126,6 +126,11 @@ export interface LayerOptions {
* Defaults to true.
*/
minimizable?: Computable;
+ /**
+ * The layout of this layer's features.
+ * When the layer is open in {@link game/player.PlayerData.tabs}, but the tab is {@link Layer.minimized} this is the content that is displayed.
+ */
+ minimizedDisplay?: Computable;
/**
* Whether or not to force the go back button to be hidden.
* If true, go back will be hidden regardless of {@link data/projInfo.allowGoBack}.
@@ -170,6 +175,7 @@ export type Layer = Replace<
name: GetComputableTypeWithDefault;
minWidth: GetComputableTypeWithDefault;
minimizable: GetComputableTypeWithDefault;
+ minimizedDisplay: GetComputableType;
forceHideGoBack: GetComputableType;
}
>;
@@ -231,6 +237,7 @@ export function createLayer(
setDefault(layer, "minWidth", 600);
processComputable(layer as T, "minimizable");
setDefault(layer, "minimizable", true);
+ processComputable(layer as T, "minimizedDisplay");
return layer as unknown as Layer;
});