@itwin/frontend-devtools 3.0.0-dev.78 → 3.0.0-dev.82

package/lib/esm/ui/RadioBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioBox.d.ts","sourceRoot":"","sources":["../../../src/ui/RadioBox.ts"],"names":[],"mappings":"AAKA;;GAEG;AAEH,aAAa;AACb,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,aAAa;AACb,oBAAY,eAAe,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;AAE7E,aAAa;AACb,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,aAAa,EAAE,CAAC;IACzB,OAAO,EAAE,eAAe,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,aAAa;AACb,MAAM,WAAW,QAAQ;IACvB,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,KAAK,OAAO,CAAC;IACjD,GAAG,EAAE,cAAc,CAAC;CACrB;AAED,aAAa;AACb,wBAAgB,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,QAAQ,CA4E7D"}

package/lib/esm/ui/RadioBox.js

@@ -0,0 +1,73 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @alpha */
+export function createRadioBox(props) {
+    const div = document.createElement("div");
+    let label;
+    if (undefined !== props.name) {
+        label = document.createElement("label");
+        label.htmlFor = props.id;
+        label.innerText = props.name;
+        div.appendChild(label);
+    }
+    const form = document.createElement("form");
+    form.id = props.id;
+    const radioBoxes = [];
+    for (const entry of props.entries) {
+        const input = document.createElement("input");
+        input.type = "radio";
+        input.name = props.name ? props.name : props.id;
+        input.value = (undefined !== entry.value) ? entry.value.toString() : "";
+        const inputLabel = document.createElement("label");
+        inputLabel.innerText = entry.label;
+        inputLabel.onclick = () => {
+            try {
+                input.checked = true;
+                const value = input.value;
+                props.handler(value, form);
+            }
+            catch (_ex) {
+                //
+            }
+        };
+        input.onchange = () => {
+            try {
+                const value = input.value;
+                props.handler(value, form);
+            }
+            catch (_ex) {
+                //
+            }
+        };
+        if (props.defaultValue === entry.value) {
+            input.checked = true;
+        }
+        radioBoxes.push(input);
+        if (props.vertical) {
+            const container = document.createElement("div");
+            container.appendChild(input);
+            container.appendChild(inputLabel);
+            form.appendChild(container);
+        }
+        else {
+            form.appendChild(input);
+            form.appendChild(inputLabel);
+        }
+    }
+    div.appendChild(form);
+    if (undefined !== props.parent)
+        props.parent.appendChild(div);
+    const setValue = (value) => {
+        const stringValue = value.toString();
+        const validValue = radioBoxes.map((input) => input.value).includes(stringValue);
+        if (validValue) {
+            radioBoxes.forEach((input) => input.checked = input.value === stringValue);
+            props.handler(stringValue, form);
+        }
+        return validValue;
+    };
+    return { div, label, setValue };
+}
+//# sourceMappingURL=RadioBox.js.map

