mirror of
https://github.com/GraphiteEditor/Graphite.git
synced 2026-09-17 23:38:06 +08:00
7e0cbb60b4
Many large changes, including:
- TypeScript enums are now string unions throughout
- Strong type-checking throughout the TS and Vue codebase
- Vue component props now all specify `as PropType<...>`
- Usage of annotated return types on all functions
- Sorting of JS import statements
- Explicit usage of Vue bind attribute function call arguments (`@click="foo"` is now `@click=(e) => foo(e)`)
- Much improved code quality related to the color picker
- Consistent camelCase Vue bind and v-model attributes
- Consistent Vue HTML attribute strings with single quotes
- Bug fix and clarity improvement with incorrect hint class parameters
- Empty Vue component objects like `props: {}` and `components: {}` removed
89 lines
2.0 KiB
TypeScript
89 lines
2.0 KiB
TypeScript
export type Widgets = TextButtonWidget | IconButtonWidget | SeparatorWidget | PopoverButtonWidget | NumberInputWidget;
|
|
export type WidgetRow = Widgets[];
|
|
export type WidgetLayout = WidgetRow[];
|
|
|
|
// Text Button
|
|
export interface TextButtonWidget {
|
|
kind: "TextButton";
|
|
tooltip?: string;
|
|
message?: string | object;
|
|
callback?: () => void;
|
|
props: TextButtonProps;
|
|
}
|
|
|
|
export interface TextButtonProps {
|
|
// `action` is used via `IconButtonWidget.callback`
|
|
label: string;
|
|
emphasized?: boolean;
|
|
disabled?: boolean;
|
|
minWidth?: number;
|
|
gapAfter?: boolean;
|
|
}
|
|
|
|
// Icon Button
|
|
export interface IconButtonWidget {
|
|
kind: "IconButton";
|
|
tooltip?: string;
|
|
message?: string | object;
|
|
callback?: () => void;
|
|
props: IconButtonProps;
|
|
}
|
|
|
|
export interface IconButtonProps {
|
|
// `action` is used via `IconButtonWidget.callback`
|
|
icon: string;
|
|
size: number;
|
|
gapAfter?: boolean;
|
|
}
|
|
|
|
// Popover Button
|
|
export interface PopoverButtonWidget {
|
|
kind: "PopoverButton";
|
|
tooltip?: string;
|
|
callback?: () => void;
|
|
// popover: WidgetLayout;
|
|
popover: { title: string; text: string }; // TODO: Replace this with a `WidgetLayout` like above for arbitrary layouts
|
|
props: PopoverButtonProps;
|
|
}
|
|
|
|
export interface PopoverButtonProps {
|
|
// `action` is used via `PopoverButtonWidget.callback`
|
|
icon?: string;
|
|
}
|
|
|
|
// Number Input
|
|
export interface NumberInputWidget {
|
|
kind: "NumberInput";
|
|
tooltip?: string;
|
|
optionPath: string[];
|
|
props: Omit<NumberInputProps, "value">;
|
|
}
|
|
|
|
export interface NumberInputProps {
|
|
value: number;
|
|
min?: number;
|
|
max?: number;
|
|
incrementBehavior?: boolean;
|
|
incrementFactor?: number;
|
|
isInteger?: boolean;
|
|
unit?: string;
|
|
unitIsHiddenWhenEditing?: boolean;
|
|
displayDecimalPlaces?: number;
|
|
label?: string;
|
|
disabled?: boolean;
|
|
}
|
|
|
|
// Separator
|
|
export type SeparatorDirection = "Horizontal" | "Vertical";
|
|
export type SeparatorType = "Related" | "Unrelated" | "Section" | "List";
|
|
|
|
export interface SeparatorWidget {
|
|
kind: "Separator";
|
|
props: SeparatorProps;
|
|
}
|
|
|
|
export interface SeparatorProps {
|
|
direction?: SeparatorDirection;
|
|
type?: SeparatorType;
|
|
}
|