@itwin/appui-react 5.5.0 → 5.7.0

package/CHANGELOG.md

@@ -1,5 +1,148 @@
 # Change Log - @itwin/appui-react
 
+## 5.7.0
+
+### Minor Changes
+
+- 6a13347: Add `data-item-id` attributes to toolbar items of `Toolbar` component.
+- ba32702: Added new `SnapMode.PerpendicularPoint` and `SnapMode.TangentPoint` options to the `SnapModeField` component. These new snap modes are only available when using the `@itwin/core-frontend@>=5.0.0`.
+- e3f7b56: Updated tool settings to display the lock button as an input decoration when the `toolSettingsLockButton` preview feature is enabled. This is supported when using the new editor system via the `toolSettingsNewEditors` preview feature.
+
+  Editors that support the lock button input decoration:
+
+  - Text editor
+  - Numeric editor
+  - Custom number editor
+
+  A separate control will still be displayed as a sibling if the lock cannot be displayed by the editor. Common cases include:
+
+  - Non-input editors (i.e. locking a toggle property)
+  - Custom editors (i.e. custom editor implementations that do not display the lock decoration)
+
+  Note that a separate lock control can only be displayed for the first dialog item in a row. Consider this scenario:
+
+  ```tsx
+  const useX = new DialogProperty();
+  const x = new DialogProperty();
+
+  const useY = new DialogProperty();
+  const y = new DialogProperty();
+
+  // Tool is supplying these tool setting properties.
+  const dialogItems = [
+    x.toDialogItem(
+      {
+        columnIndex: 0,
+        rowPriority: 1,
+      },
+      useX.toDialogItem({ columnIndex: 0, rowPriority: 1 })
+    ),
+    y.toDialogItem(
+      {
+        columnIndex: 0,
+        rowPriority: 1,
+      },
+      useY.toDialogItem({ columnIndex: 0, rowPriority: 1 })
+    ),
+  ];
+
+  // The old behavior would display the lock as a separate control for the first dialog item of the row, which is `x`.
+  // The new behavior will display the lock as an input decoration for both `x` and `y`. A separate lock control might be displayed for `x` only.
+  ```
+
+  Added `LockButtonInputDecoration` component to allow consumers to display the lock button as an input decoration in custom editors. For now this component is only compatible with the [iTwinUI Input](https://itwinui.bentley.com/docs/inputwithdecorations), but additional APIs can be exposed in the future. Usage example:
+
+  ```tsx
+  function MyCustomEditor(props) {
+    // ...
+    return (
+      <InputWithDecorations>
+        {/* ... */}
+        <LockButtonInputDecoration />
+      </InputWithDecorations>
+    );
+  }
+  ```
+
+- fe40d0a: Add `visible`, `onVisibleChange`, `pinned` and `onPinnedChange` props to `ToolAssistanceField` component. These props can be used to manually control the visibility and pinned state of the field.
+
+  ```tsx
+  function CustomField(props) {
+    // Field is open by default
+    const [visible, setVisible] = React.useState(true);
+    return (
+      <ToolAssistanceField
+        {...props}
+        visible={visible}
+        // Update the state so the field can be opened/closed
+        onVisibleChange={setVisible}
+        // Field is always pinned
+        pinned={true}
+      />
+    );
+  }
+  ```
+
+### Patch Changes
+
+- Updated dependencies [fd58c9f]
+  - @itwin/components-react@5.7.0
+  - @itwin/imodel-components-react@5.7.0
+  - @itwin/core-react@5.7.0
+
+## 5.6.0
+
+### Minor Changes
+
+- 1d29f92: Added `toolSettingsLockButton` preview feature, which when enabled will render an icon button instead of a checkbox as the default tool settings lock editor.
+
+  ```tsx
+  <PreviewFeaturesProvider
+    features={{
+      toolSettingsLockButton: true,
+    }}
+  >
+    <App />
+  </PreviewFeaturesProvider>
+  ```
+
+  Displayed icon button can be customized via the `BaseDialogItem` interface.
+
+  ```ts
+  const propertyDescription =
+    PropertyDescriptionHelper.buildLockPropertyDescription("useLength");
+  propertyDescription.displayLabel = "Toggle length lock";
+
+  const property: BaseDialogItem = {
+    value: {
+      value: true,
+    },
+    property: propertyDescription,
+    isDisabled: true,
+  };
+  // Displays an active, disabled icon button with a custom label.
+  ```
+
+  Custom lock editor components can still be displayed by customizing the lock `PropertyDescription`, even if `toolSettingsLockButton` is enabled.
+
+  ```ts
+  const property =
+    PropertyDescriptionHelper.buildLockPropertyDescription("useRadius");
+  property.editor = {
+    name: StandardEditorNames.Toggle,
+  };
+  // Displays a switch component.
+  ```
+
+- 6c97fa4: Updated the tool settings data provider to invoke `IModelApp.toolAdmin.simulateMotionEvent` after applying the tool setting property change. This causes the update to the dynamic graphics of the active tool without requiring an explicit motion event. `simulateMotionEvent` is only available from `v5.0` of `@itwin/core-frontend`.
+
+### Patch Changes
+
+- Updated dependencies [a4b74f9]
+  - @itwin/components-react@5.6.0
+  - @itwin/imodel-components-react@5.6.0
+  - @itwin/core-react@5.6.0
+
 ## 5.5.0
 
 ### Minor Changes

package/lib/appui-react/UiFramework.json

@@ -62,7 +62,9 @@
         "origin": "Origin",
         "midpoint": "Midpoint",
         "bisector": "Bisector",
-        "multi": "Multiple"
+        "multi": "Multiple",
+        "perpendicularPoint": "Perpendicular point",
+        "tangentPoint": "Tangent point"
     },
     "selectionScopeField": {
         "label": "Scope",

package/lib/appui-react/editors/CustomNumberEditor.d.ts

@@ -0,0 +1,10 @@
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { CustomNumberPropertyEditor as BaseCustomNumberPropertyEditor } from "@itwin/components-react";
+/** @internal */
+export declare class CustomNumberPropertyEditor extends BaseCustomNumberPropertyEditor {
+    get reactNode(): React.JSX.Element;
+}
+//# sourceMappingURL=CustomNumberEditor.d.ts.map

package/lib/appui-react/editors/CustomNumberEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomNumberEditor.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/CustomNumberEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAEL,0BAA0B,IAAI,8BAA8B,EAC7D,MAAM,yBAAyB,CAAC;AAOjC,gBAAgB;AAChB,qBAAa,0BAA2B,SAAQ,8BAA8B;IAC5E,IAAoB,SAAS,sBAE5B;CACF"}

package/lib/appui-react/editors/CustomNumberEditor.js

@@ -0,0 +1,24 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { CustomNumberEditor as BaseCustomNumberEditor, CustomNumberPropertyEditor as BaseCustomNumberPropertyEditor, } from "@itwin/components-react";
+import { LockButtonInputDecoration, useLockDecoration, } from "./LockProvider.js";
+/** @internal */
+export class CustomNumberPropertyEditor extends BaseCustomNumberPropertyEditor {
+    get reactNode() {
+        return React.createElement(CustomNumberEditor, null);
+    }
+}
+const CustomNumberEditor = React.forwardRef(function CustomNumberEditor(props, forwardedRef) {
+    const lockDecoration = useLockDecoration();
+    const internalProps = {
+        decoration: lockDecoration ? React.createElement(LockButtonInputDecoration, null) : undefined,
+    };
+    return (React.createElement(BaseCustomNumberEditor, { ...props, ...internalProps, ref: forwardedRef }));
+});
+//# sourceMappingURL=CustomNumberEditor.js.map

package/lib/appui-react/editors/CustomNumberEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomNumberEditor.js","sourceRoot":"","sources":["../../../src/appui-react/editors/CustomNumberEditor.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,kBAAkB,IAAI,sBAAsB,EAC5C,0BAA0B,IAAI,8BAA8B,GAC7D,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,yBAAyB,EACzB,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAE3B,gBAAgB;AAChB,MAAM,OAAO,0BAA2B,SAAQ,8BAA8B;IAC5E,IAAoB,SAAS;QAC3B,OAAO,oBAAC,kBAAkB,OAAG,CAAC;IAChC,CAAC;CACF;AAED,MAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CACzC,SAAS,kBAAkB,CAAC,KAAK,EAAE,YAAY;IAC7C,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAC3C,MAAM,aAAa,GAAG;QACpB,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,oBAAC,yBAAyB,OAAG,CAAC,CAAC,CAAC,SAAS;KACpC,CAAC;IACrC,OAAO,CACL,oBAAC,sBAAsB,OACjB,KAAK,KACL,aAAa,EACjB,GAAG,EAAE,YAAY,GACjB,CACH,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport * as React from \"react\";\nimport {\n  CustomNumberEditor as BaseCustomNumberEditor,\n  CustomNumberPropertyEditor as BaseCustomNumberPropertyEditor,\n} from \"@itwin/components-react\";\nimport type { InternalInputEditorProps } from \"@itwin/components-react/internal\";\nimport {\n  LockButtonInputDecoration,\n  useLockDecoration,\n} from \"./LockProvider.js\";\n\n/** @internal */\nexport class CustomNumberPropertyEditor extends BaseCustomNumberPropertyEditor {\n  public override get reactNode() {\n    return <CustomNumberEditor />;\n  }\n}\n\nconst CustomNumberEditor = React.forwardRef<BaseCustomNumberEditor>(\n  function CustomNumberEditor(props, forwardedRef) {\n    const lockDecoration = useLockDecoration();\n    const internalProps = {\n      decoration: lockDecoration ? <LockButtonInputDecoration /> : undefined,\n    } satisfies InternalInputEditorProps;\n    return (\n      <BaseCustomNumberEditor\n        {...props}\n        {...internalProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"]}

