@babylonjs/shared-ui-components 7.11.4 → 7.13.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@babylonjs/shared-ui-components",
3
- "version": "7.11.4",
3
+ "version": "7.13.0",
4
4
  "main": "index.js",
5
5
  "module": "index.js",
6
6
  "types": "index.d.ts",
@@ -1,7 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
3
  import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
4
- import { TextWrapping } from "@babylonjs/gui/2D/controls/textBlock.js";
5
4
  import { Control } from "@babylonjs/gui/2D/controls/control.js";
6
5
  import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
7
6
  import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
@@ -25,10 +24,10 @@ export class TextBlockPropertyGridComponent extends React.Component {
25
24
  { label: "Center", value: Control.VERTICAL_ALIGNMENT_CENTER },
26
25
  ];
27
26
  const wrappingOptions = [
28
- { label: "Clip", value: TextWrapping.Clip },
29
- { label: "Ellipsis", value: TextWrapping.Ellipsis },
30
- { label: "Word wrap", value: TextWrapping.WordWrap },
31
- { label: "Word wrap ellipsis", value: TextWrapping.WordWrapEllipsis },
27
+ { label: "Clip", value: 0 /* TextWrapping.Clip */ },
28
+ { label: "Ellipsis", value: 2 /* TextWrapping.Ellipsis */ },
29
+ { label: "Word wrap", value: 1 /* TextWrapping.WordWrap */ },
30
+ { label: "Word wrap ellipsis", value: 3 /* TextWrapping.WordWrapEllipsis */ },
32
31
  ];
