mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-12 03:46:34 +00:00
Add spacer for default of choose (#8827)
This commit is contained in:
parent
8874aaabe9
commit
109910d18f
@ -10,6 +10,8 @@ export class HatGraphNode extends LitElement {
|
|||||||
|
|
||||||
@property({ reflect: true, type: Boolean }) graphstart?: boolean;
|
@property({ reflect: true, type: Boolean }) graphstart?: boolean;
|
||||||
|
|
||||||
|
@property({ reflect: true, type: Boolean }) spacer?: boolean;
|
||||||
|
|
||||||
@property({ reflect: true, type: Boolean }) nofocus?: boolean;
|
@property({ reflect: true, type: Boolean }) nofocus?: boolean;
|
||||||
|
|
||||||
@property({ reflect: true, type: Number }) badge?: number;
|
@property({ reflect: true, type: Number }) badge?: number;
|
||||||
@ -25,6 +27,12 @@ export class HatGraphNode extends LitElement {
|
|||||||
if (!svgEl) {
|
if (!svgEl) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (this.spacer) {
|
||||||
|
svgEl.setAttribute("width", "10px");
|
||||||
|
svgEl.setAttribute("height", "41px");
|
||||||
|
svgEl.setAttribute("viewBox", "-5 -40 10 26");
|
||||||
|
return;
|
||||||
|
}
|
||||||
const bbox = svgEl.getBBox();
|
const bbox = svgEl.getBBox();
|
||||||
const extra_height = this.graphstart ? 2 : 1;
|
const extra_height = this.graphstart ? 2 : 1;
|
||||||
const extra_width = SPACING;
|
const extra_width = SPACING;
|
||||||
@ -50,7 +58,11 @@ export class HatGraphNode extends LitElement {
|
|||||||
<path
|
<path
|
||||||
class="connector"
|
class="connector"
|
||||||
d="
|
d="
|
||||||
M 0 ${-SPACING - NODE_SIZE / 2}
|
M 0 ${
|
||||||
|
this.spacer
|
||||||
|
? -SPACING * 2 - NODE_SIZE
|
||||||
|
: -SPACING - NODE_SIZE / 2
|
||||||
|
}
|
||||||
L 0 0
|
L 0 0
|
||||||
"
|
"
|
||||||
line-caps="round"
|
line-caps="round"
|
||||||
@ -58,11 +70,15 @@ export class HatGraphNode extends LitElement {
|
|||||||
`
|
`
|
||||||
}
|
}
|
||||||
<g class="node">
|
<g class="node">
|
||||||
<circle
|
${
|
||||||
|
!this.spacer
|
||||||
|
? svg`<circle
|
||||||
cx="0"
|
cx="0"
|
||||||
cy="0"
|
cy="0"
|
||||||
r="${NODE_SIZE / 2}"
|
r="${NODE_SIZE / 2}"
|
||||||
/>
|
/>`
|
||||||
|
: ""
|
||||||
|
}
|
||||||
${
|
${
|
||||||
this.badge
|
this.badge
|
||||||
? svg`
|
? svg`
|
||||||
|
@ -192,6 +192,14 @@ class HatScriptGraph extends LitElement {
|
|||||||
`;
|
`;
|
||||||
})}
|
})}
|
||||||
<hat-graph>
|
<hat-graph>
|
||||||
|
<hat-graph-node
|
||||||
|
nofocus
|
||||||
|
spacer
|
||||||
|
class=${classMap({
|
||||||
|
track:
|
||||||
|
trace !== undefined && trace[0].result?.choice === "default",
|
||||||
|
})}
|
||||||
|
></hat-graph-node>
|
||||||
${ensureArray(config.default)?.map((action, i) =>
|
${ensureArray(config.default)?.map((action, i) =>
|
||||||
this.render_node(action, `${path}/default/${i}`)
|
this.render_node(action, `${path}/default/${i}`)
|
||||||
)}
|
)}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user