package/lib/appui-react/editors/LockEditor.d.ts

@@ -0,0 +1,12 @@
+/** @packageDocumentation
+ * @module UiProvider
+ */
+import * as React from "react";
+import { PropertyEditorBase } from "@itwin/components-react";
+/** @internal */
+export declare class LockPropertyEditor extends PropertyEditorBase {
+    get reactNode(): React.JSX.Element;
+}
+/** @internal */
+export declare const LockPropertyEditorName = "appui-internal:tool-settings-lock";
+//# sourceMappingURL=LockEditor.d.ts.map

package/lib/appui-react/editors/LockEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LockEditor.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/LockEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAyE7D,gBAAgB;AAChB,qBAAa,kBAAmB,SAAQ,kBAAkB;IACxD,IAAW,SAAS,sBAEnB;CACF;AAED,gBAAgB;AAChB,eAAO,MAAM,sBAAsB,sCAAsC,CAAC"}

package/lib/appui-react/editors/LockEditor.js

@@ -0,0 +1,64 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module UiProvider
+ */
+import * as React from "react";
+import { PropertyEditorBase } from "@itwin/components-react";
+import { IconButton } from "@itwin/itwinui-react";
+import { SvgLock, SvgLockUnlocked } from "@itwin/itwinui-icons-react";
+import { PropertyValueFormat } from "@itwin/appui-abstract";
+const LockEditor = React.forwardRef(function LockEditor(props, forwardedRef) {
+    const ref = React.useRef(null);
+    const getCurrentValue = () => {
+        if (props.propertyRecord &&
+            props.propertyRecord.value.valueFormat === PropertyValueFormat.Primitive) {
+            return props.propertyRecord.value.value;
+        }
+        return false;
+    };
+    const currentValue = getCurrentValue();
+    React.useImperativeHandle(forwardedRef, () => ({
+        getPropertyValue: async () => {
+            let propertyValue;
+            if (props.propertyRecord &&
+                props.propertyRecord.value.valueFormat ===
+                    PropertyValueFormat.Primitive) {
+                propertyValue = {
+                    valueFormat: PropertyValueFormat.Primitive,
+                    value: currentValue,
+                    displayValue: "",
+                };
+            }
+            return propertyValue;
+        },
+        htmlElement: ref.current,
+        hasFocus: document.activeElement === ref.current,
+    }), [currentValue, props.propertyRecord]);
+    const displayLabel = props.propertyRecord?.property.displayLabel;
+    const label = displayLabel ? displayLabel : "Toggle lock";
+    const disabled = props.propertyRecord?.isDisabled;
+    return (React.createElement(IconButton, { ref: ref, label: label, size: "small", styleType: "borderless", isActive: currentValue, disabled: disabled, onClick: () => {
+            if (!props.propertyRecord || !props.onCommit)
+                return;
+            props.onCommit({
+                propertyRecord: props.propertyRecord,
+                newValue: {
+                    valueFormat: PropertyValueFormat.Primitive,
+                    value: !currentValue,
+                    displayValue: "",
+                },
+            });
+        } }, currentValue ? React.createElement(SvgLock, null) : React.createElement(SvgLockUnlocked, null)));
+});
+/** @internal */
+export class LockPropertyEditor extends PropertyEditorBase {
+    get reactNode() {
+        return React.createElement(LockEditor, null);
+    }
+}
+/** @internal */
+export const LockPropertyEditorName = "appui-internal:tool-settings-lock";
+//# sourceMappingURL=LockEditor.js.map

