mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-07 16:33:07 +08:00
In 6.5 the `framework` config option was one of `react`, `angular`, etc. and included Webpack settings. In the 7.0, we’ve updated it so that these are now called `renderers`, and are builder-independent. Now, frameworks contain specific builder information, such as `cra` or `nextjs` (for specific app environments) or `react-webpack5` / `react-vite` (for custom apps). This fixes the `sb init` CLI command to use renderer-specific templates. I also call out some follow-up work to fix automigrations & telemetry
55 lines
991 B
Vue
55 lines
991 B
Vue
<template>
|
|
<button type="button" :class="classes" @click="onClick" :style="style">{{ label }}</button>
|
|
</template>
|
|
|
|
<script>
|
|
import './button.css';
|
|
|
|
export default {
|
|
name: 'my-button',
|
|
|
|
props: {
|
|
label: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
primary: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
size: {
|
|
type: String,
|
|
default: 'medium',
|
|
validator: function (value) {
|
|
return ['small', 'medium', 'large'].indexOf(value) !== -1;
|
|
},
|
|
},
|
|
backgroundColor: {
|
|
type: String,
|
|
},
|
|
},
|
|
|
|
computed: {
|
|
classes() {
|
|
return {
|
|
'storybook-button': true,
|
|
'storybook-button--primary': this.primary,
|
|
'storybook-button--secondary': !this.primary,
|
|
[`storybook-button--${this.size}`]: true,
|
|
};
|
|
},
|
|
style() {
|
|
return {
|
|
backgroundColor: this.backgroundColor,
|
|
};
|
|
},
|
|
},
|
|
|
|
methods: {
|
|
onClick() {
|
|
this.$emit('onClick');
|
|
},
|
|
},
|
|
};
|
|
</script>
|