npm - @tanstack/hotkeys-devtools - Versions diffs - 0.4.4 → 0.5.0 - Mend

@tanstack/hotkeys-devtools 0.4.4 → 0.5.0

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.

Files changed (19) hide show

package/dist/HotkeysContextProvider.js +25 -2
package/dist/HotkeysContextProvider.js.map +1 -1
package/dist/components/DetailsPanel.js +84 -48
package/dist/components/DetailsPanel.js.map +1 -1
package/dist/components/HotkeyList.js +229 -195
package/dist/components/HotkeyList.js.map +1 -1
package/dist/components/Shell.js +100 -43
package/dist/components/Shell.js.map +1 -1
package/dist/sequence-progress.js +20 -0
package/dist/sequence-progress.js.map +1 -0
package/dist/styles/use-styles.js +47 -0
package/dist/styles/use-styles.js.map +1 -1
package/package.json +2 -2
package/src/HotkeysContextProvider.tsx +35 -0
package/src/components/DetailsPanel.tsx +65 -20
package/src/components/HotkeyList.tsx +187 -151
package/src/components/Shell.tsx +101 -34
package/src/sequence-progress.ts +29 -0
package/src/styles/use-styles.ts +49 -0

package/dist/components/HotkeyList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HotkeyList.js","names":["For","Show","createEffect","createMemo","createSignal","on","clsx","formatForDisplay","formatHotkeySequence","useStyles","useHotkeysDevtoolsState","ConflictBehavior","HotkeyRegistration","SequenceRegistrationView","sequenceKey","sequence","Array","join","HotkeyListProps","selectedId","setSelectedId","id","getTargetLabel","target","HTMLElement","Document","Window","document","window","tagName","toLowerCase","getTargetTooltip","tag","parts","push","className","classes","split","filter","Boolean","dataAttrs","from","attributes","attr","name","startsWith","map","value","length","findTargetConflicts","registration","all","other","hotkey","options","eventType","findScopeConflicts","findSequenceTargetConflicts","findSequenceScopeConflicts","HotkeyList","props","styles","state","registrations","sequenceRegistrations","_el$","_tmpl$","_el$2","firstChild","_el$4","nextSibling","_el$3","_$insert","_$effect","_$className","panelHeader","_el$5","_tmpl$2","_$createComponent","each","children","reg","targetConflicts","scopeConflicts","hasTargetConflict","hasScopeConflict","conflictBehavior","targetConflictBadge","behavior","c","style","const","label","tooltip","scopeConflictTooltip","enabled","triggerCount","find","r","prevCount","setPrevCount","pulsing","setPulsing","current","setTimeout","_el$1","_tmpl$5","_el$10","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_el$20","_el$19","_el$21","_el$22","$$click","when","_el$11","_tmpl$4","_el$12","_c$","_$memo","_el$23","_tmpl$6","_el$24","_p$","_v$0","badge","_v$1","tooltipText","e","t","undefined","_c$2","_el$25","_tmpl$7","_el$26","_el$27","_v$10","badgeInfo","_v$11","_v$","hotkeyRow","hotkeyRowSelected","hotkeyRowTriggered","_v$2","hotkeyLabel","_v$3","hotkeyBadges","_v$4","badgeEnabled","badgeDisabled","_v$5","_v$6","badgeKeydown","badgeKeyup","_v$7","_v$8","badgeTarget","_v$9","a","o","i","n","s","h","hotkeyList","_el$6","_tmpl$3","_el$7","_el$9","_el$8","_el$0","_el$28","_el$29","_el$32","_el$33","_el$34","_el$35","_el$36","_el$37","_el$39","_el$38","_el$40","_el$41","_el$30","_el$31","_c$3","_el$42","_el$43","_v$21","_v$22","_c$4","_el$44","_el$45","_el$46","_v$23","_v$24","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","_v$18","_v$19","_v$20","_$delegateEvents"],"sources":["../../src/components/HotkeyList.tsx"],"sourcesContent":["import { For, Show, createEffect, createMemo, createSignal, on } from 'solid-js'\nimport clsx from 'clsx'\nimport { formatForDisplay, formatHotkeySequence } from '@tanstack/hotkeys'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport type {\n ConflictBehavior,\n HotkeyRegistration,\n SequenceRegistrationView,\n} from '@tanstack/hotkeys'\n\nfunction sequenceKey(sequence: Array<string>): string {\n return sequence.join('\|')\n}\n\ntype HotkeyListProps = {\n selectedId: () => string \| null\n setSelectedId: (id: string \| null) => void\n}\n\nfunction getTargetLabel(target: HTMLElement \| Document \| Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'window'\n }\n if (target instanceof HTMLElement) {\n return target.tagName.toLowerCase()\n }\n return 'element'\n}\n\nfunction getTargetTooltip(target: HTMLElement \| Document \| Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'Listening on document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'Listening on window'\n }\n if (target instanceof HTMLElement) {\n const tag = target.tagName.toLowerCase()\n const parts: Array<string> = [tag]\n if (target.id) {\n parts.push(`id=\"${target.id}\"`)\n }\n if (target.className) {\n const classes = target.className.split(/\\s+/).filter(Boolean).join(', ')\n parts.push(`class=\"${classes}\"`)\n }\n // Collect data- attributes\n const dataAttrs = Array.from(target.attributes)\n .filter((attr) => attr.name.startsWith('data-'))\n .map((attr) => `${attr.name}=\"${attr.value}\"`)\n if (dataAttrs.length > 0) {\n parts.push(...dataAttrs)\n }\n return `Listening on ${parts.join(' ')}`\n }\n return 'Listening on element'\n}\n\nfunction findTargetConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findScopeConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nfunction findSequenceTargetConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findSequenceScopeConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nexport function HotkeyList(props: HotkeyListProps) {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n\n const registrations = createMemo(() => state.registrations())\n const sequenceRegistrations = createMemo(() => state.sequenceRegistrations())\n\n return (\n <>\n <div class={styles().panelHeader}>Hotkeys ({registrations().length})</div>\n <div class={styles().hotkeyList}>\n <For each={registrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findTargetConflicts(reg, registrations())\n const scopeConflicts = () =>\n findScopeConflicts(reg, registrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: error)`,\n }\n }\n // 'warn' (default) or 'replace' (replacement already happened, but show warn-style if somehow present)\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same key on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n // Look up trigger count reactively from the registrations list\n // (reg is a stable object ref; the list re-derives on store change)\n const triggerCount = () =>\n registrations().find((r) => r.id === reg.id)?.triggerCount ??\n reg.triggerCount\n\n // Track trigger count changes for pulse animation\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatForDisplay(reg.hotkey)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled() ? 'Hotkey is enabled' : 'Hotkey is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n\n <div class={styles().panelHeader}>\n Sequences ({sequenceRegistrations().length})\n </div>\n <div class={styles().hotkeyList}>\n <For each={sequenceRegistrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findSequenceTargetConflicts(reg, sequenceRegistrations())\n const scopeConflicts = () =>\n findSequenceScopeConflicts(reg, sequenceRegistrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: error)`,\n }\n }\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same sequence on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n const triggerCount = () =>\n sequenceRegistrations().find((r) => r.id === reg.id)\n ?.triggerCount ?? reg.triggerCount\n\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatHotkeySequence(reg.sequence)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled()\n ? 'Sequence is enabled'\n : 'Sequence is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n </>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"HotkeyList.js","names":["For","Show","createEffect","createMemo","createSignal","on","clsx","formatForDisplay","useStyles","useHotkeysDevtoolsState","effectiveSequenceMatchedSteps","ConflictBehavior","HotkeyRegistration","SequenceRegistrationView","sequenceKey","sequence","Array","join","HotkeyListProps","selectedId","setSelectedId","id","getTargetLabel","target","HTMLElement","Document","Window","document","window","tagName","toLowerCase","getTargetTooltip","tag","parts","push","className","classes","split","filter","Boolean","dataAttrs","from","attributes","attr","name","startsWith","map","value","length","findTargetConflicts","registration","all","other","hotkey","options","eventType","findScopeConflicts","findSequenceTargetConflicts","findSequenceScopeConflicts","SequenceListRow","props","reg","getSequences","sequenceProgressNow","styles","sequenceRegistrations","targetConflicts","scopeConflicts","hasTargetConflict","hasScopeConflict","conflictBehavior","targetConflictBadge","behavior","c","style","const","label","tooltip","scopeConflictTooltip","enabled","liveSequenceReg","find","r","triggerCount","matchedSteps","prevCount","setPrevCount","pulsing","setPulsing","current","setTimeout","_el$","_tmpl$2","_el$2","firstChild","_el$5","nextSibling","_el$6","_el$7","_el$8","_el$9","_el$0","_el$10","_el$1","_el$11","_el$12","$$click","_$insert","_$createComponent","each","children","step","i","_el$13","_tmpl$3","_el$14","when","_$effect","_$className","sequenceStepMatched","undefined","_el$3","_tmpl$","_el$4","_c$","_$memo","_el$15","_tmpl$4","_el$16","_p$","_v$0","badge","_v$1","tooltipText","e","t","_c$2","_el$17","_tmpl$5","_el$18","_el$19","_v$10","badgeInfo","_v$11","_v$","hotkeyRow","hotkeyRowSelected","hotkeyRowTriggered","_v$2","hotkeyLabel","_v$3","hotkeyBadges","_v$4","badgeEnabled","badgeDisabled","_v$5","_v$6","badgeKeydown","badgeKeyup","_v$7","_v$8","badgeTarget","_v$9","a","o","n","s","h","HotkeyList","state","registrations","_el$20","_tmpl$6","_el$21","_el$23","_el$22","panelHeader","_el$24","_tmpl$7","_el$30","_el$31","_el$34","_el$35","_el$36","_el$37","_el$38","_el$39","_el$41","_el$40","_el$42","_el$43","_el$32","_el$33","_c$3","_el$44","_el$45","_v$21","_v$22","_c$4","_el$46","_el$47","_el$48","_v$23","_v$24","_v$12","_v$13","_v$14","_v$15","_v$16","_v$17","_v$18","_v$19","_v$20","hotkeyList","_el$25","_tmpl$8","_el$26","_el$28","_el$27","_el$29","_$delegateEvents"],"sources":["../../src/components/HotkeyList.tsx"],"sourcesContent":["import { For, Show, createEffect, createMemo, createSignal, on } from 'solid-js'\nimport clsx from 'clsx'\nimport { formatForDisplay } from '@tanstack/hotkeys'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport { effectiveSequenceMatchedSteps } from '../sequence-progress'\nimport type {\n ConflictBehavior,\n HotkeyRegistration,\n SequenceRegistrationView,\n} from '@tanstack/hotkeys'\n\nfunction sequenceKey(sequence: Array<string>): string {\n return sequence.join('\|')\n}\n\ntype HotkeyListProps = {\n selectedId: () => string \| null\n setSelectedId: (id: string \| null) => void\n}\n\nfunction getTargetLabel(target: HTMLElement \| Document \| Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'window'\n }\n if (target instanceof HTMLElement) {\n return target.tagName.toLowerCase()\n }\n return 'element'\n}\n\nfunction getTargetTooltip(target: HTMLElement \| Document \| Window): string {\n if (typeof document !== 'undefined' && target === document) {\n return 'Listening on document'\n }\n if (typeof window !== 'undefined' && target === window) {\n return 'Listening on window'\n }\n if (target instanceof HTMLElement) {\n const tag = target.tagName.toLowerCase()\n const parts: Array<string> = [tag]\n if (target.id) {\n parts.push(`id=\"${target.id}\"`)\n }\n if (target.className) {\n const classes = target.className.split(/\\s+/).filter(Boolean).join(', ')\n parts.push(`class=\"${classes}\"`)\n }\n // Collect data- attributes\n const dataAttrs = Array.from(target.attributes)\n .filter((attr) => attr.name.startsWith('data-'))\n .map((attr) => `${attr.name}=\"${attr.value}\"`)\n if (dataAttrs.length > 0) {\n parts.push(...dataAttrs)\n }\n return `Listening on ${parts.join(' ')}`\n }\n return 'Listening on element'\n}\n\nfunction findTargetConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findScopeConflicts(\n registration: HotkeyRegistration,\n all: Array<HotkeyRegistration>,\n): Array<HotkeyRegistration> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n other.hotkey === registration.hotkey &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nfunction findSequenceTargetConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target === registration.target,\n )\n}\n\nfunction findSequenceScopeConflicts(\n registration: SequenceRegistrationView,\n all: Array<SequenceRegistrationView>,\n): Array<SequenceRegistrationView> {\n return all.filter(\n (other) =>\n other.id !== registration.id &&\n sequenceKey(other.sequence) === sequenceKey(registration.sequence) &&\n other.options.eventType === registration.options.eventType &&\n other.target !== registration.target,\n )\n}\n\nfunction SequenceListRow(props: {\n reg: SequenceRegistrationView\n getSequences: () => Array<SequenceRegistrationView>\n sequenceProgressNow: () => number\n selectedId: () => string \| null\n setSelectedId: (id: string \| null) => void\n}) {\n const styles = useStyles()\n\n const sequenceRegistrations = () => props.getSequences()\n\n const targetConflicts = () =>\n findSequenceTargetConflicts(props.reg, sequenceRegistrations())\n const scopeConflicts = () =>\n findSequenceScopeConflicts(props.reg, sequenceRegistrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n props.reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same sequence and target (conflictBehavior: error)`,\n }\n }\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same sequence and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same sequence on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => props.reg.options.enabled !== false\n\n const liveSequenceReg = createMemo(\n () =>\n sequenceRegistrations().find((r) => r.id === props.reg.id) ?? props.reg,\n )\n\n const triggerCount = () =>\n sequenceRegistrations().find((r) => r.id === props.reg.id)?.triggerCount ??\n props.reg.triggerCount\n\n const matchedSteps = createMemo(() =>\n effectiveSequenceMatchedSteps(\n liveSequenceReg(),\n props.sequenceProgressNow(),\n ),\n )\n\n const [prevCount, setPrevCount] = createSignal(props.reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === props.reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(props.reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n <For each={liveSequenceReg().sequence}>\n {(step, i) => (\n <span>\n <Show when={i() > 0}> </Show>\n <span\n class={\n i() < matchedSteps()\n ? styles().sequenceStepMatched\n : undefined\n }\n >\n {formatForDisplay(step)}\n </span>\n </span>\n )}\n </For>\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(styles().badge, styles().badgeInfo, styles().tooltip)}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled() ? styles().badgeEnabled : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled() ? 'Sequence is enabled' : 'Sequence is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (props.reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {props.reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {props.reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(styles().badge, styles().badgeTarget, styles().tooltip)}\n >\n {getTargetLabel(props.reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(props.reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n}\n\nexport function HotkeyList(props: HotkeyListProps) {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n\n const registrations = createMemo(() => state.registrations())\n const sequenceRegistrations = createMemo(() => state.sequenceRegistrations())\n\n return (\n <>\n <div class={styles().panelHeader}>Hotkeys ({registrations().length})</div>\n <div class={styles().hotkeyList}>\n <For each={registrations()}>\n {(reg) => {\n const targetConflicts = () =>\n findTargetConflicts(reg, registrations())\n const scopeConflicts = () =>\n findScopeConflicts(reg, registrations())\n\n const hasTargetConflict = () => targetConflicts().length > 0\n const hasScopeConflict = () => scopeConflicts().length > 0\n\n const conflictBehavior = (): ConflictBehavior =>\n reg.options.conflictBehavior ?? 'warn'\n\n const targetConflictBadge = () => {\n const behavior = conflictBehavior()\n const c = targetConflicts()\n if (behavior === 'allow') {\n return {\n style: 'badgeAllow' as const,\n label: '~',\n tooltip: `Allowed: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: allow)`,\n }\n }\n if (behavior === 'error') {\n return {\n style: 'badgeError' as const,\n label: '!',\n tooltip: `Error: ${c.length} conflicting binding${c.length > 1 ? 's' : ''} on same key and target (conflictBehavior: error)`,\n }\n }\n // 'warn' (default) or 'replace' (replacement already happened, but show warn-style if somehow present)\n return {\n style: 'badgeConflict' as const,\n label: '!',\n tooltip: `Warning: ${c.length} other binding${c.length > 1 ? 's' : ''} on same key and target`,\n }\n }\n\n const scopeConflictTooltip = () => {\n const c = scopeConflicts()\n return `Info: ${c.length} binding${c.length > 1 ? 's' : ''} with same key on different target${c.length > 1 ? 's' : ''}`\n }\n\n const enabled = () => reg.options.enabled !== false\n\n // Look up trigger count reactively from the registrations list\n // (reg is a stable object ref; the list re-derives on store change)\n const triggerCount = () =>\n registrations().find((r) => r.id === reg.id)?.triggerCount ??\n reg.triggerCount\n\n // Track trigger count changes for pulse animation\n const [prevCount, setPrevCount] = createSignal(reg.triggerCount)\n const [pulsing, setPulsing] = createSignal(false)\n\n createEffect(\n on(triggerCount, (current) => {\n if (current > prevCount()) {\n setPulsing(true)\n setTimeout(() => setPulsing(false), 600)\n }\n setPrevCount(current)\n }),\n )\n\n return (\n <div\n class={clsx(\n styles().hotkeyRow,\n props.selectedId() === reg.id && styles().hotkeyRowSelected,\n pulsing() && styles().hotkeyRowTriggered,\n )}\n onClick={() => props.setSelectedId(reg.id)}\n >\n <span class={styles().hotkeyLabel}>\n {formatForDisplay(reg.hotkey)}\n </span>\n <Show when={triggerCount() > 0}>\n <span class={styles().triggerCount}>x{triggerCount()}</span>\n </Show>\n <div class={styles().hotkeyBadges}>\n {hasTargetConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles()[targetConflictBadge().style],\n styles().tooltip,\n )}\n >\n {targetConflictBadge().label}\n <span class={styles().tooltipText} data-tooltip>\n {targetConflictBadge().tooltip}\n </span>\n </span>\n )}\n {hasScopeConflict() && (\n <span\n class={clsx(\n styles().badge,\n styles().badgeInfo,\n styles().tooltip,\n )}\n >\n i\n <span class={styles().tooltipText} data-tooltip>\n {scopeConflictTooltip()}\n </span>\n </span>\n )}\n <span\n class={clsx(\n styles().badge,\n enabled()\n ? styles().badgeEnabled\n : styles().badgeDisabled,\n styles().tooltip,\n )}\n >\n {enabled() ? 'on' : 'off'}\n <span class={styles().tooltipText} data-tooltip>\n {enabled() ? 'Hotkey is enabled' : 'Hotkey is disabled'}\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n (reg.options.eventType ?? 'keydown') === 'keydown'\n ? styles().badgeKeydown\n : styles().badgeKeyup,\n styles().tooltip,\n )}\n >\n {reg.options.eventType ?? 'keydown'}\n <span class={styles().tooltipText} data-tooltip>\n Fires on {reg.options.eventType ?? 'keydown'} event\n </span>\n </span>\n <span\n class={clsx(\n styles().badge,\n styles().badgeTarget,\n styles().tooltip,\n )}\n >\n {getTargetLabel(reg.target)}\n <span class={styles().tooltipText} data-tooltip>\n {getTargetTooltip(reg.target)}\n </span>\n </span>\n </div>\n </div>\n )\n }}\n </For>\n </div>\n\n <div class={styles().panelHeader}>\n Sequences ({sequenceRegistrations().length})\n </div>\n <div class={styles().hotkeyList}>\n <For each={sequenceRegistrations()}>\n {(reg) => (\n <SequenceListRow\n reg={reg}\n getSequences={sequenceRegistrations}\n sequenceProgressNow={state.sequenceProgressNow}\n selectedId={props.selectedId}\n setSelectedId={props.setSelectedId}\n />\n )}\n </For>\n </div>\n </>\n )\n}\n"],"mappings":"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"}