package/lib/appui-react/editors/LockEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LockEditor.js","sourceRoot":"","sources":["../../../src/appui-react/editors/LockEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module UiProvider\n */\n\nimport * as React from \"react\";\nimport type { PropertyEditorProps, TypeEditor } from \"@itwin/components-react\";\nimport { PropertyEditorBase } from \"@itwin/components-react\";\nimport { IconButton } from \"@itwin/itwinui-react\";\nimport { SvgLock, SvgLockUnlocked } from \"@itwin/itwinui-icons-react\";\nimport type { PropertyValue } from \"@itwin/appui-abstract\";\nimport { PropertyValueFormat } from \"@itwin/appui-abstract\";\n\nconst LockEditor = React.forwardRef<TypeEditor, PropertyEditorProps>(\n  function LockEditor(props, forwardedRef) {\n    const ref = React.useRef<HTMLButtonElement>(null);\n    const getCurrentValue = () => {\n      if (\n        props.propertyRecord &&\n        props.propertyRecord.value.valueFormat === PropertyValueFormat.Primitive\n      ) {\n        return props.propertyRecord.value.value as boolean;\n      }\n      return false;\n    };\n    const currentValue = getCurrentValue();\n\n    React.useImperativeHandle(\n      forwardedRef,\n      () => ({\n        getPropertyValue: async () => {\n          let propertyValue: PropertyValue | undefined;\n          if (\n            props.propertyRecord &&\n            props.propertyRecord.value.valueFormat ===\n              PropertyValueFormat.Primitive\n          ) {\n            propertyValue = {\n              valueFormat: PropertyValueFormat.Primitive,\n              value: currentValue,\n              displayValue: \"\",\n            };\n          }\n          return propertyValue;\n        },\n        htmlElement: ref.current,\n        hasFocus: document.activeElement === ref.current,\n      }),\n      [currentValue, props.propertyRecord]\n    );\n\n    const displayLabel = props.propertyRecord?.property.displayLabel;\n    const label = displayLabel ? displayLabel : \"Toggle lock\";\n    const disabled = props.propertyRecord?.isDisabled;\n    return (\n      <IconButton\n        ref={ref}\n        label={label}\n        size=\"small\"\n        styleType=\"borderless\"\n        isActive={currentValue}\n        disabled={disabled}\n        onClick={() => {\n          if (!props.propertyRecord || !props.onCommit) return;\n          props.onCommit({\n            propertyRecord: props.propertyRecord,\n            newValue: {\n              valueFormat: PropertyValueFormat.Primitive,\n              value: !currentValue,\n              displayValue: \"\",\n            },\n          });\n        }}\n      >\n        {currentValue ? <SvgLock /> : <SvgLockUnlocked />}\n      </IconButton>\n    );\n  }\n);\n\n/** @internal */\nexport class LockPropertyEditor extends PropertyEditorBase {\n  public get reactNode() {\n    return <LockEditor />;\n  }\n}\n\n/** @internal */\nexport const LockPropertyEditorName = \"appui-internal:tool-settings-lock\";\n"]}

