@sanity/ui 1.9.0 → 1.9.1

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
@@ -6860,6 +6860,7 @@ function useDelayedState(initialState) {
6860
6860
  }, []);
6861
6861
  return [state, onStateChange];
6862
6862
  }
6863
+ const DEFAULT_TOOLTIP_PADDING = 4;
6863
6864
  const DEFAULT_FALLBACK_PLACEMENTS = {
6864
6865
  top: ["bottom", "left", "right"],
6865
6866
  "top-start": ["bottom-start", "left-start", "right-start"],
@@ -6943,7 +6944,7 @@ var __template$e = (cooked, raw) => __freeze$e(__defProp$e(cooked, "raw", {
6943
6944
  value: __freeze$e(raw || cooked.slice())
6944
6945
  }));
6945
6946
  var _a$e;
6946
- const Root$a = styled__default.default(Layer)(_a$e || (_a$e = __template$e(["\n pointer-events: none;\n"])));
6947
+ const Root$a = styled__default.default(Layer)(_a$e || (_a$e = __template$e(["\n pointer-events: none;\n // Note that 100vw doesn't exclude system scrollbars.\n // This should be sufficiently small enough to not trigger overflow-x scrollbars when portalled.\n max-width: calc(100vw - ", "px);\n"])), DEFAULT_TOOLTIP_PADDING * 10);
6947
6948
  const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
6948
6949
  var _a2, _b, _c, _d, _e;
6949
6950
  const boundaryElementContext = useBoundaryElement();
@@ -6971,42 +6972,25 @@ const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
6971
6972
  const middleware = react.useMemo(() => {
6972
6973
  const ret = [];
6973
6974
  ret.push(reactDom$1.flip({
6974
- boundary: boundaryElement || void 0,
6975
+ boundary: portal ? void 0 : boundaryElement || void 0,
6975
6976
  fallbackPlacements,
6976
- padding: 4,
6977
- rootBoundary,
6978
- mainAxis: false
6977
+ padding: DEFAULT_TOOLTIP_PADDING,
6978
+ rootBoundary
6979
6979
  }));
6980
6980
  ret.push(reactDom$1.offset({
6981
6981
  mainAxis: 3
6982
6982
  }));
6983
- ret.push(reactDom$1.size({
6984
- apply(_ref22) {
6985
- let {
6986
- availableWidth,
6987
- availableHeight,
6988
- elements
6989
- } = _ref22;
6990
- Object.assign(elements.floating.style, {
6991
- maxWidth: "".concat(availableWidth - 4 * 2, "px"),
6992
- // the padding is `4px`
6993
- maxHeight: "".concat(availableHeight - 4 * 2, "px")
6994
- // the padding is `4px`
6995
- });
6996
- }
6997
- }));
6998
-
6999
6983
  ret.push(reactDom$1.shift({
7000
- boundary: boundaryElement || void 0,
6984
+ boundary: portal ? void 0 : boundaryElement || void 0,
7001
6985
  rootBoundary,
7002
- padding: 4
6986
+ padding: DEFAULT_TOOLTIP_PADDING
7003
6987
  }));
7004
6988
  ret.push(reactDom$1.arrow({
7005
6989
  element: arrowRef,
7006
6990
  padding: 2
7007
6991
  }));
7008
6992
  return ret;
7009
- }, [boundaryElement, fallbackPlacements]);
6993
+ }, [boundaryElement, fallbackPlacements, portal]);
7010
6994
  const {
7011
6995
  floatingStyles,
7012
6996
  placement,
@@ -7306,10 +7290,10 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7306
7290
  query,
7307
7291
  value
7308
7292
  } = state;
7309
- const defaultRenderOption = react.useCallback(_ref23 => {
7293
+ const defaultRenderOption = react.useCallback(_ref22 => {
7310
7294
  let {
7311
7295
  value: value2
7312
- } = _ref23;
7296
+ } = _ref22;
7313
7297
  return /* @__PURE__ */jsxRuntime.jsx(Card, {
7314
7298
  "data-as": "button",
7315
7299
  padding: paddingProp,
@@ -7762,10 +7746,10 @@ const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
7762
7746
  }, itemIndex))
7763
7747
  });