package/lib/esm/ui/RadioBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioBox.js","sourceRoot":"","sources":["../../../src/ui/RadioBox.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAiC/F,aAAa;AACb,MAAM,UAAU,cAAc,CAAC,KAAoB;IACjD,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1C,IAAI,KAAmC,CAAC;IACxC,IAAI,SAAS,KAAK,KAAK,CAAC,IAAI,EAAE;QAC5B,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACxC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;QACzB,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC;QAC7B,GAAG,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;KACxB;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC5C,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;IAEnB,MAAM,UAAU,GAAuB,EAAE,CAAC;IAE1C,KAAK,MAAM,KAAK,IAAI,KAAK,CAAC,OAAO,EAAE;QACjC,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC;QACrB,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC;QAEhD,KAAK,CAAC,KAAK,GAAG,CAAC,SAAS,KAAK,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAExE,MAAM,UAAU,GAAqB,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACrE,UAAU,CAAC,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC;QAEnC,UAAU,CAAC,OAAO,GAAG,GAAG,EAAE;YACxB,IAAI;gBACF,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;gBACrB,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;gBAC1B,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;aAC5B;YAAC,OAAO,GAAG,EAAE;gBACZ,EAAE;aACH;QACH,CAAC,CAAC;QAEF,KAAK,CAAC,QAAQ,GAAG,GAAG,EAAE;YACpB,IAAI;gBACF,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;gBAC1B,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;aAC5B;YAAC,OAAO,GAAG,EAAE;gBACZ,EAAE;aACH;QACH,CAAC,CAAC;QACF,IAAI,KAAK,CAAC,YAAY,KAAK,KAAK,CAAC,KAAK,EAAE;YACtC,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC;SACtB;QAED,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAEvB,IAAI,KAAK,CAAC,QAAQ,EAAE;YAClB,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAChD,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;YAC7B,SAAS,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;YAClC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;SAC7B;aAAM;YACL,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;YACxB,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;SAC9B;KACF;IAED,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;IACtB,IAAI,SAAS,KAAK,KAAK,CAAC,MAAM;QAC5B,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAEhC,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAW,EAAE;QACnD,MAAM,WAAW,GAAG,KAAK,CAAC,QAAQ,EAAE,CAAC;QACrC,MAAM,UAAU,GAAY,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;QACzF,IAAI,UAAU,EAAE;YACd,UAAU,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,KAAK,KAAK,WAAW,CAAC,CAAC;YAC3E,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;SAClC;QACD,OAAO,UAAU,CAAC;IACpB,CAAC,CAAC;IAEF,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;AAClC,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\n/** @packageDocumentation\n * @module Controls\n */\n\n/** @alpha */\nexport interface RadioBoxEntry {\n  value: number | string | undefined;\n  label: string;\n}\n\n/** @alpha */\nexport type RadioBoxHandler = (value: string, form: HTMLFormElement) => void;\n\n/** @alpha */\nexport interface RadioBoxProps {\n  id: string;\n  entries: RadioBoxEntry[];\n  handler: RadioBoxHandler;\n  name?: string;\n  parent?: HTMLElement;\n  defaultValue?: number | string;\n  vertical?: boolean;\n}\n\n/** @alpha */\nexport interface RadioBox {\n  label?: HTMLLabelElement;\n  setValue: (newValue: number | string) => boolean;\n  div: HTMLDivElement;\n}\n\n/** @alpha */\nexport function createRadioBox(props: RadioBoxProps): RadioBox {\n  const div = document.createElement(\"div\");\n\n  let label: HTMLLabelElement | undefined;\n  if (undefined !== props.name) {\n    label = document.createElement(\"label\");\n    label.htmlFor = props.id;\n    label.innerText = props.name;\n    div.appendChild(label);\n  }\n\n  const form = document.createElement(\"form\");\n  form.id = props.id;\n\n  const radioBoxes: HTMLInputElement[] = [];\n\n  for (const entry of props.entries) {\n    const input = document.createElement(\"input\");\n    input.type = \"radio\";\n    input.name = props.name ? props.name : props.id;\n\n    input.value = (undefined !== entry.value) ? entry.value.toString() : \"\";\n\n    const inputLabel: HTMLLabelElement = document.createElement(\"label\");\n    inputLabel.innerText = entry.label;\n\n    inputLabel.onclick = () => {\n      try {\n        input.checked = true;\n        const value = input.value;\n        props.handler(value, form);\n      } catch (_ex) {\n        //\n      }\n    };\n\n    input.onchange = () => {\n      try {\n        const value = input.value;\n        props.handler(value, form);\n      } catch (_ex) {\n        //\n      }\n    };\n    if (props.defaultValue === entry.value) {\n      input.checked = true;\n    }\n\n    radioBoxes.push(input);\n\n    if (props.vertical) {\n      const container = document.createElement(\"div\");\n      container.appendChild(input);\n      container.appendChild(inputLabel);\n      form.appendChild(container);\n    } else {\n      form.appendChild(input);\n      form.appendChild(inputLabel);\n    }\n  }\n\n  div.appendChild(form);\n  if (undefined !== props.parent)\n    props.parent.appendChild(div);\n\n  const setValue = (value: number | string): boolean => {\n    const stringValue = value.toString();\n    const validValue: boolean = radioBoxes.map((input) => input.value).includes(stringValue);\n    if (validValue) {\n      radioBoxes.forEach((input) => input.checked = input.value === stringValue);\n      props.handler(stringValue, form);\n    }\n    return validValue;\n  };\n\n  return { div, label, setValue };\n}\n"]}

package/lib/esm/ui/Slider.d.ts

@@ -0,0 +1,25 @@
+/** @packageDocumentation
+ * @module Controls
+ */
+/** @alpha */
+export interface Slider {
+    label: HTMLLabelElement;
+    slider: HTMLInputElement;
+    div: HTMLDivElement;
+}
+/** @alpha */
+export declare type SliderHandler = (slider: HTMLInputElement) => void;
+/** @alpha */
+export interface SliderProps {
+    name: string;
+    handler: SliderHandler;
+    id: string;
+    parent?: HTMLElement;
+    min: string;
+    max: string;
+    step: string;
+    value: string;
+}
+/** @alpha */
+export declare function createSlider(props: SliderProps): Slider;
+//# sourceMappingURL=Slider.d.ts.map

package/lib/esm/ui/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/ui/Slider.ts"],"names":[],"mappings":"AAKA;;GAEG;AAEH,aAAa;AACb,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,gBAAgB,CAAC;IACxB,MAAM,EAAE,gBAAgB,CAAC;IACzB,GAAG,EAAE,cAAc,CAAC;CACrB;AAED,aAAa;AACb,oBAAY,aAAa,GAAG,CAAC,MAAM,EAAE,gBAAgB,KAAK,IAAI,CAAC;AAE/D,aAAa;AACb,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,aAAa,CAAC;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,aAAa;AACb,wBAAgB,YAAY,CAAC,KAAK,EAAE,WAAW,GAAG,MAAM,CA0BvD"}

package/lib/esm/ui/Slider.js

@@ -0,0 +1,29 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @alpha */
+export function createSlider(props) {
+    const div = document.createElement("div");
+    div.style.display = "block";
+    div.style.verticalAlign = "middle";
+    div.style.textAlign = "right";
+    const label = document.createElement("label");
+    label.htmlFor = props.id;
+    label.innerText = props.name;
+    div.appendChild(label);
+    const slider = document.createElement("input");
+    slider.type = "range";
+    slider.className = "slider";
+    slider.id = props.id;
+    slider.min = props.min;
+    slider.max = props.max;
+    slider.step = props.step;
+    slider.value = props.value;
+    slider.addEventListener("input", () => props.handler(slider));
+    div.appendChild(slider);
+    if (undefined !== props.parent)
+        props.parent.appendChild(div);
+    return { label, slider, div };
+}
+//# sourceMappingURL=Slider.js.map