package/lib/appui-react/editors/LockProvider.d.ts

@@ -0,0 +1,48 @@
+/** @packageDocumentation
+ * @module ToolSettings
+ */
+import * as React from "react";
+import type { UiLayoutDataProvider } from "@itwin/appui-abstract";
+/** This is used to notify the parent component that the lock decoration is displayed in the editor
+ * and a separate lock component should not be displayed as a sibling.
+ * @internal
+ */
+export declare const LockContext: React.Context<{
+    /** Describes if the lock is displayed as an editor decoration. */
+    lockDecorations: Record<string, true>;
+    /** Called by editors that display lock decoration. */
+    setLockDecoration: (propertyName: string, lockDecoration: boolean) => void;
+} | undefined>;
+/** @internal */
+export declare function LockProvider({ children }: React.PropsWithChildren): React.JSX.Element;
+/** Additional context for property editors that support lock decoration.
+ * @internal
+ */
+export declare const PropertyEditorContext: React.Context<{
+    uiDataProvider: UiLayoutDataProvider;
+    itemPropertyName: string;
+    /** Specified when rendering a lock editor. */
+    lockPropertyName: string | undefined;
+} | undefined>;
+type PropertyEditorContextType = React.ContextType<typeof PropertyEditorContext>;
+interface PropertyEditorProviderProps extends NonNullable<PropertyEditorContextType> {
+    children?: React.ReactNode;
+}
+/** @internal */
+export declare function PropertyEditorProvider(props: PropertyEditorProviderProps): React.JSX.Element;
+/** Returns `true` if the lock decoration should be displayed.
+ * @internal
+ */
+export declare function useLockDecoration(): boolean;
+interface UseLockPropertyArgs {
+    provider: UiLayoutDataProvider;
+    itemPropertyName: string;
+}
+/** @internal */
+export declare function useLockProperty(args: UseLockPropertyArgs | undefined): import("@itwin/appui-abstract").BaseDialogItem | undefined;
+/** This component displays a lock button in the property editor when the `toolSettingsLockButton` preview feature is enabled.
+ * @alpha
+ */
+export declare function LockButtonInputDecoration(): React.JSX.Element | null;
+export {};
+//# sourceMappingURL=LockProvider.d.ts.map

package/lib/appui-react/editors/LockProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LockProvider.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/LockProvider.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAMlE;;;GAGG;AACH,eAAO,MAAM,WAAW;IAElB,kEAAkE;qBACjD,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC;IACrC,sDAAsD;uBACnC,CACjB,YAAY,EAAE,MAAM,EACpB,cAAc,EAAE,OAAO,KACpB,IAAI;cAGH,CAAC;AAEb,gBAAgB;AAChB,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE,KAAK,CAAC,iBAAiB,qBAgCjE;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB;oBAEZ,oBAAoB;sBAClB,MAAM;IACxB,8CAA8C;sBAC5B,MAAM,GAAG,SAAS;cAG9B,CAAC;AAEb,KAAK,yBAAyB,GAAG,KAAK,CAAC,WAAW,CAChD,OAAO,qBAAqB,CAC7B,CAAC;AAEF,UAAU,2BACR,SAAQ,WAAW,CAAC,yBAAyB,CAAC;IAC9C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,gBAAgB;AAChB,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,qBAiBxE;AAED;;GAEG;AACH,wBAAgB,iBAAiB,YAchC;AAED,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,gBAAgB;AAChB,wBAAgB,eAAe,CAAC,IAAI,EAAE,mBAAmB,GAAG,SAAS,8DAqBpE;AAED;;GAEG;AACH,wBAAgB,yBAAyB,6BAuDxC"}

package/lib/appui-react/editors/LockProvider.js

