silphius/stories/hotbar.stories.js

51 lines
988 B
JavaScript
Raw Normal View History

2024-06-10 22:42:30 -05:00
import {useArgs} from '@storybook/preview-api';
import {fn} from '@storybook/test';
2024-07-20 04:32:33 -05:00
import Hotbar from '@/react/components/hotbar.jsx';
2024-06-10 22:42:30 -05:00
import DomDecorator from './dom-decorator.jsx';
const slots = Array(10).fill({});
2024-09-17 01:25:39 -05:00
slots[2] = {qty: 24, icon: '/resources/potion/icon.png'};
2024-06-10 22:42:30 -05:00
export default {
title: 'Dom/Inventory/Hotbar',
component: Hotbar,
decorators: [
(Hotbar, ctx) => {
const [, updateArgs] = useArgs();
const {onActivate} = ctx.args;
ctx.args.onActivate = (i) => {
updateArgs({active: i});
if (onActivate) {
onActivate(i);
}
};
return Hotbar();
},
2024-06-24 05:00:24 -05:00
DomDecorator({
style: {
display: 'flex',
flexDirection: 'column',
},
}),
2024-06-10 22:42:30 -05:00
],
tags: ['autodocs'],
args: {
active: 0,
onActivate: fn(),
slots,
},
argTypes: {
active: {
control: {
type: 'number',
min: 0,
max: 9,
}
},
},
};
export const Default = {};