package/lib/esm/ui/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/ui/Slider.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AA4B/F,aAAa;AACb,MAAM,UAAU,YAAY,CAAC,KAAkB;IAC7C,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC1C,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;IAC5B,GAAG,CAAC,KAAK,CAAC,aAAa,GAAG,QAAQ,CAAC;IACnC,GAAG,CAAC,KAAK,CAAC,SAAS,GAAG,OAAO,CAAC;IAE9B,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9C,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;IACzB,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC;IAC7B,GAAG,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAEvB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,CAAC,IAAI,GAAG,OAAO,CAAC;IACtB,MAAM,CAAC,SAAS,GAAG,QAAQ,CAAC;IAC5B,MAAM,CAAC,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;IACrB,MAAM,CAAC,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;IACvB,MAAM,CAAC,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;IACvB,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;IACzB,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAC3B,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;IAC9D,GAAG,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAExB,IAAI,SAAS,KAAK,KAAK,CAAC,MAAM;QAC5B,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAEhC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;AAChC,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\n/** @packageDocumentation\n * @module Controls\n */\n\n/** @alpha */\nexport interface Slider {\n  label: HTMLLabelElement;\n  slider: HTMLInputElement;\n  div: HTMLDivElement;\n}\n\n/** @alpha */\nexport type SliderHandler = (slider: HTMLInputElement) => void;\n\n/** @alpha */\nexport interface SliderProps {\n  name: string;\n  handler: SliderHandler;\n  id: string;\n  parent?: HTMLElement;\n  min: string;\n  max: string;\n  step: string;\n  value: string;\n}\n\n/** @alpha */\nexport function createSlider(props: SliderProps): Slider {\n  const div = document.createElement(\"div\");\n  div.style.display = \"block\";\n  div.style.verticalAlign = \"middle\";\n  div.style.textAlign = \"right\";\n\n  const label = document.createElement(\"label\");\n  label.htmlFor = props.id;\n  label.innerText = props.name;\n  div.appendChild(label);\n\n  const slider = document.createElement(\"input\");\n  slider.type = \"range\";\n  slider.className = \"slider\";\n  slider.id = props.id;\n  slider.min = props.min;\n  slider.max = props.max;\n  slider.step = props.step;\n  slider.value = props.value;\n  slider.addEventListener(\"input\", () => props.handler(slider));\n  div.appendChild(slider);\n\n  if (undefined !== props.parent)\n    props.parent.appendChild(div);\n\n  return { label, slider, div };\n}\n"]}

package/lib/esm/ui/TextBox.d.ts

@@ -0,0 +1,33 @@
+/** @packageDocumentation
+ * @module Controls
+ */
+/** Wraps an HTML text input field.
+ * @beta
+ */
+export interface TextBox {
+    /** The label, if the text box has one. */
+    label?: HTMLLabelElement;
+    /** The text input element. */
+    textbox: HTMLInputElement;
+    /** The div containing the text box. */
+    div: HTMLDivElement;
+}
+/** @alpha */
+export declare type TextBoxHandler = (textbox: HTMLInputElement) => void;
+/** @alpha */
+export declare type TextBoxKeyPressHandler = (textbox: HTMLInputElement, ev: KeyboardEvent) => void;
+/** @alpha */
+export interface TextBoxProps {
+    label?: string;
+    id?: string;
+    parent?: HTMLElement;
+    handler?: TextBoxHandler;
+    keypresshandler?: TextBoxKeyPressHandler;
+    focushandler?: TextBoxHandler;
+    tooltip?: string;
+    inline?: boolean;
+    list?: string;
+}
+/** @alpha */
+export declare function createTextBox(props: TextBoxProps): TextBox;
+//# sourceMappingURL=TextBox.d.ts.map

package/lib/esm/ui/TextBox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextBox.d.ts","sourceRoot":"","sources":["../../../src/ui/TextBox.ts"],"names":[],"mappings":"AAKA;;GAEG;AAEH;;GAEG;AACH,MAAM,WAAW,OAAO;IACtB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,8BAA8B;IAC9B,OAAO,EAAE,gBAAgB,CAAC;IAC1B,uCAAuC;IACvC,GAAG,EAAE,cAAc,CAAC;CACrB;AAED,aAAa;AACb,oBAAY,cAAc,GAAG,CAAC,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;AAEjE,aAAa;AACb,oBAAY,sBAAsB,GAAG,CAAC,OAAO,EAAE,gBAAgB,EAAE,EAAE,EAAE,aAAa,KAAK,IAAI,CAAC;AAE5F,aAAa;AACb,MAAM,WAAW,YAAY;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,eAAe,CAAC,EAAE,sBAAsB,CAAC;IACzC,YAAY,CAAC,EAAE,cAAc,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,aAAa;AACb,wBAAgB,aAAa,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAwD1D"}

package/lib/esm/ui/TextBox.js

@@ -0,0 +1,53 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @alpha */
+export function createTextBox(props) {
+    const div = document.createElement("div");
+    if (true === props.inline)
+        div.style.display = "inline";
+    let label;
+    if (undefined !== props.label) {
+        label = document.createElement("label");
+        label.innerText = props.label;
+        if (undefined !== props.id)
+            label.htmlFor = props.id;
+        div.appendChild(label);
+    }
+    const textbox = document.createElement("input");
+    textbox.type = "text";
+    if (undefined !== props.id)
+        textbox.id = props.id;
+    div.appendChild(textbox);
+    if (undefined !== props.parent)
+        props.parent.appendChild(div);
+    const handler = props.handler;
+    if (undefined !== handler) {
+        textbox.onchange = () => handler(textbox);
+    }
+    // Don't want the document's listeners intepreting keypresses as keyboard shortcuts...
+    const stopPropagation = (ev) => ev.stopPropagation();
+    textbox.onkeydown = textbox.onkeyup = stopPropagation;
+    const keypresshandler = props.keypresshandler;
+    if (undefined !== keypresshandler) {
+        textbox.onkeypress = (ev) => {
+            keypresshandler(textbox, ev);
+            ev.stopPropagation();
+        };
+    }
+    else {
+        textbox.onkeypress = stopPropagation; // eslint-disable-line deprecation/deprecation
+    }
+    const focushandler = props.focushandler;
+    if (undefined !== focushandler) {
+        textbox.onfocus = () => focushandler(textbox);
+    }
+    if (undefined !== props.list) {
+        textbox.setAttribute("list", props.list);
+    }
+    if (undefined !== props.tooltip)
+        div.title = props.tooltip;
+    return { label, textbox, div };
+}
+//# sourceMappingURL=TextBox.js.map

