# Other

> Other Frame components: SolutionRow and SummaryFooter.

Web page: https://system.beibeidesign.com/components/other/

### SolutionRow

Master Used in: Wingman 0 · WorkPal 1

Row with a lucide icon + title + description + right-aligned category tag. Used in Overview solution lists.

AI 趋势速报 — 每天 3 分钟音频

针对：AI

Focus Block — 自动拦截非紧急会议

针对：Deadline

### SummaryFooter

Master Used in: Wingman 0 · WorkPal 1

Compact elapsed-time or summary line beneath a conversation result.

Install component Copy code [View source](https://github.com/BeibeiZhang/frame-design-system/blob/main/components/summary-footer.tsx)

Requires React 19, ReactDOM 19, TypeScript and lucide-react 1.14.0. Import frame.css once and use a frame-root wrapper; set its background to var(--color-bg-page) and color to var(--color-text-primary), or supply a matching host surface; add dark to an ancestor for dark mode.

Tested with shadcn 4.21.0, React 19.2.5, Vite 8.0.10 and Tailwind 3.4.19 / 4.3.3. Start with a configured React/Vite shadcn app. Files install into src/components/frame; import its frame.css. For manual copy, save the complete component and stylesheet below. Examples leave optional voice features off; retain the MIT license and third-party notices.

[Required stylesheet: frame.css](https://github.com/BeibeiZhang/frame-design-system/blob/main/styles/frame.css)

```
npx shadcn@4.21.0 add https://raw.githubusercontent.com/BeibeiZhang/frame-design-system/main/registry/summary-footer.json
```

Copy install command Close

Right-aligned row with clock icon + summary text. Use at the bottom of a section.

Total review time: **~16 min** for 3 items

70 of 91 renderable exports have a viewer representation.

Coverage is calculated at build time from `shared.tsx` exports and explicit viewer sections. New exports appear below until represented or classified as non-visual.

Not yet represented as standalone viewer entries

AvatarMenu · DangerButton · NavToggleIconProvider · RESIZABLE_NAV_DEFAULT_WIDTH · RESIZABLE_NAV_KEYBOARD_STEP · RESIZABLE_NAV_MAX_WIDTH · RESIZABLE_NAV_MIN_WIDTH · UserAvatar · VoiceWaveform · adoptUserEdit · applyFinal · applyPartial · beginDictation · clampWidth · discardDraft · mapPosition · readStoredWidth · settleDraft · useAnchoredAbove · useResizableWidth · writeStoredWidth

Source of truth: `packages/design-system/src/shared.tsx` Tokens: `packages/design-system/src/index.css`