<!-- SPEC: PJ2026-010405 云端控制台. -->
<!-- Implementation reference: draft-2026-07-13-p0-cloud-console. -->

<script setup lang="ts">
import { computed } from "vue";

const props = withDefaults(defineProps<{ inspectorOpen?: boolean; inspectorWidth?: string; label?: string }>(), {
  inspectorOpen: false,
  inspectorWidth: "36%",
  label: "有界工作区"
});

const workspaceStyle = computed(() => ({ "--console-inspector-width": props.inspectorWidth }));
</script>

<template>
  <section class="bounded-workspace" :style="workspaceStyle" :data-inspector-open="inspectorOpen ? 'true' : 'false'" :aria-label="label">
    <main class="bounded-workspace-main"><slot /></main>
    <aside v-if="inspectorOpen" class="bounded-workspace-inspector"><slot name="inspector" /></aside>
  </section>
</template>