@@ -0,0 +1,121 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module ToolSettings
+ */
+import * as React from "react";
+import { InputWithDecorations } from "@itwin/itwinui-react";
+import { SvgLock, SvgLockUnlocked } from "@itwin/itwinui-icons-react";
+import { produce } from "immer";
+import { usePreviewFeatures } from "../preview/PreviewFeatures.js";
+/** This is used to notify the parent component that the lock decoration is displayed in the editor
+ * and a separate lock component should not be displayed as a sibling.
+ * @internal
+ */
+export const LockContext = React.createContext(undefined);
+/** @internal */
+export function LockProvider({ children }) {
+    const [lockDecorations, setLockDecorations] = React.useState({});
+    const setLockDecoration = React.useCallback((propertyName, lockDecoration) => {
+        setLockDecorations(produce((draft) => {
+            if (lockDecoration) {
+                draft[propertyName] = true;
+                return;
+            }
+            delete draft[propertyName];
+        }));
+    }, []);
+    return (React.createElement(LockContext.Provider, { value: React.useMemo(() => ({
+            lockDecorations,
+            setLockDecoration,
+        }), [lockDecorations, setLockDecoration]) }, children));
+}
+/** Additional context for property editors that support lock decoration.
+ * @internal
+ */
+export const PropertyEditorContext = React.createContext(undefined);
+/** @internal */
+export function PropertyEditorProvider(props) {
+    const { children, uiDataProvider, itemPropertyName, lockPropertyName } = props;
+    return (React.createElement(PropertyEditorContext.Provider, { value: React.useMemo(() => ({
+            uiDataProvider,
+            itemPropertyName,
+            lockPropertyName,
+        }), [uiDataProvider, itemPropertyName, lockPropertyName]) }, children));
+}
+/** Returns `true` if the lock decoration should be displayed.
+ * @internal
+ */
+export function useLockDecoration() {
+    const { lockPropertyName, itemPropertyName, uiDataProvider } = React.useContext(PropertyEditorContext) ?? {};
+    const { toolSettingsLockButton } = usePreviewFeatures();
+    const dialogItem = React.useMemo(() => uiDataProvider?.items.find((item) => item.property.name === itemPropertyName), [uiDataProvider, itemPropertyName]);
+    return (!!toolSettingsLockButton && !lockPropertyName && !!dialogItem?.lockProperty);
+}
+/** @internal */
+export function useLockProperty(args) {
+    const { provider, itemPropertyName } = args ?? {};
+    const subscribe = React.useCallback((onStoreChange) => {
+        const listeners = provider
+            ? [
+                provider.onItemsReloadedEvent.addListener(onStoreChange),
+                provider.onSyncPropertiesChangeEvent.addListener(onStoreChange),
+            ]
+            : [];
+        return () => listeners.forEach((l) => l());
+    }, [provider]);
+    const getSnapshot = React.useCallback(() => {
+        const dialogItem = provider?.items.find((item) => item.property.name === itemPropertyName);
+        return dialogItem?.lockProperty;
+    }, [provider, itemPropertyName]);
+    return React.useSyncExternalStore(subscribe, getSnapshot);
+}
+/** This component displays a lock button in the property editor when the `toolSettingsLockButton` preview feature is enabled.
+ * @alpha
+ */
+export function LockButtonInputDecoration() {
+    const { itemPropertyName, uiDataProvider: provider } = React.useContext(PropertyEditorContext) ?? {};
+    const { setLockDecoration } = React.useContext(LockContext) ?? {};
+    const lockDecoration = useLockDecoration();
+    const lockProperty = useLockProperty(provider && itemPropertyName
+        ? {
+            provider,
+            itemPropertyName,
+        }
+        : undefined);
+    React.useLayoutEffect(() => {
+        if (!lockDecoration)
+            return;
+        if (!setLockDecoration)
+            return;
+        if (!itemPropertyName)
+            return;
+        setLockDecoration(itemPropertyName, true);
+        return () => {
+            setLockDecoration(itemPropertyName, false);
+        };
+    }, [setLockDecoration, itemPropertyName, lockDecoration]);
+    if (!lockDecoration)
+        return null;
+    const isLocked = !!lockProperty?.value.value;
+    const displayLabel = lockProperty?.property.displayLabel;
+    const label = displayLabel ? displayLabel : "Toggle lock";
+    const disabled = lockProperty?.isDisabled;
+    return (React.createElement(InputWithDecorations.Button, { isActive: isLocked, label: label, disabled: disabled, size: "small", styleType: "borderless", onClick: () => {
+            if (!provider)
+                return;
+            if (!lockProperty)
+                return;
+            provider.applyUiPropertyChange({
+                value: {
+                    ...lockProperty.value,
+                    value: !isLocked,
+                },
+                propertyName: lockProperty.property.name,
+            });
+            provider.reloadDialogItems();
+        } }, isLocked ? React.createElement(SvgLock, null) : React.createElement(SvgLockUnlocked, null)));
+}
+//# sourceMappingURL=LockProvider.js.map