7764
7748
  });
7765
- function dialogStyle(_ref24) {
7749
+ function dialogStyle(_ref23) {
7766
7750
  let {
7767
7751
  theme
7768
- } = _ref24;
7752
+ } = _ref23;
7769
7753
  const color = theme.sanity.color.base;
7770
7754
  return {
7771
7755
  "&:not([hidden])": {
@@ -8827,15 +8811,15 @@ var __template$6 = (cooked, raw) => __freeze$6(__defProp$6(cooked, "raw", {
8827
8811
  var _a$6, _b$3, _c$1, _d;
8828
8812
  const keyframe = styled.keyframes(_a$6 || (_a$6 = __template$6(["\n 0% {\n background-position: 100%;\n }\n 100% {\n background-position: -100%;\n }\n"])));
8829
8813
  const animation = styled.css(_b$3 || (_b$3 = __template$6(["\n background-image: linear-gradient(\n to right,\n var(--card-skeleton-color-from),\n var(--card-skeleton-color-to),\n var(--card-skeleton-color-from),\n var(--card-skeleton-color-from),\n var(--card-skeleton-color-from)\n );\n background-position: 100%;\n background-size: 200% 100%;\n background-attachment: fixed;\n animation-name: ", ";\n animation-timing-function: ease-in-out;\n animation-iteration-count: infinite;\n animation-duration: 2000ms;\n"])), keyframe);
8830
- const skeletonStyle = styled.css(_d || (_d = __template$6(["\n opacity: ", ";\n transition: opacity 200ms ease-in;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n ", "\n }\n\n @media screen and (prefers-reduced-motion: reduce) {\n background-color: var(--card-skeleton-color-from);\n }\n"])), _ref25 => {
8814
+ const skeletonStyle = styled.css(_d || (_d = __template$6(["\n opacity: ", ";\n transition: opacity 200ms ease-in;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n ", "\n }\n\n @media screen and (prefers-reduced-motion: reduce) {\n background-color: var(--card-skeleton-color-from);\n }\n"])), _ref24 => {
8831
8815
  let {
8832
8816
  $visible
8833
- } = _ref25;
8817
+ } = _ref24;
8834
8818
  return $visible ? 1 : 0;
8835
- }, _ref26 => {
8819
+ }, _ref25 => {
8836
8820
  let {
8837
8821
  $animated
8838
- } = _ref26;
8822
+ } = _ref25;
8839
8823
  return $animated ? animation : styled.css(_c$1 || (_c$1 = __template$6(["\n background-color: var(--card-skeleton-color-from);\n "])));
8840
8824
  });
8841
8825
  const Root$4 = styled__default.default(Box)(responsiveRadiusStyle, skeletonStyle);
@@ -8866,12 +8850,12 @@ const Skeleton = react.forwardRef(function Skeleton2(props, ref) {
8866
8850
  ref
8867
8851
  });
8868
8852
  });
8869
- const Root$3 = styled__default.default(Skeleton)(_ref27 => {
8853
+ const Root$3 = styled__default.default(Skeleton)(_ref26 => {
8870
8854
  let {
8871
8855
  $size,
8872
8856
  $style,
8873
8857
  theme
8874
- } = _ref27;
8858
+ } = _ref26;
8875
8859
  const {
8876
8860
  media
8877
8861
  } = theme.sanity;
@@ -9218,12 +9202,12 @@ function ToastProvider(props) {
9218
9202
  paddingY,
9219
9203
  children: /* @__PURE__ */jsxRuntime.jsx(framerMotion.AnimatePresence, {
9220
9204
  initial: false,
9221
- children: state.map(_ref28 => {
9205
+ children: state.map(_ref27 => {
9222
9206
  let {
9223
9207
  dismiss,
9224
9208
  id,
9225
9209
  params
9226
- } = _ref28;
9210
+ } = _ref27;
9227
9211
  return /* @__PURE__ */jsxRuntime.jsx(framerMotion.motion.div, {
9228
9212
  animate: {
9229
9213
  opacity: 1,