@realsee/atom-panorama-annotation

全景图标签和标注的共享视觉组件。宿主负责坐标投影、数据读取，以及通过 onClick 绑定业务行为。

<PanoramaAnnotation kind="label" title="前往客厅" description="了解客厅的设计" onClick={() => navigateToLivingRoom()} />

kind 只有 label（标签）和 annotation（标注）。标签收起时最多显示 15 字，超出或有描述时显示箭头，点击整个标签（包括图标、文字、箭头和内边距）向上展开。传入 onClick 时，整个标签优先执行该回调，不再触发内置展开。点击展开态标题收起；描述区可独立滚动，滚动条隐藏。上下边缘分别在对应方向还有内容时显示渐隐，回到顶部或滚到底部时取消对应边缘的渐隐。标注最多显示 30 字、两行，不展开。

卡片展开时底边固定，style.guideLine 开启的引导线持续保留。展开高度按最终宽度下的内容预先测量，短内容自适应高度，长内容达到上限后只滚动描述。

组件根据视口宽度自动适配（小于 768px 使用移动端尺寸）：

| 尺寸 | PC | 移动端 | | ----------------------- | -------------- | -------------- | | 标签高度 / 字号 / 行高 | 32 / 14 / 20px | 30 / 12 / 18px | | 图标圆底 / 图片 | 24 / 20px | 22 / 18px | | 展开卡片宽度 / 最大高度 | 264 / 251px | 234 / 211px | | 展开标题字号 / 行高 | 16 / 22px | 14 / 20px | | 描述字号 / 行高 | 12 / 17px | 12 / 17px | | 两行标注最大宽度 / 高度 | 234 / 52px | 204 / 48px |

卡片内边距均为 12px，左上角短条为 24×3px，短条到标题间距 4px，标题到描述间距 4px；引导线高 60px，PC 宽 2px、移动端宽 1.5px。

标签的 style.color 控制收起背景色；标注的 style.color 控制文字色，style.background 控制背景色。style.opacity 仅影响面板背景，不影响文字、图标和引导线。style.icon 可传入图标图片 URL，不传时不显示图标。展开标签使用半透明黑色面板。style.scale 控制整体缩放。组件不处理跳转目标、编辑选中态或数据协议。