package/lib/appui-react/editors/LockProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LockProvider.js","sourceRoot":"","sources":["../../../src/appui-react/editors/LockProvider.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module ToolSettings\n */\n\nimport * as React from \"react\";\nimport type { UiLayoutDataProvider } from \"@itwin/appui-abstract\";\nimport { InputWithDecorations } from \"@itwin/itwinui-react\";\nimport { SvgLock, SvgLockUnlocked } from \"@itwin/itwinui-icons-react\";\nimport { produce } from \"immer\";\nimport { usePreviewFeatures } from \"../preview/PreviewFeatures.js\";\n\n/** This is used to notify the parent component that the lock decoration is displayed in the editor\n * and a separate lock component should not be displayed as a sibling.\n * @internal\n */\nexport const LockContext = React.createContext<\n  | {\n      /** Describes if the lock is displayed as an editor decoration. */\n      lockDecorations: Record<string, true>;\n      /** Called by editors that display lock decoration. */\n      setLockDecoration: (\n        propertyName: string,\n        lockDecoration: boolean\n      ) => void;\n    }\n  | undefined\n>(undefined);\n\n/** @internal */\nexport function LockProvider({ children }: React.PropsWithChildren) {\n  const [lockDecorations, setLockDecorations] = React.useState<\n    Record<string, true>\n  >({});\n  const setLockDecoration = React.useCallback(\n    (propertyName: string, lockDecoration: boolean) => {\n      setLockDecorations(\n        produce((draft) => {\n          if (lockDecoration) {\n            draft[propertyName] = true;\n            return;\n          }\n\n          delete draft[propertyName];\n        })\n      );\n    },\n    []\n  );\n  return (\n    <LockContext.Provider\n      value={React.useMemo(\n        () => ({\n          lockDecorations,\n          setLockDecoration,\n        }),\n        [lockDecorations, setLockDecoration]\n      )}\n    >\n      {children}\n    </LockContext.Provider>\n  );\n}\n\n/** Additional context for property editors that support lock decoration.\n * @internal\n */\nexport const PropertyEditorContext = React.createContext<\n  | {\n      uiDataProvider: UiLayoutDataProvider;\n      itemPropertyName: string;\n      /** Specified when rendering a lock editor. */\n      lockPropertyName: string | undefined;\n    }\n  | undefined\n>(undefined);\n\ntype PropertyEditorContextType = React.ContextType<\n  typeof PropertyEditorContext\n>;\n\ninterface PropertyEditorProviderProps\n  extends NonNullable<PropertyEditorContextType> {\n  children?: React.ReactNode;\n}\n\n/** @internal */\nexport function PropertyEditorProvider(props: PropertyEditorProviderProps) {\n  const { children, uiDataProvider, itemPropertyName, lockPropertyName } =\n    props;\n  return (\n    <PropertyEditorContext.Provider\n      value={React.useMemo(\n        () => ({\n          uiDataProvider,\n          itemPropertyName,\n          lockPropertyName,\n        }),\n        [uiDataProvider, itemPropertyName, lockPropertyName]\n      )}\n    >\n      {children}\n    </PropertyEditorContext.Provider>\n  );\n}\n\n/** Returns `true` if the lock decoration should be displayed.\n * @internal\n */\nexport function useLockDecoration() {\n  const { lockPropertyName, itemPropertyName, uiDataProvider } =\n    React.useContext(PropertyEditorContext) ?? {};\n  const { toolSettingsLockButton } = usePreviewFeatures();\n  const dialogItem = React.useMemo(\n    () =>\n      uiDataProvider?.items.find(\n        (item) => item.property.name === itemPropertyName\n      ),\n    [uiDataProvider, itemPropertyName]\n  );\n  return (\n    !!toolSettingsLockButton && !lockPropertyName && !!dialogItem?.lockProperty\n  );\n}\n\ninterface UseLockPropertyArgs {\n  provider: UiLayoutDataProvider;\n  itemPropertyName: string;\n}\n\n/** @internal */\nexport function useLockProperty(args: UseLockPropertyArgs | undefined) {\n  const { provider, itemPropertyName } = args ?? {};\n  const subscribe = React.useCallback(\n    (onStoreChange: () => void) => {\n      const listeners = provider\n        ? [\n            provider.onItemsReloadedEvent.addListener(onStoreChange),\n            provider.onSyncPropertiesChangeEvent.addListener(onStoreChange),\n          ]\n        : [];\n      return () => listeners.forEach((l) => l());\n    },\n    [provider]\n  );\n  const getSnapshot = React.useCallback(() => {\n    const dialogItem = provider?.items.find(\n      (item) => item.property.name === itemPropertyName\n    );\n    return dialogItem?.lockProperty;\n  }, [provider, itemPropertyName]);\n  return React.useSyncExternalStore(subscribe, getSnapshot);\n}\n\n/** This component displays a lock button in the property editor when the `toolSettingsLockButton` preview feature is enabled.\n * @alpha\n */\nexport function LockButtonInputDecoration() {\n  const { itemPropertyName, uiDataProvider: provider } =\n    React.useContext(PropertyEditorContext) ?? {};\n  const { setLockDecoration } = React.useContext(LockContext) ?? {};\n  const lockDecoration = useLockDecoration();\n\n  const lockProperty = useLockProperty(\n    provider && itemPropertyName\n      ? {\n          provider,\n          itemPropertyName,\n        }\n      : undefined\n  );\n\n  React.useLayoutEffect(() => {\n    if (!lockDecoration) return;\n    if (!setLockDecoration) return;\n    if (!itemPropertyName) return;\n    setLockDecoration(itemPropertyName, true);\n    return () => {\n      setLockDecoration(itemPropertyName, false);\n    };\n  }, [setLockDecoration, itemPropertyName, lockDecoration]);\n\n  if (!lockDecoration) return null;\n\n  const isLocked = !!lockProperty?.value.value;\n  const displayLabel = lockProperty?.property.displayLabel;\n  const label = displayLabel ? displayLabel : \"Toggle lock\";\n  const disabled = lockProperty?.isDisabled;\n  return (\n    <InputWithDecorations.Button\n      isActive={isLocked}\n      label={label}\n      disabled={disabled}\n      size=\"small\"\n      styleType=\"borderless\"\n      onClick={() => {\n        if (!provider) return;\n        if (!lockProperty) return;\n\n        provider.applyUiPropertyChange({\n          value: {\n            ...lockProperty.value,\n            value: !isLocked,\n          },\n          propertyName: lockProperty.property.name,\n        });\n        provider.reloadDialogItems();\n      }}\n    >\n      {isLocked ? <SvgLock /> : <SvgLockUnlocked />}\n    </InputWithDecorations.Button>\n  );\n}\n"]}

package/lib/appui-react/editors/NumericEditor.d.ts

