Add empty message if there are no common tokens
parent
401e2559ea
commit
a9654ad5cb
|
@ -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;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue