Add empty message if there are no common tokens

pull/7007/merge
Cagatay Civici 2025-01-13 16:42:15 +03:00
parent 401e2559ea
commit a9654ad5cb
1 changed files with 8 additions and 2 deletions

View File

@ -3,9 +3,12 @@
<div class="text-lg font-semibold capitalize mb-2">{{ componentKey }}</div>
<Fieldset legend="Common" :toggleable="true" class="mb-3">
<div class="flex flex-col gap-3">
<template v-for="(value, name) in tokens" :key="name">
<DesignComponentSection v-if="name !== 'colorScheme'" :componentKey="componentKey" :path="name" />
<template v-if="hasCommonTokens">
<template v-for="(value, name) in tokens" :key="name">
<DesignComponentSection v-if="name !== 'colorScheme'" :componentKey="componentKey" :path="name" />
</template>
</template>
<span v-else class="block py-3">There are no design tokens</span>
</div>
</Fieldset>
<Fieldset legend="Color Scheme" :toggleable="true">
@ -49,6 +52,9 @@ export default {
},
hasColorScheme() {
return this.tokens.colorScheme != undefined;
},
hasCommonTokens() {
return Object.keys(this.tokens).filter((name) => name !== 'colorScheme').length > 0;
}
}
};