@dxos/react-ui 0.7.5-labs.35b4b42 → 0.7.5-labs.401163d

package/dist/lib/browser/index.mjs

@@ -253,16 +253,12 @@ var AvatarFrame = /* @__PURE__ */ forwardRef3(({ classNames, children, ...props
     y: ringGap + ringWidth,
     rx
   }))), variant === "circle" ? /* @__PURE__ */ React4.createElement("circle", {
-    className: hue ? tx("hue.fill", "avatar__frame__circle", {
-      hue
-    }) : "fill-[var(--surface-bg)]",
     cx: "50%",
     cy: "50%",
-    r
+    r,
+    fill: hue ? `var(--dx-${hue}Fill)` : "var(--surface-bg)"
   }) : /* @__PURE__ */ React4.createElement("rect", {
-    className: hue ? tx("hue.fill", "avatar__frame__rect", {
-      hue
-    }) : "fill-[var(--surface-bg)]",
+    fill: hue ? `var(--dx-${hue}Fill)` : "var(--surface-bg)",
     x: ringGap + ringWidth,
     y: ringGap + ringWidth,
     width: 2 * r,
@@ -887,7 +883,7 @@ var CopyButtonIconOnly = ({ value, classNames, iconProps, variant, ...props }) =
   const { t } = useTranslation("os");
   const { textValue, setTextValue } = useClipboard();
   const isCopied = textValue === value;
-  const label = isCopied ? t("copy success label") : t("copy label");
+  const label = isCopied ? t("copy success label") : props.label ?? t("copy label");
   const [open, setOpen] = useState6(false);
   return /* @__PURE__ */ React17.createElement(Tooltip.Root, {
     delayDuration: 1500,
@@ -969,13 +965,13 @@ var DialogOverlay = /* @__PURE__ */ forwardRef12(({ classNames, children, blockA
   }, children));
 });
 DialogOverlay.displayName = DIALOG_OVERLAY_NAME;
-var DialogContent = /* @__PURE__ */ forwardRef12(({ classNames, children, ...props }, forwardedRef) => {
+var DialogContent = /* @__PURE__ */ forwardRef12(({ classNames, children, inOverlayLayout: propsInOverlayLayout, ...props }, forwardedRef) => {
   const { tx } = useThemeContext();
   const { inOverlayLayout } = useOverlayLayoutContext(DIALOG_CONTENT_NAME);
   return /* @__PURE__ */ React18.createElement(DialogContentPrimitive, {
     ...props,
     className: tx("dialog.content", "dialog", {
-      inOverlayLayout
+      inOverlayLayout: propsInOverlayLayout || inOverlayLayout
     }, classNames),
     ref: forwardedRef
   }, children);
@@ -1712,8 +1708,8 @@ var edgeToOrientationMap = {
   right: "vertical"
 };
 var orientationStyles = {
-  horizontal: "h-[--line-thickness] left-[--terminal-radius] right-0 before:left-[--negative-terminal-size]",
-  vertical: "w-[--line-thickness] top-[--terminal-radius] bottom-0 before:top-[--negative-terminal-size]"
+  horizontal: "h-[--line-thickness] left-[calc(var(--line-inset)+var(--terminal-radius))] right-[--line-inset] before:left-[--terminal-inset]",
+  vertical: "w-[--line-thickness] top-[calc(var(--line-inset)+var(--terminal-radius))] bottom-[--line-inset] before:top-[--terminal-inset]"
 };
 var edgeStyles = {
   top: "top-[--line-offset] before:top-[--offset-terminal]",
@@ -1724,17 +1720,17 @@ var edgeStyles = {
 var strokeSize = 2;
 var terminalSize = 8;
 var offsetToAlignTerminalWithLine = (strokeSize - terminalSize) / 2;
-var ListDropIndicator = ({ edge, gap = 0 }) => {
-  const lineOffset = `calc(-0.5 * (${gap}px + ${strokeSize}px))`;
+var ListDropIndicator = ({ edge, gap = 0, lineInset = 0, terminalInset = lineInset - terminalSize }) => {
   const orientation = edgeToOrientationMap[edge];
   return /* @__PURE__ */ React23.createElement("div", {
     role: "none",
     style: {
       "--line-thickness": `${strokeSize}px`,
-      "--line-offset": `${lineOffset}`,
+      "--line-offset": `calc(-0.5 * (${gap}px + ${strokeSize}px))`,
+      "--line-inset": `${lineInset}px`,
       "--terminal-size": `${terminalSize}px`,
       "--terminal-radius": `${terminalSize / 2}px`,
-      "--negative-terminal-size": `-${terminalSize}px`,
+      "--terminal-inset": `${terminalInset}px`,
       "--offset-terminal": `${offsetToAlignTerminalWithLine}px`
     },
     className: `absolute z-10 pointer-events-none bg-accentSurface before:content-[''] before:w-[--terminal-size] before:h-[--terminal-size] box-border before:absolute before:border-[length:--line-thickness] before:border-solid before:border-accentSurface before:rounded-full ${orientationStyles[orientation]} ${edgeStyles[edge]}`
@@ -2977,14 +2973,15 @@ var Separator4 = /* @__PURE__ */ forwardRef26(({ classNames, orientation = "hori
 import { Primitive as Primitive12 } from "@radix-ui/react-primitive";
 import { Slot as Slot13 } from "@radix-ui/react-slot";
 import React35, { forwardRef as forwardRef27 } from "react";
-var Tag = /* @__PURE__ */ forwardRef27(({ asChild, palette, classNames, ...props }, forwardedRef) => {
+var Tag = /* @__PURE__ */ forwardRef27(({ asChild, palette = "neutral", classNames, ...props }, forwardedRef) => {
   const { tx } = useThemeContext();
   const Root5 = asChild ? Slot13 : Primitive12.span;
   return /* @__PURE__ */ React35.createElement(Root5, {
     ...props,
-    className: tx("tag.root", "tag", {
+    className: tx("tag.root", "dx-tag", {
       palette
     }, classNames),
+    "data-hue": palette,
     ref: forwardedRef
   });
 });