@xyo-network/react-schema 7.5.8 → 7.5.11

package/dist/browser/index.mjs

@@ -1,8 +1,9 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-
 // src/components/Property/SchemaProperty.tsx
-import { NewReleases as NewReleasesIcon, OpenInNew as OpenInNewIcon, Verified as VerifiedIcon } from "@mui/icons-material";
+import {
+  NewReleases as NewReleasesIcon,
+  OpenInNew as OpenInNewIcon,
+  Verified as VerifiedIcon
+} from "@mui/icons-material";
 import { IconButton } from "@mui/material";
 import { useAsyncEffect } from "@xylabs/react-async-effect";
 import { FlexGrowRow } from "@xylabs/react-flexbox";
@@ -10,115 +11,128 @@ import { LinkEx } from "@xylabs/react-link";
 import { useEvent } from "@xyo-network/react-event";
 import { Property, PropertyValue } from "@xyo-network/react-property";
 import { SchemaCache } from "@xyo-network/schema-cache";
-import React, { useState } from "react";
-var useResolveSchema = /* @__PURE__ */ __name((schema) => {
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var useResolveSchema = (schema) => {
   const [entry, setEntry] = useState();
-  useAsyncEffect(async (mounted) => {
-    if (schema) {
-      const entry2 = await SchemaCache.instance.get(schema);
-      if (mounted()) {
-        setEntry(entry2);
+  useAsyncEffect(
+    async (mounted) => {
+      if (schema) {
+        const entry2 = await SchemaCache.instance.get(schema);
+        if (mounted()) {
+          setEntry(entry2);
+        }
       }
-    }
-  }, [
-    schema
-  ]);
+    },
+    [schema]
+  );
   return entry;
-}, "useResolveSchema");
-var SchemaProperty = /* @__PURE__ */ __name(({ showLinkNames = true, showOpenNewWindowLink = true, showStatusIcon = true, titleProps, value, ...props }) => {
+};
+var SchemaProperty = ({
+  showLinkNames = true,
+  showOpenNewWindowLink = true,
+  showStatusIcon = true,
+  titleProps,
+  value,
+  ...props
+}) => {
   const resolvedSchema = useResolveSchema(value);
   const [buttonRef, buttonDispatch] = useEvent();
   const [divRef, divDispatch] = useEvent();
-  const onClick = /* @__PURE__ */ __name((dispatch, openNewWindow = false) => {
-    dispatch?.("schema", "click", JSON.stringify({
-      openNewWindow,
-      schema: value
-    }));
-  }, "onClick");
-  return /* @__PURE__ */ React.createElement(Property, {
-    title: "Schema",
-    value,
-    tip: "Schema sent with the payload",
-    titleProps,
-    ...props
-  }, value && showStatusIcon ? resolvedSchema === null ? /* @__PURE__ */ React.createElement(IconButton, {
-    ref: buttonRef,
-    size: "small",
-    onClick: /* @__PURE__ */ __name(() => {
-      if (!buttonRef.current) {
-        console.warn("buttonRef.current is null");
-      }
-      onClick(buttonDispatch);
-    }, "onClick")
-  }, /* @__PURE__ */ React.createElement(NewReleasesIcon, {
-    color: "warning",
-    fontSize: "inherit"
-  })) : resolvedSchema === void 0 ? /* @__PURE__ */ React.createElement(IconButton, {
-    ref: buttonRef,
-    size: "small",
-    onClick: /* @__PURE__ */ __name(() => {
-      if (!buttonRef.current) {
-        console.warn("buttonRef.current is null");
-      }
-      onClick(buttonDispatch);
-    }, "onClick")
-  }, /* @__PURE__ */ React.createElement(NewReleasesIcon, {
-    color: "disabled",
-    fontSize: "inherit"
-  })) : /* @__PURE__ */ React.createElement(IconButton, {
-    rel: "noopener noreferrer",
-    size: "small",
-    target: "_blank",
-    href: resolvedSchema?.huri?.href ?? ""
-  }, /* @__PURE__ */ React.createElement(VerifiedIcon, {
-    color: "success",
-    fontSize: "inherit"
-  })) : null, value ? /* @__PURE__ */ React.createElement(FlexGrowRow, {
-    ref: divRef,
-    justifyContent: "space-between"
-  }, showLinkNames ? /* @__PURE__ */ React.createElement(LinkEx, {
-    display: "block",
-    width: "100%",
-    sx: {
-      cursor: "pointer"
-    }
-  }, /* @__PURE__ */ React.createElement(PropertyValue, {
-    value,
-    title: "view schema",
-    onClick: /* @__PURE__ */ __name(() => {
-      if (!divRef.current) {
-        console.warn("divRef.current is null");
-      }
-      onClick(divDispatch);
-    }, "onClick")
-  })) : /* @__PURE__ */ React.createElement(PropertyValue, {
-    value,
-    title: "view schema",
-    onClick: /* @__PURE__ */ __name(() => {
-      if (!divRef.current) {
-        console.warn("divRef.current is null");
+  const onClick = (dispatch, openNewWindow = false) => {
+    dispatch?.(
+      "schema",
+      "click",
+      JSON.stringify({
+        openNewWindow,
+        schema: value
+      })
+    );
+  };
+  return /* @__PURE__ */ jsxs(Property, { title: "Schema", value, tip: "Schema sent with the payload", titleProps, ...props, children: [
+    value && showStatusIcon ? resolvedSchema === null ? /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        ref: buttonRef,
+        size: "small",
+        onClick: () => {
+          if (!buttonRef.current) {
+            console.warn("buttonRef.current is null");
+          }
+          onClick(buttonDispatch);
+        },
+        children: /* @__PURE__ */ jsx(NewReleasesIcon, { color: "warning", fontSize: "inherit" })
       }
-      onClick(divDispatch);
-    }, "onClick")
-  }), showOpenNewWindowLink ? /* @__PURE__ */ React.createElement(IconButton, {
-    ref: buttonRef,
-    size: "small",
-    onClick: /* @__PURE__ */ __name(() => {
-      if (!buttonRef.current) {
-        console.warn("buttonRef.current is null");
+    ) : resolvedSchema === void 0 ? /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        ref: buttonRef,
+        size: "small",
+        onClick: () => {
+          if (!buttonRef.current) {
+            console.warn("buttonRef.current is null");
+          }
+          onClick(buttonDispatch);
+        },
+        children: /* @__PURE__ */ jsx(NewReleasesIcon, { color: "disabled", fontSize: "inherit" })
       }
-      onClick(buttonDispatch, true);
-    }, "onClick")
-  }, /* @__PURE__ */ React.createElement(OpenInNewIcon, {
-    fontSize: "inherit"
-  })) : null) : null);
-}, "SchemaProperty");
+    ) : /* @__PURE__ */ jsx(IconButton, { rel: "noopener noreferrer", size: "small", target: "_blank", href: resolvedSchema?.huri?.href ?? "", children: /* @__PURE__ */ jsx(VerifiedIcon, { color: "success", fontSize: "inherit" }) }) : null,
+    value ? /* @__PURE__ */ jsxs(FlexGrowRow, { ref: divRef, justifyContent: "space-between", children: [
+      showLinkNames ? /* @__PURE__ */ jsx(
+        LinkEx,
+        {
+          display: "block",
+          width: "100%",
+          sx: { cursor: "pointer" },
+          children: /* @__PURE__ */ jsx(
+            PropertyValue,
+            {
+              value,
+              title: "view schema",
+              onClick: () => {
+                if (!divRef.current) {
+                  console.warn("divRef.current is null");
+                }
+                onClick(divDispatch);
+              }
+            }
+          )
+        }
+      ) : /* @__PURE__ */ jsx(
+        PropertyValue,
+        {
+          value,
+          title: "view schema",
+          onClick: () => {
+            if (!divRef.current) {
+              console.warn("divRef.current is null");
+            }
+            onClick(divDispatch);
+          }
+        }
+      ),
+      showOpenNewWindowLink ? /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          ref: buttonRef,
+          size: "small",
+          onClick: () => {
+            if (!buttonRef.current) {
+              console.warn("buttonRef.current is null");
+            }
+            onClick(buttonDispatch, true);
+          },
+          children: /* @__PURE__ */ jsx(OpenInNewIcon, { fontSize: "inherit" })
+        }
+      ) : null
+    ] }) : null
+  ] });
+};
 SchemaProperty.displayName = "SchemaProperty";
 
 // src/components/SelectEx/SchemaSelectEx.tsx
 import { MenuItem, Typography } from "@mui/material";
 import { SelectEx } from "@xylabs/react-select";
