@sanity/ui 2.0.0-alpha.29 → 2.0.0-alpha.30

package/dist/index.esm.js

@@ -715,7 +715,7 @@ var ResizeObserverController = function () {
   };
   return ResizeObserverController;
 }();
-var ResizeObserver$1 = function () {
+var ResizeObserver = function () {
   function ResizeObserver(callback) {
     if (arguments.length === 0) {
       throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
@@ -751,7 +751,7 @@ var ResizeObserver$1 = function () {
   };
   return ResizeObserver;
 }();
-const _ResizeObserver = typeof document !== "undefined" && typeof window !== "undefined" && window.ResizeObserver ? window.ResizeObserver : ResizeObserver$1;
+const _ResizeObserver = typeof document !== "undefined" && typeof window !== "undefined" && window.ResizeObserver ? window.ResizeObserver : ResizeObserver;
 const _elementSizeObserver = _createElementSizeObserver();
 function _createElementRectValueListener() {
   return {
@@ -5750,7 +5750,6 @@ const Breadcrumbs = forwardRef(function Breadcrumbs2(props, ref) {
     }, itemIndex))
   });
 });
-const BORDER_OFFSET_X = 12;
 var __freeze$c = Object.freeze;
 var __defProp$c = Object.defineProperty;
 var __template$c = (cooked, raw) => __freeze$c(__defProp$c(cooked, "raw", {
@@ -5815,9 +5814,9 @@ const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDial
 const DialogContainer = styled(Container)(_a$b || (_a$b = __template$b(["\n  &:not([hidden]) {\n    display: flex;\n  }\n  width: 100%;\n  height: 100%;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n"])));
 const DialogCardRoot = styled(Card)(_b$6 || (_b$6 = __template$b(["\n  &:not([hidden]) {\n    display: flex;\n  }\n  width: 100%;\n  min-height: 0;\n  max-height: 100%;\n  overflow: hidden;\n  overflow: clip;\n"])));
 const DialogLayout = styled(Flex)(_c$2 || (_c$2 = __template$b(["\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n"])));
-const DialogHeader = styled(Box)(_d$1 || (_d$1 = __template$b(["\n  position: relative;\n  z-index: 2;\n\n  &:after {\n    content: '';\n    display: block;\n    position: absolute;\n    left: ", "px;\n    right: ", "px;\n    bottom: -1px;\n    border-bottom: 1px solid var(--card-border-color);\n    width: auto;\n    opacity: ", ";\n    transition: opacity 200ms ease-in;\n  }\n"])), BORDER_OFFSET_X, BORDER_OFFSET_X, props => props.$isContentScrollable && props.$hasScrolledFromTop ? 1 : 0);
+const DialogHeader = styled(Box)(_d$1 || (_d$1 = __template$b(["\n  position: relative;\n  z-index: 2;\n"])));
 const DialogContent = styled(Box)(_e || (_e = __template$b(["\n  position: relative;\n  z-index: 1;\n  overflow: auto;\n  outline: none;\n"])));
-const DialogFooter = styled(Box)(_f || (_f = __template$b(["\n  position: relative;\n  z-index: 3;\n\n  &:before {\n    content: '';\n    display: block;\n    position: absolute;\n    left: ", "px;\n    right: ", "px;\n    top: -1px;\n    border-top: 1px solid var(--card-border-color);\n    width: auto;\n    opacity: ", ";\n    transition: opacity 200ms ease-in;\n  }\n"])), BORDER_OFFSET_X, BORDER_OFFSET_X, props => props.$isContentScrollable && !props.$hasScrolledToBottom ? 1 : 0);
+const DialogFooter = styled(Box)(_f || (_f = __template$b(["\n  position: relative;\n  z-index: 3;\n"])));
 const DialogCard = forwardRef(function DialogCard2(props, ref) {
   var _a2;
   const {
@@ -5852,9 +5851,6 @@ const DialogCard = forwardRef(function DialogCard2(props, ref) {
   const labelId = "".concat(id, "_label");
   const showCloseButton = Boolean(onClose) && hideCloseButton === false;
   const showHeader = Boolean(header) || showCloseButton;
-  const [isContentScrollable, setIsContentScrollable] = useState(false);
-  const [hasScrolledFromTop, setHasScrolledFromTop] = useState(false);
-  const [hasScrolledToBottom, setHasScrolledToBottom] = useState(false);
   useEffect(() => {
     if (!autoFocus) return;
     if (forwardedRef.current) {
@@ -5889,22 +5885,6 @@ const DialogCard = forwardRef(function DialogCard2(props, ref) {
     localContentRef.current = el;
     if (typeof contentRef === "function") contentRef(el);else if (contentRef) contentRef.current = el;
   }, [contentRef]);
-  const handleContentUpdate = useCallback(() => {
-    if (localContentRef.current) {
-      setIsContentScrollable(localContentRef.current.clientHeight < localContentRef.current.scrollHeight);
-      setHasScrolledFromTop(localContentRef.current.scrollTop > 0);
-      setHasScrolledToBottom(localContentRef.current.scrollTop >= localContentRef.current.scrollHeight - localContentRef.current.clientHeight);
-    }
-  }, []);
-  useEffect(() => {
-    const resizeObserver = new ResizeObserver(handleContentUpdate);
-    if (localContentRef.current) {
-      resizeObserver.observe(localContentRef.current);
-    }
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, [contentRef, handleContentUpdate]);
   return /* @__PURE__ */jsx(DialogContainer, {
     "data-ui": "DialogCard",
     width,
@@ -5916,8 +5896,6 @@ const DialogCard = forwardRef(function DialogCard2(props, ref) {
       children: /* @__PURE__ */jsxs(DialogLayout, {
         direction: "column",
         children: [showHeader && /* @__PURE__ */jsx(DialogHeader, {
-          $isContentScrollable: isContentScrollable,
-          $hasScrolledFromTop: hasScrolledFromTop,
           children: /* @__PURE__ */jsxs(Flex, {
             align: "center",
             padding: 3,
@@ -5946,11 +5924,8 @@ const DialogCard = forwardRef(function DialogCard2(props, ref) {
           flex: 1,
           ref: setContentRef,
           tabIndex: -1,
-          onScroll: handleContentUpdate,
           children
         }), footer && /* @__PURE__ */jsx(DialogFooter, {
-          $isContentScrollable: isContentScrollable,
-          $hasScrolledToBottom: hasScrolledToBottom,
           children: footer
         })]
       })