Follow-up to the light-DOM custom-elements pilot (mara: 'that one landed and works. i dont really like the css still being shared - id like that to be split by component, with common stuff via @include'). <hive-dialog> and <hive-toast> now attach a shadow root and adopt a component-scoped CSSStyleSheet built from a template-string constant in modal.js (DIALOG_CSS / TOAST_CSS), plus a new shared/src/component- styles.js sheet (currently just .btn) adopted alongside it via adoptedStyleSheets -- the native equivalent of a Sass @include, no preprocessor added. Theme vars keep resolving through the shadow boundary since CSS custom properties inherit across it; only plain class rules needed the explicit move. Deleted the global shared/src/modal.css entirely and dropped its @import from both dashboard/common.css and agent/agent.css -- nothing outside modal.js renders the old .tc-* classes any more. The <hive- dialog> element is now the backdrop itself (:host carries the fixed- position/centering rules that used to be .tc-backdrop on a light-DOM div); box/title/message/content/actions all render inside its shadow root. <hive-toast> similarly styles :host directly instead of a light- DOM div, with the message text placed straight into the shadow root (no <slot> needed since there's no external light-DOM content to project). Public API (openDialog/themedConfirm/themedPrompt/themedToast) unchanged -- no call-site changes needed anywhere in dashboard/agent. Verified with a full frontend build; nix fmt clean.
26 lines
870 B
JSON
26 lines
870 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",
|
|
"./component-styles.js": "./src/component-styles.js"
|
|
},
|
|
"files": [
|
|
"src/"
|
|
]
|
|
}
|