-import React4 from "react";
 
 // src/contexts/Schema/Context.ts
 import { createContextEx } from "@xylabs/react-shared";
@@ -126,7 +140,11 @@ var SchemaContext = createContextEx();
 
 // src/contexts/Schema/Provider/Memory.tsx
 import { exists } from "@xylabs/sdk-js";
-import React2, { useEffect, useMemo as useMemo2, useState as useState5 } from "react";
+import {
+  useEffect,
+  useMemo as useMemo2,
+  useState as useState5
+} from "react";
 
 // src/hooks/useGetSchema.tsx
 import { useAsyncEffect as useAsyncEffect2 } from "@xylabs/react-async-effect";
@@ -134,223 +152,217 @@ import { PayloadBuilder } from "@xyo-network/payload-builder";
 import { ModuleErrorSchema } from "@xyo-network/payload-model";
 import { SchemaCache as SchemaCache2 } from "@xyo-network/schema-cache";
 import { useState as useState2 } from "react";
-var useGetSchemaPayload = /* @__PURE__ */ __name((schema) => {
+var useGetSchemaPayload = (schema) => {
   const [notFound, setNotFound] = useState2(false);
   const [xyoError, setXyoError] = useState2();
   const [schemaCacheEntry, setSchemaCacheEntry] = useState2();
   const [schemaLocal, setSchemaLocal] = useState2();
-  useAsyncEffect2(async (mounted) => {
-    const firstRequest = !notFound && !schemaCacheEntry && !xyoError;
-    const schemaChanged = schema !== schemaLocal;
-    if (schema && firstRequest || schema && schemaChanged) {
-      try {
-        const schemaCacheEntry2 = await SchemaCache2.instance.get(schema);
-        if (mounted()) {
-          setSchemaCacheEntry(schemaCacheEntry2);
-          setNotFound(schemaCacheEntry2 === null || schemaCacheEntry2 === void 0);
-        }
-      } catch (e) {
-        const error = e;
-        console.error(e);
-        if (mounted()) {
-          setXyoError({
-            message: error.message,
-            schema: ModuleErrorSchema,
-            $sources: []
-          });
+  useAsyncEffect2(
+    async (mounted) => {
+      const firstRequest = !notFound && !schemaCacheEntry && !xyoError;
+      const schemaChanged = schema !== schemaLocal;
+      if (schema && firstRequest || schema && schemaChanged) {
+        try {
+          const schemaCacheEntry2 = await SchemaCache2.instance.get(schema);
+          if (mounted()) {
+            setSchemaCacheEntry(schemaCacheEntry2);
+            setNotFound(schemaCacheEntry2 === null || schemaCacheEntry2 === void 0);
+          }
+        } catch (e) {
+          const error = e;
+          console.error(e);
+          if (mounted()) {
+            setXyoError({
+              message: error.message,
+              schema: ModuleErrorSchema,
+              $sources: []
+            });
+          }
         }
       }
-    }
-    if (schemaChanged) {
-      setSchemaLocal(schema);
-    }
-  }, [
-    xyoError,
-    notFound,
-    schema,
-    schemaLocal,
-    schemaCacheEntry
-  ]);
+      if (schemaChanged) {
+        setSchemaLocal(schema);
+      }
+    },
+    [xyoError, notFound, schema, schemaLocal, schemaCacheEntry]
+  );
   return {
     notFound,
     schemaHuri: schemaCacheEntry?.huri,
     schemaPayload: schemaCacheEntry ? new PayloadBuilder(schemaCacheEntry?.payload).fields(schemaCacheEntry.payload).build() : schemaCacheEntry,
     xyoError
   };
-}, "useGetSchemaPayload");
+};
 
 // src/hooks/useSchemaDefinitions.tsx
 import { useAsyncEffect as useAsyncEffect3 } from "@xylabs/react-async-effect";
 import { SchemaCache as SchemaCache3 } from "@xyo-network/schema-cache";
 import { useState as useState3 } from "react";
-var useSchemaDefinitions = /* @__PURE__ */ __name((schemaList) => {
+var useSchemaDefinitions = (schemaList) => {
   const [schemaPayloads, setSchemaPayloads] = useState3();
-  useAsyncEffect3(async (mounted) => {
-    if (schemaList) {
-      const promiseResults = await Promise.allSettled(schemaList?.map(({ name }) => SchemaCache3.instance.get(name)));
-      if (mounted()) {
-        setSchemaPayloads(promiseResults.map((result) => result.status === "fulfilled" ? result.value?.payload : void 0).filter((item) => item !== void 0 && item !== null));
+  useAsyncEffect3(
+    async (mounted) => {
+      if (schemaList) {
+        const promiseResults = await Promise.allSettled(schemaList?.map(({ name }) => SchemaCache3.instance.get(name)));
+        if (mounted()) {
+          setSchemaPayloads(
+            promiseResults.map((result) => result.status === "fulfilled" ? result.value?.payload : void 0).filter((item) => item !== void 0 && item !== null)
+          );
+        }
       }
-    }
-  }, [
-    schemaList
-  ]);
+    },
+    [schemaList]
+  );
   return schemaPayloads;
-}, "useSchemaDefinitions");
+};
 
 // src/hooks/useSchemaList.tsx
 import { usePromise } from "@xylabs/react-promise";
 import { SchemaListQuerySchema } from "@xyo-network/diviner-schema-list-model";
 import { useWeakDivinerFromNode } from "@xyo-network/react-diviner";
 import { useMemo } from "react";
-var useSchemaList = /* @__PURE__ */ __name((address, nameOrAddress = "SchemaListDiviner") => {
+var useSchemaList = (address, nameOrAddress = "SchemaListDiviner") => {
   const [diviner, divinerError] = useWeakDivinerFromNode(nameOrAddress);
-  const query = useMemo(() => address ? [
-    {
-      address,
-      schema: SchemaListQuerySchema
-    }
-  ] : void 0, [
-    address
-  ]);
-  const [schemaList, error] = usePromise(async () => {
-    const divinerInstance = diviner?.deref();
-    if (divinerInstance) {
-      const response = await divinerInstance.divine(query);
-      return response.at(0);
-    }
-  }, [
-    diviner,
-    divinerError,
-    query
-  ]);
-  return [
-    schemaList,
-    error
-  ];
-}, "useSchemaList");
+  const query = useMemo(
+    () => address ? [
+      {
+        address,
+        schema: SchemaListQuerySchema
+      }
+    ] : void 0,
+    [address]
+  );
+  const [schemaList, error] = usePromise(
+    async () => {
+      const divinerInstance = diviner?.deref();
+      if (divinerInstance) {
+        const response = await divinerInstance.divine(query);
+        return response.at(0);
+      }
+    },
+    [diviner, divinerError, query]
+  );
+  return [schemaList, error];
+};
 
 // src/hooks/useSchemaStats.tsx
 import { useAsyncEffect as useAsyncEffect4 } from "@xylabs/react-async-effect";
 import { isDefined } from "@xylabs/sdk-js";
-import { SchemaStatsDivinerSchema, SchemaStatsQuerySchema } from "@xyo-network/diviner-schema-stats-model";
+import {
+  SchemaStatsDivinerSchema,
+  SchemaStatsQuerySchema
+} from "@xyo-network/diviner-schema-stats-model";
 import { TYPES } from "@xyo-network/node-core-types";
 import { isPayloadOfSchemaType } from "@xyo-network/payload-model";
 import { useWeakDivinerFromNode as useWeakDivinerFromNode2 } from "@xyo-network/react-diviner";
 import { useState as useState4 } from "react";
-var useSchemaStats = /* @__PURE__ */ __name((statsAddress, nameOrAddress = TYPES.SchemaStatsDiviner) => {
+var useSchemaStats = (statsAddress, nameOrAddress = TYPES.SchemaStatsDiviner) => {
   const [refresh, setRefresh] = useState4(1);
   const [diviner, divinerError] = useWeakDivinerFromNode2(nameOrAddress);
   const [error, setError] = useState4();
-  const refreshHistory = /* @__PURE__ */ __name(() => setRefresh((previous) => previous + 1), "refreshHistory");
+  const refreshHistory = () => setRefresh((previous) => previous + 1);
   const [schemaList, setSchemaList] = useState4();
-  useAsyncEffect4(async (mounted) => {
-    const instance = diviner?.deref();
-    if (isDefined(instance) && isDefined(statsAddress)) {
-      if (divinerError) {
-        if (mounted()) {
-          setError(divinerError);
-          setSchemaList(void 0);
-        }
-      } else {
-        try {
-          const query = {
-            address: statsAddress,
-            schema: SchemaStatsQuerySchema
-          };
-          const schemas = (await instance.divine([
-            query
-          ])).filter(isPayloadOfSchemaType(SchemaStatsDivinerSchema));
+  useAsyncEffect4(
+    async (mounted) => {
+      const instance = diviner?.deref();
+      if (isDefined(instance) && isDefined(statsAddress)) {
+        if (divinerError) {
           if (mounted()) {
-            setSchemaList(schemas);
-            setError(void 0);
+            setError(divinerError);
+            setSchemaList(void 0);
+          }
+        } else {
+          try {
+            const query = {
+              address: statsAddress,
+              schema: SchemaStatsQuerySchema
+            };
+            const schemas = (await instance.divine([query])).filter(isPayloadOfSchemaType(SchemaStatsDivinerSchema));
+            if (mounted()) {
+              setSchemaList(schemas);
+              setError(void 0);
+            }
+          } catch (ex) {
+            setError(ex);
+            setSchemaList(void 0);
           }
-        } catch (ex) {
-          setError(ex);
-          setSchemaList(void 0);
         }
       }
-    }
-  }, [
-    diviner,
-    refresh,
-    divinerError,
-    statsAddress
-  ]);
-  return [
-    schemaList,
-    error,
-    refreshHistory
-  ];
-}, "useSchemaStats");
+    },
+    [diviner, refresh, divinerError, statsAddress]
+  );
+  return [schemaList, error, refreshHistory];
+};
 
 // src/contexts/Schema/Provider/Memory.tsx
-var SchemaMemoryProvider = /* @__PURE__ */ __name(({ defaultSchema, knownSchemaList, ...props }) => {
+import { jsx as jsx2 } from "react/jsx-runtime";
+var SchemaMemoryProvider = ({
+  defaultSchema,
+  knownSchemaList,
+  ...props
+}) => {
   const [schema, setSchema] = useState5(defaultSchema);
   const [schemaList, setSchemaList] = useState5(knownSchemaList);
   const [fetchedSchemaStats] = useSchemaStats();
   useEffect(() => {
     if (fetchedSchemaStats) {
-      const schemaList2 = fetchedSchemaStats.map(({ name }) => name).filter(exists);
-      setSchemaList(schemaList2);
+      const newSchemaList = fetchedSchemaStats.map(({ name }) => name).filter(exists);
+      setSchemaList(newSchemaList);
     }
-  }, [
-    fetchedSchemaStats
-  ]);
+  }, [fetchedSchemaStats]);
   const value = useMemo2(() => ({
     provided: true,
     schema,
     schemaList: knownSchemaList ?? schemaList,
     setSchema,
     setSchemaList
-  }), [
-    schema,
-    schemaList,
-    knownSchemaList
-  ]);
-  return /* @__PURE__ */ React2.createElement(SchemaContext, {
-    value,
-    ...props
-  });
-}, "SchemaMemoryProvider");
+  }), [schema, schemaList, knownSchemaList]);
+  return /* @__PURE__ */ jsx2(SchemaContext, { value, ...props });
+};
 
 // src/contexts/Schema/Provider/Route.tsx
