@fusion.dev/helix 0.207.2 → 0.208.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +1 -1
- package/dist/button/root/button-root.css.js +1 -1
- package/dist/chat/message/chat-message.css.js +1 -1
- package/dist/combobox/root/combobox-root.css.js +1 -1
- package/dist/graph/root/graph-root.css.js +1 -1
- package/dist/log/line/log-line.css.js +1 -1
- package/dist/option/root/option-root.css.js +1 -1
- package/lint.json +1 -1
- package/package.json +6 -6
- package/skills/helix/SKILL.md +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: inline-flex;min-inline-size: var(--button-inline-size, auto);max-inline-size: 100%}:host {--_button-edge: var(--helix-color-border);--_button-fill: var(--_button-tone);--_button-fill-hover: var(--_button-tone-hover);--_button-on-tone: var(--helix-color-background);--_button-tone: var(--helix-color-foreground);--_button-crawl: 4s;--_button-turn: 0.8s;--_button-tone-hover: color-mix(in oklab, var(--helix-color-foreground) 86%, var(--helix-color-background))}:host([tone="primary"]) {--_button-edge: var(--helix-color-primary);--_button-fill: var(--helix-color-primary-surface);--_button-fill-hover: var(--helix-color-primary-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-primary);--_button-tone: var(--helix-color-primary);--_button-tone-hover: var(--helix-color-primary-hover)}:host([tone="accent"]) {--_button-edge: var(--helix-color-accent);--_button-fill: var(--helix-color-accent-surface);--_button-fill-hover: var(--helix-color-accent-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-accent);--_button-tone: var(--helix-color-accent);--_button-tone-hover: var(--helix-color-accent-hover)}:host([tone="danger"]) {--_button-edge: var(--helix-color-danger);--_button-fill: var(--helix-color-danger-surface);--_button-fill-hover: var(--helix-color-danger-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-status);--_button-tone: var(--helix-color-danger);--_button-tone-hover: color-mix(in oklab, var(--helix-color-danger) 86%, var(--helix-color-foreground))}[part="button"] {all: unset;align-items: center;background-color: var(--button-background-color, color-mix(in oklab, var(--_button-tone) 6%, transparent));block-size: var(--button-size, var(--helix-size-control));border: var(--helix-border-thin) solid var(--button-border-color, var(--_button-edge));box-sizing: border-box;color: var(--button-foreground-color, var(--_button-
|
|
2
|
+
export const styles = createSheet(`:host {display: inline-flex;min-inline-size: var(--button-inline-size, auto);max-inline-size: 100%}:host {--_button-edge: var(--helix-color-border);--_button-fill: var(--_button-tone);--_button-fill-hover: var(--_button-tone-hover);--_button-ink: color-mix(in oklab, var(--_button-tone) 78%, var(--helix-color-foreground));--_button-on-tone: var(--helix-color-background);--_button-tone: var(--helix-color-foreground);--_button-crawl: 4s;--_button-turn: 0.8s;--_button-tone-hover: color-mix(in oklab, var(--helix-color-foreground) 86%, var(--helix-color-background))}:host([tone="primary"]) {--_button-edge: var(--helix-color-primary);--_button-fill: var(--helix-color-primary-surface);--_button-fill-hover: var(--helix-color-primary-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-primary);--_button-tone: var(--helix-color-primary);--_button-tone-hover: var(--helix-color-primary-hover)}:host([tone="accent"]) {--_button-edge: var(--helix-color-accent);--_button-fill: var(--helix-color-accent-surface);--_button-fill-hover: var(--helix-color-accent-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-accent);--_button-tone: var(--helix-color-accent);--_button-tone-hover: var(--helix-color-accent-hover)}:host([tone="danger"]) {--_button-edge: var(--helix-color-danger);--_button-fill: var(--helix-color-danger-surface);--_button-fill-hover: var(--helix-color-danger-surface-hover);--_button-on-tone: var(--helix-color-foreground-on-status);--_button-tone: var(--helix-color-danger);--_button-tone-hover: color-mix(in oklab, var(--helix-color-danger) 86%, var(--helix-color-foreground))}[part="button"] {all: unset;align-items: center;background-color: var(--button-background-color, color-mix(in oklab, var(--_button-tone) 6%, transparent));block-size: var(--button-size, var(--helix-size-control));border: var(--helix-border-thin) solid var(--button-border-color, var(--_button-edge));box-sizing: border-box;color: var(--button-foreground-color, var(--_button-ink));cursor: pointer;display: inline-flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-control);font-weight: var(--helix-weight-medium);gap: var(--button-gap, var(--helix-space-xs));inline-size: 100%;justify-content: center;letter-spacing: var(--helix-tracking-normal);line-height: var(--helix-leading-tight);padding-inline: var(--button-padding-inline, var(--helix-space-control));text-decoration: none;transition: background-color var(--helix-duration-fast) var(--helix-easing-standard), border-color var(--helix-duration-fast) var(--helix-easing-standard), color var(--helix-duration-fast) var(--helix-easing-standard);white-space: nowrap}[part="button"] {border-end-end-radius: var(--button-radius-end-end, var(--button-radius-end, var(--button-radius, var(--helix-radii-sm))));border-end-start-radius: var(--button-radius-end-start, var(--button-radius-start, var(--button-radius, var(--helix-radii-sm))));border-start-end-radius: var(--button-radius-start-end, var(--button-radius-end, var(--button-radius, var(--helix-radii-sm))));border-start-start-radius: var(--button-radius-start-start, var(--button-radius-start, var(--button-radius, var(--helix-radii-sm))))}:host(:not(:disabled)) [part="button"]:hover {background-color: var(--button-background-color-hover, var(--button-background-color, color-mix(in oklab, var(--_button-tone) 12%, transparent)))}[part="button"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}:host([emphasis="solid"]) [part="button"] {background-color: var(--button-background-color, var(--_button-fill));border-color: transparent;color: var(--button-foreground-color, var(--_button-on-tone))}:host(:not(:disabled)[emphasis="solid"]) [part="button"]:hover {background-color: var(--button-background-color-hover, var(--button-background-color, var(--_button-fill-hover)));border-color: transparent}:host([emphasis="subtle"]) [part="button"] {background-color: var(--button-background-color, color-mix(in oklab, var(--_button-tone) 14%, transparent));border-color: transparent;color: var(--button-foreground-color, var(--_button-ink))}:host(:not(:disabled)[emphasis="subtle"]) [part="button"]:hover {background-color: var(--button-background-color-hover, var(--button-background-color, color-mix(in oklab, var(--_button-tone) 22%, transparent)));border-color: transparent}:host([emphasis="ghost"]) [part="button"] {background-color: var(--button-background-color, transparent);border-color: transparent;color: var(--button-foreground-color, var(--_button-tone))}:host(:not(:disabled)[emphasis="ghost"]) [part="button"]:hover {background-color: var(--button-background-color-hover, var(--button-background-color, color-mix(in oklab, var(--_button-tone) 8%, transparent)));border-color: transparent;color: var(--button-foreground-color, var(--_button-ink))}:host([width="full"]) {display: flex;inline-size: 100%}:host(:disabled) [part="button"] {cursor: not-allowed;opacity: 0.5}@supports (text-box: trim-both cap alphabetic) {slot:not([name]) {display: block;padding-block: var(--helix-space-2xs);text-box: trim-both cap alphabetic}}[part="button"] ::slotted(helix-icon) {--icon-size: 1.15em}:host(:state(pending)) [part="button"] {cursor: progress;position: relative}:host(:state(pending)) [part="button"] > slot {visibility: hidden}[part="spinner"] {animation: helix-button-turn var(--button-spinner-duration, var(--_button-turn)) linear infinite;block-size: var(--button-spinner-size, 1.15em);border: var(--helix-border-thick) solid color-mix(in oklab, var(--button-spinner-color, currentColor) 30%, transparent);border-block-start-color: var(--button-spinner-color, currentColor);border-radius: var(--helix-radii-full);box-sizing: border-box;inline-size: var(--button-spinner-size, 1.15em);inset: 0;margin: auto;position: absolute}@keyframes helix-button-turn {to {rotate: 1turn}}@media (prefers-reduced-motion: reduce) {[part="spinner"] {animation-duration: var(--_button-crawl)}}@media print {:host {display: none}}`);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: block}:host(:focus-visible) {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="message"] {align-items: start;display: grid;grid-template-columns: auto minmax(0, 1fr)}[part="avatar"] > slot::slotted(*) {margin-inline-end: var(--helix-space-sm)}[part="avatar"] {align-items: center;display: flex;font-size: var(--helix-text-sm);grid-column: 1;line-height: var(--helix-leading-normal);min-block-size: calc(1lh + var(--helix-space-xs) * 2)}[part="body"] {grid-column: 2}:host([author="me"]) [part="avatar"] {display: none}[part="body"] {display: grid;gap: var(--helix-space-2xs);justify-items: start;max-inline-size: min(var(--chat-message-measure, 42rem), 80%)}:host([author="me"]) [part="body"] {justify-items: end;justify-self: end}[part="actions"] {opacity: 0;pointer-events: none;transition: opacity var(--helix-duration-fast) var(--helix-easing-standard)}:host(:hover) [part="actions"], :host(:focus-within) [part="actions"] {opacity: 1;pointer-events: auto}@media (hover: none) {[part="actions"] {opacity: 1;pointer-events: auto}}[part="actions"] {--helix-size-control: calc(var(--helix-size-control-sm) - var(--helix-space-2xs));--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);align-items: center;display: inline-flex;gap: var(--helix-space-2xs)}[part="actions"][hidden] {display: none}[part="sources"] {--helix-size-avatar: var(--helix-size-avatar-sm);--helix-size-tag: var(--helix-size-tag-sm);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);align-items: center;color: var(--helix-color-foreground-muted);display: flex;flex-wrap: wrap;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);gap: var(--helix-space-2xs);line-height: var(--helix-leading-normal)}[part="sources"][hidden] {display: none}[part="work"] {color: var(--helix-color-foreground-muted);justify-self: stretch;min-inline-size: 0}[part="work"][hidden] {display: none}[part="content"] {background-color: var(--chat-message-background-color, color-mix(in oklab, var(--helix-color-foreground) 14%, transparent));border-radius: var(--chat-message-radius, var(--helix-radii-md));color: var(--chat-message-color, var(--helix-color-foreground));font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);line-height: var(--helix-leading-normal);padding-block: var(--chat-message-padding-block, var(--helix-space-xs));padding-inline: var(--chat-message-padding-inline, var(--helix-space-sm))}:host([separation="plain"]) [part="content"] {background-color: transparent;padding-inline: var(--helix-space-none)}:host([separation="plain"]) [part="body"] {justify-items: stretch;max-inline-size: 100%}:host([separation="plain"]) [part="content"] {inline-size: auto}:host([author="me"]) [part="content"] {background-color: var(--chat-message-background-color-me, color-mix(in oklab, var(--helix-color-primary) 28%, transparent));color: var(--chat-message-color-me, var(--chat-message-color, var(--helix-color-foreground)))}[part="meta"] {align-items: center;color: var(--chat-message-meta-color, var(--helix-color-foreground-muted));display: flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);gap: var(--helix-space-2xs)}:host([author="me"]) [part="meta"] {justify-content: flex-end}[part="content"] {inline-size: fit-content;max-inline-size: 100%;min-inline-size: 0;overflow-x: auto}[part="content"] slot[name="indicator"] {display: none}:host([state="streaming"]) [part="content"][data-empty] slot[name="indicator"] {display: block}slot[name="indicator"]::slotted(*) {background-color: var(--chat-indicator-background-color, var(--helix-color-surface-sunken));border-radius: var(--helix-radii-full);font-size: var(--helix-text-xs);padding-block: var(--helix-space-2xs);padding-inline: var(--helix-space-xs);--orb-size: var(--helix-size-icon-sm)}slot[name="indicator"]::slotted(helix-orb) {background-color: transparent;padding: var(--helix-space-none)}:host([state="failed"]) [part="meta"] {color: var(--helix-color-danger)}[part="state"] {align-items: center;display: inline-flex;font-weight: var(--helix-weight-medium);gap: var(--helix-space-2xs)}[part="mark"] {block-size: var(--helix-size-icon-tight);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight)}:host([state="sending"]) [part="content"] {opacity: 0.6}[part="retry"] {background: none;border: 0;border-radius: var(--helix-radii-sm);color: var(--helix-color-foreground);cursor: pointer;font: inherit;font-weight: var(--helix-weight-medium);margin-inline-end: calc(var(--helix-space-2xs) * -1);min-block-size: calc(var(--helix-size-control-tight) - var(--helix-space-2xs));padding-block: var(--helix-space-2xs);padding-inline: var(--helix-space-2xs);text-decoration: underline;text-underline-offset: 0.2em}[part="retry"]:hover {background-color:
|
|
2
|
+
export const styles = createSheet(`:host {display: block}:host(:focus-visible) {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="message"] {align-items: start;display: grid;grid-template-columns: auto minmax(0, 1fr)}[part="avatar"] > slot::slotted(*) {margin-inline-end: var(--helix-space-sm)}[part="avatar"] {align-items: center;display: flex;font-size: var(--helix-text-sm);grid-column: 1;line-height: var(--helix-leading-normal);min-block-size: calc(1lh + var(--helix-space-xs) * 2)}[part="body"] {grid-column: 2}:host([author="me"]) [part="avatar"] {display: none}[part="body"] {display: grid;gap: var(--helix-space-2xs);justify-items: start;max-inline-size: min(var(--chat-message-measure, 42rem), 80%)}:host([author="me"]) [part="body"] {justify-items: end;justify-self: end}[part="actions"] {opacity: 0;pointer-events: none;transition: opacity var(--helix-duration-fast) var(--helix-easing-standard)}:host(:hover) [part="actions"], :host(:focus-within) [part="actions"] {opacity: 1;pointer-events: auto}@media (hover: none) {[part="actions"] {opacity: 1;pointer-events: auto}}[part="actions"] {--helix-size-control: calc(var(--helix-size-control-sm) - var(--helix-space-2xs));--helix-size-control-loose: calc(var(--helix-size-control) * 1.2);--helix-size-control-tight: calc(var(--helix-size-control) * 0.8);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);align-items: center;display: inline-flex;gap: var(--helix-space-2xs)}[part="actions"][hidden] {display: none}[part="sources"] {--helix-size-avatar: var(--helix-size-avatar-sm);--helix-size-tag: var(--helix-size-tag-sm);--helix-size-icon: var(--helix-size-icon-sm);--helix-size-icon-loose: calc(var(--helix-size-icon) * 1.2);--helix-size-icon-tight: calc(var(--helix-size-icon) * 0.8);align-items: center;color: var(--helix-color-foreground-muted);display: flex;flex-wrap: wrap;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);gap: var(--helix-space-2xs);line-height: var(--helix-leading-normal)}[part="sources"][hidden] {display: none}[part="work"] {color: var(--helix-color-foreground-muted);justify-self: stretch;min-inline-size: 0}[part="work"][hidden] {display: none}[part="content"] {background-color: var(--chat-message-background-color, color-mix(in oklab, var(--helix-color-foreground) 14%, transparent));border-radius: var(--chat-message-radius, var(--helix-radii-md));color: var(--chat-message-color, var(--helix-color-foreground));font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);line-height: var(--helix-leading-normal);padding-block: var(--chat-message-padding-block, var(--helix-space-xs));padding-inline: var(--chat-message-padding-inline, var(--helix-space-sm))}:host([separation="plain"]) [part="content"] {background-color: transparent;padding-inline: var(--helix-space-none)}:host([separation="plain"]) [part="body"] {justify-items: stretch;max-inline-size: 100%}:host([separation="plain"]) [part="content"] {inline-size: auto}:host([author="me"]) [part="content"] {background-color: var(--chat-message-background-color-me, color-mix(in oklab, var(--helix-color-primary) 28%, transparent));color: var(--chat-message-color-me, var(--chat-message-color, var(--helix-color-foreground)))}[part="meta"] {align-items: center;color: var(--chat-message-meta-color, var(--helix-color-foreground-muted));display: flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);gap: var(--helix-space-2xs)}:host([author="me"]) [part="meta"] {justify-content: flex-end}[part="content"] {inline-size: fit-content;max-inline-size: 100%;min-inline-size: 0;overflow-x: auto}[part="content"] slot[name="indicator"] {display: none}:host([state="streaming"]) [part="content"][data-empty] slot[name="indicator"] {display: block}slot[name="indicator"]::slotted(*) {background-color: var(--chat-indicator-background-color, var(--helix-color-surface-sunken));border-radius: var(--helix-radii-full);font-size: var(--helix-text-xs);padding-block: var(--helix-space-2xs);padding-inline: var(--helix-space-xs);--orb-size: var(--helix-size-icon-sm)}slot[name="indicator"]::slotted(helix-orb) {background-color: transparent;padding: var(--helix-space-none)}:host([state="failed"]) [part="meta"] {color: var(--helix-color-danger)}[part="state"] {align-items: center;display: inline-flex;font-weight: var(--helix-weight-medium);gap: var(--helix-space-2xs)}[part="mark"] {block-size: var(--helix-size-icon-tight);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight)}:host([state="sending"]) [part="content"] {opacity: 0.6}[part="retry"] {background: none;border: 0;border-radius: var(--helix-radii-sm);color: var(--helix-color-foreground);cursor: pointer;font: inherit;font-weight: var(--helix-weight-medium);margin-inline-end: calc(var(--helix-space-2xs) * -1);min-block-size: calc(var(--helix-size-control-tight) - var(--helix-space-2xs));padding-block: var(--helix-space-2xs);padding-inline: var(--helix-space-2xs);text-decoration: underline;text-underline-offset: 0.2em}[part="retry"]:hover {background-color: var(--helix-color-hover)}[part="retry"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}@media print {[part="retry"] {display: none}[part="actions"] {display: none}[part="content"] slot[name="indicator"] {display: none}}`);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {position: relative}[part="field"] {align-items: center;background-color: var(--combobox-background-color, var(--helix-color-well));block-size: var(--helix-size-control);border: var(--helix-border-thin) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-sizing: border-box;display: flex;gap: var(--helix-space-xs);padding-inline: var(--helix-space-xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard), border-color var(--helix-duration-fast) var(--helix-easing-standard)}[part="field"]:has([part="tags"]) {block-size: auto;flex-wrap: wrap;min-block-size: var(--helix-size-control);padding-block: var(--helix-space-2xs);padding-inline-end: calc(var(--helix-space-xs) + var(--helix-size-icon-tight));position: relative}[part="indicator"], ::slotted([slot="indicator"]) {transition: scale var(--helix-duration-fast) var(--helix-easing-standard)}[part="field"]:has([part="tags"]) [part="indicator"], [part="field"]:has([part="tags"]) ::slotted([slot="indicator"]) {inset-block-start: 50%;inset-inline-end: var(--helix-space-xs);position: absolute;translate: 0 -50%}[part="tag"] {flex: 0 0 auto;max-inline-size: 100%}[part="field"]:has([part="tags"]) [part="control"] {flex: 1 1 var(--combobox-control-size, 4ch)}[part="control"]::placeholder {color: var(--helix-color-foreground-muted);font-weight: var(--helix-weight-regular)}:host(:disabled) [part="field"] {color: var(--helix-color-foreground-subtle);cursor: not-allowed;opacity: 0.5}[part="indicator"] {block-size: var(--helix-size-icon-tight);color: var(--helix-color-foreground-muted);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight)}:host(:state(open)) [part="indicator"], :host(:state(open)) ::slotted([slot="indicator"]) {scale: 1 -1}slot[name="start"]::slotted(*), slot[name="end"]::slotted(*) {--icon-size: var(--helix-size-icon);color: var(--helix-color-foreground-muted);flex: 0 0 auto}[part="surface"] {--_floating-border-color: var(--combobox-border-color, var(--helix-color-border));--_floating-border-width: var(--combobox-border-width, var(--helix-border-floating));--_floating-shadow: var(--combobox-shadow, var(--helix-shadow-floating));box-sizing: border-box;inline-size: var(--combobox-panel-size, max-content);max-block-size: var(--floating-available-block-size, none);max-inline-size: calc(100vw - var(--helix-space-md) * 2);min-inline-size: var(--floating-anchor-inline-size, 100%);overflow: hidden;padding: var(--helix-space-none);position: absolute}[part~="create"] {all: unset;border-block-start: var(--helix-border-thin) solid var(--helix-color-border);box-sizing: border-box;color: var(--helix-color-foreground);cursor: pointer;display: block;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);inline-size: 100%;padding: var(--helix-space-xs) var(--helix-space-sm);text-align: start;transition: background-color var(--helix-duration-fast) var(--helix-easing-standard)}[part~="create"]:hover, [part~="create-active"] {background-color:
|
|
2
|
+
export const styles = createSheet(`:host {position: relative}[part="field"] {align-items: center;background-color: var(--combobox-background-color, var(--helix-color-well));block-size: var(--helix-size-control);border: var(--helix-border-thin) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-sizing: border-box;display: flex;gap: var(--helix-space-xs);padding-inline: var(--helix-space-xs);transition: background-color var(--helix-duration-fast) var(--helix-easing-standard), border-color var(--helix-duration-fast) var(--helix-easing-standard)}[part="field"]:has([part="tags"]) {block-size: auto;flex-wrap: wrap;min-block-size: var(--helix-size-control);padding-block: var(--helix-space-2xs);padding-inline-end: calc(var(--helix-space-xs) + var(--helix-size-icon-tight));position: relative}[part="indicator"], ::slotted([slot="indicator"]) {transition: scale var(--helix-duration-fast) var(--helix-easing-standard)}[part="field"]:has([part="tags"]) [part="indicator"], [part="field"]:has([part="tags"]) ::slotted([slot="indicator"]) {inset-block-start: 50%;inset-inline-end: var(--helix-space-xs);position: absolute;translate: 0 -50%}[part="tag"] {flex: 0 0 auto;max-inline-size: 100%}[part="field"]:has([part="tags"]) [part="control"] {flex: 1 1 var(--combobox-control-size, 4ch)}[part="control"]::placeholder {color: var(--helix-color-foreground-muted);font-weight: var(--helix-weight-regular)}:host(:disabled) [part="field"] {color: var(--helix-color-foreground-subtle);cursor: not-allowed;opacity: 0.5}[part="indicator"] {block-size: var(--helix-size-icon-tight);color: var(--helix-color-foreground-muted);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight)}:host(:state(open)) [part="indicator"], :host(:state(open)) ::slotted([slot="indicator"]) {scale: 1 -1}slot[name="start"]::slotted(*), slot[name="end"]::slotted(*) {--icon-size: var(--helix-size-icon);color: var(--helix-color-foreground-muted);flex: 0 0 auto}[part="surface"] {--_floating-border-color: var(--combobox-border-color, var(--helix-color-border));--_floating-border-width: var(--combobox-border-width, var(--helix-border-floating));--_floating-shadow: var(--combobox-shadow, var(--helix-shadow-floating));box-sizing: border-box;inline-size: var(--combobox-panel-size, max-content);max-block-size: var(--floating-available-block-size, none);max-inline-size: calc(100vw - var(--helix-space-md) * 2);min-inline-size: var(--floating-anchor-inline-size, 100%);overflow: hidden;padding: var(--helix-space-none);position: absolute}[part~="create"] {all: unset;border-block-start: var(--helix-border-thin) solid var(--helix-color-border);box-sizing: border-box;color: var(--helix-color-foreground);cursor: pointer;display: block;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);font-weight: var(--helix-weight-medium);inline-size: 100%;padding: var(--helix-space-xs) var(--helix-space-sm);text-align: start;transition: background-color var(--helix-duration-fast) var(--helix-easing-standard)}[part~="create"]:hover, [part~="create-active"] {background-color: var(--helix-color-hover)}[part~="create"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="listbox"] {--listbox-background-color: transparent;border: none;display: block}@media (prefers-reduced-motion: reduce) {[part="field"] {transition: none}[part~="create"] {transition: none}}@media print {:host {print-color-adjust: exact}}`);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: contents}[part="region"] {background-color: var(--graph-background-color, var(--helix-color-surface-sunken));block-size: var(--graph-block-size, 32rem);border: var(--helix-border-thin) solid var(--graph-border-color, var(--helix-color-border));border-radius: var(--helix-radii-sm);box-sizing: border-box;container-type: inline-size;display: grid;grid-template-rows: auto minmax(0, 1fr) auto;overflow: hidden;position: relative}[part="body"] {display: grid;grid-template-columns: minmax(0, 1fr) var(--graph-panel-size, 18rem);min-block-size: 0}[part="stage"] {isolation: isolate;min-block-size: 0;overflow: hidden;position: relative}[part="viewport"] {inset: 0;position: absolute}[part="viewport"] ::slotted(*) {block-size: 100%;inline-size: 100%}[part="panel"] {background-color: var(--graph-panel-background-color, var(--helix-color-surface));border-inline-start: var(--helix-border-thin) solid var(--helix-color-border);color: var(--graph-panel-color, var(--helix-color-foreground));display: grid;grid-template-columns: minmax(0, 1fr);grid-template-rows: auto minmax(0, 1fr);min-block-size: 0}@container (inline-size < 40rem) {[part="body"] {grid-template-columns: minmax(0, 1fr);grid-template-rows: minmax(0, 3fr) minmax(0, 2fr)}[part="panel"] {border-block-start: var(--helix-border-thin) solid var(--helix-color-border);border-inline-start: none}}:host([no-panel]) [part="body"] {grid-template-columns: minmax(0, 1fr);grid-template-rows: minmax(0, 1fr);position: relative}:host([no-panel]) [part="panel"] {border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);inline-size: min(var(--graph-panel-size, 18rem), calc(100% - var(--helix-space-sm) * 2));inset-block: var(--helix-space-sm);inset-inline-end: var(--helix-space-sm);overflow: hidden;position: absolute;z-index: 1}:host([no-panel]) [part="panel"][hidden] {display: none}:host([no-panel]) [part="body"]:has([part="panel"]:not([hidden])) [part="controls"] {inset-inline-end: calc(min(var(--graph-panel-size, 18rem), 100%) + var(--helix-space-sm) * 2)}[part="notes-toggle"] {grid-area: notes}[part="notes-toggle"] svg {block-size: 1em;inline-size: 1em}[part="controls"]:has([part="notes-toggle"]):not(:has([part="pan-up"])) {grid-template-areas: "zoomin" "zoomout" "notes" "full"}[part="controls"]:has([part="notes-toggle"]):has([part="pan-up"]) {grid-template-areas: ". up . zoomin" "start . end zoomout" ". down . notes" ". . . full"}[part="legend"] {display: flex;flex-wrap: wrap;gap: var(--helix-space-2xs);inset-block-end: var(--helix-space-sm);inset-inline-start: var(--helix-space-sm);max-inline-size: calc(100% - var(--helix-space-sm) * 3 - var(--helix-size-control-sm));position: absolute}:host([controls-placement="bottom-start"]) [part="legend"] {inset-inline: auto var(--helix-space-sm)}@container (inline-size < 40rem) {[part="legend"] {flex-wrap: nowrap;inset-block-end: calc(var(--helix-space-sm) - var(--helix-space-2xs));inset-inline-start: calc(var(--helix-space-sm) - var(--helix-space-2xs));overflow-x: auto;padding: var(--helix-space-2xs);scrollbar-width: none}}[part~="legend-item"] {align-items: center;background-color: var(--viewport-control-background-color, var(--helix-color-surface-overlay));block-size: var(--helix-size-control-tight);border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);color: var(--helix-color-foreground);cursor: pointer;display: inline-flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);font-weight: var(--helix-weight-medium);gap: var(--helix-space-2xs);padding-inline: var(--helix-space-xs);white-space: nowrap}[part~="legend-item"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}[part~="legend-item"]:nth-child(24n + 1) {--_graph-swatch: var(--helix-color-series-1)}[part~="legend-item"]:nth-child(24n + 2) {--_graph-swatch: var(--helix-color-series-2)}[part~="legend-item"]:nth-child(24n + 3) {--_graph-swatch: var(--helix-color-series-3)}[part~="legend-item"]:nth-child(24n + 4) {--_graph-swatch: var(--helix-color-series-4)}[part~="legend-item"]:nth-child(24n + 5) {--_graph-swatch: var(--helix-color-series-5)}[part~="legend-item"]:nth-child(24n + 6) {--_graph-swatch: var(--helix-color-series-6)}[part~="legend-item"]:nth-child(24n + 7) {--_graph-swatch: var(--helix-color-series-7)}[part~="legend-item"]:nth-child(24n + 8) {--_graph-swatch: var(--helix-color-series-8)}[part~="legend-item"]:nth-child(24n + 9) {--_graph-swatch: var(--helix-color-series-9)}[part~="legend-item"]:nth-child(24n + 10) {--_graph-swatch: var(--helix-color-series-10)}[part~="legend-item"]:nth-child(24n + 11) {--_graph-swatch: var(--helix-color-series-11)}[part~="legend-item"]:nth-child(24n + 12) {--_graph-swatch: var(--helix-color-series-12)}[part~="legend-item"]:nth-child(24n + 13) {--_graph-swatch: var(--helix-color-series-13)}[part~="legend-item"]:nth-child(24n + 14) {--_graph-swatch: var(--helix-color-series-14)}[part~="legend-item"]:nth-child(24n + 15) {--_graph-swatch: var(--helix-color-series-15)}[part~="legend-item"]:nth-child(24n + 16) {--_graph-swatch: var(--helix-color-series-16)}[part~="legend-item"]:nth-child(24n + 17) {--_graph-swatch: var(--helix-color-series-17)}[part~="legend-item"]:nth-child(24n + 18) {--_graph-swatch: var(--helix-color-series-18)}[part~="legend-item"]:nth-child(24n + 19) {--_graph-swatch: var(--helix-color-series-19)}[part~="legend-item"]:nth-child(24n + 20) {--_graph-swatch: var(--helix-color-series-20)}[part~="legend-item"]:nth-child(24n + 21) {--_graph-swatch: var(--helix-color-series-21)}[part~="legend-item"]:nth-child(24n + 22) {--_graph-swatch: var(--helix-color-series-22)}[part~="legend-item"]:nth-child(24n + 23) {--_graph-swatch: var(--helix-color-series-23)}[part~="legend-item"]:nth-child(24n + 24) {--_graph-swatch: var(--helix-color-series-24)}[part~="legend-item"][data-tone="accent"] {--_graph-swatch: var(--helix-color-accent)}[part~="legend-item"][data-tone="danger"] {--_graph-swatch: var(--helix-color-danger)}[part~="legend-item"][data-tone="info"] {--_graph-swatch: var(--helix-color-info)}[part~="legend-item"][data-tone="neutral"] {--_graph-swatch: var(--helix-color-foreground-muted)}[part~="legend-item"][data-tone="primary"] {--_graph-swatch: var(--helix-color-primary)}[part~="legend-item"][data-tone="success"] {--_graph-swatch: var(--helix-color-success)}[part~="legend-item"][data-tone="warning"] {--_graph-swatch: var(--helix-color-warning)}[part="legend-swatch"] {block-size: var(--helix-space-xs);border: var(--helix-border-thin) solid var(--_graph-swatch, var(--helix-color-foreground-muted));border-radius: var(--helix-radii-full);box-sizing: border-box;background-color: var(--_graph-swatch, var(--helix-color-foreground-muted));flex: 0 0 auto;inline-size: var(--helix-space-xs)}[part~="legend-item-hidden"] {color: var(--helix-color-foreground-muted)}[part~="legend-item-hidden"] [part="legend-swatch"] {background-color: transparent}[part="search"] {align-items: center;border-block-end: var(--helix-border-thin) solid var(--helix-color-border);display: flex;gap: var(--helix-space-2xs);padding: var(--helix-space-2xs);padding-inline-start: var(--helix-space-xs)}[part="filter-icon"] {align-items: center;color: var(--helix-color-foreground-subtle);display: inline-flex;flex: 0 0 auto}[part="filter-icon"] svg, slot[name="filter-icon"]::slotted(*) {--icon-size: var(--helix-size-icon-tight);block-size: var(--helix-size-icon-tight);inline-size: var(--helix-size-icon-tight)}[part="search-field"] {appearance: none;background-color: transparent;block-size: var(--helix-size-control-tight);border: none;box-sizing: border-box;color: var(--helix-color-foreground);flex: 1 1 auto;font-family: var(--helix-font-sans);font-size: max(var(--helix-text-field-min), var(--helix-text-sm));font-weight: var(--helix-weight-medium);min-inline-size: 0;padding-inline: var(--helix-space-2xs)}[part="search-field"]::placeholder {color: var(--helix-color-foreground-muted);font-weight: var(--helix-weight-regular)}[part="search-field"]:focus-visible {outline: none}[part="search"]:has([part="search-field"]:focus-visible), [part="list"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="count"] {color: var(--helix-color-foreground-muted);flex: 0 0 auto;font-size: var(--helix-text-xs);font-variant-numeric: tabular-nums;padding-inline-end: calc(var(--helix-space-xs) - var(--helix-space-2xs))}[part="empty"], [part="loading"] {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);grid-area: 2 / 1;padding: var(--helix-space-sm)}[part="list"] {min-block-size: 0;overflow-y: auto;overscroll-behavior: contain;padding-block: var(--helix-space-2xs)}[part~="note"] {align-items: center;box-sizing: border-box;cursor: pointer;display: flex;font-size: var(--graph-note-text, var(--helix-text-sm));gap: var(--helix-space-sm);min-block-size: var(--helix-size-control-tight);padding-block: var(--helix-space-2xs);padding-inline: var(--graph-note-padding-inline, var(--helix-space-xs));user-select: none}[part~="note"]:hover, [part="list"]:focus-visible [part~="note-cursor"], [part="search"]:has([aria-activedescendant]) ~ [part="list"] [part~="note-cursor"] {--_graph-wash: var(--graph-note-hover-color, light-dark(color-mix(in oklab, var(--helix-color-foreground) 8%, transparent), color-mix(in oklab, var(--helix-color-foreground) 12%, transparent)));background-image: linear-gradient(var(--_graph-wash), var(--_graph-wash))}[part="note-name"] {flex: 0 1 auto;max-inline-size: 70%;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}[part="note-relation"] {color: var(--graph-note-relation-color, var(--helix-color-foreground-muted));flex: 1 1 0;font-size: var(--helix-text-xs);min-inline-size: 0;overflow: hidden;text-align: end;text-overflow: ellipsis;white-space: nowrap}[part~="note-selected"] {background-color: var(--graph-note-selected-background-color, var(--helix-color-surface-sunken))}[part~="note-selected"] [part="note-name"] {font-weight: var(--graph-note-selected-weight, var(--helix-weight-semibold))}[part="header"], [part="footer"] {min-inline-size: 0}@media (forced-colors: active) {[part~="legend-item-hidden"] {color: GrayText}[part="legend-swatch"] {forced-color-adjust: none}[part="list"]:focus-visible [part~="note-cursor"], [part="search"]:has([aria-activedescendant]) ~ [part="list"] [part~="note-cursor"] {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part~="note-selected"], [part~="note-selected"] [part="note-relation"] {background-color: Highlight;color: HighlightText;forced-color-adjust: none}}@media print {:host {print-color-adjust: economy}}:host(:state(settling-unseen)) [part="viewport"] ::slotted(*) {visibility: hidden}[part="settling"] {color: var(--helix-color-foreground-muted);font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);inset-block-start: 50%;inset-inline: 0;position: absolute;text-align: center;translate: 0 -50%}[part="stop-layout"] {background-color: var(--viewport-control-background-color, var(--helix-color-surface-overlay));border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);color: var(--helix-color-foreground);cursor: pointer;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);inset-block-end: var(--helix-space-sm);inset-inline-start: var(--helix-space-sm);min-block-size: var(--helix-size-control-sm);padding-inline: var(--helix-space-sm);position: absolute;z-index: var(--helix-layer-raised)}[part="stop-layout"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 10%, var(--viewport-control-background-color, var(--helix-color-surface-overlay)))}[part="stop-layout"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: contents}[part="region"] {background-color: var(--graph-background-color, var(--helix-color-surface-sunken));block-size: var(--graph-block-size, 32rem);border: var(--helix-border-thin) solid var(--graph-border-color, var(--helix-color-border));border-radius: var(--helix-radii-sm);box-sizing: border-box;container-type: inline-size;display: grid;grid-template-rows: auto minmax(0, 1fr) auto;overflow: hidden;position: relative}[part="body"] {display: grid;grid-template-columns: minmax(0, 1fr) var(--graph-panel-size, 18rem);min-block-size: 0}[part="stage"] {isolation: isolate;min-block-size: 0;overflow: hidden;position: relative}[part="viewport"] {inset: 0;position: absolute}[part="viewport"] ::slotted(*) {block-size: 100%;inline-size: 100%}[part="panel"] {background-color: var(--graph-panel-background-color, var(--helix-color-surface));border-inline-start: var(--helix-border-thin) solid var(--helix-color-border);color: var(--graph-panel-color, var(--helix-color-foreground));display: grid;grid-template-columns: minmax(0, 1fr);grid-template-rows: auto minmax(0, 1fr);min-block-size: 0}@container (inline-size < 40rem) {[part="body"] {grid-template-columns: minmax(0, 1fr);grid-template-rows: minmax(0, 3fr) minmax(0, 2fr)}[part="panel"] {border-block-start: var(--helix-border-thin) solid var(--helix-color-border);border-inline-start: none}}:host([no-panel]) [part="body"] {grid-template-columns: minmax(0, 1fr);grid-template-rows: minmax(0, 1fr);position: relative}:host([no-panel]) [part="panel"] {border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);inline-size: min(var(--graph-panel-size, 18rem), calc(100% - var(--helix-space-sm) * 2));inset-block: var(--helix-space-sm);inset-inline-end: var(--helix-space-sm);overflow: hidden;position: absolute;z-index: 1}:host([no-panel]) [part="panel"][hidden] {display: none}:host([no-panel]) [part="body"]:has([part="panel"]:not([hidden])) [part="controls"] {inset-inline-end: calc(min(var(--graph-panel-size, 18rem), 100%) + var(--helix-space-sm) * 2)}[part="notes-toggle"] {grid-area: notes}[part="notes-toggle"] svg {block-size: 1em;inline-size: 1em}[part="controls"]:has([part="notes-toggle"]):not(:has([part="pan-up"])) {grid-template-areas: "zoomin" "zoomout" "notes" "full"}[part="controls"]:has([part="notes-toggle"]):has([part="pan-up"]) {grid-template-areas: ". up . zoomin" "start . end zoomout" ". down . notes" ". . . full"}[part="legend"] {display: flex;flex-wrap: wrap;gap: var(--helix-space-2xs);inset-block-end: var(--helix-space-sm);inset-inline-start: var(--helix-space-sm);max-inline-size: calc(100% - var(--helix-space-sm) * 3 - var(--helix-size-control-sm));position: absolute}:host([controls-placement="bottom-start"]) [part="legend"] {inset-inline: auto var(--helix-space-sm)}@container (inline-size < 40rem) {[part="legend"] {flex-wrap: nowrap;inset-block-end: calc(var(--helix-space-sm) - var(--helix-space-2xs));inset-inline-start: calc(var(--helix-space-sm) - var(--helix-space-2xs));overflow-x: auto;padding: var(--helix-space-2xs);scrollbar-width: none}}[part~="legend-item"] {align-items: center;background-color: var(--viewport-control-background-color, var(--helix-color-surface-overlay));block-size: var(--helix-size-control-tight);border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);color: var(--helix-color-foreground);cursor: pointer;display: inline-flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-xs);font-weight: var(--helix-weight-medium);gap: var(--helix-space-2xs);padding-inline: var(--helix-space-xs);white-space: nowrap}[part~="legend-item"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}[part~="legend-item"]:nth-child(24n + 1) {--_graph-swatch: var(--helix-color-series-1)}[part~="legend-item"]:nth-child(24n + 2) {--_graph-swatch: var(--helix-color-series-2)}[part~="legend-item"]:nth-child(24n + 3) {--_graph-swatch: var(--helix-color-series-3)}[part~="legend-item"]:nth-child(24n + 4) {--_graph-swatch: var(--helix-color-series-4)}[part~="legend-item"]:nth-child(24n + 5) {--_graph-swatch: var(--helix-color-series-5)}[part~="legend-item"]:nth-child(24n + 6) {--_graph-swatch: var(--helix-color-series-6)}[part~="legend-item"]:nth-child(24n + 7) {--_graph-swatch: var(--helix-color-series-7)}[part~="legend-item"]:nth-child(24n + 8) {--_graph-swatch: var(--helix-color-series-8)}[part~="legend-item"]:nth-child(24n + 9) {--_graph-swatch: var(--helix-color-series-9)}[part~="legend-item"]:nth-child(24n + 10) {--_graph-swatch: var(--helix-color-series-10)}[part~="legend-item"]:nth-child(24n + 11) {--_graph-swatch: var(--helix-color-series-11)}[part~="legend-item"]:nth-child(24n + 12) {--_graph-swatch: var(--helix-color-series-12)}[part~="legend-item"]:nth-child(24n + 13) {--_graph-swatch: var(--helix-color-series-13)}[part~="legend-item"]:nth-child(24n + 14) {--_graph-swatch: var(--helix-color-series-14)}[part~="legend-item"]:nth-child(24n + 15) {--_graph-swatch: var(--helix-color-series-15)}[part~="legend-item"]:nth-child(24n + 16) {--_graph-swatch: var(--helix-color-series-16)}[part~="legend-item"]:nth-child(24n + 17) {--_graph-swatch: var(--helix-color-series-17)}[part~="legend-item"]:nth-child(24n + 18) {--_graph-swatch: var(--helix-color-series-18)}[part~="legend-item"]:nth-child(24n + 19) {--_graph-swatch: var(--helix-color-series-19)}[part~="legend-item"]:nth-child(24n + 20) {--_graph-swatch: var(--helix-color-series-20)}[part~="legend-item"]:nth-child(24n + 21) {--_graph-swatch: var(--helix-color-series-21)}[part~="legend-item"]:nth-child(24n + 22) {--_graph-swatch: var(--helix-color-series-22)}[part~="legend-item"]:nth-child(24n + 23) {--_graph-swatch: var(--helix-color-series-23)}[part~="legend-item"]:nth-child(24n + 24) {--_graph-swatch: var(--helix-color-series-24)}[part~="legend-item"][data-tone="accent"] {--_graph-swatch: var(--helix-color-accent)}[part~="legend-item"][data-tone="danger"] {--_graph-swatch: var(--helix-color-danger)}[part~="legend-item"][data-tone="info"] {--_graph-swatch: var(--helix-color-info)}[part~="legend-item"][data-tone="neutral"] {--_graph-swatch: var(--helix-color-foreground-muted)}[part~="legend-item"][data-tone="primary"] {--_graph-swatch: var(--helix-color-primary)}[part~="legend-item"][data-tone="success"] {--_graph-swatch: var(--helix-color-success)}[part~="legend-item"][data-tone="warning"] {--_graph-swatch: var(--helix-color-warning)}[part="legend-swatch"] {block-size: var(--helix-space-xs);border: var(--helix-border-thin) solid var(--_graph-swatch, var(--helix-color-foreground-muted));border-radius: var(--helix-radii-full);box-sizing: border-box;background-color: var(--_graph-swatch, var(--helix-color-foreground-muted));flex: 0 0 auto;inline-size: var(--helix-space-xs)}[part~="legend-item-hidden"] {color: var(--helix-color-foreground-muted)}[part~="legend-item-hidden"] [part="legend-swatch"] {background-color: transparent}[part="search"] {align-items: center;border-block-end: var(--helix-border-thin) solid var(--helix-color-border);display: flex;gap: var(--helix-space-2xs);padding: var(--helix-space-2xs);padding-inline-start: var(--helix-space-xs)}[part="filter-icon"] {align-items: center;color: var(--helix-color-foreground-subtle);display: inline-flex;flex: 0 0 auto}[part="filter-icon"] svg, slot[name="filter-icon"]::slotted(*) {--icon-size: var(--helix-size-icon-tight);block-size: var(--helix-size-icon-tight);inline-size: var(--helix-size-icon-tight)}[part="search-field"] {appearance: none;background-color: transparent;block-size: var(--helix-size-control-tight);border: none;box-sizing: border-box;color: var(--helix-color-foreground);flex: 1 1 auto;font-family: var(--helix-font-sans);font-size: max(var(--helix-text-field-min), var(--helix-text-sm));font-weight: var(--helix-weight-medium);min-inline-size: 0;padding-inline: var(--helix-space-2xs)}[part="search-field"]::placeholder {color: var(--helix-color-foreground-muted);font-weight: var(--helix-weight-regular)}[part="search-field"]:focus-visible {outline: none}[part="search"]:has([part="search-field"]:focus-visible), [part="list"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="count"] {color: var(--helix-color-foreground-muted);flex: 0 0 auto;font-size: var(--helix-text-xs);font-variant-numeric: tabular-nums;padding-inline-end: calc(var(--helix-space-xs) - var(--helix-space-2xs))}[part="empty"], [part="loading"] {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-sm);grid-area: 2 / 1;padding: var(--helix-space-sm)}[part="list"] {min-block-size: 0;overflow-y: auto;overscroll-behavior: contain;padding-block: var(--helix-space-2xs)}[part~="note"] {align-items: center;box-sizing: border-box;cursor: pointer;display: flex;font-size: var(--graph-note-text, var(--helix-text-sm));gap: var(--helix-space-sm);min-block-size: var(--helix-size-control-tight);padding-block: var(--helix-space-2xs);padding-inline: var(--graph-note-padding-inline, var(--helix-space-xs));user-select: none}[part~="note"]:hover, [part="list"]:focus-visible [part~="note-cursor"], [part="search"]:has([aria-activedescendant]) ~ [part="list"] [part~="note-cursor"] {--_graph-wash: var(--graph-note-hover-color, var(--helix-color-hover));background-image: linear-gradient(var(--_graph-wash), var(--_graph-wash))}[part="note-name"] {flex: 0 1 auto;max-inline-size: 70%;min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}[part="note-relation"] {color: var(--graph-note-relation-color, var(--helix-color-foreground-muted));flex: 1 1 0;font-size: var(--helix-text-xs);min-inline-size: 0;overflow: hidden;text-align: end;text-overflow: ellipsis;white-space: nowrap}[part~="note-selected"] {background-color: var(--graph-note-selected-background-color, var(--helix-color-surface-sunken))}[part~="note-selected"] [part="note-name"] {font-weight: var(--graph-note-selected-weight, var(--helix-weight-semibold))}[part="header"], [part="footer"] {min-inline-size: 0}@media (forced-colors: active) {[part~="legend-item-hidden"] {color: GrayText}[part="legend-swatch"] {forced-color-adjust: none}[part="list"]:focus-visible [part~="note-cursor"], [part="search"]:has([aria-activedescendant]) ~ [part="list"] [part~="note-cursor"] {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part~="note-selected"], [part~="note-selected"] [part="note-relation"] {background-color: Highlight;color: HighlightText;forced-color-adjust: none}}@media print {:host {print-color-adjust: economy}}:host(:state(settling-unseen)) [part="viewport"] ::slotted(*) {visibility: hidden}[part="settling"] {color: var(--helix-color-foreground-muted);font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);inset-block-start: 50%;inset-inline: 0;position: absolute;text-align: center;translate: 0 -50%}[part="stop-layout"] {background-color: var(--viewport-control-background-color, var(--helix-color-surface-overlay));border: var(--helix-border-floating) solid var(--helix-color-border);border-radius: var(--helix-radii-sm);box-shadow: var(--helix-shadow-floating);color: var(--helix-color-foreground);cursor: pointer;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);inset-block-end: var(--helix-space-sm);inset-inline-start: var(--helix-space-sm);min-block-size: var(--helix-size-control-sm);padding-inline: var(--helix-space-sm);position: absolute;z-index: var(--helix-layer-raised)}[part="stop-layout"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 10%, var(--viewport-control-background-color, var(--helix-color-surface-overlay)))}[part="stop-layout"]:focus-visible {outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: var(--helix-size-focus-offset)}`);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {display: block}[part~="line"] {column-gap: var(--helix-space-md);display: flex;inline-size: var(--_log-line-size, max-content);min-inline-size: 100%;padding-inline: var(--log-padding-inline, var(--helix-space-md))}[part~="line-grouped"]:not(:has(> [part="number"])) {padding-inline-start: calc(var(--log-padding-inline, var(--helix-space-md)) + max(var(--helix-size-icon-sm), calc(var(--log-digits, 2) * 1ch)) + var(--helix-space-md))}[part~="line"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 4%, transparent)}:where(button[part="number"]) {all: unset;box-sizing: border-box}[part="number"] {color: var(--helix-color-foreground-muted);flex: none;font-variant-numeric: tabular-nums;min-inline-size: max(var(--helix-size-icon-sm), calc(var(--log-digits, 2) * 1ch));text-align: end;text-decoration: none;user-select: none}a[part="number"]:hover, button[part="number"]:hover {color: var(--helix-color-foreground);cursor: pointer}a[part="number"]:hover {text-decoration: underline}a[part="number"]:focus-visible, button[part="number"]:focus-visible {border-radius: var(--helix-radii-sm);outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="time"] {color: var(--helix-color-foreground-muted);flex: none;font-variant-numeric: tabular-nums;user-select: none}[part="text"] {flex: 1 1 auto;min-inline-size: 0;overflow-wrap: anywhere;white-space: var(--_log-white-space, pre)}[part~="line-debug"] {color: var(--helix-color-foreground-muted)}[part~="line-warn"] {background-color: color-mix(in oklab, var(--log-warn-color, var(--helix-color-warning)) 10%, transparent);color: var(--log-warn-color, var(--helix-color-warning))}[part~="line-error"] {background-color: color-mix(in oklab, var(--log-error-color, var(--helix-color-danger)) 10%, transparent);color: var(--log-error-color, var(--helix-color-danger))}[part~="line-marked"] {background-color: var(--log-mark-background-color, color-mix(in oklab, var(--helix-color-primary) 12%, transparent))}[part~="line-selected"] {background-color: var(--log-selected-background-color, color-mix(in oklab, var(--helix-color-info) 14%, transparent))}[part~="line-selected"] > [part="number"] {color: var(--helix-color-foreground)}[part~="run"] {background-color: var(--log-run-background-color, transparent);color: var(--log-run-color, inherit)}[part~="run-bold"] {font-weight: var(--helix-weight-semibold)}[part~="run-dim"] {opacity: 0.7}[part~="run-italic"] {font-style: italic}[part~="run-underline"] {text-decoration-line: underline}[part~="run-strike"] {text-decoration-line: line-through}[part~="run-underline"][part~="run-strike"] {text-decoration-line: underline line-through}[part="match"] {background-color: var(--log-match-background-color, var(--helix-color-warning-surface));border-radius: var(--helix-radii-sm);color: inherit}@media print {[part~="line"] {print-color-adjust: exact}}`);
|
|
2
|
+
export const styles = createSheet(`:host {display: block}[part~="line"] {column-gap: var(--helix-space-md);display: flex;inline-size: var(--_log-line-size, max-content);min-inline-size: 100%;padding-inline: var(--log-padding-inline, var(--helix-space-md))}[part~="line-grouped"]:not(:has(> [part="number"])) {padding-inline-start: calc(var(--log-padding-inline, var(--helix-space-md)) + max(var(--helix-size-icon-sm), calc(var(--log-digits, 2) * 1ch)) + var(--helix-space-md))}[part~="line"]:hover {background-color: color-mix(in oklab, var(--helix-color-foreground) 4%, transparent)}:where(button[part="number"]) {all: unset;box-sizing: border-box}[part="number"] {color: var(--helix-color-foreground-muted);flex: none;font-variant-numeric: tabular-nums;min-inline-size: max(var(--helix-size-icon-sm), calc(var(--log-digits, 2) * 1ch));text-align: end;text-decoration: none;user-select: none}a[part="number"]:hover, button[part="number"]:hover {color: var(--helix-color-foreground);cursor: pointer}a[part="number"]:hover {text-decoration: underline}a[part="number"]:focus-visible, button[part="number"]:focus-visible {border-radius: var(--helix-radii-sm);outline: var(--helix-size-focus-ring) solid var(--helix-color-focus-ring);outline-offset: calc(var(--helix-size-focus-offset) * -1)}[part="time"] {color: var(--helix-color-foreground-muted);flex: none;font-variant-numeric: tabular-nums;user-select: none}[part="text"] {flex: 1 1 auto;min-inline-size: 0;overflow-wrap: anywhere;white-space: var(--_log-white-space, pre)}[part~="line-debug"] {color: var(--helix-color-foreground-muted)}[part~="line-warn"] {background-color: color-mix(in oklab, var(--log-warn-color, var(--helix-color-warning)) 10%, transparent);color: color-mix(in oklab, var(--log-warn-color, var(--helix-color-warning)) 78%, var(--helix-color-foreground))}[part~="line-error"] {background-color: color-mix(in oklab, var(--log-error-color, var(--helix-color-danger)) 10%, transparent);color: color-mix(in oklab, var(--log-error-color, var(--helix-color-danger)) 78%, var(--helix-color-foreground))}[part~="line-marked"] {background-color: var(--log-mark-background-color, color-mix(in oklab, var(--helix-color-primary) 12%, transparent))}[part~="line-selected"] {background-color: var(--log-selected-background-color, color-mix(in oklab, var(--helix-color-info) 14%, transparent))}[part~="line-selected"] > [part="number"] {color: var(--helix-color-foreground)}[part~="run"] {background-color: var(--log-run-background-color, transparent);color: var(--log-run-color, inherit)}[part~="run-bold"] {font-weight: var(--helix-weight-semibold)}[part~="run-dim"] {opacity: 0.7}[part~="run-italic"] {font-style: italic}[part~="run-underline"] {text-decoration-line: underline}[part~="run-strike"] {text-decoration-line: line-through}[part~="run-underline"][part~="run-strike"] {text-decoration-line: underline line-through}[part="match"] {background-color: var(--log-match-background-color, var(--helix-color-warning-surface));border-radius: var(--helix-radii-sm);color: inherit}@media print {[part~="line"] {print-color-adjust: exact}}`);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { createSheet } from '@fusion.dev/helix-core';
|
|
2
|
-
export const styles = createSheet(`:host {--_option-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M104 192a8 8 0 0 1-5.7-2.3l-56-56a8 8 0 0 1 11.4-11.4L104 172.7 210.3 66.3a8 8 0 0 1 11.4 11.4l-112 112A8 8 0 0 1 104 192Z'/%3E%3C/svg%3E");display: block}:host([hidden]) {display: none}[part~="item"] {align-items: center;border-radius: var(--option-radius, var(--helix-radii-sm));color: var(--helix-color-foreground);cursor: pointer;display: flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);gap: var(--helix-space-xs);min-block-size: var(--helix-size-control-tight);box-sizing: border-box;padding-block: var(--option-block-padding, var(--helix-space-2xs));padding-inline: var(--option-padding, var(--helix-space-xs));user-select: none}[part="text"] {display: flex;flex: 1 1 auto;flex-direction: column;min-inline-size: 0}[part="description"], slot[name="description"]::slotted(*) {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-xs);line-height: var(--helix-leading-tight);overflow: hidden;text-overflow: ellipsis;white-space: nowrap}[part="label"] {min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}slot[name="indicator"]::slotted(*) {display: none}:host(:state(selected)) slot[name="indicator"]::slotted(*) {block-size: var(--helix-size-icon-tight);display: block;flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto}:host(:state(selected)) [part~="item"]::after {content: "";background-color: currentColor;block-size: var(--helix-size-icon-tight);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto;mask-image: var(--_option-check);mask-position: center;mask-repeat: no-repeat;mask-size: contain}:host(:state(has-indicator)) [part~="item"]::after {content: none}:host(:state(active)) [part~="item"], :host(:not([disabled])) [part~="item"]:hover {background-color: var(--option-active-color,
|
|
2
|
+
export const styles = createSheet(`:host {--_option-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M104 192a8 8 0 0 1-5.7-2.3l-56-56a8 8 0 0 1 11.4-11.4L104 172.7 210.3 66.3a8 8 0 0 1 11.4 11.4l-112 112A8 8 0 0 1 104 192Z'/%3E%3C/svg%3E");display: block}:host([hidden]) {display: none}[part~="item"] {align-items: center;border-radius: var(--option-radius, var(--helix-radii-sm));color: var(--helix-color-foreground);cursor: pointer;display: flex;font-family: var(--helix-font-sans);font-size: var(--helix-text-sm);gap: var(--helix-space-xs);min-block-size: var(--helix-size-control-tight);box-sizing: border-box;padding-block: var(--option-block-padding, var(--helix-space-2xs));padding-inline: var(--option-padding, var(--helix-space-xs));user-select: none}[part="text"] {display: flex;flex: 1 1 auto;flex-direction: column;min-inline-size: 0}[part="description"], slot[name="description"]::slotted(*) {color: var(--helix-color-foreground-muted);font-size: var(--helix-text-xs);line-height: var(--helix-leading-tight);overflow: hidden;text-overflow: ellipsis;white-space: nowrap}[part="label"] {min-inline-size: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}slot[name="indicator"]::slotted(*) {display: none}:host(:state(selected)) slot[name="indicator"]::slotted(*) {block-size: var(--helix-size-icon-tight);display: block;flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto}:host(:state(selected)) [part~="item"]::after {content: "";background-color: currentColor;block-size: var(--helix-size-icon-tight);flex: 0 0 auto;inline-size: var(--helix-size-icon-tight);margin-inline-start: auto;mask-image: var(--_option-check);mask-position: center;mask-repeat: no-repeat;mask-size: contain}:host(:state(has-indicator)) [part~="item"]::after {content: none}:host(:state(active)) [part~="item"], :host(:not([disabled])) [part~="item"]:hover {background-color: var(--option-active-color, var(--helix-color-hover))}:host([disabled]) [part~="item"] {cursor: default;opacity: 0.5}@media print {:host {print-color-adjust: exact}}`);
|