mirror of
https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git
synced 2025-12-18 02:21:13 +00:00
refactor(design-system): replace functional components (#3802)
* update creator item * update warning tooltip * update badge and trigger icon * update action box * update avatar component * update badge * update heading component * update icon component * update link component * update menu * update route component * fix avatar bug * fix avatar bug * update input component * update select * update input * update tags component * update spinner * update square button * update tag component * update text component * add danger color * add vue.extend * add human readable names * add human readable name * revert button changes * update name * revert name * update classes * delete unused component * redo name change * rename * rename back * rename back * update snapshots
This commit is contained in:
@@ -1,29 +1,28 @@
|
||||
<template functional>
|
||||
<div :class="$style.container">
|
||||
<div :class="$style.heading" v-if="props.heading">
|
||||
<component :is="$options.components.N8nHeading" size="xlarge" align="center">{{ props.heading }}</component>
|
||||
<template>
|
||||
<div :class="['n8n-action-box', $style.container]">
|
||||
<div :class="$style.heading" v-if="heading">
|
||||
<n8n-heading size="xlarge" align="center">{{ heading }}</n8n-heading>
|
||||
</div>
|
||||
<div :class="$style.description" @click="(e) => listeners.descriptionClick && listeners.descriptionClick(e)">
|
||||
<component :is="$options.components.N8nText" color="text-base">
|
||||
<span v-html="props.description"></span>
|
||||
</component>
|
||||
<div :class="$style.description" @click="$emit('descriptionClick', $event)">
|
||||
<n8n-text color="text-base">
|
||||
<span v-html="description"></span>
|
||||
</n8n-text>
|
||||
</div>
|
||||
<component v-if="props.buttonText" :is="$options.components.N8nButton" :label="props.buttonText" size="large"
|
||||
@click="(e) => listeners.click && listeners.click(e)"
|
||||
<n8n-button v-if="buttonText" :label="buttonText" size="large"
|
||||
@click="$emit('click', $event)"
|
||||
/>
|
||||
<component
|
||||
v-if="props.calloutText"
|
||||
:is="$options.components.N8nCallout"
|
||||
:theme="props.calloutTheme"
|
||||
:icon="props.calloutIcon"
|
||||
<n8n-callout
|
||||
v-if="calloutText"
|
||||
:theme="calloutTheme"
|
||||
:icon="calloutIcon"
|
||||
:class="$style.callout"
|
||||
>
|
||||
<template>
|
||||
<component :is="$options.components.N8nText" color="text-base">
|
||||
<span size="small" v-html="props.calloutText"></span>
|
||||
</component>
|
||||
<n8n-text color="text-base">
|
||||
<span size="small" v-html="calloutText"></span>
|
||||
</n8n-text>
|
||||
</template>
|
||||
</component>
|
||||
</n8n-callout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -32,8 +31,9 @@ import N8nButton from '../N8nButton';
|
||||
import N8nHeading from '../N8nHeading';
|
||||
import N8nText from '../N8nText';
|
||||
import N8nCallout from '../N8nCallout';
|
||||
import Vue from 'vue';
|
||||
|
||||
export default {
|
||||
export default Vue.extend({
|
||||
name: 'n8n-action-box',
|
||||
components: {
|
||||
N8nButton,
|
||||
@@ -62,7 +62,7 @@ export default {
|
||||
type: String,
|
||||
},
|
||||
},
|
||||
};
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
|
||||
Reference in New Issue
Block a user