package/lib/esm/ui/TextBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextBox.js","sourceRoot":"","sources":["../../../src/ui/TextBox.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAqC/F,aAAa;AACb,MAAM,UAAU,aAAa,CAAC,KAAmB;IAC/C,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC1C,IAAI,IAAI,KAAK,KAAK,CAAC,MAAM;QACvB,GAAG,CAAC,KAAK,CAAC,OAAO,GAAG,QAAQ,CAAC;IAE/B,IAAI,KAAK,CAAC;IACV,IAAI,SAAS,KAAK,KAAK,CAAC,KAAK,EAAE;QAC7B,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACxC,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC;QAC9B,IAAI,SAAS,KAAK,KAAK,CAAC,EAAE;YACxB,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;QAE3B,GAAG,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;KACxB;IAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAChD,OAAO,CAAC,IAAI,GAAG,MAAM,CAAC;IACtB,IAAI,SAAS,KAAK,KAAK,CAAC,EAAE;QACxB,OAAO,CAAC,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC;IAExB,GAAG,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAEzB,IAAI,SAAS,KAAK,KAAK,CAAC,MAAM;QAC5B,KAAK,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;IAEhC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;IAC9B,IAAI,SAAS,KAAK,OAAO,EAAE;QACzB,OAAO,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;KAC3C;IAED,sFAAsF;IACtF,MAAM,eAAe,GAAG,CAAC,EAAiB,EAAE,EAAE,CAAC,EAAE,CAAC,eAAe,EAAE,CAAC;IACpE,OAAO,CAAC,SAAS,GAAG,OAAO,CAAC,OAAO,GAAG,eAAe,CAAC;IACtD,MAAM,eAAe,GAAG,KAAK,CAAC,eAAe,CAAC;IAC9C,IAAI,SAAS,KAAK,eAAe,EAAE;QACjC,OAAO,CAAC,UAAU,GAAG,CAAC,EAAiB,EAAE,EAAE;YACzC,eAAe,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;YAC7B,EAAE,CAAC,eAAe,EAAE,CAAC;QACvB,CAAC,CAAC;KACH;SAAM;QACL,OAAO,CAAC,UAAU,GAAG,eAAe,CAAC,CAAC,8CAA8C;KACrF;IAED,MAAM,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC;IACxC,IAAI,SAAS,KAAK,YAAY,EAAE;QAC9B,OAAO,CAAC,OAAO,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;KAC/C;IAED,IAAI,SAAS,KAAK,KAAK,CAAC,IAAI,EAAE;QAC5B,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;KAC1C;IAED,IAAI,SAAS,KAAK,KAAK,CAAC,OAAO;QAC7B,GAAG,CAAC,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;IAE5B,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC;AACjC,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\n/** @packageDocumentation\n * @module Controls\n */\n\n/** Wraps an HTML text input field.\n * @beta\n */\nexport interface TextBox {\n  /** The label, if the text box has one. */\n  label?: HTMLLabelElement;\n  /** The text input element. */\n  textbox: HTMLInputElement;\n  /** The div containing the text box. */\n  div: HTMLDivElement;\n}\n\n/** @alpha */\nexport type TextBoxHandler = (textbox: HTMLInputElement) => void;\n\n/** @alpha */\nexport type TextBoxKeyPressHandler = (textbox: HTMLInputElement, ev: KeyboardEvent) => void;\n\n/** @alpha */\nexport interface TextBoxProps {\n  label?: string;\n  id?: string;\n  parent?: HTMLElement;\n  handler?: TextBoxHandler;\n  keypresshandler?: TextBoxKeyPressHandler;\n  focushandler?: TextBoxHandler;\n  tooltip?: string;\n  inline?: boolean;\n  list?: string; // if defined, contains the id of a datalist to bind to this textbox for autocompletion\n}\n\n/** @alpha */\nexport function createTextBox(props: TextBoxProps): TextBox {\n  const div = document.createElement(\"div\");\n  if (true === props.inline)\n    div.style.display = \"inline\";\n\n  let label;\n  if (undefined !== props.label) {\n    label = document.createElement(\"label\");\n    label.innerText = props.label;\n    if (undefined !== props.id)\n      label.htmlFor = props.id;\n\n    div.appendChild(label);\n  }\n\n  const textbox = document.createElement(\"input\");\n  textbox.type = \"text\";\n  if (undefined !== props.id)\n    textbox.id = props.id;\n\n  div.appendChild(textbox);\n\n  if (undefined !== props.parent)\n    props.parent.appendChild(div);\n\n  const handler = props.handler;\n  if (undefined !== handler) {\n    textbox.onchange = () => handler(textbox);\n  }\n\n  // Don't want the document's listeners intepreting keypresses as keyboard shortcuts...\n  const stopPropagation = (ev: KeyboardEvent) => ev.stopPropagation();\n  textbox.onkeydown = textbox.onkeyup = stopPropagation;\n  const keypresshandler = props.keypresshandler;\n  if (undefined !== keypresshandler) {\n    textbox.onkeypress = (ev: KeyboardEvent) => { // eslint-disable-line deprecation/deprecation\n      keypresshandler(textbox, ev);\n      ev.stopPropagation();\n    };\n  } else {\n    textbox.onkeypress = stopPropagation; // eslint-disable-line deprecation/deprecation\n  }\n\n  const focushandler = props.focushandler;\n  if (undefined !== focushandler) {\n    textbox.onfocus = () => focushandler(textbox);\n  }\n\n  if (undefined !== props.list) {\n    textbox.setAttribute(\"list\", props.list);\n  }\n\n  if (undefined !== props.tooltip)\n    div.title = props.tooltip;\n\n  return { label, textbox, div };\n}\n"]}

package/lib/esm/widgets/DiagnosticsPanel.d.ts

@@ -0,0 +1,36 @@
+import { Viewport } from "@itwin/core-frontend";
+import { KeyinField } from "./KeyinField";
+/** Options for configuring a [[DiagnosticsPanel]].
+ * @beta
+ */
+export interface DiagnosticsPanelProps {
+    /** Widgets to exclude from the panel. */
+    exclude?: {
+        keyin?: boolean;
+        fps?: boolean;
+        tileStats?: boolean;
+        memory?: boolean;
+        tileMemoryBreakdown?: boolean;
+        gpuProfiler?: boolean;
+        toolSettings?: boolean;
+    };
+}
+/** Consolidates many other widgets into a single panel.
+ * @beta
+ */
+export declare class DiagnosticsPanel {
+    private readonly _element;
+    private readonly _parentElement?;
+    private readonly _fpsTracker?;
+    private readonly _memoryTracker?;
+    private readonly _tileMemoryBreakdown?;
+    private readonly _statsTracker?;
+    private readonly _gpuProfiler?;
+    private readonly _toolSettingsTracker?;
+    readonly keyinField?: KeyinField;
+    constructor(vp: Viewport, props?: DiagnosticsPanelProps);
+    get element(): HTMLElement;
+    dispose(): void;
+    private addSeparator;
+}
+//# sourceMappingURL=DiagnosticsPanel.d.ts.map

package/lib/esm/widgets/DiagnosticsPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiagnosticsPanel.d.ts","sourceRoot":"","sources":["../../../src/widgets/DiagnosticsPanel.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGhD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAM1C;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,yCAAyC;IACzC,OAAO,CAAC,EAAE;QACR,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,GAAG,CAAC,EAAE,OAAO,CAAC;QACd,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB,mBAAmB,CAAC,EAAE,OAAO,CAAC;QAC9B,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,YAAY,CAAC,EAAE,OAAO,CAAC;KACxB,CAAC;CACH;AAED;;GAEG;AACH,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAc;IACvC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAc;IAC9C,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAa;IAC1C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAgB;IAChD,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAsB;IAC5D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAwB;IACvD,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAc;IAC5C,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAC,CAAsB;IAC5D,SAAgB,UAAU,CAAC,EAAE,UAAU,CAAC;gBAErB,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,qBAAqB;IA+C9D,IAAW,OAAO,IAAI,WAAW,CAA0B;IAEpD,OAAO,IAAI,IAAI;IAYtB,OAAO,CAAC,YAAY;CAGrB"}

package/lib/esm/widgets/DiagnosticsPanel.js

@@ -0,0 +1,72 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Widgets
+ */
+import { dispose } from "@itwin/core-bentley";
+import { FpsTracker } from "./FpsTracker";
+import { GpuProfiler } from "./GpuProfiler";
+import { KeyinField } from "./KeyinField";
+import { MemoryTracker } from "./MemoryTracker";
+import { TileMemoryBreakdown } from "./TileMemoryBreakdown";
+import { TileStatisticsTracker } from "./TileStatisticsTracker";
+import { ToolSettingsTracker } from "./ToolSettingsTracker";
+/** Consolidates many other widgets into a single panel.
+ * @beta
+ */
+export class DiagnosticsPanel {
+    constructor(vp, props) {
+        const exclude = (undefined !== props && undefined !== props.exclude) ? props.exclude : {};
+        this._element = document.createElement("div");
+        this._element.className = "debugPanel";
+        if (true !== exclude.fps) {
+            this._fpsTracker = new FpsTracker(this._element, vp);
+            this.addSeparator();
+        }
+        if (true !== exclude.keyin) {
+            this.keyinField = new KeyinField({
+                parent: this._element,
+                baseId: "diagnosticsPanelKeyin",
+                wantButton: true,
+                wantLabel: true,
+                historyLength: 20,
+            });
+            this.addSeparator();
+        }
+        if (true !== exclude.tileStats) {
+            this._statsTracker = new TileStatisticsTracker(this._element, vp);
+            this.addSeparator();
+        }
+        if (true !== exclude.tileMemoryBreakdown) {
+            this._tileMemoryBreakdown = new TileMemoryBreakdown(this._element);
+            this.addSeparator();
+        }
+        if (true !== exclude.memory) {
+            this._memoryTracker = new MemoryTracker(this._element, vp);
+            this.addSeparator();
+        }
+        if (true !== exclude.gpuProfiler) {
+            this._gpuProfiler = new GpuProfiler(this._element);
+            this.addSeparator();
+        }
+        if (true !== exclude.toolSettings)
+            this._toolSettingsTracker = new ToolSettingsTracker(this._element, vp);
+    }
+    get element() { return this._element; }
+    dispose() {
+        dispose(this._fpsTracker);
+        dispose(this._memoryTracker);
+        dispose(this._tileMemoryBreakdown);
+        dispose(this._statsTracker);
+        dispose(this._gpuProfiler);
+        dispose(this._toolSettingsTracker);
+        if (undefined !== this._parentElement)
+            this._parentElement.removeChild(this._element);
+    }
+    addSeparator() {
+        this._element.appendChild(document.createElement("hr"));
+    }
+}
+//# sourceMappingURL=DiagnosticsPanel.js.map

package/lib/{widgets → esm/widgets}/DiagnosticsPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"DiagnosticsPanel.js","sourceRoot":"","sources":["../../src/widgets/DiagnosticsPanel.ts"],"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\n/** @packageDocumentation\n * @module Widgets\n */\n\nimport { dispose } from \"@itwin/core-bentley\";\nimport { Viewport } from \"@itwin/core-frontend\";\nimport { FpsTracker } from \"./FpsTracker\";\nimport { GpuProfiler } from \"./GpuProfiler\";\nimport { KeyinField } from \"./KeyinField\";\nimport { MemoryTracker } from \"./MemoryTracker\";\nimport { TileMemoryBreakdown } from \"./TileMemoryBreakdown\";\nimport { TileStatisticsTracker } from \"./TileStatisticsTracker\";\nimport { ToolSettingsTracker } from \"./ToolSettingsTracker\";\n\n/** Options for configuring a [[DiagnosticsPanel]].\n * @beta\n */\nexport interface DiagnosticsPanelProps {\n  /** Widgets to exclude from the panel. */\n  exclude?: {\n    keyin?: boolean;\n    fps?: boolean;\n    tileStats?: boolean;\n    memory?: boolean;\n    tileMemoryBreakdown?: boolean;\n    gpuProfiler?: boolean;\n    toolSettings?: boolean;\n  };\n}\n\n/** Consolidates many other widgets into a single panel.\n * @beta\n */\nexport class DiagnosticsPanel {\n  private readonly _element: HTMLElement;\n  private readonly _parentElement?: HTMLElement;\n  private readonly _fpsTracker?: FpsTracker;\n  private readonly _memoryTracker?: MemoryTracker;\n  private readonly _tileMemoryBreakdown?: TileMemoryBreakdown;\n  private readonly _statsTracker?: TileStatisticsTracker;\n  private readonly _gpuProfiler?: GpuProfiler;\n  private readonly _toolSettingsTracker?: ToolSettingsTracker;\n  public readonly keyinField?: KeyinField;\n\n  public constructor(vp: Viewport, props?: DiagnosticsPanelProps) {\n    const exclude = (undefined !== props && undefined !== props.exclude) ? props.exclude : {};\n\n    this._element = document.createElement(\"div\");\n    this._element.className = \"debugPanel\";\n\n    if (true !== exclude.fps) {\n      this._fpsTracker = new FpsTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.keyin) {\n      this.keyinField = new KeyinField({\n        parent: this._element,\n        baseId: \"diagnosticsPanelKeyin\",\n        wantButton: true,\n        wantLabel: true,\n        historyLength: 20,\n      });\n\n      this.addSeparator();\n    }\n\n    if (true !== exclude.tileStats) {\n      this._statsTracker = new TileStatisticsTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.tileMemoryBreakdown) {\n      this._tileMemoryBreakdown = new TileMemoryBreakdown(this._element);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.memory) {\n      this._memoryTracker = new MemoryTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.gpuProfiler) {\n      this._gpuProfiler = new GpuProfiler(this._element);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.toolSettings)\n      this._toolSettingsTracker = new ToolSettingsTracker(this._element, vp);\n  }\n\n  public get element(): HTMLElement { return this._element; }\n\n  public dispose(): void {\n    dispose(this._fpsTracker);\n    dispose(this._memoryTracker);\n    dispose(this._tileMemoryBreakdown);\n    dispose(this._statsTracker);\n    dispose(this._gpuProfiler);\n    dispose(this._toolSettingsTracker);\n\n    if (undefined !== this._parentElement)\n      this._parentElement.removeChild(this._element);\n  }\n\n  private addSeparator(): void {\n    this._element.appendChild(document.createElement(\"hr\")!);\n  }\n}\n"]}
+{"version":3,"file":"DiagnosticsPanel.js","sourceRoot":"","sources":["../../../src/widgets/DiagnosticsPanel.ts"],"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\n/** @packageDocumentation\n * @module Widgets\n */\n\nimport { dispose } from \"@itwin/core-bentley\";\nimport { Viewport } from \"@itwin/core-frontend\";\nimport { FpsTracker } from \"./FpsTracker\";\nimport { GpuProfiler } from \"./GpuProfiler\";\nimport { KeyinField } from \"./KeyinField\";\nimport { MemoryTracker } from \"./MemoryTracker\";\nimport { TileMemoryBreakdown } from \"./TileMemoryBreakdown\";\nimport { TileStatisticsTracker } from \"./TileStatisticsTracker\";\nimport { ToolSettingsTracker } from \"./ToolSettingsTracker\";\n\n/** Options for configuring a [[DiagnosticsPanel]].\n * @beta\n */\nexport interface DiagnosticsPanelProps {\n  /** Widgets to exclude from the panel. */\n  exclude?: {\n    keyin?: boolean;\n    fps?: boolean;\n    tileStats?: boolean;\n    memory?: boolean;\n    tileMemoryBreakdown?: boolean;\n    gpuProfiler?: boolean;\n    toolSettings?: boolean;\n  };\n}\n\n/** Consolidates many other widgets into a single panel.\n * @beta\n */\nexport class DiagnosticsPanel {\n  private readonly _element: HTMLElement;\n  private readonly _parentElement?: HTMLElement;\n  private readonly _fpsTracker?: FpsTracker;\n  private readonly _memoryTracker?: MemoryTracker;\n  private readonly _tileMemoryBreakdown?: TileMemoryBreakdown;\n  private readonly _statsTracker?: TileStatisticsTracker;\n  private readonly _gpuProfiler?: GpuProfiler;\n  private readonly _toolSettingsTracker?: ToolSettingsTracker;\n  public readonly keyinField?: KeyinField;\n\n  public constructor(vp: Viewport, props?: DiagnosticsPanelProps) {\n    const exclude = (undefined !== props && undefined !== props.exclude) ? props.exclude : {};\n\n    this._element = document.createElement(\"div\");\n    this._element.className = \"debugPanel\";\n\n    if (true !== exclude.fps) {\n      this._fpsTracker = new FpsTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.keyin) {\n      this.keyinField = new KeyinField({\n        parent: this._element,\n        baseId: \"diagnosticsPanelKeyin\",\n        wantButton: true,\n        wantLabel: true,\n        historyLength: 20,\n      });\n\n      this.addSeparator();\n    }\n\n    if (true !== exclude.tileStats) {\n      this._statsTracker = new TileStatisticsTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.tileMemoryBreakdown) {\n      this._tileMemoryBreakdown = new TileMemoryBreakdown(this._element);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.memory) {\n      this._memoryTracker = new MemoryTracker(this._element, vp);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.gpuProfiler) {\n      this._gpuProfiler = new GpuProfiler(this._element);\n      this.addSeparator();\n    }\n\n    if (true !== exclude.toolSettings)\n      this._toolSettingsTracker = new ToolSettingsTracker(this._element, vp);\n  }\n\n  public get element(): HTMLElement { return this._element; }\n\n  public dispose(): void {\n    dispose(this._fpsTracker);\n    dispose(this._memoryTracker);\n    dispose(this._tileMemoryBreakdown);\n    dispose(this._statsTracker);\n    dispose(this._gpuProfiler);\n    dispose(this._toolSettingsTracker);\n\n    if (undefined !== this._parentElement)\n      this._parentElement.removeChild(this._element);\n  }\n\n  private addSeparator(): void {\n    this._element.appendChild(document.createElement(\"hr\")!);\n  }\n}\n"]}