@@ -0,0 +1,10 @@
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { NumericInputPropertyEditor as BaseNumericInputPropertyEditor } from "@itwin/components-react";
+/** @internal */
+export declare class NumericInputPropertyEditor extends BaseNumericInputPropertyEditor {
+    get reactNode(): React.JSX.Element;
+}
+//# sourceMappingURL=NumericEditor.d.ts.map

package/lib/appui-react/editors/NumericEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumericEditor.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/NumericEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAEL,0BAA0B,IAAI,8BAA8B,EAC7D,MAAM,yBAAyB,CAAC;AAOjC,gBAAgB;AAChB,qBAAa,0BAA2B,SAAQ,8BAA8B;IAC5E,IAAoB,SAAS,sBAE5B;CACF"}

package/lib/appui-react/editors/NumericEditor.js

@@ -0,0 +1,24 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { NumericInputEditor as BaseNumericInputEditor, NumericInputPropertyEditor as BaseNumericInputPropertyEditor, } from "@itwin/components-react";
+import { LockButtonInputDecoration, useLockDecoration, } from "./LockProvider.js";
+/** @internal */
+export class NumericInputPropertyEditor extends BaseNumericInputPropertyEditor {
+    get reactNode() {
+        return React.createElement(NumericEditor, null);
+    }
+}
+const NumericEditor = React.forwardRef(function NumericEditor(props, forwardedRef) {
+    const lockDecoration = useLockDecoration();
+    const internalProps = {
+        decoration: lockDecoration ? React.createElement(LockButtonInputDecoration, null) : undefined,
+    };
+    return (React.createElement(BaseNumericInputEditor, { ...props, ...internalProps, ref: forwardedRef }));
+});
+//# sourceMappingURL=NumericEditor.js.map

package/lib/appui-react/editors/NumericEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumericEditor.js","sourceRoot":"","sources":["../../../src/appui-react/editors/NumericEditor.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,kBAAkB,IAAI,sBAAsB,EAC5C,0BAA0B,IAAI,8BAA8B,GAC7D,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,yBAAyB,EACzB,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAE3B,gBAAgB;AAChB,MAAM,OAAO,0BAA2B,SAAQ,8BAA8B;IAC5E,IAAoB,SAAS;QAC3B,OAAO,oBAAC,aAAa,OAAG,CAAC;IAC3B,CAAC;CACF;AAED,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CACpC,SAAS,aAAa,CAAC,KAAK,EAAE,YAAY;IACxC,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAC3C,MAAM,aAAa,GAAG;QACpB,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,oBAAC,yBAAyB,OAAG,CAAC,CAAC,CAAC,SAAS;KACpC,CAAC;IACrC,OAAO,CACL,oBAAC,sBAAsB,OACjB,KAAK,KACL,aAAa,EACjB,GAAG,EAAE,YAAY,GACjB,CACH,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport * as React from \"react\";\nimport {\n  NumericInputEditor as BaseNumericInputEditor,\n  NumericInputPropertyEditor as BaseNumericInputPropertyEditor,\n} from \"@itwin/components-react\";\nimport type { InternalInputEditorProps } from \"@itwin/components-react/internal\";\nimport {\n  LockButtonInputDecoration,\n  useLockDecoration,\n} from \"./LockProvider.js\";\n\n/** @internal */\nexport class NumericInputPropertyEditor extends BaseNumericInputPropertyEditor {\n  public override get reactNode() {\n    return <NumericEditor />;\n  }\n}\n\nconst NumericEditor = React.forwardRef<BaseNumericInputEditor>(\n  function NumericEditor(props, forwardedRef) {\n    const lockDecoration = useLockDecoration();\n    const internalProps = {\n      decoration: lockDecoration ? <LockButtonInputDecoration /> : undefined,\n    } satisfies InternalInputEditorProps;\n    return (\n      <BaseNumericInputEditor\n        {...props}\n        {...internalProps}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"]}

package/lib/appui-react/editors/TextEditor.d.ts

@@ -0,0 +1,10 @@
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { BasicPropertyEditor as BaseTextPropertyEditor } from "@itwin/components-react";
+/** @internal */
+export declare class TextPropertyEditor extends BaseTextPropertyEditor {
+    get reactNode(): React.JSX.Element;
+}
+//# sourceMappingURL=TextEditor.d.ts.map

package/lib/appui-react/editors/TextEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEditor.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/TextEditor.tsx"],"names":[],"mappings":"AAIA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAEL,mBAAmB,IAAI,sBAAsB,EAC9C,MAAM,yBAAyB,CAAC;AAOjC,gBAAgB;AAChB,qBAAa,kBAAmB,SAAQ,sBAAsB;IAC5D,IAAoB,SAAS,sBAE5B;CACF"}

package/lib/appui-react/editors/TextEditor.js

@@ -0,0 +1,24 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import * as React from "react";
+import { TextEditor as BaseTextEditor, BasicPropertyEditor as BaseTextPropertyEditor, } from "@itwin/components-react";
+import { LockButtonInputDecoration, useLockDecoration, } from "./LockProvider.js";
+/** @internal */
+export class TextPropertyEditor extends BaseTextPropertyEditor {
+    get reactNode() {
+        return React.createElement(TextEditor, null);
+    }
+}
+const TextEditor = React.forwardRef(function TextEditor(props, forwardedRef) {
+    const lockDecoration = useLockDecoration();
+    const internalProps = {
+        decoration: lockDecoration ? React.createElement(LockButtonInputDecoration, null) : undefined,
+    };
+    return React.createElement(BaseTextEditor, { ...props, ...internalProps, ref: forwardedRef });
+});
+//# sourceMappingURL=TextEditor.js.map

