mirror of
https://github.com/notion-enhancer/notion-enhancer.git
synced 2025-04-18 18:59:01 +00:00
dragonwocky
44c480062b
removed use strict from mjs files, where strict mode is assumed/enforced regardless
46 lines
1.7 KiB
JavaScript
46 lines
1.7 KiB
JavaScript
/**
|
|
* notion-enhancer
|
|
* (c) 2023 dragonwocky <thedragonring.bod@gmail.com> (https://dragonwocky.me/)
|
|
* (https://notion-enhancer.github.io/) under the MIT license
|
|
*/
|
|
|
|
function Button({ icon, variant, tagName, ...props }, ...children) {
|
|
const { html, extendProps } = globalThis.__enhancerApi;
|
|
extendProps(props, {
|
|
class: `notion-enhancer--menu-button shrink-0
|
|
flex gap-[8px] items-center px-[12px] rounded-[4px]
|
|
h-[${variant === "sm" ? "28" : "32"}px] select-none
|
|
transition duration-[20ms] ${
|
|
variant === "primary"
|
|
? `text-[color:var(--theme--accent-primary\\_contrast)]
|
|
font-medium bg-[color:var(--theme--accent-primary)]
|
|
hover:bg-[color:var(--theme--accent-primary\\_hover)]`
|
|
: variant === "secondary"
|
|
? `text-[color:var(--theme--accent-secondary)]
|
|
border-(~ [color:var(--theme--accent-secondary)])
|
|
hover:bg-[color:var(--theme--accent-secondary\\_hover)]`
|
|
: variant === "brand"
|
|
? `text-white border-(~ purple-400)
|
|
bg-purple-500 hover:(from-white/20 to-transparent
|
|
bg-[linear-gradient(225deg,var(--tw-gradient-stops))])`
|
|
: `border-(~ [color:var(--theme--fg-border)])
|
|
not-disabled:hover:bg-[color:var(--theme--bg-hover)]
|
|
disabled:text-[color:var(--theme--fg-secondary)]`
|
|
}`,
|
|
});
|
|
tagName ??= props["href"] ? "a" : "button";
|
|
return html`<${tagName} ...${props}>
|
|
${icon
|
|
? html`<i
|
|
class="i-${icon}
|
|
text-[${variant === "sm" && children.length ? "13" : "17"}px]"
|
|
></i>`
|
|
: ""}
|
|
<span class="text-[${variant === "sm" ? "13" : "14"}px] empty:hidden">
|
|
${children}
|
|
</span>
|
|
<//>`;
|
|
}
|
|
|
|
export { Button };
|