diff --git a/examples/vue-3-cli/src/stories/OverrideArgs.stories.js b/examples/vue-3-cli/src/stories/OverrideArgs.stories.js new file mode 100644 index 00000000000..3555d47daa1 --- /dev/null +++ b/examples/vue-3-cli/src/stories/OverrideArgs.stories.js @@ -0,0 +1,43 @@ +import OverrideArgs from './OverrideArgs.vue'; + +// Emulate something that isn't serializable +const icons = { + Primary: { + template: 'Primary Icon', + }, + Secondary: { + template: 'Secondary Icon', + }, +}; + +export default { + title: 'Example/Override Args', + component: OverrideArgs, + argTypes: { + // To show that other props are passed through + backgroundColor: { control: 'color' }, + icon: { + control: { + type: 'select', + options: Object.keys(icons), + }, + defaultValue: 'Primary', + }, + }, +}; + +const Template = (args, { argTypes }) => { + return { + props: Object.keys(argTypes), + components: { OverrideArgs }, + template: '', + setup(props) { + return { + icon: icons[props.icon], + }; + }, + }; +}; + +export const TestOne = Template.bind({}); +export const TestTwo = Template.bind({}); diff --git a/examples/vue-3-cli/src/stories/OverrideArgs.vue b/examples/vue-3-cli/src/stories/OverrideArgs.vue new file mode 100644 index 00000000000..b98424b021f --- /dev/null +++ b/examples/vue-3-cli/src/stories/OverrideArgs.vue @@ -0,0 +1,41 @@ + + +