package/lib/appui-react/editors/TextEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEditor.js","sourceRoot":"","sources":["../../../src/appui-react/editors/TextEditor.tsx"],"names":[],"mappings":"AAAA;;;gGAGgG;AAChG;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,UAAU,IAAI,cAAc,EAC5B,mBAAmB,IAAI,sBAAsB,GAC9C,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EACL,yBAAyB,EACzB,iBAAiB,GAClB,MAAM,mBAAmB,CAAC;AAE3B,gBAAgB;AAChB,MAAM,OAAO,kBAAmB,SAAQ,sBAAsB;IAC5D,IAAoB,SAAS;QAC3B,OAAO,oBAAC,UAAU,OAAG,CAAC;IACxB,CAAC;CACF;AAED,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAiB,SAAS,UAAU,CACrE,KAAK,EACL,YAAY;IAEZ,MAAM,cAAc,GAAG,iBAAiB,EAAE,CAAC;IAC3C,MAAM,aAAa,GAAG;QACpB,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,oBAAC,yBAAyB,OAAG,CAAC,CAAC,CAAC,SAAS;KACpC,CAAC;IACrC,OAAO,oBAAC,cAAc,OAAK,KAAK,KAAM,aAAa,EAAE,GAAG,EAAE,YAAY,GAAI,CAAC;AAC7E,CAAC,CAAC,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\n * Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n * See LICENSE.md in the project root for license terms and full copyright notice.\n *--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module PropertyEditors\n */\n\nimport * as React from \"react\";\nimport {\n  TextEditor as BaseTextEditor,\n  BasicPropertyEditor as BaseTextPropertyEditor,\n} from \"@itwin/components-react\";\nimport type { InternalInputEditorProps } from \"@itwin/components-react/internal\";\nimport {\n  LockButtonInputDecoration,\n  useLockDecoration,\n} from \"./LockProvider.js\";\n\n/** @internal */\nexport class TextPropertyEditor extends BaseTextPropertyEditor {\n  public override get reactNode() {\n    return <TextEditor />;\n  }\n}\n\nconst TextEditor = React.forwardRef<BaseTextEditor>(function TextEditor(\n  props,\n  forwardedRef\n) {\n  const lockDecoration = useLockDecoration();\n  const internalProps = {\n    decoration: lockDecoration ? <LockButtonInputDecoration /> : undefined,\n  } satisfies InternalInputEditorProps;\n  return <BaseTextEditor {...props} {...internalProps} ref={forwardedRef} />;\n});\n"]}

package/lib/appui-react/editors/registerEditors.d.ts

@@ -0,0 +1,6 @@
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+/** @internal */
+export declare function registerEditors(): void;
+//# sourceMappingURL=registerEditors.d.ts.map

package/lib/appui-react/editors/registerEditors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"registerEditors.d.ts","sourceRoot":"","sources":["../../../src/appui-react/editors/registerEditors.ts"],"names":[],"mappings":"AAIA;;GAEG;AASH,gBAAgB;AAChB,wBAAgB,eAAe,SAwD9B"}

package/lib/appui-react/editors/registerEditors.js

@@ -0,0 +1,28 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module PropertyEditors
+ */
+import { StandardEditorNames, StandardTypeNames } from "@itwin/appui-abstract";
+import { registerDefaultPropertyEditor } from "@itwin/components-react/internal";
+import { LockPropertyEditor, LockPropertyEditorName } from "./LockEditor.js";
+import { CustomNumberPropertyEditor } from "./CustomNumberEditor.js";
+import { TextPropertyEditor } from "./TextEditor.js";
+import { NumericInputPropertyEditor } from "./NumericEditor.js";
+/** @internal */
+export function registerEditors() {
+    // Editors that support lock decorations.
+    registerDefaultPropertyEditor(StandardTypeNames.Text, TextPropertyEditor, undefined, true);
+    registerDefaultPropertyEditor(StandardTypeNames.String, TextPropertyEditor, undefined, true);
+    registerDefaultPropertyEditor(StandardTypeNames.Number, NumericInputPropertyEditor, StandardEditorNames.NumericInput, true);
+    registerDefaultPropertyEditor(StandardTypeNames.Int, NumericInputPropertyEditor, StandardEditorNames.NumericInput, true);
+    registerDefaultPropertyEditor(StandardTypeNames.Float, NumericInputPropertyEditor, StandardEditorNames.NumericInput, true);
+    registerDefaultPropertyEditor(StandardTypeNames.Double, NumericInputPropertyEditor, StandardEditorNames.NumericInput, true);
+    registerDefaultPropertyEditor(StandardTypeNames.Number, CustomNumberPropertyEditor, StandardEditorNames.NumberCustom, true);
+    // `appui-react` specific editors.
+    registerDefaultPropertyEditor(StandardTypeNames.Bool, LockPropertyEditor, LockPropertyEditorName);
+    registerDefaultPropertyEditor(StandardTypeNames.Boolean, LockPropertyEditor, LockPropertyEditorName);
+}
+//# sourceMappingURL=registerEditors.js.map