vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Class documents added

pull/5806/head
tugcekucukoglu 2024-05-22 16:52:40 +03:00
parent 145c91adfb
commit a870d91caa
87 changed files with 1565 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
doc/accordion/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,43 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes.accordion',
label: 'Accordion CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Accordion')
},
{
id: 'theming.classes.accordioncontent',
label: 'AccordionContent CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('AccordionContent')
},
{
id: 'theming.classes.accordionheader',
label: 'AccordionHeader CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('AccordionHeader')
},
{
id: 'theming.classes.accordionpanel',
label: 'AccordionPanel CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('AccordionPanel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Accordion')
// }
]
},
{
id: 'theming.unstyled',

20
doc/autocomplete/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('AutoComplete')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('AutoComplete')
// }
]
},
{
id: 'theming.unstyled',

20
doc/avatar/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Avatar')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Avatar')
// }
]
},
{
id: 'theming.unstyled',

16
doc/badge/theming/index.vue
View File

@ -10,7 +10,7 @@
<script>
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions, getTokenOptions } from '@/components/doc/helpers';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -34,14 +34,14 @@ export default {
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('OverlayBadge')
},
{
id: 'theming.tokens',
label: 'Design Tokens',
description: 'List of design tokens used in a preset.',
component: DocApiTable,
data: getTokenOptions('Badge')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Badge')
// }
]
},
{

20
doc/blockui/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('BlockUI')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('BlockUI')
// }
]
},
{
id: 'theming.unstyled',

20
doc/breadcrumb/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Breadcrumb')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Breadcrumb')
// }
]
},
{
id: 'theming.unstyled',

27
doc/button/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,29 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes.button',
label: 'Button CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Button')
},
{
id: 'theming.classes.buttongroup',
label: 'ButtonGroup CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ButtonGroup')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Button')
// }
]
},
{
id: 'theming.unstyled',

20
doc/card/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Card')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Card')
// }
]
},
{
id: 'theming.unstyled',

20
doc/carousel/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Carousel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Carousel')
// }
]
},
{
id: 'theming.unstyled',

20
doc/cascadeselect/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('CascadeSelect')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('CascadeSelect')
// }
]
},
{
id: 'theming.unstyled',

13
doc/chart/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,15 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Chart')
}
]
},
{
id: 'theming.unstyled',

20
doc/checkbox/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Checkbox')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Checkbox')
// }
]
},
{
id: 'theming.unstyled',

20
doc/chip/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Chip')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Chip')
// }
]
},
{
id: 'theming.unstyled',

20
doc/colorpicker/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ColorPicker')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ColorPicker')
// }
]
},
{
id: 'theming.unstyled',

20
doc/confirmdialog/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ConfirmDialog')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ConfirmDialog')
// }
]
},
{
id: 'theming.unstyled',

20
doc/confirmpopup/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ConfirmPopup')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ConfirmPopup')
// }
]
},
{
id: 'theming.unstyled',

20
doc/contextmenu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ContextMenu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ContextMenu')
// }
]
},
{
id: 'theming.unstyled',

20
doc/datatable/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('DataTable')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('DataTable')
// }
]
},
{
id: 'theming.unstyled',

20
doc/dataview/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('DataView')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('DataView')
// }
]
},
{
id: 'theming.unstyled',

20
doc/datepicker/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('DatePicker')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('DatePicker')
// }
]
},
{
id: 'theming.unstyled',

20
doc/dialog/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Dialog')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Dialog')
// }
]
},
{
id: 'theming.unstyled',

20
doc/divider/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Divider')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Divider')
// }
]
},
{
id: 'theming.unstyled',

20
doc/dock/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Dock')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Dock')
// }
]
},
{
id: 'theming.unstyled',

20
doc/drawer/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Drawer')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Drawer')
// }
]
},
{
id: 'theming.unstyled',

2
doc/dynamicdialog/theming/StyledDoc.vue
View File

@ -1,5 +1,5 @@
<template>
<DocSectionText v-bind="$attrs">
<p>List of class names can be found in <PrimeVueNuxtLink to="/dialog/#theming.styled">Dialog</PrimeVueNuxtLink> theming documentation.</p>
<p>List of class names and desing tokens can be found in <PrimeVueNuxtLink to="/dialog/#theming.styled">Dialog</PrimeVueNuxtLink> theming documentation.</p>
</DocSectionText>
</template>

20
doc/editor/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Editor')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Editor')
// }
]
},
{
id: 'theming.unstyled',

20
doc/fieldset/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Fieldset')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Fieldset')
// }
]
},
{
id: 'theming.unstyled',

20
doc/fileupload/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('FileUpload')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('FileUpload')
// }
]
},
{
id: 'theming.unstyled',

20
doc/floatlabel/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('FloatLabel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('FloatLabel')
// }
]
},
{
id: 'theming.unstyled',

20
doc/galleria/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Galleria')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Galleria')
// }
]
},
{
id: 'theming.unstyled',

27
doc/iconfield/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,29 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes.iconfield',
label: 'IconField CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('IconField')
},
{
id: 'theming.classes.inputicon',
label: 'InputIcon CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputIcon')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('IconField')
// }
]
},
{
id: 'theming.unstyled',

20
doc/image/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Image')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Image')
// }
]
},
{
id: 'theming.unstyled',

20
doc/inlinemessage/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InlineMessage')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('InlineMessage')
// }
]
},
{
id: 'theming.unstyled',

20
doc/inplace/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Inplace')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Inplace')
// }
]
},
{
id: 'theming.unstyled',

27
doc/inputgroup/theming/index.vue
View File

@ -9,8 +9,8 @@
</template>
<script>
import InputGroupAddonStyleDoc from './InputGroupAddonStyleDoc.vue';
import InputGroupStyleDoc from './InputGroupStyleDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -22,15 +22,26 @@ export default {
label: 'Styled',
children: [
{
id: 'theming.inputgroup',
label: 'InputGroup',
component: InputGroupStyleDoc
id: 'theming.classes.inputgroup',
label: 'InputGroup CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputGroup')
},
{
id: 'theming.inputgroupaddon',
label: 'InputGroupAddon',
component: InputGroupAddonStyleDoc
id: 'theming.classes.inputgroupaddon',
label: 'InputGroupAddon CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputGroupAddon')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('InputGroup')
// }
]
},
{

12
doc/inputmask/theming/index.vue
View File

@ -9,6 +9,8 @@
</template>
<script>
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import StyledDoc from './StyledDoc.vue';
import TailwindDoc from './TailwindDoc.vue';
@ -19,7 +21,15 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputMask')
}
]
},
{
id: 'theming.unstyled',

20
doc/inputnumber/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputNumber')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('InputNumber')
// }
]
},
{
id: 'theming.unstyled',

12
doc/inputotp/theming/index.vue
View File

@ -9,6 +9,8 @@
</template>
<script>
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import StyledDoc from './StyledDoc.vue';
import TailwindDoc from './TailwindDoc.vue';
@ -19,7 +21,15 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputOtp')
}
]
},
{
id: 'theming.unstyled',

16
doc/inputtext/theming/index.vue
View File

@ -10,7 +10,7 @@
<script>
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions, getTokenOptions } from '@/components/doc/helpers';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -27,14 +27,14 @@ export default {
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('InputText')
},
{
id: 'theming.tokens',
label: 'Design Tokens',
description: 'List of design tokens used in a preset.',
component: DocApiTable,
data: getTokenOptions(this.$appState.preset, 'InputText')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('InputText')
// }
]
},
{

20
doc/knob/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Knob')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Knob')
// }
]
},
{
id: 'theming.unstyled',

20
doc/listbox/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Listbox')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Listbox')
// }
]
},
{
id: 'theming.unstyled',

20
doc/megamenu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('MegaMenu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('MegaMenu')
// }
]
},
{
id: 'theming.unstyled',

20
doc/menu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Menu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Menu')
// }
]
},
{
id: 'theming.unstyled',

20
doc/menubar/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Menubar')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Menubar')
// }
]
},
{
id: 'theming.unstyled',

20
doc/message/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Message')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Message')
// }
]
},
{
id: 'theming.unstyled',

20
doc/metergroup/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('MeterGroup')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('MeterGroup')
// }
]
},
{
id: 'theming.unstyled',

20
doc/multiselect/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('MultiSelect')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('MultiSelect')
// }
]
},
{
id: 'theming.unstyled',

20
doc/orderlist/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('OrderList')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('OrderList')
// }
]
},
{
id: 'theming.unstyled',

20
doc/organizationchart/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('OrganizationChart')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('OrganizationChart')
// }
]
},
{
id: 'theming.unstyled',

20
doc/paginator/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Paginator')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Paginator')
// }
]
},
{
id: 'theming.unstyled',

20
doc/panel/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Panel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Panel')
// }
]
},
{
id: 'theming.unstyled',

20
doc/panelmenu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('PanelMenu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('PanelMenu')
// }
]
},
{
id: 'theming.unstyled',

20
doc/password/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Password')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Password')
// }
]
},
{
id: 'theming.unstyled',

20
doc/picklist/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('PickList')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('PickList')
// }
]
},
{
id: 'theming.unstyled',

20
doc/popover/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Popover')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Popover')
// }
]
},
{
id: 'theming.unstyled',

20
doc/progressbar/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ProgressBar')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ProgressBar')
// }
]
},
{
id: 'theming.unstyled',

20
doc/progressspinner/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ProgressSpinner')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ProgressSpinner')
// }
]
},
{
id: 'theming.unstyled',

20
doc/radiobutton/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('RadioButton')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('RadioButton')
// }
]
},
{
id: 'theming.unstyled',

20
doc/rating/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Rating')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Rating')
// }
]
},
{
id: 'theming.unstyled',

20
doc/ripple/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Ripple')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Ripple')
// }
]
},
{
id: 'theming.unstyled',

20
doc/scrollpanel/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ScrollPanel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ScrollPanel')
// }
]
},
{
id: 'theming.unstyled',

13
doc/scrolltop/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions, getTokenOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,15 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ScrollTop')
}
]
},
{
id: 'theming.unstyled',

20
doc/select/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Select')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Select')
// }
]
},
{
id: 'theming.unstyled',

20
doc/selectbutton/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('SelectButton')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('SelectButton')
// }
]
},
{
id: 'theming.unstyled',

20
doc/skeleton/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Skeleton')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Skeleton')
// }
]
},
{
id: 'theming.unstyled',

20
doc/slider/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Slider')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Slider')
// }
]
},
{
id: 'theming.unstyled',

20
doc/speeddial/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('SpeedDial')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('SpeedDial')
// }
]
},
{
id: 'theming.unstyled',

20
doc/splitbutton/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('SplitButton')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('SplitButton')
// }
]
},
{
id: 'theming.unstyled',

27
doc/splitter/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,29 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes.splitter',
label: 'Splitter CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Splitter')
},
{
id: 'theming.classes.splitterpanel',
label: 'SplitterPanel CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('SplitterPanel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Splitter')
// }
]
},
{
id: 'theming.unstyled',

20
doc/stepper/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Stepper')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Stepper')
// }
]
},
{
id: 'theming.unstyled',

20
doc/steps/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Steps')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Steps')
// }
]
},
{
id: 'theming.unstyled',

20
doc/tabmenu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TabMenu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('TabMenu')
// }
]
},
{
id: 'theming.unstyled',

48
doc/tabs/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,50 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes.tabs',
label: 'Tabs CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Tabs')
},
{
id: 'theming.classes.tablist',
label: 'TabList CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TabList')
},
{
id: 'theming.classes.tab',
label: 'Tab CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Tab')
},
{
id: 'theming.classes.tabpanels',
label: 'TabPanels CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TabPanels')
},
{
id: 'theming.classes.tabpanel',
label: 'TabPanel CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TabPanel')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Tabs')
// }
]
},
{
id: 'theming.unstyled',

20
doc/tag/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Tag')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Tag')
// }
]
},
{
id: 'theming.unstyled',

20
doc/terminal/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Terminal')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Terminal')
// }
]
},
{
id: 'theming.unstyled',

20
doc/textarea/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Textarea')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Textarea')
// }
]
},
{
id: 'theming.unstyled',

20
doc/tieredmenu/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TieredMenu')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('TieredMenu')
// }
]
},
{
id: 'theming.unstyled',

20
doc/timeline/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Timeline')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Timeline')
// }
]
},
{
id: 'theming.unstyled',

20
doc/toast/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Toast')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Toast')
// }
]
},
{
id: 'theming.unstyled',

20
doc/togglebutton/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ToggleButton')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ToggleButton')
// }
]
},
{
id: 'theming.unstyled',

20
doc/toggleswitch/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('ToggleSwitch')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('ToggleSwitch')
// }
]
},
{
id: 'theming.unstyled',

20
doc/toolbar/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Toolbar')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Toolbar')
// }
]
},
{
id: 'theming.unstyled',

20
doc/tooltip/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Tooltip')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Tooltip')
// }
]
},
{
id: 'theming.unstyled',

20
doc/tree/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('Tree')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('Tree')
// }
]
},
{
id: 'theming.unstyled',

20
doc/treeselect/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TreeSelect')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('TreeSelect')
// }
]
},
{
id: 'theming.unstyled',

20
doc/treetable/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
import TailwindDoc from './TailwindDoc.vue';
export default {
@ -19,7 +20,22 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('TreeTable')
}
// {
// id: 'theming.tokens',
// label: 'Design Tokens',
// description: 'List of design tokens used in a preset.',
// component: DocApiTable,
// data: getTokenOptions('TreeTable')
// }
]
},
{
id: 'theming.unstyled',

13
doc/virtualscroller/theming/index.vue
View File

@ -9,7 +9,8 @@
</template>
<script>
import StyledDoc from './StyledDoc.vue';
import DocApiTable from '@/components/doc/DocApiTable.vue';
import { getStyleOptions } from '@/components/doc/helpers';
export default {
data() {
@ -18,7 +19,15 @@ export default {
{
id: 'theming.styled',
label: 'Styled',
component: StyledDoc
children: [
{
id: 'theming.classes',
label: 'CSS Classes',
description: 'List of class names used in the styled mode.',
component: DocApiTable,
data: getStyleOptions('VirtualScroller')
}
]
}
]
};