@sanity/ui 2.8.3 → 2.8.4

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
@@ -5127,8 +5127,8 @@ const Root$7 = styledComponents.styled(Layer)(responsivePaddingStyle, dialogStyl
5127
5127
  scheme,
5128
5128
  shadow: shadowProp,
5129
5129
  width: widthProp
5130
- } = props, portal = usePortal(), portalElement = portalProp ? ((_a = portal.elements) == null ? void 0 : _a[portalProp]) || null : portal.element, boundaryElement = useBoundaryElement().element, radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), width = useArrayProp(widthProp), ref = react.useRef(null), [rootElement, setRootElement] = react.useState(null), contentRef = react.useRef(null), layer = useLayer(), { isTopLayer } = layer, labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton;
5131
- react.useImperativeHandle(forwardedRef, () => ref.current), react.useImperativeHandle(
5130
+ } = props, portal = usePortal(), portalElement = portalProp ? ((_a = portal.elements) == null ? void 0 : _a[portalProp]) || null : portal.element, boundaryElement = useBoundaryElement().element, radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), width = useArrayProp(widthProp), ref = react.useRef(null), contentRef = react.useRef(null), layer = useLayer(), { isTopLayer } = layer, labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton;
5131
+ return react.useImperativeHandle(forwardedRef, () => ref.current), react.useImperativeHandle(
5132
5132
  forwardedContentRef,
5133
5133
  () => contentRef.current
5134
5134
  ), react.useEffect(() => {
@@ -5142,21 +5142,13 @@ const Root$7 = styledComponents.styled(Layer)(responsivePaddingStyle, dialogStyl
5142
5142
  },
5143
5143
  [boundaryElement, isTopLayer, onClose, portalElement]
5144
5144
  )
5145
- ), useClickOutside(
5146
- react.useCallback(
5147
- (event) => {
5148
- if (!isTopLayer || !onClickOutside) return;
5149
- const target = event.target;
5150
- target && !isTargetWithinScope(boundaryElement, portalElement, target) || onClickOutside();
5151
- },
5152
- [boundaryElement, isTopLayer, onClickOutside, portalElement]
5153
- ),
5154
- [rootElement]
5155
- );
5156
- const setRef = react.useCallback((el) => {
5157
- setRootElement(el), ref.current = el;
5158
- }, []);
5159
- return /* @__PURE__ */ jsxRuntime.jsx(DialogContainer, { "data-ui": "DialogCard", width, children: /* @__PURE__ */ jsxRuntime.jsx(DialogCardRoot, { radius, ref: setRef, scheme, shadow, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogLayout, { direction: "column", children: [
5145
+ ), useClickOutsideEvent(
5146
+ isTopLayer && onClickOutside && ((event) => {
5147
+ const target = event.target;
5148
+ target && !isTargetWithinScope(boundaryElement, portalElement, target) || onClickOutside();
5149
+ }),
5150
+ () => [ref.current]
5151
+ ), /* @__PURE__ */ jsxRuntime.jsx(DialogContainer, { "data-ui": "DialogCard", width, children: /* @__PURE__ */ jsxRuntime.jsx(DialogCardRoot, { radius, ref, scheme, shadow, children: /* @__PURE__ */ jsxRuntime.jsxs(DialogLayout, { direction: "column", children: [
5160
5152
  showHeader && /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", padding: 3, children: [
5161
5153
  /* @__PURE__ */ jsxRuntime.jsx(Box, { flex: 1, padding: 2, children: header && /* @__PURE__ */ jsxRuntime.jsx(Text, { id: labelId, size: 1, weight: "semibold", children: header }) }),
5162
5154
  showCloseButton && /* @__PURE__ */ jsxRuntime.jsx(Box, { flex: "none", children: /* @__PURE__ */ jsxRuntime.jsx(