a588ed42ce
mara: 'wait the common styles is literally just the button stuff? pls make a button component now as part of this pr and replace the usage in the modal. replacing all usages and finally removing the btn styles from common css is a follow up then.' <hive-btn> (hive-btn.js) is a customized built-in <button is="hive-btn"> with its own shadow root -- extending HTMLButtonElement keeps every native button behaviour (click/keyboard activation, :disabled, form participation) instead of re-implementing it on a generic wrapper. Shadow root holds only an adopted stylesheet + a <slot>, so the button's light-DOM content (label, or asyncBtn's swapped-in spinner span) renders through unchanged -- slotted content stays styled by the light-DOM cascade, so the global .spinner class still applies. Variants (cancel/confirm/danger) are a 'variant' attribute, not a CSS class, since they're a semantic prop of the component. Customized built-ins aren't supported in Safari/WebKit -- fine here, the project targets recent Firefox only (same reasoning as the original custom-elements pilot). Wired into modal.js: HiveDialog's buttons now render as <button is="hive-btn" variant="...">, replacing the old component-common.css .btn copy -- deleted that file + component- styles.js entirely (their sole purpose was giving dialog buttons a .btn look, which hive-btn now owns properly). dom.js's el() gained support so it can create customized built-ins the same way it creates everything else. hive-dialog.css dropped the now-dead .cancel/.confirm/.confirm.danger rules. Per mara's scoping: NOT touching the other .btn consumers across the app (dashboard/agent submit buttons, form() helper, etc.) or removing .btn from dashboard/common.css / agent/agent.css in this PR -- that migration + cleanup is an explicit follow-up. Verified with a full frontend build (grepped bundled JS for hive-btn/ variant to confirm it inlines); nix fmt clean.
25 lines
812 B
JSON
25 lines
812 B
JSON
{
|
|
"name": "@hive/shared",
|
|
"version": "0.0.0",
|
|
"private": true,
|
|
"description": "Shared frontend modules used by both the dashboard and the per-agent UI: terminal log pane, Catppuccin palette, base typography. Imported by sibling workspaces; not bundled standalone.",
|
|
"type": "module",
|
|
"main": "./src/index.js",
|
|
"exports": {
|
|
".": "./src/index.js",
|
|
"./terminal.js": "./src/terminal.js",
|
|
"./tabs.js": "./src/tabs.js",
|
|
"./tabs.css": "./src/tabs.css",
|
|
"./colors.css": "./src/colors.css",
|
|
"./theme.css": "./src/theme.css",
|
|
"./base.css": "./src/base.css",
|
|
"./terminal.css": "./src/terminal.css",
|
|
"./chrome.css": "./src/chrome.css",
|
|
"./forms.js": "./src/forms.js",
|
|
"./dom.js": "./src/dom.js",
|
|
"./modal.js": "./src/modal.js"
|
|
},
|
|
"files": [
|
|
"src/"
|
|
]
|
|
}
|