enso/app/gui2/stories/ComponentBrowser.story.vue
Ilya Bogdanov 41cb4e32c4
Doc panel improvements (#8530)
Fixes parts of #8135

- Fixed rendering of the documentation panel when no entry is selected.
- Multiple improvements of tags in the documentation panel:
- Group color for `GROUP` tag
- Custom styling for `DEPRECATED`, `UNSTABLE`, and `ADVANCED` tags.
- Sorting
- Collapsing tags that exceed one line with a button
- Filtering out some tags (`ICON` and `TEXT_ONLY` for now)
- Filtering out private items from the documentation
- Fixing group colors (was incorrectly assuming unique group names) and fallback color (was incorrectly replacing every character in the name with `-` before hashing, which was hilarious).
- Fixing ComponentBrowser demo scene.
- Minor fixes for mock database in demo scenes (removed duplicated entry, added an additional one for testing tags)


https://github.com/enso-org/enso/assets/6566674/10f4f5d0-9332-40c6-93c6-8263eb5fd85a
2023-12-15 14:58:57 +00:00

42 lines
1.1 KiB
Vue

<script setup lang="ts">
import { logEvent } from 'histoire/client'
import ComponentBrowser from '@/components/ComponentBrowser.vue'
import { useSuggestionDbStore } from '@/stores/suggestionDatabase'
import { Vec2 } from '@/util/vec2'
import GroupColorsWrapper from './GroupColorsWrapper.vue'
import NavigatorWrapper from './NavigatorWrapper.vue'
const position = new Vec2(-329.5, 0)
</script>
<template>
<Story
title="Component Browser"
group="graph"
:layout="{ type: 'single', iframe: false }"
:setupApp="
() => {
useSuggestionDbStore()
}
"
responsiveDisabled
autoPropsDisabled
>
<NavigatorWrapper style="height: 100%">
<template #default="{ navigator }">
<GroupColorsWrapper>
<ComponentBrowser
:nodePosition="position"
:navigator="navigator"
:initialContent="''"
:sourcePort="null"
:initialCaretPosition="[0, 0]"
@finished="logEvent('finished', [])"
/>
</GroupColorsWrapper>
</template>
</NavigatorWrapper>
</Story>
</template>