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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -728,7 +728,7 @@ var ResizeObserverController = function () {
728
728
  };
729
729
  return ResizeObserverController;
730
730
  }();
731
- var ResizeObserver$1 = function () {
731
+ var ResizeObserver = function () {
732
732
  function ResizeObserver(callback) {
733
733
  if (arguments.length === 0) {
734
734
  throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
@@ -764,7 +764,7 @@ var ResizeObserver$1 = function () {
764
764
  };
765
765
  return ResizeObserver;
766
766
  }();
767
- const _ResizeObserver = typeof document !== "undefined" && typeof window !== "undefined" && window.ResizeObserver ? window.ResizeObserver : ResizeObserver$1;
767
+ const _ResizeObserver = typeof document !== "undefined" && typeof window !== "undefined" && window.ResizeObserver ? window.ResizeObserver : ResizeObserver;
768
768
  const _elementSizeObserver = _createElementSizeObserver();
769
769
  function _createElementRectValueListener() {
770
770
  return {
@@ -5763,7 +5763,6 @@ const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
5763
5763
  }, itemIndex))
5764
5764
  });
5765
5765
  });
5766
- const BORDER_OFFSET_X = 12;
5767
5766
  var __freeze$c = Object.freeze;
5768
5767
  var __defProp$c = Object.defineProperty;
5769
5768
  var __template$c = (cooked, raw) => __freeze$c(__defProp$c(cooked, "raw", {
@@ -5828,9 +5827,9 @@ const Root$7 = styled__default.default(Layer)(responsivePaddingStyle, dialogStyl
5828
5827
  const DialogContainer = styled__default.default(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"])));
5829
5828
  const DialogCardRoot = styled__default.default(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"])));
5830
5829
  const DialogLayout = styled__default.default(Flex)(_c$2 || (_c$2 = __template$b(["\n flex: 1;\n min-height: 0;\n width: 100%;\n"])));
5831
- const DialogHeader = styled__default.default(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);
5830
+ const DialogHeader = styled__default.default(Box)(_d$1 || (_d$1 = __template$b(["\n position: relative;\n z-index: 2;\n"])));
5832
5831
  const DialogContent = styled__default.default(Box)(_e || (_e = __template$b(["\n position: relative;\n z-index: 1;\n overflow: auto;\n outline: none;\n"])));
5833
- const DialogFooter = styled__default.default(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);
5832
+ const DialogFooter = styled__default.default(Box)(_f || (_f = __template$b(["\n position: relative;\n z-index: 3;\n"])));
5834
5833
  const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
5835
5834
  var _a2;
5836
5835
  const {
@@ -5865,9 +5864,6 @@ const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
5865
5864
  const labelId = "".concat(id, "_label");
5866
5865
  const showCloseButton = Boolean(onClose) && hideCloseButton === false;
5867
5866
  const showHeader = Boolean(header) || showCloseButton;
5868
- const [isContentScrollable, setIsContentScrollable] = react.useState(false);
5869
- const [hasScrolledFromTop, setHasScrolledFromTop] = react.useState(false);
5870
- const [hasScrolledToBottom, setHasScrolledToBottom] = react.useState(false);
5871
5867
  react.useEffect(() => {
5872
5868
  if (!autoFocus) return;
5873
5869
  if (forwardedRef.current) {
@@ -5902,22 +5898,6 @@ const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
5902
5898
  localContentRef.current = el;
5903
5899
  if (typeof contentRef === "function") contentRef(el);else if (contentRef) contentRef.current = el;
5904
5900
  }, [contentRef]);
5905
- const handleContentUpdate = react.useCallback(() => {
5906
- if (localContentRef.current) {
5907
- setIsContentScrollable(localContentRef.current.clientHeight < localContentRef.current.scrollHeight);
5908
- setHasScrolledFromTop(localContentRef.current.scrollTop > 0);
5909
- setHasScrolledToBottom(localContentRef.current.scrollTop >= localContentRef.current.scrollHeight - localContentRef.current.clientHeight);
5910
- }
5911
- }, []);
5912
- react.useEffect(() => {
5913
- const resizeObserver = new ResizeObserver(handleContentUpdate);
5914
- if (localContentRef.current) {
5915
- resizeObserver.observe(localContentRef.current);
5916
- }
5917
- return () => {
5918
- resizeObserver.disconnect();
5919
- };
5920
- }, [contentRef, handleContentUpdate]);
5921
5901
  return /* @__PURE__ */jsxRuntime.jsx(DialogContainer, {
5922
5902
  "data-ui": "DialogCard",
5923
5903
  width,
@@ -5929,8 +5909,6 @@ const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
5929
5909
  children: /* @__PURE__ */jsxRuntime.jsxs(DialogLayout, {
5930
5910
  direction: "column",
5931
5911
  children: [showHeader && /* @__PURE__ */jsxRuntime.jsx(DialogHeader, {
5932
- $isContentScrollable: isContentScrollable,
5933
- $hasScrolledFromTop: hasScrolledFromTop,
5934
5912
  children: /* @__PURE__ */jsxRuntime.jsxs(Flex, {
5935
5913
  align: "center",
5936
5914
  padding: 3,
@@ -5959,11 +5937,8 @@ const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
5959
5937
  flex: 1,
5960
5938
  ref: setContentRef,
5961
5939
  tabIndex: -1,
5962
- onScroll: handleContentUpdate,
5963
5940
  children
5964
5941
  }), footer && /* @__PURE__ */jsxRuntime.jsx(DialogFooter, {
5965
- $isContentScrollable: isContentScrollable,
5966
- $hasScrolledToBottom: hasScrolledToBottom,
5967
5942
  children: footer
5968
5943
  })]
5969
5944
  })