diff --git a/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.test.tsx b/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.test.tsx
new file mode 100644
index 00000000..cad19bbe
--- /dev/null
+++ b/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.test.tsx
@@ -0,0 +1,56 @@
+import * as React from "react";
+import { render, screen } from "@testing-library/react";
+import OidComponent from "./OidComponent";
+import userEvent from "@testing-library/user-event";
+
+describe("OidComponent", () => {
+ it("Should render OidComponent", async () => {
+ const handleChange = jest.fn();
+
+ render(
+
+ );
+
+ expect(screen.getByText("OID")).toBeInTheDocument();
+ expect(screen.getByTestId("field-input-OID")).toBeInTheDocument();
+ });
+
+ it("Should validate input", async () => {
+ const handleChange = jest.fn();
+
+ render(
+
+ );
+
+ const oidInput = screen.getByTestId("field-input-OID") as HTMLInputElement;
+
+ // valid oidInput
+ userEvent.type(oidInput, "urn:oid:1.2.3.4.5");
+ expect(oidInput.value).toBe("urn:oid:1.2.3.4.5");
+ expect(
+ screen.getByTestId("field-input-helper-text-OID")
+ ).not.toHaveTextContent("Please enter a valid OID");
+
+ // invalid oidInput
+ userEvent.clear(oidInput);
+ userEvent.type(oidInput, "invalid OID.");
+ expect(oidInput).toHaveValue("invalid OID.");
+ expect(screen.getByTestId("field-input-helper-text-OID")).toHaveTextContent(
+ "Please enter a valid OID"
+ );
+ });
+});
diff --git a/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.tsx b/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.tsx
new file mode 100644
index 00000000..cc2503be
--- /dev/null
+++ b/src/components/editMeasure/testCases/components/editTestCase/qiCore/LeftPanel/ElementsTab/builder/element/types/OidComponent.tsx
@@ -0,0 +1,55 @@
+import React, { useState } from "react";
+import { FormHelperText } from "@mui/material";
+import { TypeComponentProps } from "./TypeComponentProps";
+import { TextField } from "@madie/madie-design-system/dist/react";
+import _ from "lodash";
+
+const OidComponent = ({
+ canEdit,
+ fieldRequired,
+ label = "OID",
+ value,
+ onChange,
+ structureDefinition,
+}: TypeComponentProps) => {
+ const oidRegex = /urn:oid:[0-2](\.(0|[1-9][0-9]*))+/;
+ const [isValid, setValid] = useState(
+ value ? value.match(oidRegex) : true
+ );
+
+ const handleChange = (oid) => {
+ setValid(true);
+ if (oid.match(oidRegex)) {
+ onChange(oid);
+ } else if (!_.isEmpty(oid)) {
+ setValid(false);
+ }
+ };
+ return (
+ handleChange(e.target.value)}
+ helperText={
+
+ {isValid ? "" : "Please enter a valid OID"}
+
+ }
+ />
+ );
+};
+
+export default OidComponent;