package/lib/esm/widgets/FpsTracker.d.ts

@@ -0,0 +1,20 @@
+/** @packageDocumentation
+ * @module Widgets
+ */
+import { Viewport } from "@itwin/core-frontend";
+/** Displays average frames-per-second.
+ * NOTE: Enabling fps tracking causes a new frame to render on every tick of the render loop, which may negatively impact battery life.
+ * @beta
+ */
+export declare class FpsTracker {
+    private readonly _label;
+    private _metrics?;
+    private _curIntervalId?;
+    private readonly _vp;
+    constructor(parent: HTMLElement, viewport: Viewport);
+    dispose(): void;
+    private clearInterval;
+    private toggle;
+    private updateFPS;
+}
+//# sourceMappingURL=FpsTracker.d.ts.map

package/lib/esm/widgets/FpsTracker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FpsTracker.d.ts","sourceRoot":"","sources":["../../../src/widgets/FpsTracker.ts"],"names":[],"mappings":"AAKA;;GAEG;AAEH,OAAO,EAA8B,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAG5E;;;GAGG;AACH,qBAAa,UAAU;IACrB,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAmB;IAC1C,OAAO,CAAC,QAAQ,CAAC,CAAqB;IACtC,OAAO,CAAC,cAAc,CAAC,CAAe;IACtC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAW;gBAEZ,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ;IAUnD,OAAO,IAAI,IAAI;IAItB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,MAAM;IAed,OAAO,CAAC,SAAS;CAKlB"}

