Add tp-popup-menu-content for non-interactive menu content
This commit is contained in:
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@tp/tp-popup",
|
"name": "@tp/tp-popup",
|
||||||
"version": "1.4.0",
|
"version": "1.5.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "tp-popup.js",
|
"main": "tp-popup.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@@ -0,0 +1,42 @@
|
|||||||
|
/**
|
||||||
|
@license
|
||||||
|
Copyright (c) 2026 trading_peter
|
||||||
|
This program is available under Apache License Version 2.0
|
||||||
|
*/
|
||||||
|
|
||||||
|
// tp-popup-menu-content — non-interactive content block for tp-popup-menu.
|
||||||
|
// Integrates plain content (hints, descriptions, small previews) into a
|
||||||
|
// popup menu with the same horizontal rhythm as tp-popup-menu-item, without
|
||||||
|
// item chrome (no hover, no pointer cursor). Styling hooks:
|
||||||
|
// --tp-popup-menu-content-color, --tp-popup-menu-content-font-size.
|
||||||
|
|
||||||
|
import { LitElement, html, css } from 'lit';
|
||||||
|
|
||||||
|
class TpPopupMenuContent extends LitElement {
|
||||||
|
static get styles() {
|
||||||
|
return [
|
||||||
|
css`
|
||||||
|
:host {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrap {
|
||||||
|
padding: 6px 12px;
|
||||||
|
color: var(--tp-popup-menu-content-color, #666);
|
||||||
|
font-size: var(--tp-popup-menu-content-font-size, 12px);
|
||||||
|
line-height: 1.45;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return html`
|
||||||
|
<div part="wrap" class="wrap">
|
||||||
|
<slot></slot>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
window.customElements.define('tp-popup-menu-content', TpPopupMenuContent);
|
||||||
Reference in New Issue
Block a user