-import React3, { useCallback, useEffect as useEffect2, useMemo as useMemo3 } from "react";
+import {
+  useCallback,
+  useEffect as useEffect2,
+  useMemo as useMemo3
+} from "react";
 import { useSearchParams } from "react-router-dom";
 
 // src/contexts/Schema/use.ts
 import { useContextEx } from "@xylabs/react-shared";
-var useSchema = /* @__PURE__ */ __name((required = false) => {
+var useSchema = (required = false) => {
   return useContextEx(SchemaContext, "Schema", required);
-}, "useSchema");
+};
 
 // src/contexts/Schema/Provider/Route.tsx
-var SchemaRouteProviderInner = /* @__PURE__ */ __name(({ children }) => {
-  const { schema, setSchema, schemaList } = useSchema();
+import { jsx as jsx3 } from "react/jsx-runtime";
+var SchemaRouteProviderInner = ({ children }) => {
+  const {
+    schema,
+    setSchema,
+    schemaList
+  } = useSchema();
   const [params, setParams] = useSearchParams();
   const routeSchema = params.get("schema");
-  const setSchemaParam = useCallback((schema2) => {
-    if (schema2) {
-      params.set("schema", schema2);
-      setParams(params, {
-        replace: true
-      });
+  const setSchemaParam = useCallback(
+    (schema2) => {
+      if (schema2) {
+        params.set("schema", schema2);
+        setParams(params, { replace: true });
+        setSchema?.(schema2);
+      } else {
+        params.delete("network");
+      }
+    },
+    [params, setParams, setSchema]
+  );
+  const setSchemaLocal = useCallback(
+    (schema2) => {
+      setSchemaParam(schema2);
       setSchema?.(schema2);
-    } else {
-      params.delete("network");
-    }
-  }, [
-    params,
-    setParams,
-    setSchema
-  ]);
-  const setSchemaLocal = useCallback((schema2) => {
-    setSchemaParam(schema2);
-    setSchema?.(schema2);
-  }, [
-    setSchemaParam,
-    setSchema
-  ]);
+    },
+    [setSchemaParam, setSchema]
+  );
   useEffect2(() => {
     if (routeSchema !== schema) {
       if (routeSchema === void 0 && schema !== void 0) {
@@ -359,61 +371,60 @@ var SchemaRouteProviderInner = /* @__PURE__ */ __name(({ children }) => {
         setSchema?.(routeSchema);
       }
     }
-  }, [
-    routeSchema,
-    schema,
-    setSchemaParam,
-    setSchema,
-    setSchemaLocal
-  ]);
+  }, [routeSchema, schema, setSchemaParam, setSchema, setSchemaLocal]);
   const value = useMemo3(() => ({
     provided: true,
     schema,
     schemaList,
     setSchema: setSchemaLocal
-  }), [
-    schema,
-    schemaList,
-    setSchemaLocal
-  ]);
-  return /* @__PURE__ */ React3.createElement(SchemaContext, {
-    value
-  }, children);
-}, "SchemaRouteProviderInner");
-var SchemaRouteProvider = /* @__PURE__ */ __name(({ knownSchemaList, defaultSchema, ...props }) => {
-  return /* @__PURE__ */ React3.createElement(SchemaMemoryProvider, {
-    knownSchemaList,
-    defaultSchema
-  }, /* @__PURE__ */ React3.createElement(SchemaRouteProviderInner, props));
-}, "SchemaRouteProvider");
+  }), [schema, schemaList, setSchemaLocal]);
+  return /* @__PURE__ */ jsx3(SchemaContext, { value, children });
+};
+var SchemaRouteProvider = ({
+  knownSchemaList,
+  defaultSchema,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx3(SchemaMemoryProvider, { knownSchemaList, defaultSchema, children: /* @__PURE__ */ jsx3(SchemaRouteProviderInner, { ...props }) });
+};
 
 // src/components/SelectEx/SchemaSelectEx.tsx
-var SchemaSelectEx = /* @__PURE__ */ __name(({ onChange, variant = "outlined", ...props }) => {
-  const { schema, setSchema, schemaList } = useSchema(false);
-  return /* @__PURE__ */ React4.createElement(SelectEx, {
-    variant,
-    size: "small",
-    value: schema ?? "none",
-    onChange: /* @__PURE__ */ __name((event, child) => {
-      if (event.target.value !== schema) {
-        onChange?.(event, child);
-        setSchema?.(event.target.value);
-      }
-    }, "onChange"),
-    renderValue: /* @__PURE__ */ __name((value) => {
-      return /* @__PURE__ */ React4.createElement(Typography, null, value === "none" ? "- None -" : value);
-    }, "renderValue"),
-    ...props
-  }, schemaList?.map((schema2) => {
-    return /* @__PURE__ */ React4.createElement(MenuItem, {
-      key: schemaList.indexOf(schema2),
-      value: schema2
-    }, schema2);
-  }), /* @__PURE__ */ React4.createElement(MenuItem, {
-    key: "none",
-    value: "none"
-  }, "- None -"));
-}, "SchemaSelectEx");
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+var SchemaSelectEx = ({
+  onChange,
+  variant = "outlined",
+  ...props
+}) => {
+  const {
+    schema,
+    setSchema,
+    schemaList
+  } = useSchema(false);
+  return /* @__PURE__ */ jsxs2(
+    SelectEx,
+    {
+      variant,
+      size: "small",
+      value: schema ?? "none",
+      onChange: (event, child) => {
+        if (event.target.value !== schema) {
+          onChange?.(event, child);
+          setSchema?.(event.target.value);
+        }
+      },
+      renderValue: (value) => {
+        return /* @__PURE__ */ jsx4(Typography, { children: value === "none" ? "- None -" : value });
+      },
+      ...props,
+      children: [
+        schemaList?.map((schema2) => {
+          return /* @__PURE__ */ jsx4(MenuItem, { value: schema2, children: schema2 }, schemaList.indexOf(schema2));
+        }),
+        /* @__PURE__ */ jsx4(MenuItem, { value: "none", children: "- None -" }, "none")
+      ]
+    }
+  );
+};
 export {
   SchemaContext,
   SchemaMemoryProvider,