33
32
  return (_jsxs(_Fragment, { children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: textBlock, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "TEXTBLOCK", children: [_jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Text", target: textBlock, propertyName: "text", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLine, { label: "Horizontal text alignment", options: horizontalOptions, target: textBlock, propertyName: "textHorizontalAlignment", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLine, { label: "Vertical text alignment", options: verticalOptions, target: textBlock, propertyName: "textVerticalAlignment", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Resize to fit", target: textBlock, propertyName: "resizeToFit", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLine, { label: "Wrapping", options: wrappingOptions, target: textBlock, propertyName: "textWrapping", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Line spacing", target: textBlock, propertyName: "lineSpacing", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), _jsxs(LineContainerComponent, { title: "OUTLINE", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Outline width", target: textBlock, propertyName: "outlineWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Outline color", target: textBlock, propertyName: "outlineColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
34
33
  }
@@ -1 +1 @@
1
- {"version":3,"file":"textBlockPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/textBlockPropertyGridComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oEAAoE,CAAC;AAExH,OAAO,EAAE,YAAY,EAAE,gDAAkC;AACzD,OAAO,EAAE,OAAO,EAAE,8CAAgC;AAClD,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAE/E,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAQvE,MAAM,OAAO,8BAA+B,SAAQ,KAAK,CAAC,SAA+C;IACrG,YAAY,KAA2C;QACnD,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAEQ,MAAM;QACX,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QAEvC,MAAM,iBAAiB,GAAG;YACtB,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,yBAAyB,EAAE;YAC3D,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,CAAC,0BAA0B,EAAE;YAC7D,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,CAAC,2BAA2B,EAAE;SAClE,CAAC;QAEF,MAAM,eAAe,GAAG;YACpB,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,sBAAsB,EAAE;YACvD,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,CAAC,yBAAyB,EAAE;YAC7D,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,CAAC,yBAAyB,EAAE;SAChE,CAAC;QAEF,MAAM,eAAe,GAAG;YACpB,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,EAAE;YAC3C,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE;YACnD,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,CAAC,QAAQ,EAAE;YACpD,EAAE,KAAK,EAAE,oBAAoB,EAAE,KAAK,EAAE,YAAY,CAAC,gBAAgB,EAAE;SACxE,CAAC;QAEF,OAAO,CACH,8BACI,KAAC,kCAAkC,IAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GAAI,EAClK,MAAC,sBAAsB,IAAC,KAAK,EAAC,WAAW,aACrC,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,MAAM,EACZ,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,MAAM,EACnB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,WAAW,IACR,KAAK,EAAC,2BAA2B,EACjC,OAAO,EAAE,iBAAiB,EAC1B,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,yBAAyB,EACtC,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,WAAW,IACR,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,eAAe,EACxB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,uBAAuB,EACpC,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,qBAAqB,IAClB,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,aAAa,EAC1B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,WAAW,IACR,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,eAAe,EACxB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,cAAc,EACpB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,aAAa,EAC1B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,EACzB,MAAC,sBAAsB,IAAC,KAAK,EAAC,SAAS,aACnC,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,IAC1B,CACN,CAAC;IACN,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { TextBlock } from \"gui/2D/controls/textBlock\";\r\nimport { TextWrapping } from \"gui/2D/controls/textBlock\";\r\nimport { Control } from \"gui/2D/controls/control\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport { OptionsLine } from \"../../../lines/optionsLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\n\r\ninterface ITextBlockPropertyGridComponentProps {\r\n textBlock: TextBlock;\r\n lockObject: LockObject;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class TextBlockPropertyGridComponent extends React.Component<ITextBlockPropertyGridComponentProps> {\r\n constructor(props: ITextBlockPropertyGridComponentProps) {\r\n super(props);\r\n }\r\n\r\n override render() {\r\n const textBlock = this.props.textBlock;\r\n\r\n const horizontalOptions = [\r\n { label: \"Left\", value: Control.HORIZONTAL_ALIGNMENT_LEFT },\r\n { label: \"Right\", value: Control.HORIZONTAL_ALIGNMENT_RIGHT },\r\n { label: \"Center\", value: Control.HORIZONTAL_ALIGNMENT_CENTER },\r\n ];\r\n\r\n const verticalOptions = [\r\n { label: \"Top\", value: Control.VERTICAL_ALIGNMENT_TOP },\r\n { label: \"Bottom\", value: Control.VERTICAL_ALIGNMENT_BOTTOM },\r\n { label: \"Center\", value: Control.VERTICAL_ALIGNMENT_CENTER },\r\n ];\r\n\r\n const wrappingOptions = [\r\n { label: \"Clip\", value: TextWrapping.Clip },\r\n { label: \"Ellipsis\", value: TextWrapping.Ellipsis },\r\n { label: \"Word wrap\", value: TextWrapping.WordWrap },\r\n { label: \"Word wrap ellipsis\", value: TextWrapping.WordWrapEllipsis },\r\n ];\r\n\r\n return (\r\n <>\r\n <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={textBlock} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n <LineContainerComponent title=\"TEXTBLOCK\">\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Text\"\r\n target={textBlock}\r\n propertyName=\"text\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Horizontal text alignment\"\r\n options={horizontalOptions}\r\n target={textBlock}\r\n propertyName=\"textHorizontalAlignment\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Vertical text alignment\"\r\n options={verticalOptions}\r\n target={textBlock}\r\n propertyName=\"textVerticalAlignment\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <CheckBoxLineComponent\r\n label=\"Resize to fit\"\r\n target={textBlock}\r\n propertyName=\"resizeToFit\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Wrapping\"\r\n options={wrappingOptions}\r\n target={textBlock}\r\n propertyName=\"textWrapping\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Line spacing\"\r\n target={textBlock}\r\n propertyName=\"lineSpacing\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n </LineContainerComponent>\r\n <LineContainerComponent title=\"OUTLINE\">\r\n <FloatLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Outline width\"\r\n target={textBlock}\r\n propertyName=\"outlineWidth\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Outline color\"\r\n target={textBlock}\r\n propertyName=\"outlineColor\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n </LineContainerComponent>\r\n </>\r\n );\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"textBlockPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/textBlockPropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { TextBlock } from \"gui/2D/controls/textBlock\";\r\nimport { TextWrapping } from \"gui/2D/controls/textBlock\";\r\nimport { Control } from \"gui/2D/controls/control\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport { OptionsLine } from \"../../../lines/optionsLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\n\r\ninterface ITextBlockPropertyGridComponentProps {\r\n textBlock: TextBlock;\r\n lockObject: LockObject;\r\n onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class TextBlockPropertyGridComponent extends React.Component<ITextBlockPropertyGridComponentProps> {\r\n constructor(props: ITextBlockPropertyGridComponentProps) {\r\n super(props);\r\n }\r\n\r\n override render() {\r\n const textBlock = this.props.textBlock;\r\n\r\n const horizontalOptions = [\r\n { label: \"Left\", value: Control.HORIZONTAL_ALIGNMENT_LEFT },\r\n { label: \"Right\", value: Control.HORIZONTAL_ALIGNMENT_RIGHT },\r\n { label: \"Center\", value: Control.HORIZONTAL_ALIGNMENT_CENTER },\r\n ];\r\n\r\n const verticalOptions = [\r\n { label: \"Top\", value: Control.VERTICAL_ALIGNMENT_TOP },\r\n { label: \"Bottom\", value: Control.VERTICAL_ALIGNMENT_BOTTOM },\r\n { label: \"Center\", value: Control.VERTICAL_ALIGNMENT_CENTER },\r\n ];\r\n\r\n const wrappingOptions = [\r\n { label: \"Clip\", value: TextWrapping.Clip },\r\n { label: \"Ellipsis\", value: TextWrapping.Ellipsis },\r\n { label: \"Word wrap\", value: TextWrapping.WordWrap },\r\n { label: \"Word wrap ellipsis\", value: TextWrapping.WordWrapEllipsis },\r\n ];\r\n\r\n return (\r\n <>\r\n <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={textBlock} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n <LineContainerComponent title=\"TEXTBLOCK\">\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Text\"\r\n target={textBlock}\r\n propertyName=\"text\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Horizontal text alignment\"\r\n options={horizontalOptions}\r\n target={textBlock}\r\n propertyName=\"textHorizontalAlignment\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Vertical text alignment\"\r\n options={verticalOptions}\r\n target={textBlock}\r\n propertyName=\"textVerticalAlignment\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <CheckBoxLineComponent\r\n label=\"Resize to fit\"\r\n target={textBlock}\r\n propertyName=\"resizeToFit\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <OptionsLine\r\n label=\"Wrapping\"\r\n options={wrappingOptions}\r\n target={textBlock}\r\n propertyName=\"textWrapping\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Line spacing\"\r\n target={textBlock}\r\n propertyName=\"lineSpacing\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n </LineContainerComponent>\r\n <LineContainerComponent title=\"OUTLINE\">\r\n <FloatLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Outline width\"\r\n target={textBlock}\r\n propertyName=\"outlineWidth\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n <TextInputLineComponent\r\n lockObject={this.props.lockObject}\r\n label=\"Outline color\"\r\n target={textBlock}\r\n propertyName=\"outlineColor\"\r\n onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n />\r\n </LineContainerComponent>\r\n </>\r\n );\r\n }\r\n}\r\n"]}