package/dist/components/Shell.js CHANGED Viewed

@@ -3,18 +3,33 @@ import { useStyles } from "../styles/use-styles.js";
 import { HeldKeysBar } from "./HeldKeysTopbar.js";
 import { HotkeyList } from "./HotkeyList.js";
 import { DetailsPanel } from "./DetailsPanel.js";
-import { className, createComponent, delegateEvents, effect, insert, setStyleProperty, template } from "solid-js/web";
+import { className, createComponent, delegateEvents, effect, insert, setStyleProperty, style, template, use } from "solid-js/web";
 import { Header, HeaderLogo, MainPanel } from "@tanstack/devtools-ui";
-import { createMemo, createSignal, onCleanup, onMount } from "solid-js";
+import { createEffect, createMemo, createSignal, onCleanup, onMount } from "solid-js";
 //#region src/components/Shell.tsx
-var _tmpl$ = /* @__PURE__ */ template(`<div><div><div style=min-width:150px;max-width:800px></div><div></div><div style=flex:1><div>Details`);
+var _tmpl$ = /* @__PURE__ */ template(`<div><div><div style=min-width:150px;max-width:800px><div></div></div><div></div><div style=flex:1><div>Details`), _tmpl$2 = /* @__PURE__ */ template(`<div>`);
+function readResizeObserverBlockSize(entry) {
+	const [box] = entry.borderBoxSize;
+	if (box !== void 0) return box.blockSize;
+	return entry.contentRect.height;
+}
+/** TanStack devtools plugin pane; percentage heights break without this. */
+function resolvePluginHost(el) {
+	const found = el.closest("[id^=\"plugin-container-\"]");
+	if (found instanceof HTMLElement) return found;
+	let n = el;
+	for (let i = 0; i < 3 && n; i++) n = n.parentElement;
+	return n;
+}
 function Shell() {
 	const styles = useStyles();
 	const state = useHotkeysDevtoolsState();
 	const [selectedId, setSelectedId] = createSignal(null);
 	const [leftPanelWidth, setLeftPanelWidth] = createSignal(300);
 	const [isDragging, setIsDragging] = createSignal(false);
+	const [shellRootEl, setShellRootEl] = createSignal(null);
+	const [slotHeightPx, setSlotHeightPx] = createSignal(void 0);
 	const selectedRegistration = createMemo(() => {
 		const id = selectedId();
 		if (!id) return null;
@@ -52,46 +67,88 @@ function Shell() {
 		document.removeEventListener("mousemove", handleMouseMove);
 		document.removeEventListener("mouseup", handleMouseUp);
 	});
-	return createComponent(MainPanel, { get children() {
-		return [createComponent(Header, { get children() {
-			return createComponent(HeaderLogo, {
-				flavor: {
-					light: "oklch(51.4% 0.222 16.935)",
-					dark: "oklch(58.6% 0.253 17.585)"
-				},
-				children: "TanStack Hotkeys"
-			});
-		} }), (() => {
-			var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.firstChild;
-			insert(_el$, createComponent(HeldKeysBar, {}), _el$2);
-			insert(_el$3, createComponent(HotkeyList, {
-				selectedId,
-				setSelectedId
-			}));
-			_el$4.$$mousedown = handleMouseDown;
-			insert(_el$5, createComponent(DetailsPanel, { selectedRegistration }), null);
-			effect((_p$) => {
-				var _v$ = styles().mainContainer, _v$2 = styles().panelsContainer, _v$3 = styles().leftPanel, _v$4 = `${leftPanelWidth()}px`, _v$5 = `${styles().dragHandle} ${isDragging() ? "dragging" : ""}`, _v$6 = styles().rightPanel, _v$7 = styles().panelHeader;
-				_v$ !== _p$.e && className(_el$, _p$.e = _v$);
-				_v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
-				_v$3 !== _p$.a && className(_el$3, _p$.a = _v$3);
-				_v$4 !== _p$.o && setStyleProperty(_el$3, "width", _p$.o = _v$4);
-				_v$5 !== _p$.i && className(_el$4, _p$.i = _v$5);
-				_v$6 !== _p$.n && className(_el$5, _p$.n = _v$6);
-				_v$7 !== _p$.s && className(_el$6, _p$.s = _v$7);
-				return _p$;
-			}, {
-				e: void 0,
-				t: void 0,
-				a: void 0,
-				o: void 0,
-				i: void 0,
-				n: void 0,
-				s: void 0
-			});
-			return _el$;
-		})()];
-	} });
+	createEffect(() => {
+		const el = shellRootEl();
+		if (!el || typeof ResizeObserver === "undefined") return;
+		const pluginHost = resolvePluginHost(el);
+		if (!pluginHost) return;
+		const applyHeight = (entry) => {
+			const clientH = pluginHost.clientHeight;
+			const fromObserver = entry !== void 0 ? readResizeObserverBlockSize(entry) : 0;
+			const h = clientH > 0 ? clientH : fromObserver;
+			if (h > 0) setSlotHeightPx(Math.round(h));
+		};
+		applyHeight();
+		const ro = new ResizeObserver((entries) => {
+			applyHeight(entries[0]);
+		});
+		ro.observe(pluginHost);
+		onCleanup(() => ro.disconnect());
+	});
+	return (() => {
+		var _el$ = _tmpl$2();
+		use((el) => setShellRootEl(el), _el$);
+		insert(_el$, createComponent(MainPanel, {
+			get ["class"]() {
+				return styles().mainPanelShell;
+			},
+			get children() {
+				return [createComponent(Header, { get children() {
+					return createComponent(HeaderLogo, {
+						flavor: {
+							light: "oklch(51.4% 0.222 16.935)",
+							dark: "oklch(58.6% 0.253 17.585)"
+						},
+						children: "TanStack Hotkeys"
+					});
+				} }), (() => {
+					var _el$2 = _tmpl$(), _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$4.nextSibling, _el$7 = _el$6.nextSibling, _el$8 = _el$7.firstChild;
+					insert(_el$2, createComponent(HeldKeysBar, {}), _el$3);
+					insert(_el$5, createComponent(HotkeyList, {
+						selectedId,
+						setSelectedId
+					}));
+					_el$6.$$mousedown = handleMouseDown;
+					insert(_el$7, createComponent(DetailsPanel, { selectedRegistration }), null);
+					effect((_p$) => {
+						var _v$ = styles().mainContainer, _v$2 = styles().panelsContainer, _v$3 = styles().leftPanel, _v$4 = `${leftPanelWidth()}px`, _v$5 = styles().leftPanelScroll, _v$6 = `${styles().dragHandle} ${isDragging() ? "dragging" : ""}`, _v$7 = styles().rightPanel, _v$8 = styles().panelHeader;
+						_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
+						_v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
+						_v$3 !== _p$.a && className(_el$4, _p$.a = _v$3);
+						_v$4 !== _p$.o && setStyleProperty(_el$4, "width", _p$.o = _v$4);
+						_v$5 !== _p$.i && className(_el$5, _p$.i = _v$5);
+						_v$6 !== _p$.n && className(_el$6, _p$.n = _v$6);
+						_v$7 !== _p$.s && className(_el$7, _p$.s = _v$7);
+						_v$8 !== _p$.h && className(_el$8, _p$.h = _v$8);
+						return _p$;
+					}, {
+						e: void 0,
+						t: void 0,
+						a: void 0,
+						o: void 0,
+						i: void 0,
+						n: void 0,
+						s: void 0,
+						h: void 0
+					});
+					return _el$2;
+				})()];
+			}
+		}));
+		effect((_p$) => {
+			var _v$9 = styles().shellRoot, _v$0 = { ...slotHeightPx() !== void 0 ? {
+				height: `${slotHeightPx()}px`,
+				"max-height": `${slotHeightPx()}px`
+			} : {} };
+			_v$9 !== _p$.e && className(_el$, _p$.e = _v$9);
+			_p$.t = style(_el$, _v$0, _p$.t);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0
+		});
+		return _el$;
+	})();
 }
 delegateEvents(["mousedown"]);

package/dist/components/Shell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Shell.js","names":["createMemo","createSignal","onCleanup","onMount","Header","HeaderLogo","MainPanel","useStyles","useHotkeysDevtoolsState","HeldKeysBar","HotkeyList","DetailsPanel","Shell","styles","state","selectedId","setSelectedId","leftPanelWidth","setLeftPanelWidth","isDragging","setIsDragging","selectedRegistration","id","hotkey","registrations","find","r","sequence","sequenceRegistrations","dragStartX","dragStartWidth","handleMouseDown","e","MouseEvent","preventDefault","stopPropagation","document","body","style","cursor","userSelect","clientX","handleMouseMove","deltaX","newWidth","Math","max","min","handleMouseUp","addEventListener","removeEventListener","_$createComponent","children","flavor","light","dark","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","_el$6","_$insert","$$mousedown","_$effect","_p$","_v$","mainContainer","_v$2","panelsContainer","_v$3","leftPanel","_v$4","_v$5","dragHandle","_v$6","rightPanel","_v$7","panelHeader","_$className","t","a","o","_$setStyleProperty","i","n","s","undefined","_$delegateEvents"],"sources":["../../src/components/Shell.tsx"],"sourcesContent":["import { createMemo, createSignal, onCleanup, onMount } from 'solid-js'\nimport { Header, HeaderLogo, MainPanel } from '@tanstack/devtools-ui'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport { HeldKeysBar } from './HeldKeysTopbar'\nimport { HotkeyList } from './HotkeyList'\nimport { DetailsPanel } from './DetailsPanel'\n\nexport function Shell() {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n const [selectedId, setSelectedId] = createSignal<string \| null>(null)\n const [leftPanelWidth, setLeftPanelWidth] = createSignal(300)\n const [isDragging, setIsDragging] = createSignal(false)\n\n const selectedRegistration = createMemo(() => {\n const id = selectedId()\n if (!id) return null\n const hotkey = state.registrations().find((r) => r.id === id)\n if (hotkey) return hotkey\n const sequence = state.sequenceRegistrations().find((r) => r.id === id)\n return sequence ?? null\n })\n\n let dragStartX = 0\n let dragStartWidth = 0\n\n const handleMouseDown = (e: MouseEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setIsDragging(true)\n document.body.style.cursor = 'col-resize'\n document.body.style.userSelect = 'none'\n dragStartX = e.clientX\n dragStartWidth = leftPanelWidth()\n }\n\n const handleMouseMove = (e: MouseEvent) => {\n if (!isDragging()) return\n\n e.preventDefault()\n const deltaX = e.clientX - dragStartX\n const newWidth = Math.max(150, Math.min(800, dragStartWidth + deltaX))\n setLeftPanelWidth(newWidth)\n }\n\n const handleMouseUp = () => {\n setIsDragging(false)\n document.body.style.cursor = ''\n document.body.style.userSelect = ''\n }\n\n onMount(() => {\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n })\n\n onCleanup(() => {\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n })\n\n return (\n <MainPanel>\n <Header>\n <HeaderLogo\n flavor={{\n light: 'oklch(51.4% 0.222 16.935)',\n dark: 'oklch(58.6% 0.253 17.585)',\n }}\n >\n TanStack Hotkeys\n </HeaderLogo>\n </Header>\n\n <div class={styles().mainContainer}>\n <HeldKeysBar />\n\n <div class={styles().panelsContainer}>\n <div\n class={styles().leftPanel}\n style={{\n width: `${leftPanelWidth()}px`,\n 'min-width': '150px',\n 'max-width': '800px',\n }}\n >\n <HotkeyList selectedId={selectedId} setSelectedId={setSelectedId} />\n </div>\n\n <div\n class={`${styles().dragHandle} ${isDragging() ? 'dragging' : ''}`}\n onMouseDown={handleMouseDown}\n />\n\n <div class={styles().rightPanel} style={{ flex: 1 }}>\n <div class={styles().panelHeader}>Details</div>\n <DetailsPanel selectedRegistration={selectedRegistration} />\n </div>\n </div>\n </div>\n </MainPanel>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"Shell.js","names":["createEffect","createMemo","createSignal","onCleanup","onMount","Header","HeaderLogo","MainPanel","useStyles","useHotkeysDevtoolsState","HeldKeysBar","HotkeyList","DetailsPanel","readResizeObserverBlockSize","entry","ResizeObserverEntry","box","borderBoxSize","undefined","blockSize","contentRect","height","resolvePluginHost","el","HTMLElement","found","closest","n","i","parentElement","Shell","styles","state","selectedId","setSelectedId","leftPanelWidth","setLeftPanelWidth","isDragging","setIsDragging","shellRootEl","setShellRootEl","slotHeightPx","setSlotHeightPx","selectedRegistration","id","hotkey","registrations","find","r","sequence","sequenceRegistrations","dragStartX","dragStartWidth","handleMouseDown","e","MouseEvent","preventDefault","stopPropagation","document","body","style","cursor","userSelect","clientX","handleMouseMove","deltaX","newWidth","Math","max","min","handleMouseUp","addEventListener","removeEventListener","ResizeObserver","pluginHost","applyHeight","clientH","clientHeight","fromObserver","h","round","ro","entries","observe","disconnect","_el$","_tmpl$2","_$use","_$insert","_$createComponent","class","mainPanelShell","children","flavor","light","dark","_el$2","_tmpl$","_el$3","firstChild","_el$4","_el$5","_el$6","nextSibling","_el$7","_el$8","$$mousedown","_$effect","_p$","_v$","mainContainer","_v$2","panelsContainer","_v$3","leftPanel","_v$4","_v$5","leftPanelScroll","_v$6","dragHandle","_v$7","rightPanel","_v$8","panelHeader","_$className","t","a","o","_$setStyleProperty","s","_v$9","shellRoot","_v$0","_$style","_$delegateEvents"],"sources":["../../src/components/Shell.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n onCleanup,\n onMount,\n} from 'solid-js'\nimport { Header, HeaderLogo, MainPanel } from '@tanstack/devtools-ui'\nimport { useStyles } from '../styles/use-styles'\nimport { useHotkeysDevtoolsState } from '../HotkeysContextProvider'\nimport { HeldKeysBar } from './HeldKeysTopbar'\nimport { HotkeyList } from './HotkeyList'\nimport { DetailsPanel } from './DetailsPanel'\n\nfunction readResizeObserverBlockSize(entry: ResizeObserverEntry): number {\n const [box] = entry.borderBoxSize\n if (box !== undefined) return box.blockSize\n return entry.contentRect.height\n}\n\n/** TanStack devtools plugin pane; percentage heights break without this. */\nfunction resolvePluginHost(el: HTMLElement): HTMLElement \| null {\n const found = el.closest('[id^=\"plugin-container-\"]')\n if (found instanceof HTMLElement) return found\n let n: HTMLElement \| null = el\n for (let i = 0; i < 3 && n; i++) {\n n = n.parentElement\n }\n return n\n}\n\nexport function Shell() {\n const styles = useStyles()\n const state = useHotkeysDevtoolsState()\n const [selectedId, setSelectedId] = createSignal<string \| null>(null)\n const [leftPanelWidth, setLeftPanelWidth] = createSignal(300)\n const [isDragging, setIsDragging] = createSignal(false)\n const [shellRootEl, setShellRootEl] = createSignal<HTMLElement \| null>(null)\n const [slotHeightPx, setSlotHeightPx] = createSignal<number \| undefined>(\n undefined,\n )\n\n const selectedRegistration = createMemo(() => {\n const id = selectedId()\n if (!id) return null\n const hotkey = state.registrations().find((r) => r.id === id)\n if (hotkey) return hotkey\n const sequence = state.sequenceRegistrations().find((r) => r.id === id)\n return sequence ?? null\n })\n\n let dragStartX = 0\n let dragStartWidth = 0\n\n const handleMouseDown = (e: MouseEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setIsDragging(true)\n document.body.style.cursor = 'col-resize'\n document.body.style.userSelect = 'none'\n dragStartX = e.clientX\n dragStartWidth = leftPanelWidth()\n }\n\n const handleMouseMove = (e: MouseEvent) => {\n if (!isDragging()) return\n\n e.preventDefault()\n const deltaX = e.clientX - dragStartX\n const newWidth = Math.max(150, Math.min(800, dragStartWidth + deltaX))\n setLeftPanelWidth(newWidth)\n }\n\n const handleMouseUp = () => {\n setIsDragging(false)\n document.body.style.cursor = ''\n document.body.style.userSelect = ''\n }\n\n onMount(() => {\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n })\n\n onCleanup(() => {\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n })\n\n createEffect(() => {\n const el = shellRootEl()\n if (!el \|\| typeof ResizeObserver === 'undefined') return\n const pluginHost = resolvePluginHost(el)\n if (!pluginHost) return\n\n const applyHeight = (entry?: ResizeObserverEntry) => {\n const clientH = pluginHost.clientHeight\n const fromObserver =\n entry !== undefined ? readResizeObserverBlockSize(entry) : 0\n const h = clientH > 0 ? clientH : fromObserver\n if (h > 0) setSlotHeightPx(Math.round(h))\n }\n\n applyHeight()\n const ro = new ResizeObserver((entries) => {\n applyHeight(entries[0])\n })\n ro.observe(pluginHost)\n onCleanup(() => ro.disconnect())\n })\n\n return (\n <div\n ref={(el) => setShellRootEl(el)}\n class={styles().shellRoot}\n style={{\n ...(slotHeightPx() !== undefined\n ? {\n height: `${slotHeightPx()}px`,\n 'max-height': `${slotHeightPx()}px`,\n }\n : {}),\n }}\n >\n <MainPanel class={styles().mainPanelShell}>\n <Header>\n <HeaderLogo\n flavor={{\n light: 'oklch(51.4% 0.222 16.935)',\n dark: 'oklch(58.6% 0.253 17.585)',\n }}\n >\n TanStack Hotkeys\n </HeaderLogo>\n </Header>\n\n <div class={styles().mainContainer}>\n <HeldKeysBar />\n\n <div class={styles().panelsContainer}>\n <div\n class={styles().leftPanel}\n style={{\n width: `${leftPanelWidth()}px`,\n 'min-width': '150px',\n 'max-width': '800px',\n }}\n >\n <div class={styles().leftPanelScroll}>\n <HotkeyList\n selectedId={selectedId}\n setSelectedId={setSelectedId}\n />\n </div>\n </div>\n\n <div\n class={`${styles().dragHandle} ${isDragging() ? 'dragging' : ''}`}\n onMouseDown={handleMouseDown}\n />\n\n <div class={styles().rightPanel} style={{ flex: 1 }}>\n <div class={styles().panelHeader}>Details</div>\n <DetailsPanel selectedRegistration={selectedRegistration} />\n </div>\n </div>\n </div>\n </MainPanel>\n </div>\n )\n}\n"],"mappings":"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"}

package/dist/sequence-progress.js ADDED Viewed

@@ -0,0 +1,20 @@
+import { DEFAULT_SEQUENCE_TIMEOUT } from "@tanstack/hotkeys";
+//#region src/sequence-progress.ts
+/**
+* Matched step count for UI, accounting for inter-key timeout even if the
+* manager has not processed another event yet.
+*/
+function effectiveSequenceMatchedSteps(reg, now) {
+	const timeout = reg.options.timeout ?? DEFAULT_SEQUENCE_TIMEOUT;
+	if (reg.matchedStepCount <= 0 || reg.partialMatchLastKeyTime <= 0 || now - reg.partialMatchLastKeyTime > timeout) return 0;
+	return reg.matchedStepCount;
+}
+/** Whether the devtools should run a short interval to refresh sequence progress UI. */
+function needsSequenceProgressClock(regs, now) {
+	return regs.some((reg) => effectiveSequenceMatchedSteps(reg, now) > 0);
+}
+//#endregion
+export { effectiveSequenceMatchedSteps, needsSequenceProgressClock };
+//# sourceMappingURL=sequence-progress.js.map

package/dist/sequence-progress.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"sequence-progress.js","names":[],"sources":["../src/sequence-progress.ts"],"sourcesContent":["import { DEFAULT_SEQUENCE_TIMEOUT } from '@tanstack/hotkeys'\nimport type { SequenceRegistrationView } from '@tanstack/hotkeys'\n\n/**\n * Matched step count for UI, accounting for inter-key timeout even if the\n * manager has not processed another event yet.\n */\nexport function effectiveSequenceMatchedSteps(\n reg: SequenceRegistrationView,\n now: number,\n): number {\n const timeout = reg.options.timeout ?? DEFAULT_SEQUENCE_TIMEOUT\n if (\n reg.matchedStepCount <= 0 ||\n reg.partialMatchLastKeyTime <= 0 ||\n now - reg.partialMatchLastKeyTime > timeout\n ) {\n return 0\n }\n return reg.matchedStepCount\n}\n\n/** Whether the devtools should run a short interval to refresh sequence progress UI. */\nexport function needsSequenceProgressClock(\n regs: Array<SequenceRegistrationView>,\n now: number,\n): boolean {\n return regs.some((reg) => effectiveSequenceMatchedSteps(reg, now) > 0)\n}\n"],"mappings":";;;;;;;AAOA,SAAgB,8BACd,KACA,KACQ;CACR,MAAM,UAAU,IAAI,QAAQ,WAAW;AACvC,KACE,IAAI,oBAAoB,KACxB,IAAI,2BAA2B,KAC/B,MAAM,IAAI,0BAA0B,QAEpC,QAAO;AAET,QAAO,IAAI;;;AAIb,SAAgB,2BACd,MACA,KACS;AACT,QAAO,KAAK,MAAM,QAAQ,8BAA8B,KAAK,IAAI,GAAG,EAAE"}

package/dist/styles/use-styles.js CHANGED Viewed

@@ -10,9 +10,28 @@ const stylesFactory = (theme) => {
 	const css = goober.css;
 	const t = (light, dark) => theme === "light" ? light : dark;
 	return {
+		shellRoot: css`
+      display: flex;
+      flex-direction: column;
+      min-height: 0;
+      height: 100%;
+      flex: 1;
+      overflow: hidden;
+    `,
+		mainPanelShell: css`
+      display: flex;
+      flex-direction: column;
+      flex: 1 1 0%;
+      min-height: 0;
+      height: auto;
+      overflow: hidden !important;
+    `,
 		mainContainer: css`
       display: flex;
       flex-direction: column;
+      flex: 1 1 0%;
+      min-height: 0;
+      overflow: hidden;
       padding: ${size[2]};
       padding-top: 0;
       margin-top: ${size[2]};
@@ -47,6 +66,10 @@ const stylesFactory = (theme) => {
     `,
 		panelsContainer: css`
       display: flex;
+      flex: 1 1 0%;
+      min-height: 0;
+      overflow: hidden;
+      align-items: stretch;
     `,
 		dragHandle: css`
       width: 8px;
@@ -129,6 +152,13 @@ const stylesFactory = (theme) => {
       display: flex;
       flex-direction: column;
       flex-shrink: 0;
+      min-height: 0;
+      min-width: 0;
+    `,
+		leftPanelScroll: css`
+      flex: 1;
+      min-height: 0;
+      overflow-y: auto;
     `,
 		rightPanel: css`
       background: ${t(colors.gray[100], colors.darkGray[800])};
@@ -137,6 +167,9 @@ const stylesFactory = (theme) => {
       display: flex;
       flex-direction: column;
       flex: 1;
+      min-height: 0;
+      min-width: 0;
+      overflow: hidden;
     `,
 		panelHeader: css`
       font-size: ${fontSize.md};
@@ -197,6 +230,10 @@ const stylesFactory = (theme) => {
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
+    `,
+		sequenceStepMatched: css`
+      font-weight: ${font.weight.bold};
+      color: ${t(colors.blue[700], colors.blue[300])};
     `,
 		hotkeyBadges: css`
       display: flex;
@@ -250,6 +287,11 @@ const stylesFactory = (theme) => {
       background: ${t(colors.blue[100], colors.blue[900] + alpha[30])};
     `,
 		stateDetails: css`
+      display: flex;
+      flex-direction: column;
+      flex: 1;
+      min-height: 0;
+      overflow-y: auto;
       padding: ${size[2]};
     `,
 		stateHeader: css`
@@ -378,6 +420,11 @@ const stylesFactory = (theme) => {
       box-shadow: ${tokens.shadow.sm()};
       text-transform: capitalize;
       white-space: nowrap;
+    `,
+		keyCapLargeInProgress: css`
+      border-color: ${t(colors.blue[500], colors.blue[400])};
+      color: ${t(colors.blue[900], colors.blue[200])};
+      background: ${t(colors.blue[50], colors.darkGray[500])};
     `,
 		conflictList: css`
       display: flex;

package/dist/styles/use-styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-styles.js","names":[],"sources":["../../src/styles/use-styles.ts"],"sourcesContent":["import * as goober from 'goober'\nimport { createEffect, createSignal } from 'solid-js'\nimport { useTheme } from '@tanstack/devtools-ui'\nimport { tokens } from './tokens'\n\nconst stylesFactory = (theme: 'light' \| 'dark') => {\n const { colors, font, size, alpha, border } = tokens\n const { fontFamily, size: fontSize } = font\n const css = goober.css\n const t = (light: string, dark: string) => (theme === 'light' ? light : dark)\n\n return {\n mainContainer: css`\n display: flex;\n flex-direction: column;\n padding: ${size[2]};\n padding-top: 0;\n margin-top: ${size[2]};\n `,\n heldKeysBar: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n align-items: center;\n gap: ${size[3]};\n padding: ${size[3]} ${size[3]};\n flex-shrink: 0;\n min-height: 64px;\n margin-bottom: ${size[2]};\n `,\n heldKeysBarHeader: css`\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[600], colors.gray[400])};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n flex-shrink: 0;\n `,\n heldKeysBarList: css`\n display: flex;\n align-items: center;\n gap: ${size[1.5]};\n flex-wrap: wrap;\n flex: 1;\n min-width: 0;\n `,\n panelsContainer: css`\n display: flex;\n `,\n dragHandle: css`\n width: 8px;\n background: ${t(colors.gray[300], colors.darkGray[600])};\n cursor: col-resize;\n position: relative;\n transition: all 0.2s ease;\n user-select: none;\n pointer-events: all;\n margin: 0 ${size[1]};\n border-radius: 2px;\n\n &:hover {\n background: ${t(colors.blue[600], colors.blue[500])};\n margin: 0 ${size[1]};\n }\n\n &.dragging {\n background: ${t(colors.blue[700], colors.blue[600])};\n margin: 0 ${size[1]};\n }\n\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 2px;\n height: 20px;\n background: ${t(colors.gray[400], colors.darkGray[400])};\n border-radius: 1px;\n pointer-events: none;\n }\n\n &:hover::after,\n &.dragging::after {\n background: ${t(colors.blue[500], colors.blue[300])};\n }\n `,\n keyCap: css`\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n padding: ${size[1]} ${size[2]};\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[100])};\n background: ${t(colors.white, colors.darkGray[600])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[400])};\n border-bottom-width: 2px;\n border-radius: ${border.radius.sm};\n box-shadow: ${tokens.shadow.xs()};\n text-transform: capitalize;\n white-space: nowrap;\n line-height: 1.2;\n `,\n keyCapCode: css`\n font-size: ${fontSize['2xs']};\n font-weight: ${font.weight.normal};\n color: ${t(colors.gray[500], colors.gray[400])};\n text-transform: none;\n line-height: 1;\n margin-top: 2px;\n `,\n noKeysHeld: css`\n font-size: ${fontSize.sm};\n color: ${t(colors.gray[400], colors.gray[600])};\n font-style: italic;\n text-align: center;\n padding: ${size[1]};\n `,\n leftPanel: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n `,\n rightPanel: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n flex-direction: column;\n flex: 1;\n `,\n panelHeader: css`\n font-size: ${fontSize.md};\n font-weight: ${font.weight.bold};\n color: ${t(colors.blue[700], colors.blue[400])};\n padding: ${size[2]};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n background: ${t(colors.gray[100], colors.darkGray[800])};\n flex-shrink: 0;\n `,\n hotkeyList: css`\n padding: ${size[1]};\n `,\n hotkeyRow: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${size[2]};\n margin-bottom: ${size[1]};\n background: ${t(colors.gray[200], colors.darkGray[700])};\n border-radius: ${border.radius.md};\n cursor: pointer;\n transition: all 0.2s ease;\n border: 1px solid transparent;\n\n &:hover {\n background: ${t(colors.gray[300], colors.darkGray[600])};\n border-color: ${t(colors.gray[400], colors.darkGray[500])};\n }\n `,\n hotkeyRowSelected: css`\n background: ${t(colors.blue[100], colors.blue[900] + alpha[20])};\n border-color: ${t(colors.blue[600], colors.blue[500])};\n box-shadow: 0 0 0 1px\n ${t(colors.blue[600] + alpha[30], colors.blue[500] + alpha[30])};\n `,\n hotkeyRowTriggered: css`\n animation: hotkey-pulse 0.6s ease-out;\n\n @keyframes hotkey-pulse {\n 0% {\n border-color: ${t(colors.blue[500], colors.blue[400])};\n box-shadow: 0 0 0 2px\n ${t(colors.blue[500] + alpha[40], colors.blue[400] + alpha[40])};\n }\n 100% {\n border-color: transparent;\n box-shadow: 0 0 0 0px\n ${t(colors.blue[500] + '00', colors.blue[400] + '00')};\n }\n }\n `,\n hotkeyLabel: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[900], colors.gray[100])};\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n hotkeyBadges: css`\n display: flex;\n gap: ${size[1]};\n margin-left: ${size[1]};\n flex-shrink: 0;\n overflow: visible;\n `,\n badge: css`\n font-size: ${fontSize['2xs']};\n padding: ${size[0.5]} ${size[1]};\n border-radius: ${border.radius.sm};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n white-space: nowrap;\n `,\n badgeEnabled: css`\n color: ${t(colors.green[700], colors.green[400])};\n background: ${t(colors.green[100], colors.green[900] + alpha[30])};\n `,\n badgeDisabled: css`\n color: ${t(colors.red[700], colors.red[400])};\n background: ${t(colors.red[100], colors.red[900] + alpha[30])};\n `,\n badgeKeydown: css`\n color: ${t(colors.purple[700], colors.purple[400])};\n background: ${t(colors.purple[100], colors.purple[900] + alpha[30])};\n `,\n badgeKeyup: css`\n color: ${t(colors.teal[700], colors.teal[400])};\n background: ${t(colors.teal[100], colors.teal[900] + alpha[30])};\n `,\n badgeTarget: css`\n color: ${t(colors.gray[700], colors.gray[300])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n `,\n badgeConflict: css`\n color: ${t(colors.yellow[700], colors.yellow[400])};\n background: ${t(colors.yellow[100], colors.yellow[900] + alpha[30])};\n `,\n badgeError: css`\n color: ${t(colors.red[700], colors.red[400])};\n background: ${t(colors.red[100], colors.red[900] + alpha[30])};\n `,\n badgeAllow: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n `,\n badgeInfo: css`\n color: ${t(colors.blue[700], colors.blue[400])};\n background: ${t(colors.blue[100], colors.blue[900] + alpha[30])};\n `,\n stateDetails: css`\n padding: ${size[2]};\n `,\n stateHeader: css`\n margin-bottom: ${size[2]};\n padding-bottom: ${size[2]};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n `,\n stateTitle: css`\n font-size: ${fontSize.md};\n font-weight: ${font.weight.bold};\n color: ${t(colors.blue[700], colors.blue[400])};\n margin-bottom: ${size[1]};\n `,\n detailsGrid: css`\n display: grid;\n grid-template-columns: 1fr;\n gap: ${size[2]};\n align-items: start;\n `,\n detailSection: css`\n background: ${t(colors.white, colors.darkGray[700])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[600])};\n border-radius: ${border.radius.md};\n padding: ${size[2]};\n `,\n detailSectionHeader: css`\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[200])};\n margin-bottom: ${size[1]};\n text-transform: uppercase;\n letter-spacing: 0.04em;\n `,\n infoGrid: css`\n display: grid;\n grid-template-columns: auto 1fr;\n gap: ${size[1]};\n row-gap: ${size[1]};\n align-items: center;\n `,\n infoLabel: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n font-size: ${fontSize.xs};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n `,\n infoValueMono: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[900], colors.gray[100])};\n word-break: break-all;\n `,\n actionsRow: css`\n display: flex;\n flex-wrap: wrap;\n gap: ${size[2]};\n `,\n actionButton: css`\n display: inline-flex;\n align-items: center;\n gap: ${size[1]};\n padding: ${size[1]} ${size[2]};\n border-radius: ${border.radius.md};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[500])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n color: ${t(colors.gray[900], colors.gray[100])};\n font-size: ${fontSize.xs};\n cursor: pointer;\n user-select: none;\n transition:\n background 0.15s,\n border-color 0.15s;\n &:hover {\n background: ${t(colors.gray[300], colors.darkGray[500])};\n border-color: ${t(colors.gray[400], colors.darkGray[400])};\n }\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n &:hover {\n background: ${t(colors.gray[200], colors.darkGray[600])};\n border-color: ${t(colors.gray[300], colors.darkGray[500])};\n }\n }\n `,\n actionDotGreen: css`\n width: 6px;\n height: 6px;\n border-radius: 9999px;\n background: ${colors.green[400]};\n `,\n noSelection: css`\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${t(colors.gray[500], colors.gray[500])};\n font-style: italic;\n text-align: center;\n padding: ${size[4]};\n `,\n keyBreakdown: css`\n display: flex;\n flex-wrap: wrap;\n gap: ${size[1]};\n align-items: center;\n `,\n keyBreakdownPlus: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: ${fontSize.sm};\n `,\n keyCapLarge: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n padding: ${size[1]} ${size[2]};\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[100])};\n background: ${t(colors.white, colors.darkGray[600])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[400])};\n border-bottom-width: 3px;\n border-radius: ${border.radius.md};\n box-shadow: ${tokens.shadow.sm()};\n text-transform: capitalize;\n white-space: nowrap;\n `,\n conflictList: css`\n display: flex;\n flex-direction: column;\n gap: ${size[1]};\n `,\n conflictItem: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.yellow[700], colors.yellow[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.yellow[50], colors.yellow[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.yellow[200], colors.yellow[800] + alpha[30])};\n `,\n conflictItemAllow: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[600], colors.gray[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.gray[100], colors.darkGray[700])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[600])};\n `,\n conflictItemError: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.red[700], colors.red[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.red[50], colors.red[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.red[200], colors.red[900] + alpha[30])};\n `,\n conflictItemScope: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.blue[700], colors.blue[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.blue[50], colors.blue[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.blue[200], colors.blue[800] + alpha[30])};\n `,\n optionRow: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${size[1]} 0;\n font-size: ${fontSize.xs};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[600])};\n &:last-child {\n border-bottom: none;\n }\n `,\n optionLabel: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n `,\n optionValue: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.gray[900], colors.gray[100])};\n `,\n optionValueTrue: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.green[600], colors.green[400])};\n `,\n optionValueFalse: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.red[600], colors.red[400])};\n `,\n tooltip: css`\n position: relative;\n &:hover > [data-tooltip] {\n opacity: 1;\n visibility: visible;\n }\n `,\n tooltipText: css`\n position: absolute;\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n padding: ${size[1]} ${size[1.5]};\n background: ${t(colors.gray[800], colors.darkGray[500])};\n color: ${t(colors.white, colors.gray[100])};\n font-size: ${fontSize['2xs']};\n border-radius: ${border.radius.sm};\n white-space: nowrap;\n pointer-events: none;\n opacity: 0;\n visibility: hidden;\n transition:\n opacity 0.15s,\n visibility 0.15s;\n z-index: ${tokens.zIndices.tooltip};\n margin-top: ${size[1]};\n `,\n triggerCount: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize['2xs']};\n color: ${t(colors.gray[500], colors.gray[400])};\n margin-left: ${size[1]};\n flex-shrink: 0;\n `,\n }\n}\n\nexport function useStyles() {\n const { theme } = useTheme()\n const [styles, setStyles] = createSignal(stylesFactory(theme()))\n createEffect(() => {\n setStyles(stylesFactory(theme()))\n })\n return styles\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"use-styles.js","names":[],"sources":["../../src/styles/use-styles.ts"],"sourcesContent":["import * as goober from 'goober'\nimport { createEffect, createSignal } from 'solid-js'\nimport { useTheme } from '@tanstack/devtools-ui'\nimport { tokens } from './tokens'\n\nconst stylesFactory = (theme: 'light' \| 'dark') => {\n const { colors, font, size, alpha, border } = tokens\n const { fontFamily, size: fontSize } = font\n const css = goober.css\n const t = (light: string, dark: string) => (theme === 'light' ? light : dark)\n\n return {\n /** Full-height flex child so MainPanel gets a bounded height from the portal /\n shellRoot: css`\n display: flex;\n flex-direction: column;\n min-height: 0;\n height: 100%;\n flex: 1;\n overflow: hidden;\n `,\n /* Overrides devtools-ui MainPanel (overflow-y: auto) so inner columns scroll independently */\n mainPanelShell: css`\n display: flex;\n flex-direction: column;\n flex: 1 1 0%;\n min-height: 0;\n height: auto;\n overflow: hidden !important;\n `,\n mainContainer: css`\n display: flex;\n flex-direction: column;\n flex: 1 1 0%;\n min-height: 0;\n overflow: hidden;\n padding: ${size[2]};\n padding-top: 0;\n margin-top: ${size[2]};\n `,\n heldKeysBar: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n align-items: center;\n gap: ${size[3]};\n padding: ${size[3]} ${size[3]};\n flex-shrink: 0;\n min-height: 64px;\n margin-bottom: ${size[2]};\n `,\n heldKeysBarHeader: css`\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[600], colors.gray[400])};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n flex-shrink: 0;\n `,\n heldKeysBarList: css`\n display: flex;\n align-items: center;\n gap: ${size[1.5]};\n flex-wrap: wrap;\n flex: 1;\n min-width: 0;\n `,\n panelsContainer: css`\n display: flex;\n flex: 1 1 0%;\n min-height: 0;\n overflow: hidden;\n align-items: stretch;\n `,\n dragHandle: css`\n width: 8px;\n background: ${t(colors.gray[300], colors.darkGray[600])};\n cursor: col-resize;\n position: relative;\n transition: all 0.2s ease;\n user-select: none;\n pointer-events: all;\n margin: 0 ${size[1]};\n border-radius: 2px;\n\n &:hover {\n background: ${t(colors.blue[600], colors.blue[500])};\n margin: 0 ${size[1]};\n }\n\n &.dragging {\n background: ${t(colors.blue[700], colors.blue[600])};\n margin: 0 ${size[1]};\n }\n\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 2px;\n height: 20px;\n background: ${t(colors.gray[400], colors.darkGray[400])};\n border-radius: 1px;\n pointer-events: none;\n }\n\n &:hover::after,\n &.dragging::after {\n background: ${t(colors.blue[500], colors.blue[300])};\n }\n `,\n keyCap: css`\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n padding: ${size[1]} ${size[2]};\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[100])};\n background: ${t(colors.white, colors.darkGray[600])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[400])};\n border-bottom-width: 2px;\n border-radius: ${border.radius.sm};\n box-shadow: ${tokens.shadow.xs()};\n text-transform: capitalize;\n white-space: nowrap;\n line-height: 1.2;\n `,\n keyCapCode: css`\n font-size: ${fontSize['2xs']};\n font-weight: ${font.weight.normal};\n color: ${t(colors.gray[500], colors.gray[400])};\n text-transform: none;\n line-height: 1;\n margin-top: 2px;\n `,\n noKeysHeld: css`\n font-size: ${fontSize.sm};\n color: ${t(colors.gray[400], colors.gray[600])};\n font-style: italic;\n text-align: center;\n padding: ${size[1]};\n `,\n leftPanel: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n min-height: 0;\n min-width: 0;\n `,\n leftPanelScroll: css`\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n `,\n rightPanel: css`\n background: ${t(colors.gray[100], colors.darkGray[800])};\n border-radius: ${border.radius.lg};\n border: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n min-width: 0;\n overflow: hidden;\n `,\n panelHeader: css`\n font-size: ${fontSize.md};\n font-weight: ${font.weight.bold};\n color: ${t(colors.blue[700], colors.blue[400])};\n padding: ${size[2]};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n background: ${t(colors.gray[100], colors.darkGray[800])};\n flex-shrink: 0;\n `,\n hotkeyList: css`\n padding: ${size[1]};\n `,\n hotkeyRow: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${size[2]};\n margin-bottom: ${size[1]};\n background: ${t(colors.gray[200], colors.darkGray[700])};\n border-radius: ${border.radius.md};\n cursor: pointer;\n transition: all 0.2s ease;\n border: 1px solid transparent;\n\n &:hover {\n background: ${t(colors.gray[300], colors.darkGray[600])};\n border-color: ${t(colors.gray[400], colors.darkGray[500])};\n }\n `,\n hotkeyRowSelected: css`\n background: ${t(colors.blue[100], colors.blue[900] + alpha[20])};\n border-color: ${t(colors.blue[600], colors.blue[500])};\n box-shadow: 0 0 0 1px\n ${t(colors.blue[600] + alpha[30], colors.blue[500] + alpha[30])};\n `,\n hotkeyRowTriggered: css`\n animation: hotkey-pulse 0.6s ease-out;\n\n @keyframes hotkey-pulse {\n 0% {\n border-color: ${t(colors.blue[500], colors.blue[400])};\n box-shadow: 0 0 0 2px\n ${t(colors.blue[500] + alpha[40], colors.blue[400] + alpha[40])};\n }\n 100% {\n border-color: transparent;\n box-shadow: 0 0 0 0px\n ${t(colors.blue[500] + '00', colors.blue[400] + '00')};\n }\n }\n `,\n hotkeyLabel: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[900], colors.gray[100])};\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n `,\n sequenceStepMatched: css`\n font-weight: ${font.weight.bold};\n color: ${t(colors.blue[700], colors.blue[300])};\n `,\n hotkeyBadges: css`\n display: flex;\n gap: ${size[1]};\n margin-left: ${size[1]};\n flex-shrink: 0;\n overflow: visible;\n `,\n badge: css`\n font-size: ${fontSize['2xs']};\n padding: ${size[0.5]} ${size[1]};\n border-radius: ${border.radius.sm};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n white-space: nowrap;\n `,\n badgeEnabled: css`\n color: ${t(colors.green[700], colors.green[400])};\n background: ${t(colors.green[100], colors.green[900] + alpha[30])};\n `,\n badgeDisabled: css`\n color: ${t(colors.red[700], colors.red[400])};\n background: ${t(colors.red[100], colors.red[900] + alpha[30])};\n `,\n badgeKeydown: css`\n color: ${t(colors.purple[700], colors.purple[400])};\n background: ${t(colors.purple[100], colors.purple[900] + alpha[30])};\n `,\n badgeKeyup: css`\n color: ${t(colors.teal[700], colors.teal[400])};\n background: ${t(colors.teal[100], colors.teal[900] + alpha[30])};\n `,\n badgeTarget: css`\n color: ${t(colors.gray[700], colors.gray[300])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n `,\n badgeConflict: css`\n color: ${t(colors.yellow[700], colors.yellow[400])};\n background: ${t(colors.yellow[100], colors.yellow[900] + alpha[30])};\n `,\n badgeError: css`\n color: ${t(colors.red[700], colors.red[400])};\n background: ${t(colors.red[100], colors.red[900] + alpha[30])};\n `,\n badgeAllow: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n `,\n badgeInfo: css`\n color: ${t(colors.blue[700], colors.blue[400])};\n background: ${t(colors.blue[100], colors.blue[900] + alpha[30])};\n `,\n stateDetails: css`\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: ${size[2]};\n `,\n stateHeader: css`\n margin-bottom: ${size[2]};\n padding-bottom: ${size[2]};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[700])};\n `,\n stateTitle: css`\n font-size: ${fontSize.md};\n font-weight: ${font.weight.bold};\n color: ${t(colors.blue[700], colors.blue[400])};\n margin-bottom: ${size[1]};\n `,\n detailsGrid: css`\n display: grid;\n grid-template-columns: 1fr;\n gap: ${size[2]};\n align-items: start;\n `,\n detailSection: css`\n background: ${t(colors.white, colors.darkGray[700])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[600])};\n border-radius: ${border.radius.md};\n padding: ${size[2]};\n `,\n detailSectionHeader: css`\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[200])};\n margin-bottom: ${size[1]};\n text-transform: uppercase;\n letter-spacing: 0.04em;\n `,\n infoGrid: css`\n display: grid;\n grid-template-columns: auto 1fr;\n gap: ${size[1]};\n row-gap: ${size[1]};\n align-items: center;\n `,\n infoLabel: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n font-size: ${fontSize.xs};\n text-transform: uppercase;\n letter-spacing: 0.05em;\n `,\n infoValueMono: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[900], colors.gray[100])};\n word-break: break-all;\n `,\n actionsRow: css`\n display: flex;\n flex-wrap: wrap;\n gap: ${size[2]};\n `,\n actionButton: css`\n display: inline-flex;\n align-items: center;\n gap: ${size[1]};\n padding: ${size[1]} ${size[2]};\n border-radius: ${border.radius.md};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[500])};\n background: ${t(colors.gray[200], colors.darkGray[600])};\n color: ${t(colors.gray[900], colors.gray[100])};\n font-size: ${fontSize.xs};\n cursor: pointer;\n user-select: none;\n transition:\n background 0.15s,\n border-color 0.15s;\n &:hover {\n background: ${t(colors.gray[300], colors.darkGray[500])};\n border-color: ${t(colors.gray[400], colors.darkGray[400])};\n }\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n &:hover {\n background: ${t(colors.gray[200], colors.darkGray[600])};\n border-color: ${t(colors.gray[300], colors.darkGray[500])};\n }\n }\n `,\n actionDotGreen: css`\n width: 6px;\n height: 6px;\n border-radius: 9999px;\n background: ${colors.green[400]};\n `,\n noSelection: css`\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${t(colors.gray[500], colors.gray[500])};\n font-style: italic;\n text-align: center;\n padding: ${size[4]};\n `,\n keyBreakdown: css`\n display: flex;\n flex-wrap: wrap;\n gap: ${size[1]};\n align-items: center;\n `,\n keyBreakdownPlus: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: ${fontSize.sm};\n `,\n keyCapLarge: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 36px;\n padding: ${size[1]} ${size[2]};\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.sm};\n font-weight: ${font.weight.bold};\n color: ${t(colors.gray[800], colors.gray[100])};\n background: ${t(colors.white, colors.darkGray[600])};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[400])};\n border-bottom-width: 3px;\n border-radius: ${border.radius.md};\n box-shadow: ${tokens.shadow.sm()};\n text-transform: capitalize;\n white-space: nowrap;\n `,\n keyCapLargeInProgress: css`\n border-color: ${t(colors.blue[500], colors.blue[400])};\n color: ${t(colors.blue[900], colors.blue[200])};\n background: ${t(colors.blue[50], colors.darkGray[500])};\n `,\n conflictList: css`\n display: flex;\n flex-direction: column;\n gap: ${size[1]};\n `,\n conflictItem: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.yellow[700], colors.yellow[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.yellow[50], colors.yellow[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.yellow[200], colors.yellow[800] + alpha[30])};\n `,\n conflictItemAllow: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.gray[600], colors.gray[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.gray[100], colors.darkGray[700])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.gray[300], colors.darkGray[600])};\n `,\n conflictItemError: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.red[700], colors.red[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.red[50], colors.red[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.red[200], colors.red[900] + alpha[30])};\n `,\n conflictItemScope: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize.xs};\n color: ${t(colors.blue[700], colors.blue[400])};\n padding: ${size[1]} ${size[2]};\n background: ${t(colors.blue[50], colors.blue[900] + alpha[20])};\n border-radius: ${border.radius.sm};\n border: 1px solid ${t(colors.blue[200], colors.blue[800] + alpha[30])};\n `,\n optionRow: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${size[1]} 0;\n font-size: ${fontSize.xs};\n border-bottom: 1px solid ${t(colors.gray[200], colors.darkGray[600])};\n &:last-child {\n border-bottom: none;\n }\n `,\n optionLabel: css`\n color: ${t(colors.gray[600], colors.gray[400])};\n `,\n optionValue: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.gray[900], colors.gray[100])};\n `,\n optionValueTrue: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.green[600], colors.green[400])};\n `,\n optionValueFalse: css`\n font-family: ${fontFamily.mono};\n color: ${t(colors.red[600], colors.red[400])};\n `,\n tooltip: css`\n position: relative;\n &:hover > [data-tooltip] {\n opacity: 1;\n visibility: visible;\n }\n `,\n tooltipText: css`\n position: absolute;\n top: 100%;\n left: 50%;\n transform: translateX(-50%);\n padding: ${size[1]} ${size[1.5]};\n background: ${t(colors.gray[800], colors.darkGray[500])};\n color: ${t(colors.white, colors.gray[100])};\n font-size: ${fontSize['2xs']};\n border-radius: ${border.radius.sm};\n white-space: nowrap;\n pointer-events: none;\n opacity: 0;\n visibility: hidden;\n transition:\n opacity 0.15s,\n visibility 0.15s;\n z-index: ${tokens.zIndices.tooltip};\n margin-top: ${size[1]};\n `,\n triggerCount: css`\n font-family: ${fontFamily.mono};\n font-size: ${fontSize['2xs']};\n color: ${t(colors.gray[500], colors.gray[400])};\n margin-left: ${size[1]};\n flex-shrink: 0;\n `,\n }\n}\n\nexport function useStyles() {\n const { theme } = useTheme()\n const [styles, setStyles] = createSignal(stylesFactory(theme()))\n createEffect(() => {\n setStyles(stylesFactory(theme()))\n })\n return styles\n}\n"],"mappings":"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"}