package/lib/esm/widgets/FpsTracker.js

@@ -0,0 +1,53 @@
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Widgets
+ */
+import { PerformanceMetrics } from "@itwin/core-frontend";
+import { createCheckBox } from "../ui/CheckBox";
+/** Displays average frames-per-second.
+ * NOTE: Enabling fps tracking causes a new frame to render on every tick of the render loop, which may negatively impact battery life.
+ * @beta
+ */
+export class FpsTracker {
+    constructor(parent, viewport) {
+        this._vp = viewport;
+        this._label = createCheckBox({
+            parent,
+            name: "Track FPS",
+            id: "fpsTracker_toggle",
+            handler: (cb) => this.toggle(cb.checked),
+        }).label;
+    }
+    dispose() {
+        this.toggle(false);
+    }
+    clearInterval() {
+        if (undefined !== this._curIntervalId) {
+            clearInterval(this._curIntervalId);
+            this._curIntervalId = undefined;
+        }
+    }
+    toggle(enabled) {
+        this._vp.continuousRendering = enabled;
+        if (enabled) {
+            this._metrics = new PerformanceMetrics(false, true);
+            this._curIntervalId = setInterval(() => this.updateFPS(), 500);
+            this._label.innerText = "Tracking FPS...";
+        }
+        else {
+            this._metrics = undefined;
+            this.clearInterval();
+            this._label.innerText = "Track FPS";
+        }
+        this._vp.target.performanceMetrics = this._metrics;
+    }
+    updateFPS() {
+        const metrics = this._metrics;
+        const fps = (metrics.spfTimes.length / metrics.spfSum).toFixed(2);
+        this._label.innerText = `FPS: ${fps}`;
+    }
+}
+//# sourceMappingURL=FpsTracker.js.map

