pxt-core
Version:
Microsoft MakeCode provides Blocks / JavaScript / Python tools and editors
112 lines (111 loc) • 3.67 kB
TypeScript
/**
* @fileoverview Colour input field.
*/
import { FieldGridDropdown } from '@blockly/field-grid-dropdown';
import * as Blockly from 'blockly/core';
import { FieldCustom, FieldCustomOptions } from './field_utils';
/**
* The value modes:
* hex - Outputs an HTML color string: "#ffffff" (with quotes)
* rgb - Outputs an RGB number in hex: 0xffffff
* index - Outputs the index of the color in the list of colors: 0
*/
export declare type FieldColourValueMode = "hex" | "rgb" | "index";
export interface FieldColourNumberOptions extends FieldCustomOptions {
colours?: string;
columns?: string;
className?: string;
valueMode?: FieldColourValueMode;
}
/**
* Similar to Blockly's field_colour but with support for different colour
* formats.
*/
export declare class FieldColorNumber extends FieldGridDropdown implements FieldCustom {
isFieldCustom_: boolean;
/**
* Used to tell if the field needs to be rendered the next time the block is
* rendered. Colour fields are statically sized, and only need to be
* rendered at initialization.
*/
protected isDirty_: boolean;
private allColoursCSSFormat_;
private valueMode_;
constructor(text: string, params: FieldColourNumberOptions, opt_validator?: Blockly.FieldValidator);
/**
* FieldDropdown has complex behaviors for normalizing options that aren't
* applicable here. Instead, just return the options as-is.
*
* @param options The options (colour swatches) to normalize.
* @returns The colour swatches as-is.
*/
protected trimOptions(options: Blockly.MenuOption[]): {
options: Blockly.MenuOption[];
};
/**
* Create the block UI for this colour field.
*
* @internal
*/
initView(): void;
/**
* Shows the colour picker dropdown attached to the field.
*
* @param e The event that triggered display of the colour picker dropdown.
*/
protected showEditor_(e?: MouseEvent): void;
/**
* Defines whether this field should take up the full block or not.
*
* @returns True if this field should take up the full block. False otherwise.
*/
isFullBlockField(): boolean;
/**
* @returns True if the source block is a value block with a single editable
* field.
* @internal
*/
blockIsSimpleReporter(): boolean;
/**
* Updates text field to match the colour/style of the block.
*
* @internal
*/
applyColour(): void;
/**
* Returns the height and width of the field.
*
* This should *in general* be the only place render_ gets called from.
*
* @returns Height and width.
*/
getSize(): Blockly.utils.Size;
/**
* Updates the colour of the block to reflect whether this is a full
* block field or not.
*/
protected render_(): void;
/**
* Updates the size of the field based on whether it is a full block field
* or not.
*
* @param margin margin to use when positioning the field.
*/
protected updateSize_(margin?: number): void;
/**
* Ensure that the input value is a valid colour.
*
* @param newValue The input value.
* @returns A valid colour, or null if invalid.
*/
protected doClassValidation_(newValue: string): string | null | undefined;
protected doClassValidation_(newValue?: string): string | null;
/**
* Get the text for this field. Used when the block is collapsed.
*
* @returns Text representing the value of this field.
*/
getText(): string;
getFieldDescription(): string;
getCSSValue(): string;
}