primevue-mirror/pages/speeddial/index.vue

43 lines
1.8 KiB
Vue
Raw Normal View History

2022-09-09 20:41:18 +00:00
<template>
2023-04-28 09:47:17 +00:00
<DocComponent
title="Vue Speed Dial Component"
header="Speed Dial"
description="When pressed, a floating action button can display multiple primary actions that can be performed on a page."
:componentDocs="docs"
:apiDocs="['SpeedDial']"
:ptTabComponent="ptComponent"
/>
2022-09-09 20:41:18 +00:00
</template>
<script>
2023-02-28 08:29:30 +00:00
import AccessibilityDoc from '@/doc/speeddial/AccessibilityDoc.vue';
import CircleDoc from '@/doc/speeddial/CircleDoc.vue';
import CustomDoc from '@/doc/speeddial/CustomDoc.vue';
import ImportDoc from '@/doc/speeddial/ImportDoc.vue';
import LinearDoc from '@/doc/speeddial/LinearDoc.vue';
import MaskDoc from '@/doc/speeddial/MaskDoc.vue';
import QuarterCircleDoc from '@/doc/speeddial/QuarterCircleDoc.vue';
import SemiCircleDoc from '@/doc/speeddial/SemiCircleDoc.vue';
import TooltipDoc from '@/doc/speeddial/TooltipDoc.vue';
2023-04-28 09:47:17 +00:00
import PTComponent from '@/doc/speeddial/pt/index.vue';
2022-09-09 20:41:18 +00:00
export default {
data() {
return {
2023-02-28 08:29:30 +00:00
docs: [
{ id: 'import', label: 'Import', component: ImportDoc },
{ id: 'linear', label: 'Linear', component: LinearDoc },
{ id: 'circle', label: 'Circle', component: CircleDoc },
{ id: 'semi-circle', label: 'Semi Circle', component: SemiCircleDoc },
{ id: 'quarter-circle', label: 'Quarter Circle', component: QuarterCircleDoc },
{ id: 'tooltip', label: 'Tooltip', component: TooltipDoc },
{ id: 'mask', label: 'Mask', component: MaskDoc },
{ id: 'custom', label: 'Custom', component: CustomDoc },
{ id: 'accessibility', label: 'Accessibility', component: AccessibilityDoc }
2023-04-28 09:47:17 +00:00
],
ptComponent: PTComponent
2022-09-09 20:41:18 +00:00
};
}
};
</script>