package/lib/esm/widgets/FpsTracker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FpsTracker.js","sourceRoot":"","sources":["../../../src/widgets/FpsTracker.ts"],"names":[],"mappings":"AAAA;;;+FAG+F;AAE/F;;GAEG;AAEH,OAAO,EAAE,kBAAkB,EAAoB,MAAM,sBAAsB,CAAC;AAC5E,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAEhD;;;GAGG;AACH,MAAM,OAAO,UAAU;IAMrB,YAAmB,MAAmB,EAAE,QAAkB;QACxD,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC;QACpB,IAAI,CAAC,MAAM,GAAG,cAAc,CAAC;YAC3B,MAAM;YACN,IAAI,EAAE,WAAW;YACjB,EAAE,EAAE,mBAAmB;YACvB,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC;SACzC,CAAC,CAAC,KAAK,CAAC;IACX,CAAC;IAEM,OAAO;QACZ,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IACrB,CAAC;IAEO,aAAa;QACnB,IAAI,SAAS,KAAK,IAAI,CAAC,cAAc,EAAE;YACrC,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YACnC,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;SACjC;IACH,CAAC;IAEO,MAAM,CAAC,OAAgB;QAC7B,IAAI,CAAC,GAAG,CAAC,mBAAmB,GAAG,OAAO,CAAC;QACvC,IAAI,OAAO,EAAE;YACX,IAAI,CAAC,QAAQ,GAAG,IAAI,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YACpD,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,GAAG,CAAC,CAAC;YAC/D,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,iBAAiB,CAAC;SAC3C;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;YAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;YACrB,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,WAAW,CAAC;SACrC;QAEA,IAAI,CAAC,GAAG,CAAC,MAAiB,CAAC,kBAAkB,GAAG,IAAI,CAAC,QAAQ,CAAC;IACjE,CAAC;IAEO,SAAS;QACf,MAAM,OAAO,GAAG,IAAI,CAAC,QAAS,CAAC;QAC/B,MAAM,GAAG,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;QAClE,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,QAAQ,GAAG,EAAE,CAAC;IACxC,CAAC;CACF","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\n/** @packageDocumentation\n * @module Widgets\n */\n\nimport { PerformanceMetrics, Target, Viewport } from \"@itwin/core-frontend\";\nimport { createCheckBox } from \"../ui/CheckBox\";\n\n/** Displays average frames-per-second.\n * NOTE: Enabling fps tracking causes a new frame to render on every tick of the render loop, which may negatively impact battery life.\n * @beta\n */\nexport class FpsTracker {\n  private readonly _label: HTMLLabelElement;\n  private _metrics?: PerformanceMetrics;\n  private _curIntervalId?: NodeJS.Timer;\n  private readonly _vp: Viewport;\n\n  public constructor(parent: HTMLElement, viewport: Viewport) {\n    this._vp = viewport;\n    this._label = createCheckBox({\n      parent,\n      name: \"Track FPS\",\n      id: \"fpsTracker_toggle\",\n      handler: (cb) => this.toggle(cb.checked),\n    }).label;\n  }\n\n  public dispose(): void {\n    this.toggle(false);\n  }\n\n  private clearInterval(): void {\n    if (undefined !== this._curIntervalId) {\n      clearInterval(this._curIntervalId);\n      this._curIntervalId = undefined;\n    }\n  }\n\n  private toggle(enabled: boolean): void {\n    this._vp.continuousRendering = enabled;\n    if (enabled) {\n      this._metrics = new PerformanceMetrics(false, true);\n      this._curIntervalId = setInterval(() => this.updateFPS(), 500);\n      this._label.innerText = \"Tracking FPS...\";\n    } else {\n      this._metrics = undefined;\n      this.clearInterval();\n      this._label.innerText = \"Track FPS\";\n    }\n\n    (this._vp.target as Target).performanceMetrics = this._metrics;\n  }\n\n  private updateFPS(): void {\n    const metrics = this._metrics!;\n    const fps = (metrics.spfTimes.length / metrics.spfSum).toFixed(2);\n    this._label.innerText = `FPS: ${fps}`;\n  }\n}\n"]}

