@overmap-ai/core 1.0.38-component-fields.18 → 1.0.38-component-fields.20

package/dist/overmap-core.umd.cjs

@@ -7718,15 +7718,15 @@ var __publicField = (obj, key, value) => {
     }
     return classes.join(" ");
   }
-  const paddingValues = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
+  const paddingValues$1 = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
   const paddingPropDefs = {
-    p: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    px: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    py: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    pt: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    pr: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    pb: { type: "enum", values: paddingValues, default: void 0, responsive: true },
-    pl: { type: "enum", values: paddingValues, default: void 0, responsive: true }
+    p: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    px: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    py: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    pt: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    pr: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    pb: { type: "enum", values: paddingValues$1, default: void 0, responsive: true },
+    pl: { type: "enum", values: paddingValues$1, default: void 0, responsive: true }
   };
   function extractPaddingProps(props) {
     const { p = layoutPropDefs.p.default, px = layoutPropDefs.px.default, py = layoutPropDefs.py.default, pt = layoutPropDefs.pt.default, pr = layoutPropDefs.pr.default, pb = layoutPropDefs.pb.default, pl = layoutPropDefs.pl.default, ...rest } = props;
@@ -7867,6 +7867,26 @@ var __publicField = (obj, key, value) => {
     wrap: { type: "enum", values: wrapValues, default: void 0, responsive: true },
     gap: { type: "enum", values: gapValues, default: void 0, responsive: true }
   };
+  const sides = ["all", "x", "y", "top", "bottom", "left", "right"];
+  const clipValues = ["border-box", "padding-box"];
+  const paddingValues = ["current", "0"];
+  const insetPropDefs = {
+    side: { type: "enum", values: sides, default: "all", responsive: true },
+    clip: { type: "enum", values: clipValues, default: "border-box", responsive: true },
+    p: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    px: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    py: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    pt: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    pr: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    pb: { type: "enum", values: paddingValues, default: void 0, responsive: true },
+    pl: { type: "enum", values: paddingValues, default: void 0, responsive: true }
+  };
+  const Inset = React__namespace.forwardRef((props, forwardedRef) => {
+    const { rest: marginRest, ...marginProps } = extractMarginProps(props);
+    const { className, side = insetPropDefs.side.default, clip = insetPropDefs.clip.default, p, px, py, pt, pr, pb, pl, ...insetProps } = marginRest;
+    return React__namespace.createElement("div", { ...insetProps, ref: forwardedRef, className: classNames("rt-Inset", className, withBreakpoints(side, "rt-r-side"), withBreakpoints(clip, "rt-r-clip"), withBreakpoints(p, "rt-r-p"), withBreakpoints(px, "rt-r-px"), withBreakpoints(py, "rt-r-py"), withBreakpoints(pt, "rt-r-pt"), withBreakpoints(pr, "rt-r-pr"), withBreakpoints(pb, "rt-r-pb"), withBreakpoints(pl, "rt-r-pl"), withMarginProps(marginProps)) });
+  });
+  Inset.displayName = "Inset";
   const sizes$4 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
   const headingPropDefs = {
     size: { type: "enum", values: sizes$4, default: "6", responsive: true },
@@ -9657,10 +9677,10 @@ var __publicField = (obj, key, value) => {
       super(options, FieldInputCloner);
     }
   }
-  const previewImage$1 = "_previewImage_ebhyt_1";
-  const nameContainer = "_nameContainer_ebhyt_9";
-  const hasPreview = "_hasPreview_ebhyt_14";
-  const useEllipsis = "_useEllipsis_ebhyt_19";
+  const previewImage$1 = "_previewImage_1piva_1";
+  const nameContainer = "_nameContainer_1piva_11";
+  const hasPreview = "_hasPreview_1piva_16";
+  const useEllipsis = "_useEllipsis_1piva_21";
   const styles$4 = {
     previewImage: previewImage$1,
     nameContainer,
@@ -9806,9 +9826,36 @@ var __publicField = (obj, key, value) => {
       },
       [name, resolvedFile]
     );
-    return /* @__PURE__ */ jsxRuntime.jsx(Card, { children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: { initial: "column", sm: "row" }, gap: "3", justify: "between", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "row", gap: "3", align: "center", grow: "1", shrink: "0", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "column", gap: "2", children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(Card, { style: { width: "100%" }, size: "1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Inset, { clip: "border-box", side: "top", pb: "0", children: url && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "img",
+          {
+            className: styles$4.previewImage,
+            src: url,
+            alt: name,
+            onClick: () => {
+              setShowPreview(true);
+            }
+          }
+        ),
+        showPreview && /* @__PURE__ */ jsxRuntime.jsx(
+          FullScreenImagePreview,
+          {
+            file: resolvedFile,
+            url,
+            name,
+            setShowPreview
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(blocks.Flex, { style: { marginBottom: "calc(-1 * var(--space-1))" }, children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", width: "100%", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", grow: "1", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$4.useEllipsis, size: "1", children: name }),
+          /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", children: size }),
+          error2 && /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", severity: "danger", children: error2 })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", gap: "2", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             blocks.IconButton,
             {
@@ -9830,44 +9877,9 @@ var __publicField = (obj, key, value) => {
               children: /* @__PURE__ */ jsxRuntime.jsx(Cross1Icon, {})
             }
           )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          blocks.Flex,
-          {
-            className: classNames$1(styles$4.nameContainer, { [styles$4.hasPreview]: !!url }),
-            direction: "column",
-            gap: "1",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$4.useEllipsis, children: name }),
-              /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", children: size }),
-              error2 && /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", severity: "danger", children: error2 })
-            ]
-          }
-        )
-      ] }),
-      url && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "img",
-          {
-            className: styles$4.previewImage,
-            src: url,
-            alt: name,
-            onClick: () => {
-              setShowPreview(true);
-            }
-          }
-        ),
-        showPreview && /* @__PURE__ */ jsxRuntime.jsx(
-          FullScreenImagePreview,
-          {
-            file: resolvedFile,
-            url,
-            name,
-            setShowPreview
-          }
-        )
-      ] })
-    ] }) });
+        ] })
+      ] }) })
+    ] });
   });
   DisplayFile.displayName = "DisplayFile";
   const emptyUploadField = {