babylon.guiEditor.d.ts 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980
  1. /// <reference types="react" />
  2. declare module GUIEDITOR {
  3. interface ILogComponentProps {
  4. globalState: GlobalState;
  5. }
  6. export class LogEntry {
  7. message: string;
  8. isError: boolean;
  9. constructor(message: string, isError: boolean);
  10. }
  11. export class LogComponent extends React.Component<ILogComponentProps, {
  12. logs: LogEntry[];
  13. }> {
  14. constructor(props: ILogComponentProps);
  15. componentDidMount(): void;
  16. componentDidUpdate(): void;
  17. render(): JSX.Element;
  18. }
  19. }
  20. declare module GUIEDITOR {
  21. export interface IWorkbenchComponentProps {
  22. globalState: GlobalState;
  23. }
  24. export type FramePortData = {};
  25. export const isFramePortData: (variableToCheck: any) => variableToCheck is FramePortData;
  26. export class WorkbenchComponent extends React.Component<IWorkbenchComponentProps> {
  27. private readonly MinZoom;
  28. private readonly MaxZoom;
  29. private _hostCanvas;
  30. private _gridCanvas;
  31. private _selectionContainer;
  32. private _frameContainer;
  33. private _svgCanvas;
  34. private _rootContainer;
  35. private _guiNodes;
  36. private _mouseStartPointX;
  37. private _mouseStartPointY;
  38. private _selectionStartX;
  39. private _selectionStartY;
  40. private _x;
  41. private _y;
  42. private _zoom;
  43. private _selectedGuiNodes;
  44. private _gridSize;
  45. private _selectionBox;
  46. private _frameCandidate;
  47. private _altKeyIsPressed;
  48. private _ctrlKeyIsPressed;
  49. private _oldY;
  50. _frameIsMoving: boolean;
  51. _isLoading: boolean;
  52. isOverGUINode: boolean;
  53. get gridSize(): number;
  54. set gridSize(value: number);
  55. get globalState(): GlobalState;
  56. get nodes(): GUINode[];
  57. get zoom(): number;
  58. set zoom(value: number);
  59. get x(): number;
  60. set x(value: number);
  61. get y(): number;
  62. set y(value: number);
  63. get selectedGuiNodes(): GUINode[];
  64. get canvasContainer(): HTMLDivElement;
  65. get hostCanvas(): HTMLDivElement;
  66. get svgCanvas(): HTMLElement;
  67. get selectionContainer(): HTMLDivElement;
  68. get frameContainer(): HTMLDivElement;
  69. constructor(props: IWorkbenchComponentProps);
  70. getGridPosition(position: number, useCeil?: boolean): number;
  71. getGridPositionCeil(position: number): number;
  72. updateTransform(): void;
  73. onKeyUp(): void;
  74. findNodeFromGuiElement(guiControl: Control): GUINode;
  75. reset(): void;
  76. appendBlock(guiElement: Control): GUINode;
  77. distributeGraph(): void;
  78. componentDidMount(): void;
  79. onMove(evt: React.PointerEvent): void;
  80. onDown(evt: React.PointerEvent<HTMLElement>): void;
  81. onUp(evt: React.PointerEvent): void;
  82. onWheel(evt: React.WheelEvent): void;
  83. zoomToFit(): void;
  84. createGUICanvas(): void;
  85. updateGUIs(): void;
  86. render(): JSX.Element;
  87. }
  88. }
  89. declare module GUIEDITOR {
  90. export interface IPropertyComponentProps {
  91. globalState: GlobalState;
  92. guiControl: Control;
  93. }
  94. }
  95. declare module GUIEDITOR {
  96. interface ILineContainerComponentProps {
  97. title: string;
  98. children: any[] | any;
  99. closed?: boolean;
  100. }
  101. export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {
  102. isExpanded: boolean;
  103. }> {
  104. constructor(props: ILineContainerComponentProps);
  105. switchExpandedState(): void;
  106. renderHeader(): JSX.Element;
  107. render(): JSX.Element;
  108. }
  109. }
  110. declare module GUIEDITOR {
  111. export class PropertyChangedEvent {
  112. object: any;
  113. property: string;
  114. value: any;
  115. initialValue: any;
  116. allowNullValue?: boolean;
  117. }
  118. }
  119. declare module GUIEDITOR {
  120. export interface ICheckBoxLineComponentProps {
  121. label: string;
  122. target?: any;
  123. propertyName?: string;
  124. isSelected?: () => boolean;
  125. onSelect?: (value: boolean) => void;
  126. onValueChanged?: () => void;
  127. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  128. disabled?: boolean;
  129. }
  130. export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
  131. isSelected: boolean;
  132. isDisabled?: boolean;
  133. }> {
  134. private static _UniqueIdSeed;
  135. private _uniqueId;
  136. private _localChange;
  137. constructor(props: ICheckBoxLineComponentProps);
  138. shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {
  139. isSelected: boolean;
  140. isDisabled: boolean;
  141. }): boolean;
  142. onChange(): void;
  143. render(): JSX.Element;
  144. }
  145. }
  146. declare module GUIEDITOR {
  147. export class PropertyChangedEvent {
  148. object: any;
  149. property: string;
  150. value: any;
  151. initialValue: any;
  152. }
  153. }
  154. declare module GUIEDITOR {
  155. interface IFloatLineComponentProps {
  156. label: string;
  157. target: any;
  158. propertyName: string;
  159. onChange?: (newValue: number) => void;
  160. isInteger?: boolean;
  161. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  162. additionalClass?: string;
  163. step?: string;
  164. digits?: number;
  165. globalState: GlobalState;
  166. min?: number;
  167. max?: number;
  168. smallUI?: boolean;
  169. onEnter?: (newValue: number) => void;
  170. }
  171. export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {
  172. value: string;
  173. }> {
  174. private _localChange;
  175. private _store;
  176. private _regExp;
  177. private _digits;
  178. constructor(props: IFloatLineComponentProps);
  179. shouldComponentUpdate(nextProps: IFloatLineComponentProps, nextState: {
  180. value: string;
  181. }): boolean;
  182. raiseOnPropertyChanged(newValue: number, previousValue: number): void;
  183. updateValue(valueString: string): void;
  184. render(): JSX.Element;
  185. }
  186. }
  187. declare module GUIEDITOR {
  188. interface ISliderLineComponentProps {
  189. label: string;
  190. target?: any;
  191. propertyName?: string;
  192. minimum: number;
  193. maximum: number;
  194. step: number;
  195. directValue?: number;
  196. useEuler?: boolean;
  197. onChange?: (value: number) => void;
  198. onInput?: (value: number) => void;
  199. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  200. decimalCount?: number;
  201. globalState: GlobalState;
  202. }
  203. export class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
  204. value: number;
  205. }> {
  206. private _localChange;
  207. constructor(props: ISliderLineComponentProps);
  208. shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
  209. value: number;
  210. }): boolean;
  211. onChange(newValueString: any): void;
  212. onInput(newValueString: any): void;
  213. prepareDataToRead(value: number): number;
  214. render(): JSX.Element;
  215. }
  216. }
  217. declare module GUIEDITOR {
  218. export class GenericPropertyComponent extends React.Component<IPropertyComponentProps> {
  219. constructor(props: IPropertyComponentProps);
  220. render(): JSX.Element;
  221. }
  222. export class GeneralPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  223. constructor(props: IPropertyComponentProps);
  224. render(): JSX.Element;
  225. }
  226. export class GenericPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  227. constructor(props: IPropertyComponentProps);
  228. forceRebuild(notifiers?: {
  229. "rebuild"?: boolean;
  230. "update"?: boolean;
  231. }): void;
  232. render(): JSX.Element;
  233. }
  234. }
  235. declare module GUIEDITOR {
  236. interface INumericInputComponentProps {
  237. label: string;
  238. value: number;
  239. step?: number;
  240. onChange: (value: number) => void;
  241. globalState: GlobalState;
  242. }
  243. export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
  244. value: string;
  245. }> {
  246. static defaultProps: {
  247. step: number;
  248. };
  249. private _localChange;
  250. constructor(props: INumericInputComponentProps);
  251. shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
  252. value: string;
  253. }): boolean;
  254. updateValue(evt: any): void;
  255. render(): JSX.Element;
  256. }
  257. }
  258. declare module GUIEDITOR {
  259. interface ITextLineComponentProps {
  260. label?: string;
  261. value?: string;
  262. color?: string;
  263. underline?: boolean;
  264. onLink?: () => void;
  265. url?: string;
  266. ignoreValue?: boolean;
  267. additionalClass?: string;
  268. }
  269. export class TextLineComponent extends React.Component<ITextLineComponentProps> {
  270. constructor(props: ITextLineComponentProps);
  271. onLink(): void;
  272. renderContent(): JSX.Element | null;
  273. render(): JSX.Element;
  274. }
  275. }
  276. declare module GUIEDITOR {
  277. export class SliderPropertyTabComponent extends React.Component<IPropertyComponentProps> {
  278. constructor(props: IPropertyComponentProps);
  279. private _slider;
  280. render(): JSX.Element;
  281. }
  282. }
  283. declare module GUIEDITOR {
  284. export class PropertyGuiLedger {
  285. static RegisteredControls: {
  286. [key: string]: React.ComponentClass<IPropertyComponentProps>;
  287. };
  288. }
  289. }
  290. declare module GUIEDITOR {
  291. export class GUINode {
  292. guiControl: Control;
  293. private _x;
  294. private _y;
  295. private _gridAlignedX;
  296. private _gridAlignedY;
  297. private _globalState;
  298. private _onSelectionChangedObserver;
  299. private _onSelectionBoxMovedObserver;
  300. private _onUpdateRequiredObserver;
  301. private _ownerCanvas;
  302. private _isSelected;
  303. private _isVisible;
  304. private _enclosingFrameId;
  305. get isVisible(): boolean;
  306. set isVisible(value: boolean);
  307. get gridAlignedX(): number;
  308. get gridAlignedY(): number;
  309. get x(): number;
  310. set x(value: number);
  311. get y(): number;
  312. set y(value: number);
  313. get width(): number;
  314. get height(): number;
  315. get id(): number;
  316. get name(): string | undefined;
  317. get isSelected(): boolean;
  318. get enclosingFrameId(): number;
  319. set enclosingFrameId(value: number);
  320. set isSelected(value: boolean);
  321. constructor(globalState: GlobalState, guiControl: Control);
  322. cleanAccumulation(useCeil?: boolean): void;
  323. clicked: boolean;
  324. _onMove(evt: BABYLON.Vector2, startPos: BABYLON.Vector2): boolean;
  325. renderProperties(): BABYLON.Nullable<JSX.Element>;
  326. updateVisual(): void;
  327. dispose(): void;
  328. }
  329. }
  330. declare module GUIEDITOR {
  331. export class GlobalState {
  332. guiTexture: AdvancedDynamicTexture;
  333. hostElement: HTMLElement;
  334. hostDocument: HTMLDocument;
  335. hostWindow: Window;
  336. onSelectionChangedObservable: BABYLON.Observable<BABYLON.Nullable<GUINode>>;
  337. onRebuildRequiredObservable: BABYLON.Observable<void>;
  338. onBuiltObservable: BABYLON.Observable<void>;
  339. onResetRequiredObservable: BABYLON.Observable<void>;
  340. onUpdateRequiredObservable: BABYLON.Observable<void>;
  341. onReOrganizedRequiredObservable: BABYLON.Observable<void>;
  342. onLogRequiredObservable: BABYLON.Observable<LogEntry>;
  343. onErrorMessageDialogRequiredObservable: BABYLON.Observable<string>;
  344. onIsLoadingChanged: BABYLON.Observable<boolean>;
  345. onSelectionBoxMoved: BABYLON.Observable<DOMRect | ClientRect>;
  346. onGuiNodeRemovalObservable: BABYLON.Observable<GUINode>;
  347. backgroundColor: BABYLON.Color4;
  348. blockKeyboardEvents: boolean;
  349. controlCamera: boolean;
  350. workbench: WorkbenchComponent;
  351. storeEditorData: (serializationObject: any) => void;
  352. customSave?: {
  353. label: string;
  354. action: (data: string) => Promise<void>;
  355. };
  356. constructor();
  357. }
  358. }
  359. declare module GUIEDITOR {
  360. export interface IButtonLineComponentProps {
  361. data: string;
  362. tooltip: string;
  363. }
  364. export class DraggableLineComponent extends React.Component<IButtonLineComponentProps> {
  365. constructor(props: IButtonLineComponentProps);
  366. render(): JSX.Element;
  367. }
  368. }
  369. declare module GUIEDITOR {
  370. interface IGuiListComponentProps {
  371. globalState: GlobalState;
  372. }
  373. export class GuiListComponent extends React.Component<IGuiListComponentProps, {
  374. filter: string;
  375. }> {
  376. private _onResetRequiredObserver;
  377. private static _Tooltips;
  378. constructor(props: IGuiListComponentProps);
  379. componentWillUnmount(): void;
  380. filterContent(filter: string): void;
  381. render(): JSX.Element;
  382. }
  383. }
  384. declare module GUIEDITOR {
  385. export interface IButtonLineComponentProps {
  386. label: string;
  387. onClick: () => void;
  388. }
  389. export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
  390. constructor(props: IButtonLineComponentProps);
  391. render(): JSX.Element;
  392. }
  393. }
  394. declare module GUIEDITOR {
  395. interface IFileButtonLineComponentProps {
  396. label: string;
  397. onClick: (file: File) => void;
  398. accept: string;
  399. }
  400. export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
  401. private static _IDGenerator;
  402. private _id;
  403. private uploadInputRef;
  404. constructor(props: IFileButtonLineComponentProps);
  405. onChange(evt: any): void;
  406. render(): JSX.Element;
  407. }
  408. }
  409. declare module GUIEDITOR {
  410. export class SerializationTools {
  411. static Deserialize(serializationObject: any, globalState: GlobalState): void;
  412. }
  413. }
  414. declare module GUIEDITOR {
  415. interface IPropertyTabComponentProps {
  416. globalState: GlobalState;
  417. }
  418. interface IPropertyTabComponentState {
  419. currentNode: BABYLON.Nullable<GUINode>;
  420. }
  421. export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, IPropertyTabComponentState> {
  422. private _onBuiltObserver;
  423. constructor(props: IPropertyTabComponentProps);
  424. componentDidMount(): void;
  425. componentWillUnmount(): void;
  426. load(file: File): void;
  427. loadFrame(file: File): void;
  428. save(): void;
  429. customSave(): void;
  430. saveToSnippetServer(): void;
  431. loadFromSnippet(): void;
  432. render(): JSX.Element;
  433. }
  434. }
  435. declare module GUIEDITOR {
  436. interface IPortalProps {
  437. globalState: GlobalState;
  438. }
  439. export class Portal extends React.Component<IPortalProps> {
  440. render(): React.ReactPortal;
  441. }
  442. }
  443. declare module GUIEDITOR {
  444. export class GUINodeTools {
  445. static CreateControlFromString(data: string): Slider | Checkbox | ColorPicker | Ellipse | Rectangle | Line | TextBlock;
  446. }
  447. }
  448. declare module GUIEDITOR {
  449. export interface INodeLocationInfo {
  450. blockId: number;
  451. x: number;
  452. y: number;
  453. }
  454. export interface IFrameData {
  455. x: number;
  456. y: number;
  457. width: number;
  458. height: number;
  459. color: number[];
  460. name: string;
  461. isCollapsed: boolean;
  462. blocks: number[];
  463. comments: string;
  464. }
  465. export interface IEditorData {
  466. locations: INodeLocationInfo[];
  467. x: number;
  468. y: number;
  469. zoom: number;
  470. frames?: IFrameData[];
  471. map?: {
  472. [key: number]: number;
  473. };
  474. }
  475. }
  476. declare module GUIEDITOR {
  477. interface IMessageDialogComponentProps {
  478. globalState: GlobalState;
  479. }
  480. export class MessageDialogComponent extends React.Component<IMessageDialogComponentProps, {
  481. message: string;
  482. isError: boolean;
  483. }> {
  484. constructor(props: IMessageDialogComponentProps);
  485. render(): JSX.Element | null;
  486. }
  487. }
  488. declare module GUIEDITOR {
  489. interface IGraphEditorProps {
  490. globalState: GlobalState;
  491. }
  492. interface IGraphEditorState {
  493. showPreviewPopUp: boolean;
  494. }
  495. export class WorkbenchEditor extends React.Component<IGraphEditorProps, IGraphEditorState> {
  496. private _workbenchCanvas;
  497. private _startX;
  498. private _moveInProgress;
  499. private _leftWidth;
  500. private _rightWidth;
  501. private _blocks;
  502. private _onWidgetKeyUpPointer;
  503. private _popUpWindow;
  504. /**
  505. * Creates a node and recursivly creates its parent nodes from it's input
  506. * @param block
  507. */
  508. createNodeFromObject(block: Control, recursion?: boolean): BABYLON.Nullable<GUINode>;
  509. componentDidMount(): void;
  510. componentWillUnmount(): void;
  511. constructor(props: IGraphEditorProps);
  512. pasteSelection(copiedNodes: GUINode[], currentX: number, currentY: number, selectNew?: boolean): GUINode[];
  513. zoomToFit(): void;
  514. showWaitScreen(): void;
  515. hideWaitScreen(): void;
  516. reOrganize(editorData?: BABYLON.Nullable<IEditorData>, isImportingAFrame?: boolean): void;
  517. onPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
  518. onPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
  519. resizeColumns(evt: React.PointerEvent<HTMLDivElement>, forLeft?: boolean): void;
  520. buildColumnLayout(): string;
  521. emitNewBlock(event: React.DragEvent<HTMLDivElement>): void;
  522. handlePopUp: () => void;
  523. handleClosingPopUp: () => void;
  524. createPopupWindow: (title: string, windowVariableName: string, width?: number, height?: number) => Window | null;
  525. copyStyles: (sourceDoc: HTMLDocument, targetDoc: HTMLDocument) => void;
  526. fixPopUpStyles: (document: Document) => void;
  527. render(): JSX.Element;
  528. }
  529. }
  530. declare module GUIEDITOR {
  531. export class Popup {
  532. static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;
  533. private static _CopyStyles;
  534. }
  535. }
  536. declare module GUIEDITOR {
  537. /**
  538. * Interface used to specify creation options for the gui editor
  539. */
  540. export interface IGUIEditorOptions {
  541. hostElement?: HTMLElement;
  542. customSave?: {
  543. label: string;
  544. action: (data: string) => Promise<void>;
  545. };
  546. customLoadObservable?: BABYLON.Observable<any>;
  547. }
  548. /**
  549. * Class used to create a gui editor
  550. */
  551. export class GUIEditor {
  552. private static _CurrentState;
  553. /**
  554. * Show the gui editor
  555. * @param options defines the options to use to configure the gui editor
  556. */
  557. static Show(options: IGUIEditorOptions): void;
  558. }
  559. }
  560. declare module GUIEDITOR {
  561. interface ILineWithFileButtonComponentProps {
  562. title: string;
  563. closed?: boolean;
  564. label: string;
  565. iconImage: any;
  566. onIconClick: (file: File) => void;
  567. accept: string;
  568. uploadName?: string;
  569. }
  570. export class LineWithFileButtonComponent extends React.Component<ILineWithFileButtonComponentProps, {
  571. isExpanded: boolean;
  572. }> {
  573. private uploadRef;
  574. constructor(props: ILineWithFileButtonComponentProps);
  575. onChange(evt: any): void;
  576. switchExpandedState(): void;
  577. render(): JSX.Element;
  578. }
  579. }
  580. declare module GUIEDITOR {
  581. interface ITextInputLineComponentProps {
  582. label: string;
  583. globalState: GlobalState;
  584. target?: any;
  585. propertyName?: string;
  586. value?: string;
  587. multilines?: boolean;
  588. onChange?: (value: string) => void;
  589. validator?: (value: string) => boolean;
  590. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  591. }
  592. export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
  593. value: string;
  594. }> {
  595. private _localChange;
  596. constructor(props: ITextInputLineComponentProps);
  597. shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
  598. value: string;
  599. }): boolean;
  600. raiseOnPropertyChanged(newValue: string, previousValue: string): void;
  601. updateValue(value: string, raisePropertyChanged: boolean): void;
  602. render(): JSX.Element;
  603. }
  604. }
  605. declare module GUIEDITOR {
  606. export interface IColorComponentEntryProps {
  607. value: number;
  608. label: string;
  609. max?: number;
  610. min?: number;
  611. onChange: (value: number) => void;
  612. }
  613. export class ColorComponentEntry extends React.Component<IColorComponentEntryProps> {
  614. constructor(props: IColorComponentEntryProps);
  615. updateValue(valueString: string): void;
  616. render(): JSX.Element;
  617. }
  618. }
  619. declare module GUIEDITOR {
  620. export interface IHexColorProps {
  621. value: string;
  622. expectedLength: number;
  623. onChange: (value: string) => void;
  624. }
  625. export class HexColor extends React.Component<IHexColorProps, {
  626. hex: string;
  627. }> {
  628. constructor(props: IHexColorProps);
  629. shouldComponentUpdate(nextProps: IHexColorProps, nextState: {
  630. hex: string;
  631. }): boolean;
  632. updateHexValue(valueString: string): void;
  633. render(): JSX.Element;
  634. }
  635. }
  636. declare module GUIEDITOR {
  637. /**
  638. * Interface used to specify creation options for color picker
  639. */
  640. export interface IColorPickerProps {
  641. color: BABYLON.Color3 | BABYLON.Color4;
  642. debugMode?: boolean;
  643. onColorChanged?: (color: BABYLON.Color3 | BABYLON.Color4) => void;
  644. }
  645. /**
  646. * Interface used to specify creation options for color picker
  647. */
  648. export interface IColorPickerState {
  649. color: BABYLON.Color3;
  650. alpha: number;
  651. }
  652. /**
  653. * Class used to create a color picker
  654. */
  655. export class ColorPicker extends React.Component<IColorPickerProps, IColorPickerState> {
  656. private _saturationRef;
  657. private _hueRef;
  658. private _isSaturationPointerDown;
  659. private _isHuePointerDown;
  660. constructor(props: IColorPickerProps);
  661. onSaturationPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
  662. onSaturationPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
  663. onSaturationPointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
  664. onHuePointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
  665. onHuePointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
  666. onHuePointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
  667. private _evaluateSaturation;
  668. private _evaluateHue;
  669. componentDidUpdate(): void;
  670. raiseOnColorChanged(): void;
  671. render(): JSX.Element;
  672. }
  673. }
  674. declare module GUIEDITOR {
  675. export interface IBooleanLineComponentProps {
  676. label: string;
  677. value: boolean;
  678. }
  679. export class BooleanLineComponent extends React.Component<IBooleanLineComponentProps> {
  680. constructor(props: IBooleanLineComponentProps);
  681. render(): JSX.Element;
  682. }
  683. }
  684. declare module GUIEDITOR {
  685. interface INumericInputComponentProps {
  686. label: string;
  687. value: number;
  688. step?: number;
  689. onChange: (value: number) => void;
  690. precision?: number;
  691. }
  692. export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
  693. value: string;
  694. }> {
  695. static defaultProps: {
  696. step: number;
  697. };
  698. private _localChange;
  699. constructor(props: INumericInputComponentProps);
  700. shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
  701. value: string;
  702. }): boolean;
  703. updateValue(evt: any): void;
  704. onBlur(): void;
  705. render(): JSX.Element;
  706. }
  707. }
  708. declare module GUIEDITOR {
  709. export interface IColorPickerComponentProps {
  710. value: BABYLON.Color4 | BABYLON.Color3;
  711. onColorChanged: (newOne: string) => void;
  712. }
  713. interface IColorPickerComponentState {
  714. pickerEnabled: boolean;
  715. color: BABYLON.Color3 | BABYLON.Color4;
  716. hex: string;
  717. }
  718. export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
  719. private _floatRef;
  720. private _floatHostRef;
  721. constructor(props: IColorPickerComponentProps);
  722. syncPositions(): void;
  723. shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
  724. componentDidUpdate(): void;
  725. componentDidMount(): void;
  726. render(): JSX.Element;
  727. }
  728. }
  729. declare module GUIEDITOR {
  730. export interface IColor3LineComponentProps {
  731. label: string;
  732. target: any;
  733. propertyName: string;
  734. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  735. isLinear?: boolean;
  736. }
  737. export class Color3LineComponent extends React.Component<IColor3LineComponentProps, {
  738. isExpanded: boolean;
  739. color: BABYLON.Color3;
  740. }> {
  741. private _localChange;
  742. constructor(props: IColor3LineComponentProps);
  743. shouldComponentUpdate(nextProps: IColor3LineComponentProps, nextState: {
  744. color: BABYLON.Color3;
  745. }): boolean;
  746. setPropertyValue(newColor: BABYLON.Color3): void;
  747. onChange(newValue: string): void;
  748. switchExpandState(): void;
  749. raiseOnPropertyChanged(previousValue: BABYLON.Color3): void;
  750. updateStateR(value: number): void;
  751. updateStateG(value: number): void;
  752. updateStateB(value: number): void;
  753. copyToClipboard(): void;
  754. render(): JSX.Element;
  755. }
  756. }
  757. declare module GUIEDITOR {
  758. export interface IColor4LineComponentProps {
  759. label: string;
  760. target: any;
  761. propertyName: string;
  762. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  763. onChange?: () => void;
  764. isLinear?: boolean;
  765. }
  766. export class Color4LineComponent extends React.Component<IColor4LineComponentProps, {
  767. isExpanded: boolean;
  768. color: BABYLON.Color4;
  769. }> {
  770. private _localChange;
  771. constructor(props: IColor4LineComponentProps);
  772. shouldComponentUpdate(nextProps: IColor4LineComponentProps, nextState: {
  773. color: BABYLON.Color4;
  774. }): boolean;
  775. setPropertyValue(newColor: BABYLON.Color4): void;
  776. onChange(newValue: string): void;
  777. switchExpandState(): void;
  778. raiseOnPropertyChanged(previousValue: BABYLON.Color4): void;
  779. updateStateR(value: number): void;
  780. updateStateG(value: number): void;
  781. updateStateB(value: number): void;
  782. updateStateA(value: number): void;
  783. copyToClipboard(): void;
  784. render(): JSX.Element;
  785. }
  786. }
  787. declare module GUIEDITOR {
  788. interface IFileMultipleButtonLineComponentProps {
  789. label: string;
  790. onClick: (event: any) => void;
  791. accept: string;
  792. }
  793. export class FileMultipleButtonLineComponent extends React.Component<IFileMultipleButtonLineComponentProps> {
  794. private static _IDGenerator;
  795. private _id;
  796. private uploadInputRef;
  797. constructor(props: IFileMultipleButtonLineComponentProps);
  798. onChange(evt: any): void;
  799. render(): JSX.Element;
  800. }
  801. }
  802. declare module GUIEDITOR {
  803. export interface IIconButtonLineComponentProps {
  804. icon: string;
  805. onClick: () => void;
  806. tooltip: string;
  807. active?: boolean;
  808. }
  809. export class IconButtonLineComponent extends React.Component<IIconButtonLineComponentProps> {
  810. constructor(props: IIconButtonLineComponentProps);
  811. render(): JSX.Element;
  812. }
  813. }
  814. declare module GUIEDITOR {
  815. interface IIndentedTextLineComponentProps {
  816. value?: string;
  817. color?: string;
  818. underline?: boolean;
  819. onLink?: () => void;
  820. url?: string;
  821. additionalClass?: string;
  822. }
  823. export class IndentedTextLineComponent extends React.Component<IIndentedTextLineComponentProps> {
  824. constructor(props: IIndentedTextLineComponentProps);
  825. onLink(): void;
  826. renderContent(): JSX.Element;
  827. render(): JSX.Element;
  828. }
  829. }
  830. declare module GUIEDITOR {
  831. interface ILinkButtonComponentProps {
  832. label: string;
  833. buttonLabel: string;
  834. url?: string;
  835. onClick: () => void;
  836. onIconClick?: () => void;
  837. }
  838. export class LinkButtonComponent extends React.Component<ILinkButtonComponentProps> {
  839. constructor(props: ILinkButtonComponentProps);
  840. onLink(): void;
  841. render(): JSX.Element;
  842. }
  843. }
  844. declare module GUIEDITOR {
  845. interface IMessageLineComponentProps {
  846. text: string;
  847. color?: string;
  848. }
  849. export class MessageLineComponent extends React.Component<IMessageLineComponentProps> {
  850. constructor(props: IMessageLineComponentProps);
  851. render(): JSX.Element;
  852. }
  853. }
  854. declare module GUIEDITOR {
  855. export const Null_Value: number;
  856. export class ListLineOption {
  857. label: string;
  858. value: number;
  859. selected?: boolean;
  860. }
  861. export interface IOptionsLineComponentProps {
  862. label: string;
  863. target: any;
  864. propertyName: string;
  865. options: ListLineOption[];
  866. noDirectUpdate?: boolean;
  867. onSelect?: (value: number) => void;
  868. extractValue?: () => number;
  869. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  870. allowNullValue?: boolean;
  871. }
  872. export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
  873. value: number;
  874. }> {
  875. private _localChange;
  876. private remapValueIn;
  877. private remapValueOut;
  878. constructor(props: IOptionsLineComponentProps);
  879. shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
  880. value: number;
  881. }): boolean;
  882. raiseOnPropertyChanged(newValue: number, previousValue: number): void;
  883. updateValue(valueString: string): void;
  884. render(): JSX.Element;
  885. }
  886. }
  887. declare module GUIEDITOR {
  888. interface IRadioButtonLineComponentProps {
  889. onSelectionChangedObservable: BABYLON.Observable<RadioButtonLineComponent>;
  890. label: string;
  891. isSelected: () => boolean;
  892. onSelect: () => void;
  893. }
  894. export class RadioButtonLineComponent extends React.Component<IRadioButtonLineComponentProps, {
  895. isSelected: boolean;
  896. }> {
  897. private _onSelectionChangedObserver;
  898. constructor(props: IRadioButtonLineComponentProps);
  899. componentDidMount(): void;
  900. componentWillUnmount(): void;
  901. onChange(): void;
  902. render(): JSX.Element;
  903. }
  904. }
  905. declare module GUIEDITOR {
  906. interface IValueLineComponentProps {
  907. label: string;
  908. value: number;
  909. color?: string;
  910. fractionDigits?: number;
  911. units?: string;
  912. }
  913. export class ValueLineComponent extends React.Component<IValueLineComponentProps> {
  914. constructor(props: IValueLineComponentProps);
  915. render(): JSX.Element;
  916. }
  917. }
  918. declare module GUIEDITOR {
  919. interface IVector2LineComponentProps {
  920. label: string;
  921. target: any;
  922. propertyName: string;
  923. step?: number;
  924. onChange?: (newvalue: BABYLON.Vector2) => void;
  925. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  926. }
  927. export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
  928. isExpanded: boolean;
  929. value: BABYLON.Vector2;
  930. }> {
  931. static defaultProps: {
  932. step: number;
  933. };
  934. private _localChange;
  935. constructor(props: IVector2LineComponentProps);
  936. shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {
  937. isExpanded: boolean;
  938. value: BABYLON.Vector2;
  939. }): boolean;
  940. switchExpandState(): void;
  941. raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;
  942. updateStateX(value: number): void;
  943. updateStateY(value: number): void;
  944. render(): JSX.Element;
  945. }
  946. }
  947. declare module GUIEDITOR {
  948. interface IVector4LineComponentProps {
  949. label: string;
  950. target: any;
  951. propertyName: string;
  952. step?: number;
  953. onChange?: (newvalue: BABYLON.Vector4) => void;
  954. useEuler?: boolean;
  955. onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
  956. }
  957. export class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
  958. isExpanded: boolean;
  959. value: BABYLON.Vector4;
  960. }> {
  961. static defaultProps: {
  962. step: number;
  963. };
  964. private _localChange;
  965. constructor(props: IVector4LineComponentProps);
  966. getCurrentValue(): any;
  967. shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
  968. isExpanded: boolean;
  969. value: BABYLON.Vector4;
  970. }): boolean;
  971. switchExpandState(): void;
  972. raiseOnPropertyChanged(previousValue: BABYLON.Vector4): void;
  973. updateVector4(): void;
  974. updateStateX(value: number): void;
  975. updateStateY(value: number): void;
  976. updateStateZ(value: number): void;
  977. updateStateW(value: number): void;
  978. render(): JSX.Element;
  979. }
  980. }