package/lib/esm/widgets/GpuProfiler.d.ts

@@ -0,0 +1,17 @@
+/** @alpha */
+export declare class GpuProfiler {
+    private readonly _div;
+    private readonly _resultsDiv;
+    private readonly _results;
+    private readonly _debugControl;
+    private readonly _recordButton;
+    private _recordedResults;
+    private _isRecording;
+    constructor(parent: HTMLElement);
+    dispose(): void;
+    private toggleProfileCheckBox;
+    private _clickRecord;
+    private stopRecording;
+    private _resultsCallback;
+}
+//# sourceMappingURL=GpuProfiler.d.ts.map

package/lib/esm/widgets/GpuProfiler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GpuProfiler.d.ts","sourceRoot":"","sources":["../../../src/widgets/GpuProfiler.ts"],"names":[],"mappings":"AA2FA,aAAa;AACb,qBAAa,WAAW;IACtB,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAiB;IACtC,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAiB;IAC7C,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAuB;IAChD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA2B;IAEzD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAqB;IACnD,OAAO,CAAC,gBAAgB,CAAkB;IAC1C,OAAO,CAAC,YAAY,CAAU;gBAEX,MAAM,EAAE,WAAW;IAmC/B,OAAO,IAAI,IAAI;IAItB,OAAO,CAAC,qBAAqB;IAY7B,OAAO,CAAC,YAAY,CAQlB;IAEF,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,gBAAgB,CA0EtB;CACH"}