overleaf/services/web/frontend/stories/outline.stories.jsx
Alf Eaton c2b553e915 [ide-react] Improve file tree and outline components in the editor sidebar (#16225)
* Upgrade react-resizable-panels
* Add FileTreeOpenProvider
* Add OutlineProvider and OutlineContainer
* Convert Outline tests to Cypress

GitOrigin-RevId: afd9ae8190edf37642e36a4ffb331f1182c8982d
2023-12-18 09:03:53 +00:00

61 lines
1.3 KiB
JavaScript

import OutlinePane from '../js/features/outline/components/outline-pane'
import { ScopeDecorator } from './decorators/scope'
export const Basic = args => <OutlinePane {...args} />
Basic.args = {
outline: [{ line: 1, title: 'Hello', level: 1 }],
}
export const Nested = args => <OutlinePane {...args} />
Nested.args = {
outline: [
{
line: 1,
title: 'Section',
level: 1,
children: [
{
line: 2,
title: 'Subsection',
level: 2,
children: [
{
line: 3,
title: 'Subsubsection',
level: 3,
},
],
},
],
},
],
}
export const NoSections = args => <OutlinePane {...args} />
NoSections.args = {}
export const NonTexFile = args => <OutlinePane {...args} />
NonTexFile.args = {
isTexFile: false,
}
export const PartialResult = args => <OutlinePane {...args} />
PartialResult.args = {
isPartial: true,
}
export default {
title: 'Editor / Outline',
component: OutlinePane,
argTypes: {
jumpToLine: { action: 'jumpToLine' },
onToggle: { action: 'onToggle' },
toggleExpanded: { action: 'toggleExpanded' },
},
args: {
isTexFile: true,
outline: [],
expanded: true,
},
decorators: [ScopeDecorator],
}