diff --git a/ivette/src/dome/renderer/frame/style.css b/ivette/src/dome/renderer/frame/style.css
index 66b6c559a423c130f27932df012ccda65eaef3fd..0f744024de94cbe6fae015aa249bd0959828b03f 100644
--- a/ivette/src/dome/renderer/frame/style.css
+++ b/ivette/src/dome/renderer/frame/style.css
@@ -492,6 +492,13 @@
color: var(--text);
}
+.dome-xToolBar-searchField input[type=search]:disabled {
+ background: var(--background-profound);
+ color: var(--disabled-text);
+ opacity: 30%;
+}
+
+
.dome-xToolBar-searchComponent div.dome-xToolBar-suggestions {
position: absolute;
overflow-x: hidden;
@@ -500,11 +507,11 @@
z-index: +1;
width: 0px;
background: var(--background-alterning-odd);
- border-radius: 12px;
}
.dome-xToolBar-searchComponent:focus-within div.dome-xToolBar-suggestions {
width: 230px;
+ border: solid thin var(--border);
}
.dome-xToolBar-searchItem {
@@ -529,9 +536,9 @@
fill: var(--text-discrete);
}
-.dome-xToolBar-modeOfModes {
+.dome-xToolBar-disabledMode {
background: var(--background-profound);
- fill: var(--text-discrete);
+ fill: var(--disabled-text);
}
/* -------------------------------------------------------------------------- */
diff --git a/ivette/src/dome/renderer/frame/toolbars.tsx b/ivette/src/dome/renderer/frame/toolbars.tsx
index f3ccaca938c39d93ae7f5fe057961206f42faece..eebb53c3d73861bf0fe7873e79fafbae3cadb556 100644
--- a/ivette/src/dome/renderer/frame/toolbars.tsx
+++ b/ivette/src/dome/renderer/frame/toolbars.tsx
@@ -329,17 +329,19 @@ export function byHint(a: Hint, b: Hint): number {
interface ModeButtonComponentProps {
icon: string;
- className?: string;
+ disabled: boolean;
+ className: string;
onClick?: () => void;
}
function ModeButton(props: ModeButtonComponentProps): JSX.Element {
- const { className, icon, onClick } = props;
+ const { icon, disabled, onClick } = props;
+ const className = classes(
+ 'dome-xToolBar-modeSelection',
+ disabled ? 'dome-xToolBar-disabledMode' : props.className
+ );
return (
- <div
- className={classes("dome-xToolBar-modeSelection", className)}
- onClick={onClick}
- >
+ <div className={className} onClick={onClick} >
<SVG
className="dome-xToolBar-modeIcon"
id={icon}
@@ -354,9 +356,10 @@ function ModeButton(props: ModeButtonComponentProps): JSX.Element {
// --------------------------------------------------------------------------
interface SuggestionsProps {
- hints?: Hint[];
- onHint?: (hint: Hint) => void;
index: number;
+ hints: Hint[];
+ onClose: () => void;
+ onHint?: (hint: Hint) => void;
}
function scrollToRef(r: null | HTMLLabelElement): void {
@@ -364,14 +367,13 @@ function scrollToRef(r: null | HTMLLabelElement): void {
}
function Suggestions(props: SuggestionsProps): JSX.Element {
- const { hints=[], onHint, index } = props;
-
- // Computing the relevant suggestions. */
+ const { hints, onHint, index, onClose } = props;
const suggestions = hints.map((h, k) => {
const selected = k === index || hints.length === 1;
const classSelected = selected && 'dome-xToolBar-searchIndex';
const className = classes('dome-xToolBar-searchItem', classSelected);
const onClick = (): void => {
+ onClose();
if (h.onClick) h.onClick();
if (onHint) onHint(h);
};
@@ -409,9 +411,10 @@ interface SearchInputProps {
title?: string;
placeholder?: string;
disabled: boolean;
- hints?: Hint[];
+ hints: Hint[];
onHint?: (hint: Hint) => void;
onEnter?: (pattern: string) => void;
+ onClose: () => void;
index: number;
setIndex: (n: number) => void;
pattern: string;
@@ -421,28 +424,27 @@ interface SearchInputProps {
function SearchInput(props: SearchInputProps): JSX.Element {
const {
- title, placeholder, disabled=false,
- hints=[], onHint, onEnter,
+ title, placeholder, disabled,
+ hints=[], onHint, onEnter, onClose,
index, setIndex, pattern, setPattern, inputRef
} = props;
- // Blur Event
- const onBlur = (): void => { setPattern(''); setIndex(-1); };
-
// Key Up Events
const onKeyUp = (evt: React.KeyboardEvent): void => {
- const blur = (): void => inputRef.current?.blur();
switch (evt.key) {
case 'Escape':
- blur();
+ onClose();
break;
case 'Enter':
- blur();
- if (onHint) {
- if (index >= 0 && index < hints.length) onHint(hints[index]);
- else if (hints.length === 1) onHint(hints[0]);
+ onClose();
+ {
+ const hint : Hint | undefined =
+ hints[index] ??
+ (hints.length === 1 ? hints[0] : undefined);
+ if (hint && hint.onClick) hint.onClick();
+ if (hint && onHint) onHint(hint);
+ if (onEnter) onEnter(pattern);
}
- else if (onEnter) onEnter(pattern);
break;
case 'ArrowUp':
if (index < 0) setIndex(hints.length - 1);
@@ -457,7 +459,12 @@ function SearchInput(props: SearchInputProps): JSX.Element {
// Key Down Events. Disables the default behavior on ArrowUp and ArrowDown.
const onKeyDown = (evt: React.KeyboardEvent): void => {
- if (evt.key === 'ArrowUp' || evt.key === 'ArrowDown') evt.preventDefault();
+ switch (evt.key) {
+ case 'ArrowUp':
+ case 'ArrowDown':
+ evt.preventDefault();
+ break;
+ }
};
// // Input Events
@@ -477,7 +484,7 @@ function SearchInput(props: SearchInputProps): JSX.Element {
onKeyUp={onKeyUp}
onKeyDown={onKeyDown}
onChange={onChange}
- onBlur={onBlur}
+ onBlur={onClose}
/>
);
}
@@ -521,20 +528,33 @@ export function SearchField(props: SearchFieldProps): JSX.Element {
const inputRef = React.useRef<HTMLInputElement | null>(null);
const [index, setIndex] = React.useState(-1);
const [pattern, setPattern] = React.useState('');
- const focusInput = React.useCallback(() => inputRef.current?.focus(), []);
const { onPattern } = props;
+ const onFocus = React.useCallback(() => inputRef.current?.focus(), []);
+ const onClose = React.useCallback(() => {
+ inputRef.current?.blur();
+ setPattern('');
+ setIndex(-1);
+ if (onPattern) onPattern('');
+ }, [onPattern]);
const onPatternChanged = React.useCallback((p: string) => {
setPattern(p);
if (onPattern) onPattern(p);
}, [onPattern]);
- Dome.useEvent(props.focus, focusInput);
+ Dome.useEvent(props.focus, onFocus);
// Compute the hints for the current mode.
const {
- hints, onHint, onEnter, icon='SEARCH',
+ hints=[], onHint, onEnter,
+ icon='SEARCH',
+ className='dome-xToolBar-searchMode',
enabled=true, disabled=false,
} = props;
+ const disabledInput = disabled || !enabled;
+ React.useEffect(
+ () => { if (disabledInput) inputRef.current?.blur(); }
+ , [disabledInput]);
+
// Build the component.
return (
<div className="dome-xToolBar-searchComponent"
@@ -543,15 +563,17 @@ export function SearchField(props: SearchFieldProps): JSX.Element {
<div className="dome-xToolBar-searchField">
<ModeButton
icon={icon}
- className={props.className}
+ disabled={disabledInput}
+ className={className}
onClick={props.onSearch} />
<SearchInput
title={props.title}
placeholder={props.placeholder}
- disabled={disabled || !enabled}
+ disabled={disabledInput}
hints={hints}
onHint={onHint}
onEnter={onEnter}
+ onClose={onClose}
index={index}
setIndex={setIndex}
pattern={pattern}
@@ -559,7 +581,11 @@ export function SearchField(props: SearchFieldProps): JSX.Element {
inputRef={inputRef}
/>
</div>
- <Suggestions hints={hints} onHint={onHint} index={index} />
+ <Suggestions
+ index={index}
+ hints={hints}
+ onClose={onClose}
+ onHint={onHint} />
</div>
);
}
diff --git a/ivette/src/frama-c/kernel/Globals.tsx b/ivette/src/frama-c/kernel/Globals.tsx
index 4836a7adfde37f297f1b48fbe32b60307737597b..5f72b77eac02352c8f817224d1f097f75ddcb6b9 100644
--- a/ivette/src/frama-c/kernel/Globals.tsx
+++ b/ivette/src/frama-c/kernel/Globals.tsx
@@ -33,6 +33,7 @@ import { Section, Item } from 'dome/frame/sidebars';
import { Button } from 'dome/controls/buttons';
import * as Ivette from 'ivette';
+import * as Server from 'frama-c/server';
import * as States from 'frama-c/states';
import * as Ast from 'frama-c/kernel/api/ast';
import * as Locations from 'frama-c/kernel/Locations';
@@ -53,15 +54,26 @@ function globalHints(): Ivette.Hint[] {
}));
}
-const globalSearchMode : Ivette.ModeProps = {
+const globalMode : Ivette.ModeProps = {
id: 'frama-c.kernel.globals',
label: 'Globals',
- title: 'Lookup for Global Variables',
+ title: 'Lookup for Global Declarations',
+ placeholder: 'declaration',
hints: globalHints,
};
-Ivette.registerMode(globalSearchMode);
-Dome.find.on(() => Ivette.focusMode(globalSearchMode.id));
+function resetMode(enabled: boolean): void {
+ Ivette.updateMode({ id: globalMode.id, enabled });
+ Ivette.selectMode(globalMode.id);
+}
+
+{
+ Ivette.registerMode(globalMode);
+ Dome.find.on(() => Ivette.focusMode(globalMode.id));
+ Server.onReady(() => resetMode(true));
+ Server.onShutdown(() => resetMode(false));
+ resetMode(false);
+}
// --------------------------------------------------------------------------
// --- Function Item
diff --git a/ivette/src/frama-c/plugins/studia/studia.ts b/ivette/src/frama-c/plugins/studia/studia.ts
index e1cf5d861a7642128cdae44359e77171028089d0..e90e47cac0622454a44351cbfef91fbc87d5721b 100644
--- a/ivette/src/frama-c/plugins/studia/studia.ts
+++ b/ivette/src/frama-c/plugins/studia/studia.ts
@@ -97,7 +97,7 @@ const studiaReadsMode : Ivette.ModeProps = {
id: 'frama-c.plugins.studia.reads',
label: 'Studia: reads',
title: 'Select all statements reading the given lvalue',
- placeholder: 'lvalue',
+ placeholder: 'lvalue (reads)',
icon: 'EDIT',
className: 'studia-search-mode',
onEnter: (p: string) => onEnter('Reads', p)
@@ -107,7 +107,7 @@ const studiaWritesMode : Ivette.ModeProps = {
id: 'frama-c.plugins.studia.writes',
label: 'Studia: writes',
title: 'Select all statements writing the given lvalue',
- placeholder: "lvalue",
+ placeholder: "lvalue (writes)",
icon: 'EDIT',
className: 'studia-search-mode',
onEnter: (p: string) => onEnter('Writes', p)
diff --git a/ivette/src/ivette/index.tsx b/ivette/src/ivette/index.tsx
index 95557b0d23508d7defc9a60c1aec687e706f3af9..1eeee4a21223d851a223035d84819500c1da9813 100644
--- a/ivette/src/ivette/index.tsx
+++ b/ivette/src/ivette/index.tsx
@@ -230,6 +230,7 @@ export interface ModeProps {
export function registerMode(m: ModeProps): void { Mode.registerMode(m); }
export function updateMode(m: ModeProps): void { Mode.updateMode(m); }
export function removeMode(id: string): void { Mode.removeMode(id); }
+export function selectMode(id: string): void { Mode.selectMode(id); }
export function focusMode(id: string): void { Mode.focusMode(id); }
export function useMode(m: ModeProps): void {
React.useEffect(() => {
diff --git a/ivette/src/renderer/Actions.tsx b/ivette/src/renderer/Actions.tsx
index 9f9cc357d25037feeb3b57c4916321d041376a90..3fb71117e1141d84a50ecb823bb8765a00120554 100644
--- a/ivette/src/renderer/Actions.tsx
+++ b/ivette/src/renderer/Actions.tsx
@@ -106,6 +106,13 @@ export function findMode(id: string): ModeProps | undefined {
return allModes.find(id);
}
+export function selectMode(id: string): void {
+ const m = allModes.find(id);
+ if (m !== undefined) {
+ allModes.setValue(m);
+ }
+}
+
export function focusMode(id: string): void {
const m = allModes.find(id);
if (m !== undefined) {
@@ -118,14 +125,17 @@ export function focusMode(id: string): void {
// --- Search Mode Selector
// --------------------------------------------------------------------------
-const searchMode : ModeProps = {
- id: 'ivette.searchmode',
+const switchMode : ModeProps = {
+ id: 'ivette.switchmode',
+ icon: 'TRIANGLE.RIGHT',
title: 'Search & Action Modes',
- placeholder: 'mode',
+ placeholder: 'search mode',
hints: () => allModes.selfhints(),
onHint: (h: Hint) => focusMode(h.id),
};
+allModes.register(switchMode);
+
// --------------------------------------------------------------------------
// --- Search Action Component
// --------------------------------------------------------------------------
@@ -159,12 +169,15 @@ export function SearchAction(): JSX.Element {
return lookupHints(getHints(), pattern);
}, [getHints, pattern]);
React.useEffect(() => {
- if (currMode && currMode !== searchMode.id)
+ if (currMode && currMode !== switchMode.id)
userMode.current = currMode;
}, [currMode]);
- const onSearch = React.useCallback(() => focusMode(searchMode.id), []);
+ const onSearch = React.useCallback(() => {
+ if (currMode !== switchMode.id)
+ focusMode(switchMode.id);
+ }, [currMode]);
const onBlur = React.useCallback(() => {
- if (currMode === searchMode.id) {
+ if (currMode === switchMode.id) {
const user = findMode(userMode.current) ?? defaultMode;
allModes.setValue(user);
}