tweaked DropdownItem styling and removed dev process fluff
This commit is contained in:
@@ -2,11 +2,9 @@ import { Menu } from '@headlessui/react'
|
|||||||
import { useHotkeys } from 'react-hotkeys-hook';
|
import { useHotkeys } from 'react-hotkeys-hook';
|
||||||
|
|
||||||
export function DropdownItem({ config, state, thunkDispatch }) {
|
export function DropdownItem({ config, state, thunkDispatch }) {
|
||||||
console.log({ name: config.label, shortcut: config.shortcut, callback: handleClick})
|
|
||||||
useHotkeys(config.shortcut, handleClick)
|
useHotkeys(config.shortcut, handleClick)
|
||||||
|
|
||||||
function handleClick(e) {
|
function handleClick(e) {
|
||||||
console.log(e, config)
|
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
config.callback(e, {state, thunkDispatch})
|
config.callback(e, {state, thunkDispatch})
|
||||||
}
|
}
|
||||||
@@ -14,11 +12,11 @@ export function DropdownItem({ config, state, thunkDispatch }) {
|
|||||||
<Menu.Item>
|
<Menu.Item>
|
||||||
{({ active }) => (
|
{({ active }) => (
|
||||||
<button
|
<button
|
||||||
className={`${active && 'bg-gray-600'} px-2 py-1 text-left`}
|
className={`${active && 'bg-gray-600'} px-2 py-1 flex justify-between`}
|
||||||
onClick={handleClick}
|
onClick={handleClick}
|
||||||
>
|
>
|
||||||
{config.label}
|
{config.label}
|
||||||
{config.shortcutLabel && <span className="text-gray-400 pl-4">{ config.shortcutLabel }</span> }
|
{config.shortcutLabel && <span className="text-gray-400 pl-6 text-right">{ config.shortcutLabel }</span> }
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</Menu.Item>
|
</Menu.Item>
|
||||||
|
|||||||
@@ -49,16 +49,6 @@ const fileMenuConfig = {
|
|||||||
|
|
||||||
config.callback = handleStlDownload
|
config.callback = handleStlDownload
|
||||||
|
|
||||||
return <DropdownItem {...props} />
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: 'Cook Donut',
|
|
||||||
shortcut: 'ctrl+d, command+d',
|
|
||||||
shortcutLabel: cmdOrCtrl() + ' D',
|
|
||||||
component: (props) => {
|
|
||||||
const { config } = props
|
|
||||||
config.callback = () => alert('Donut is cooked!')
|
|
||||||
return <DropdownItem {...props} />
|
return <DropdownItem {...props} />
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user