@sanity/ui 2.0.0-alpha.25 → 2.0.0-alpha.26

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.esm.js CHANGED
@@ -4677,13 +4677,13 @@ function responsiveInputPaddingIconRightStyle(props) {
4677
4677
  $iconRight: true
4678
4678
  });
4679
4679
  }
4680
- var __freeze$D = Object.freeze;
4681
- var __defProp$E = Object.defineProperty;
4682
- var __template$D = (cooked, raw) => __freeze$D(__defProp$E(cooked, "raw", {
4683
- value: __freeze$D(raw || cooked.slice())
4680
+ var __freeze$E = Object.freeze;
4681
+ var __defProp$F = Object.defineProperty;
4682
+ var __template$E = (cooked, raw) => __freeze$E(__defProp$F(cooked, "raw", {
4683
+ value: __freeze$E(raw || cooked.slice())
4684
4684
  }));
4685
- var _a$D, _b$n, _c$d;
4686
- const ROOT_STYLE = css(_a$D || (_a$D = __template$D(["\n &:not([hidden]) {\n display: flex;\n }\n\n align-items: center;\n"])));
4685
+ var _a$E, _b$o, _c$d;
4686
+ const ROOT_STYLE = css(_a$E || (_a$E = __template$E(["\n &:not([hidden]) {\n display: flex;\n }\n\n align-items: center;\n"])));
4687
4687
  function textInputRootStyle() {
4688
4688
  return ROOT_STYLE;
4689
4689
  }
@@ -4696,7 +4696,7 @@ function textInputBaseStyle(props) {
4696
4696
  } = props;
4697
4697
  const font = theme.sanity.fonts.text;
4698
4698
  const color = theme.sanity.color.input;
4699
- return css(_b$n || (_b$n = __template$D(["\n appearance: none;\n background: none;\n border: 0;\n border-radius: 0;\n outline: none;\n width: 100%;\n box-sizing: border-box;\n font-family: ", ";\n font-weight: ", ";\n margin: 0;\n position: relative;\n z-index: 1;\n display: block;\n\n /* NOTE: This is a hack to disable Chrome\u2019s autofill styles */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-text-fill-color: var(--input-fg-color) !important;\n transition: background-color 5000s;\n transition-delay: 86400s /* 24h */;\n }\n\n /* &:is(textarea) */\n &[data-as='textarea'] {\n resize: none;\n }\n\n color: var(--input-fg-color);\n\n &::placeholder {\n color: var(--input-placeholder-color);\n }\n\n &[data-scheme='", "'][data-tone='", "'] {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n\n /* enabled */\n &:not(:invalid):not(:disabled):not(:read-only) {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* disabled */\n &:not(:invalid):disabled {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* invalid */\n &:invalid {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* readOnly */\n &:read-only {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n }\n "])), font.family, $weight && font.weights[$weight] || font.weights.regular, $scheme, $tone, color.default.enabled.fg, color.default.enabled.placeholder, color.default.enabled.fg, color.default.enabled.placeholder, color.default.disabled.fg, color.default.disabled.placeholder, color.invalid.enabled.fg, color.invalid.enabled.placeholder, color.default.readOnly.fg, color.default.readOnly.placeholder);
4699
+ return css(_b$o || (_b$o = __template$E(["\n appearance: none;\n background: none;\n border: 0;\n border-radius: 0;\n outline: none;\n width: 100%;\n box-sizing: border-box;\n font-family: ", ";\n font-weight: ", ";\n margin: 0;\n position: relative;\n z-index: 1;\n display: block;\n\n /* NOTE: This is a hack to disable Chrome\u2019s autofill styles */\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active {\n -webkit-text-fill-color: var(--input-fg-color) !important;\n transition: background-color 5000s;\n transition-delay: 86400s /* 24h */;\n }\n\n /* &:is(textarea) */\n &[data-as='textarea'] {\n resize: none;\n }\n\n color: var(--input-fg-color);\n\n &::placeholder {\n color: var(--input-placeholder-color);\n }\n\n &[data-scheme='", "'][data-tone='", "'] {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n\n /* enabled */\n &:not(:invalid):not(:disabled):not(:read-only) {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* disabled */\n &:not(:invalid):disabled {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* invalid */\n &:invalid {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n\n /* readOnly */\n &:read-only {\n --input-fg-color: ", ";\n --input-placeholder-color: ", ";\n }\n }\n "])), font.family, $weight && font.weights[$weight] || font.weights.regular, $scheme, $tone, color.default.enabled.fg, color.default.enabled.placeholder, color.default.enabled.fg, color.default.enabled.placeholder, color.default.disabled.fg, color.default.disabled.placeholder, color.invalid.enabled.fg, color.invalid.enabled.placeholder, color.default.readOnly.fg, color.default.readOnly.placeholder);
4700
4700
  }
4701
4701
  function textInputFontSizeStyle(props) {
4702
4702
  const {
@@ -4730,7 +4730,7 @@ function textInputRepresentationStyle(props) {
4730
4730
  focusRing
4731
4731
  } = input.text;
4732
4732
  const color = theme.sanity.color.input;
4733
- return css(_c$d || (_c$d = __template$D(["\n --input-box-shadow: none;\n\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: block;\n pointer-events: none;\n z-index: 0;\n\n background-color: var(--card-bg-color);\n box-shadow: var(--input-box-shadow);\n\n border-top-left-radius: ", ";\n border-bottom-left-radius: ", ";\n border-top-right-radius: ", ";\n border-bottom-right-radius: ", ";\n\n &[data-scheme='", "'][data-tone='", "'] {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n\n /* enabled */\n *:not(:disabled) + &[data-border] {\n --input-box-shadow: ", ";\n }\n\n /* invalid */\n *:not(:disabled):invalid + & {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n\n &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n\n /* focused */\n *:not(:disabled):focus + & {\n &[data-border] {\n --input-box-shadow: ", ";\n }\n\n &:not([data-border]) {\n --input-box-shadow: ", ";\n }\n }\n\n /* disabled */\n *:disabled + & {\n --card-bg-color: ", " !important;\n --card-fg-color: ", " !important;\n\n &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n\n /* readOnly */\n *:read-only + & {\n --card-bg-color: ", " !important;\n --card-fg-color: ", " !important;\n }\n\n /* hovered */\n @media (hover: hover) {\n *:not(:disabled):not(:read-only):not(:invalid):hover + & {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n }\n\n *:not(:disabled):not(:read-only):not(:invalid):not(:focus):hover + &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n }\n "])), $hasPrefix ? 0 : void 0, $hasPrefix ? 0 : void 0, $hasSuffix ? 0 : void 0, $hasSuffix ? 0 : void 0, $scheme, $tone, color.default.enabled.bg, color.default.enabled.fg, focusRingBorderStyle({
4733
+ return css(_c$d || (_c$d = __template$E(["\n --input-box-shadow: none;\n\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: block;\n pointer-events: none;\n z-index: 0;\n\n background-color: var(--card-bg-color);\n box-shadow: var(--input-box-shadow);\n\n border-top-left-radius: ", ";\n border-bottom-left-radius: ", ";\n border-top-right-radius: ", ";\n border-bottom-right-radius: ", ";\n\n &[data-scheme='", "'][data-tone='", "'] {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n\n /* enabled */\n *:not(:disabled) + &[data-border] {\n --input-box-shadow: ", ";\n }\n\n /* invalid */\n *:not(:disabled):invalid + & {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n\n &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n\n /* focused */\n *:not(:disabled):focus + & {\n &[data-border] {\n --input-box-shadow: ", ";\n }\n\n &:not([data-border]) {\n --input-box-shadow: ", ";\n }\n }\n\n /* disabled */\n *:disabled + & {\n --card-bg-color: ", " !important;\n --card-fg-color: ", " !important;\n\n &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n\n /* readOnly */\n *:read-only + & {\n --card-bg-color: ", " !important;\n --card-fg-color: ", " !important;\n }\n\n /* hovered */\n @media (hover: hover) {\n *:not(:disabled):not(:read-only):not(:invalid):hover + & {\n --card-bg-color: ", ";\n --card-fg-color: ", ";\n }\n\n *:not(:disabled):not(:read-only):not(:invalid):not(:focus):hover + &[data-border] {\n --input-box-shadow: ", ";\n }\n }\n }\n "])), $hasPrefix ? 0 : void 0, $hasPrefix ? 0 : void 0, $hasSuffix ? 0 : void 0, $hasSuffix ? 0 : void 0, $scheme, $tone, color.default.enabled.bg, color.default.enabled.fg, focusRingBorderStyle({
4734
4734
  color: color.default.enabled.border,
4735
4735
  width: input.border.width
4736
4736
  }), color.invalid.enabled.bg, color.invalid.enabled.fg, focusRingBorderStyle({
@@ -4808,12 +4808,12 @@ function responsiveShadowStyle(props) {
4808
4808
  } = theme.sanity;
4809
4809
  return _responsive(media, props.$shadow, shadow => shadowStyle(shadows[shadow]));
4810
4810
  }
4811
- var __freeze$C = Object.freeze;
4812
- var __defProp$D = Object.defineProperty;
4813
- var __template$C = (cooked, raw) => __freeze$C(__defProp$D(cooked, "raw", {
4814
- value: __freeze$C(raw || cooked.slice())
4811
+ var __freeze$D = Object.freeze;
4812
+ var __defProp$E = Object.defineProperty;
4813
+ var __template$D = (cooked, raw) => __freeze$D(__defProp$E(cooked, "raw", {
4814
+ value: __freeze$D(raw || cooked.slice())
4815
4815
  }));
4816
- var _a$C, _b$m, _c$c;
4816
+ var _a$D, _b$n, _c$c;
4817
4817
  function textBaseStyle(props) {
4818
4818
  const {
4819
4819
  $accent,
@@ -4823,16 +4823,16 @@ function textBaseStyle(props) {
4823
4823
  const {
4824
4824
  weights
4825
4825
  } = theme.sanity.fonts.text;
4826
- return css(_c$c || (_c$c = __template$C(["\n color: var(--card-fg-color);\n\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n background-color: var(--card-code-bg-color);\n color: var(--card-code-fg-color);\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n color: var(--card-link-color);\n outline: none;\n\n @media (hover: hover) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus {\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n 0 0 0 3px var(--card-focus-ring-color);\n }\n\n &:focus:not(:focus-visible) {\n box-shadow: none;\n }\n }\n\n & strong {\n font-weight: ", ";\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n color: var(--card-icon-color);\n }\n "])), $accent && css(_a$C || (_a$C = __template$C(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$m || (_b$m = __template$C(["\n color: var(--card-muted-fg-color);\n "]))), theme.sanity.fonts.code.family, weights.bold);
4826
+ return css(_c$c || (_c$c = __template$D(["\n color: var(--card-fg-color);\n\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n background-color: var(--card-code-bg-color);\n color: var(--card-code-fg-color);\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n color: var(--card-link-color);\n outline: none;\n\n @media (hover: hover) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus {\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n 0 0 0 3px var(--card-focus-ring-color);\n }\n\n &:focus:not(:focus-visible) {\n box-shadow: none;\n }\n }\n\n & strong {\n font-weight: ", ";\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n color: var(--card-icon-color);\n }\n "])), $accent && css(_a$D || (_a$D = __template$D(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$n || (_b$n = __template$D(["\n color: var(--card-muted-fg-color);\n "]))), theme.sanity.fonts.code.family, weights.bold);
4827
4827
  }
4828
- var __freeze$B = Object.freeze;
4829
- var __defProp$C = Object.defineProperty;
4830
- var __template$B = (cooked, raw) => __freeze$B(__defProp$C(cooked, "raw", {
4831
- value: __freeze$B(raw || cooked.slice())
4828
+ var __freeze$C = Object.freeze;
4829
+ var __defProp$D = Object.defineProperty;
4830
+ var __template$C = (cooked, raw) => __freeze$C(__defProp$D(cooked, "raw", {
4831
+ value: __freeze$C(raw || cooked.slice())
4832
4832
  }));
4833
- var _a$B;
4833
+ var _a$C;
4834
4834
  const Root$E = styled.div(responsiveTextFont, responsiveTextAlignStyle, textBaseStyle);
4835
- const SpanWithTextOverflow$2 = styled.span(_a$B || (_a$B = __template$B(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
4835
+ const SpanWithTextOverflow$2 = styled.span(_a$C || (_a$C = __template$C(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
4836
4836
  const Text = forwardRef(function Text2(props, ref) {
4837
4837
  const {
4838
4838
  accent = false,
@@ -5135,12 +5135,12 @@ const Avatar = forwardRef(function Avatar2(props, ref) {
5135
5135
  })]
5136
5136
  });
5137
5137
  });
5138
- var __freeze$A = Object.freeze;
5139
- var __defProp$B = Object.defineProperty;
5140
- var __template$A = (cooked, raw) => __freeze$A(__defProp$B(cooked, "raw", {
5141
- value: __freeze$A(raw || cooked.slice())
5138
+ var __freeze$B = Object.freeze;
5139
+ var __defProp$C = Object.defineProperty;
5140
+ var __template$B = (cooked, raw) => __freeze$B(__defProp$C(cooked, "raw", {
5141
+ value: __freeze$B(raw || cooked.slice())
5142
5142
  }));
5143
- var _a$A;
5143
+ var _a$B;
5144
5144
  function _responsiveAvatarCounterSizeStyle(props) {
5145
5145
  const {
5146
5146
  theme
@@ -5163,7 +5163,7 @@ function _avatarCounterBaseStyle(props) {
5163
5163
  const {
5164
5164
  theme
5165
5165
  } = props;
5166
- return css(_a$A || (_a$A = __template$A(["\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n user-select: none;\n color: inherit;\n color: var(--card-fg-color);\n background: var(--card-bg-color);\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n inset 0 0 0 1px var(--card-hairline-hard-color);\n padding: 0 ", ";\n\n &:not([hidden]) {\n display: flex;\n }\n "])), rem(theme.sanity.space[2]));
5166
+ return css(_a$B || (_a$B = __template$B(["\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n user-select: none;\n color: inherit;\n color: var(--card-fg-color);\n background: var(--card-bg-color);\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n inset 0 0 0 1px var(--card-hairline-hard-color);\n padding: 0 ", ";\n\n &:not([hidden]) {\n display: flex;\n }\n "])), rem(theme.sanity.space[2]));
5167
5167
  }
5168
5168
  const Root$C = styled.div(_responsiveAvatarCounterSizeStyle, _avatarCounterBaseStyle);
5169
5169
  const AvatarCounter = forwardRef(function AvatarCounter2(props, ref) {
@@ -5189,13 +5189,13 @@ function childrenToElementArray(children) {
5189
5189
  const childrenArray = Array.isArray(children) ? children : [children];
5190
5190
  return childrenArray.filter(node => isElement$1(node) || isFragment(node) || typeof node === "string");
5191
5191
  }
5192
- var __freeze$z = Object.freeze;
5193
- var __defProp$A = Object.defineProperty;
5194
- var __template$z = (cooked, raw) => __freeze$z(__defProp$A(cooked, "raw", {
5195
- value: __freeze$z(raw || cooked.slice())
5192
+ var __freeze$A = Object.freeze;
5193
+ var __defProp$B = Object.defineProperty;
5194
+ var __template$A = (cooked, raw) => __freeze$A(__defProp$B(cooked, "raw", {
5195
+ value: __freeze$A(raw || cooked.slice())
5196
5196
  }));
5197
- var _a$z;
5198
- const BASE_STYLES = css(_a$z || (_a$z = __template$z(["\n white-space: nowrap;\n\n & > div {\n vertical-align: top;\n\n &:not([hidden]) {\n display: inline-block;\n }\n }\n"])));
5197
+ var _a$A;
5198
+ const BASE_STYLES = css(_a$A || (_a$A = __template$A(["\n white-space: nowrap;\n\n & > div {\n vertical-align: top;\n\n &:not([hidden]) {\n display: inline-block;\n }\n }\n"])));
5199
5199
  function avatarStackStyle() {
5200
5200
  return BASE_STYLES;
5201
5201
  }
@@ -5390,14 +5390,14 @@ const Flex = forwardRef(function Flex2(props, ref) {
5390
5390
  })
5391
5391
  );
5392
5392
  });
5393
- var __freeze$y = Object.freeze;
5394
- var __defProp$z = Object.defineProperty;
5395
- var __template$y = (cooked, raw) => __freeze$y(__defProp$z(cooked, "raw", {
5396
- value: __freeze$y(raw || cooked.slice())
5393
+ var __freeze$z = Object.freeze;
5394
+ var __defProp$A = Object.defineProperty;
5395
+ var __template$z = (cooked, raw) => __freeze$z(__defProp$A(cooked, "raw", {
5396
+ value: __freeze$z(raw || cooked.slice())
5397
5397
  }));
5398
- var _a$y, _b$l;
5399
- const rotate$1 = keyframes(_a$y || (_a$y = __template$y(["\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n"])));
5400
- const Root$x = styled(Text)(_b$l || (_b$l = __template$y(["\n & > span > svg {\n animation: ", " 500ms linear infinite;\n }\n"])), rotate$1);
5398
+ var _a$z, _b$m;
5399
+ const rotate$1 = keyframes(_a$z || (_a$z = __template$z(["\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n"])));
5400
+ const Root$x = styled(Text)(_b$m || (_b$m = __template$z(["\n & > span > svg {\n animation: ", " 500ms linear infinite;\n }\n"])), rotate$1);
5401
5401
  const Spinner = forwardRef(function Spinner2(props, ref) {
5402
5402
  return /* @__PURE__ */jsx(Root$x, {
5403
5403
  "data-ui": "Spinner",
@@ -5437,17 +5437,17 @@ function _colorVarsStyle(base, color) {
5437
5437
  "--card-hairline-hard-color": color.border
5438
5438
  };
5439
5439
  }
5440
- var __freeze$x = Object.freeze;
5441
- var __defProp$y = Object.defineProperty;
5442
- var __template$x = (cooked, raw) => __freeze$x(__defProp$y(cooked, "raw", {
5443
- value: __freeze$x(raw || cooked.slice())
5440
+ var __freeze$y = Object.freeze;
5441
+ var __defProp$z = Object.defineProperty;
5442
+ var __template$y = (cooked, raw) => __freeze$y(__defProp$z(cooked, "raw", {
5443
+ value: __freeze$y(raw || cooked.slice())
5444
5444
  }));
5445
- var _a$x, _b$k;
5445
+ var _a$y, _b$l;
5446
5446
  function buttonBaseStyles(_ref24) {
5447
5447
  let {
5448
5448
  $width
5449
5449
  } = _ref24;
5450
- return css(_b$k || (_b$k = __template$x(["\n -webkit-font-smoothing: inherit;\n appearance: none;\n display: inline-flex;\n align-items: center;\n font: inherit;\n border: 0;\n outline: none;\n user-select: none;\n text-decoration: none;\n border: 0;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n white-space: nowrap;\n text-align: left;\n position: relative;\n\n ", "\n\n & > span {\n display: block;\n flex: 1;\n min-width: 0;\n border-radius: inherit;\n }\n\n &::-moz-focus-inner {\n border: 0;\n padding: 0;\n }\n "])), $width === "fill" && css(_a$x || (_a$x = __template$x(["\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n "]))));
5450
+ return css(_b$l || (_b$l = __template$y(["\n -webkit-font-smoothing: inherit;\n appearance: none;\n display: inline-flex;\n align-items: center;\n font: inherit;\n border: 0;\n outline: none;\n user-select: none;\n text-decoration: none;\n border: 0;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n white-space: nowrap;\n text-align: left;\n position: relative;\n\n ", "\n\n & > span {\n display: block;\n flex: 1;\n min-width: 0;\n border-radius: inherit;\n }\n\n &::-moz-focus-inner {\n border: 0;\n padding: 0;\n }\n "])), $width === "fill" && css(_a$y || (_a$y = __template$y(["\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n "]))));
5451
5451
  }
5452
5452
  const buttonTheme = {
5453
5453
  border: {
@@ -5507,14 +5507,14 @@ function buttonColorStyles(props) {
5507
5507
  }
5508
5508
  }, (_b2 = (_a2 = theme.sanity.styles) == null ? void 0 : _a2.button) == null ? void 0 : _b2.root].filter(Boolean);
5509
5509
  }
5510
- var __freeze$w = Object.freeze;
5511
- var __defProp$x = Object.defineProperty;
5512
- var __template$w = (cooked, raw) => __freeze$w(__defProp$x(cooked, "raw", {
5513
- value: __freeze$w(raw || cooked.slice())
5510
+ var __freeze$x = Object.freeze;
5511
+ var __defProp$y = Object.defineProperty;
5512
+ var __template$x = (cooked, raw) => __freeze$x(__defProp$y(cooked, "raw", {
5513
+ value: __freeze$x(raw || cooked.slice())
5514
5514
  }));
5515
- var _a$w;
5515
+ var _a$x;
5516
5516
  const Root$w = styled.button(responsiveRadiusStyle, buttonBaseStyles, buttonColorStyles);
5517
- const LoadingBox = styled.div(_a$w || (_a$w = __template$w(["\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--card-bg-color);\n border-radius: inherit;\n z-index: 1;\n box-shadow: inherit;\n"])));
5517
+ const LoadingBox = styled.div(_a$x || (_a$x = __template$x(["\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--card-bg-color);\n border-radius: inherit;\n z-index: 1;\n box-shadow: inherit;\n"])));
5518
5518
  const Button = forwardRef(function Button2(props, ref) {
5519
5519
  const {
5520
5520
  children,
@@ -5610,12 +5610,12 @@ const Button = forwardRef(function Button2(props, ref) {
5610
5610
  })]
5611
5611
  });
5612
5612
  });
5613
- var __freeze$v = Object.freeze;
5614
- var __defProp$w = Object.defineProperty;
5615
- var __template$v = (cooked, raw) => __freeze$v(__defProp$w(cooked, "raw", {
5616
- value: __freeze$v(raw || cooked.slice())
5613
+ var __freeze$w = Object.freeze;
5614
+ var __defProp$x = Object.defineProperty;
5615
+ var __template$w = (cooked, raw) => __freeze$w(__defProp$x(cooked, "raw", {
5616
+ value: __freeze$w(raw || cooked.slice())
5617
5617
  }));
5618
- var _a$v, _b$j, _c$b;
5618
+ var _a$w, _b$k, _c$b;
5619
5619
  function cardStyle(props) {
5620
5620
  return [cardBaseStyle(props), cardColorStyle(props)];
5621
5621
  }
@@ -5625,7 +5625,7 @@ function cardBaseStyle(props) {
5625
5625
  theme
5626
5626
  } = props;
5627
5627
  const space = theme.sanity.space;
5628
- return css(_b$j || (_b$j = __template$v(["\n ", "\n\n &[data-as='button'] {\n -webkit-font-smoothing: inherit;\n appearance: none;\n outline: none;\n font: inherit;\n text-align: inherit;\n border: 0;\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n }\n\n /* &:is(a) */\n &[data-as='a'] {\n outline: none;\n text-decoration: none;\n }\n\n /* &:is(pre) */\n &[data-as='pre'] {\n font: inherit;\n }\n "])), $checkered && css(_a$v || (_a$v = __template$v(["\n background-size: ", "px ", "px;\n background-position: 50% 50%;\n background-image: var(--card-bg-image);\n "])), space[3], space[3]));
5628
+ return css(_b$k || (_b$k = __template$w(["\n ", "\n\n &[data-as='button'] {\n -webkit-font-smoothing: inherit;\n appearance: none;\n outline: none;\n font: inherit;\n text-align: inherit;\n border: 0;\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n }\n\n /* &:is(a) */\n &[data-as='a'] {\n outline: none;\n text-decoration: none;\n }\n\n /* &:is(pre) */\n &[data-as='pre'] {\n font: inherit;\n }\n "])), $checkered && css(_a$w || (_a$w = __template$w(["\n background-size: ", "px ", "px;\n background-position: 50% 50%;\n background-image: var(--card-bg-image);\n "])), space[3], space[3]));
5629
5629
  }
5630
5630
  function cardColorStyle(props) {
5631
5631
  var _a2, _b2;
@@ -5646,7 +5646,7 @@ function cardColorStyle(props) {
5646
5646
  width: 0,
5647
5647
  color: "var(--card-border-color)"
5648
5648
  };
5649
- return css(_c$b || (_c$b = __template$v(["\n color-scheme: ", ";\n\n ", "\n\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n\n /* &:is(button) */\n &[data-as='button'] {\n --card-focus-ring-box-shadow: none;\n\n cursor: default;\n box-shadow: var(--card-focus-ring-box-shadow);\n\n &:disabled {\n ", "\n }\n\n &:not(:disabled) {\n &[data-pressed] {\n ", "\n }\n\n &[data-selected] {\n ", "\n }\n\n @media (hover: hover) {\n &:not([data-pressed]):not([data-selected]) {\n &[data-hovered],\n &:hover {\n ", "\n }\n\n &:active {\n ", "\n }\n }\n }\n\n &:focus {\n --card-focus-ring-box-shadow: ", ";\n }\n\n &:focus:not(:focus-visible) {\n --card-focus-ring-box-shadow: ", ";\n }\n }\n }\n\n /* &:is(a) */\n &[data-as='a'] {\n cursor: pointer;\n box-shadow: var(--card-focus-ring-box-shadow);\n\n &[data-disabled] {\n ", "\n }\n\n &:not([data-disabled]) {\n &[data-pressed] {\n ", "\n }\n\n &[data-selected] {\n ", "\n }\n\n @media (hover: hover) {\n &:not([data-pressed]):not([data-selected]) {\n &[data-hovered],\n &:hover {\n ", "\n }\n\n &:active {\n ", "\n }\n }\n }\n\n &:focus {\n --card-focus-ring-box-shadow: ", ";\n }\n\n &:focus:not(:focus-visible) {\n --card-focus-ring-box-shadow: ", ";\n }\n }\n }\n\n ", "\n "])), dark ? "dark" : "light", _colorVarsStyle(base, card.enabled, $checkered), _colorVarsStyle(base, card.disabled, $checkered), _colorVarsStyle(base, card.pressed, $checkered), _colorVarsStyle(base, card.selected, $checkered), _colorVarsStyle(base, card.hovered, $checkered), _colorVarsStyle(base, card.pressed, $checkered), $focusRing ? focusRingStyle({
5649
+ return css(_c$b || (_c$b = __template$w(["\n color-scheme: ", ";\n\n ", "\n\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n\n /* &:is(button) */\n &[data-as='button'] {\n --card-focus-ring-box-shadow: none;\n\n cursor: default;\n box-shadow: var(--card-focus-ring-box-shadow);\n\n &:disabled {\n ", "\n }\n\n &:not(:disabled) {\n &[data-pressed] {\n ", "\n }\n\n &[data-selected] {\n ", "\n }\n\n @media (hover: hover) {\n &:not([data-pressed]):not([data-selected]) {\n &[data-hovered],\n &:hover {\n ", "\n }\n\n &:active {\n ", "\n }\n }\n }\n\n &:focus {\n --card-focus-ring-box-shadow: ", ";\n }\n\n &:focus:not(:focus-visible) {\n --card-focus-ring-box-shadow: ", ";\n }\n }\n }\n\n /* &:is(a) */\n &[data-as='a'] {\n cursor: pointer;\n box-shadow: var(--card-focus-ring-box-shadow);\n\n &[data-disabled] {\n ", "\n }\n\n &:not([data-disabled]) {\n &[data-pressed] {\n ", "\n }\n\n &[data-selected] {\n ", "\n }\n\n @media (hover: hover) {\n &:not([data-pressed]):not([data-selected]) {\n &[data-hovered],\n &:hover {\n ", "\n }\n\n &:active {\n ", "\n }\n }\n }\n\n &:focus {\n --card-focus-ring-box-shadow: ", ";\n }\n\n &:focus:not(:focus-visible) {\n --card-focus-ring-box-shadow: ", ";\n }\n }\n }\n\n ", "\n "])), dark ? "dark" : "light", _colorVarsStyle(base, card.enabled, $checkered), _colorVarsStyle(base, card.disabled, $checkered), _colorVarsStyle(base, card.pressed, $checkered), _colorVarsStyle(base, card.selected, $checkered), _colorVarsStyle(base, card.hovered, $checkered), _colorVarsStyle(base, card.pressed, $checkered), $focusRing ? focusRingStyle({
5650
5650
  base,
5651
5651
  border,
5652
5652
  focusRing
@@ -5706,14 +5706,14 @@ const Card = forwardRef(function Card2(props, ref) {
5706
5706
  })
5707
5707
  });
5708
5708
  });
5709
- var __freeze$u = Object.freeze;
5710
- var __defProp$v = Object.defineProperty;
5711
- var __template$u = (cooked, raw) => __freeze$u(__defProp$v(cooked, "raw", {
5712
- value: __freeze$u(raw || cooked.slice())
5709
+ var __freeze$v = Object.freeze;
5710
+ var __defProp$w = Object.defineProperty;
5711
+ var __template$v = (cooked, raw) => __freeze$v(__defProp$w(cooked, "raw", {
5712
+ value: __freeze$v(raw || cooked.slice())
5713
5713
  }));
5714
- var _a$u, _b$i;
5714
+ var _a$v, _b$j;
5715
5715
  function checkboxBaseStyles() {
5716
- return css(_a$u || (_a$u = __template$u(["\n position: relative;\n display: inline-block;\n "])));
5716
+ return css(_a$v || (_a$v = __template$v(["\n position: relative;\n display: inline-block;\n "])));
5717
5717
  }
5718
5718
  function inputElementStyles(props) {
5719
5719
  const {
@@ -5727,7 +5727,7 @@ function inputElementStyles(props) {
5727
5727
  const {
5728
5728
  focusRing
5729
5729
  } = input.checkbox;
5730
- return css(_b$i || (_b$i = __template$u(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n outline: none;\n opacity: 0;\n z-index: 1;\n padding: 0;\n margin: 0;\n\n & + span {\n position: relative;\n display: block;\n height: ", ";\n width: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n border-radius: ", ";\n line-height: 1;\n background-color: ", ";\n\n & > svg {\n display: block;\n position: absolute;\n opacity: 0;\n height: 100%;\n width: 100%;\n\n & > path {\n vector-effect: non-scaling-stroke;\n stroke-width: 1.2 !important;\n }\n }\n }\n &:checked + span {\n background: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n\n /* focus */\n &:not(:disabled):focus:focus-visible + span {\n box-shadow: ", ";\n }\n\n /* focus when checked - uses a different offset */\n &:not(:disabled):focus:focus-visible&:checked + span {\n box-shadow: ", ";\n }\n\n &[data-error] + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n &[data-error]&:checked + span {\n background-color: ", ";\n color: ", ";\n }\n &[data-error]&:checked&:not(:disabled):focus:focus-visible + span {\n box-shadow: ", ";\n }\n\n &:disabled + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n &:disabled&:checked + span {\n background-color: ", ";\n }\n\n &[data-read-only] + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n\n &[data-read-only]&:checked + span {\n background-color: ", ";\n }\n\n &:checked + span > svg:first-child {\n opacity: 1;\n }\n &:indeterminate + span > svg:last-child {\n opacity: 1;\n }\n "])), rem(input.checkbox.size), rem(input.checkbox.size), focusRingBorderStyle({
5730
+ return css(_b$j || (_b$j = __template$v(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n outline: none;\n opacity: 0;\n z-index: 1;\n padding: 0;\n margin: 0;\n\n & + span {\n position: relative;\n display: block;\n height: ", ";\n width: ", ";\n box-sizing: border-box;\n box-shadow: ", ";\n border-radius: ", ";\n line-height: 1;\n background-color: ", ";\n\n & > svg {\n display: block;\n position: absolute;\n opacity: 0;\n height: 100%;\n width: 100%;\n\n & > path {\n vector-effect: non-scaling-stroke;\n stroke-width: 1.2 !important;\n }\n }\n }\n &:checked + span {\n background: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n\n /* focus */\n &:not(:disabled):focus:focus-visible + span {\n box-shadow: ", ";\n }\n\n /* focus when checked - uses a different offset */\n &:not(:disabled):focus:focus-visible&:checked + span {\n box-shadow: ", ";\n }\n\n &[data-error] + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n &[data-error]&:checked + span {\n background-color: ", ";\n color: ", ";\n }\n &[data-error]&:checked&:not(:disabled):focus:focus-visible + span {\n box-shadow: ", ";\n }\n\n &:disabled + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n &:disabled&:checked + span {\n background-color: ", ";\n }\n\n &[data-read-only] + span {\n background-color: ", ";\n box-shadow: ", ";\n color: ", ";\n }\n\n &[data-read-only]&:checked + span {\n background-color: ", ";\n }\n\n &:checked + span > svg:first-child {\n opacity: 1;\n }\n &:indeterminate + span > svg:last-child {\n opacity: 1;\n }\n "])), rem(input.checkbox.size), rem(input.checkbox.size), focusRingBorderStyle({
5731
5731
  color: color.default.enabled.border,
5732
5732
  width: input.border.width
5733
5733
  }), rem(radius[2]), color.default.enabled.bg, color.default.enabled.bg2, focusRingBorderStyle({
@@ -5798,12 +5798,12 @@ const Checkbox = forwardRef(function Checkbox2(props, forwardedRef) {
5798
5798
  })]
5799
5799
  });
5800
5800
  });
5801
- var __freeze$t = Object.freeze;
5802
- var __defProp$u = Object.defineProperty;
5803
- var __template$t = (cooked, raw) => __freeze$t(__defProp$u(cooked, "raw", {
5804
- value: __freeze$t(raw || cooked.slice())
5801
+ var __freeze$u = Object.freeze;
5802
+ var __defProp$v = Object.defineProperty;
5803
+ var __template$u = (cooked, raw) => __freeze$u(__defProp$v(cooked, "raw", {
5804
+ value: __freeze$u(raw || cooked.slice())
5805
5805
  }));
5806
- var _a$t;
5806
+ var _a$u;
5807
5807
  function codeSyntaxHighlightingStyle(_ref25) {
5808
5808
  let {
5809
5809
  theme
@@ -5921,7 +5921,7 @@ function codeSyntaxHighlightingStyle(_ref25) {
5921
5921
  };
5922
5922
  }
5923
5923
  function codeBaseStyle() {
5924
- return css(_a$t || (_a$t = __template$t(["\n color: var(--card-code-fg-color);\n\n & code {\n font-family: inherit;\n\n &.refractor .token {\n ", "\n }\n }\n\n & a {\n color: inherit;\n text-decoration: underline;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), codeSyntaxHighlightingStyle);
5924
+ return css(_a$u || (_a$u = __template$u(["\n color: var(--card-code-fg-color);\n\n & code {\n font-family: inherit;\n\n &.refractor .token {\n ", "\n }\n }\n\n & a {\n color: inherit;\n text-decoration: underline;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), codeSyntaxHighlightingStyle);
5925
5925
  }
5926
5926
  const Root$t = styled.pre(codeBaseStyle, responsiveCodeFontStyle);
5927
5927
  const Code = forwardRef(function Code2(props, ref) {
@@ -6015,28 +6015,28 @@ const Grid = forwardRef(function Grid2(props, ref) {
6015
6015
  children
6016
6016
  });
6017
6017
  });
6018
- var __freeze$s = Object.freeze;
6019
- var __defProp$t = Object.defineProperty;
6020
- var __template$s = (cooked, raw) => __freeze$s(__defProp$t(cooked, "raw", {
6021
- value: __freeze$s(raw || cooked.slice())
6018
+ var __freeze$t = Object.freeze;
6019
+ var __defProp$u = Object.defineProperty;
6020
+ var __template$t = (cooked, raw) => __freeze$t(__defProp$u(cooked, "raw", {
6021
+ value: __freeze$t(raw || cooked.slice())
6022
6022
  }));
6023
- var _a$s, _b$h, _c$a;
6023
+ var _a$t, _b$i, _c$a;
6024
6024
  function headingBaseStyle(props) {
6025
6025
  const {
6026
6026
  $accent,
6027
6027
  $muted,
6028
6028
  theme
6029
6029
  } = props;
6030
- return css(_c$a || (_c$a = __template$s(["\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n color: var(--card-link-color);\n outline: none;\n\n @media (hover: hover) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus {\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n 0 0 0 3px var(--card-focus-ring-color);\n }\n\n &:focus:not(:focus-visible) {\n box-shadow: none;\n }\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), $accent && css(_a$s || (_a$s = __template$s(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$h || (_b$h = __template$s(["\n color: var(--card-muted-fg-color);\n "]))), theme.sanity.fonts.code.family);
6030
+ return css(_c$a || (_c$a = __template$t(["\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n color: var(--card-link-color);\n outline: none;\n\n @media (hover: hover) {\n &:hover {\n text-decoration: underline;\n }\n }\n\n &:focus {\n box-shadow:\n 0 0 0 1px var(--card-bg-color),\n 0 0 0 3px var(--card-focus-ring-color);\n }\n\n &:focus:not(:focus-visible) {\n box-shadow: none;\n }\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), $accent && css(_a$t || (_a$t = __template$t(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$i || (_b$i = __template$t(["\n color: var(--card-muted-fg-color);\n "]))), theme.sanity.fonts.code.family);
6031
6031
  }
6032
- var __freeze$r = Object.freeze;
6033
- var __defProp$s = Object.defineProperty;
6034
- var __template$r = (cooked, raw) => __freeze$r(__defProp$s(cooked, "raw", {
6035
- value: __freeze$r(raw || cooked.slice())
6032
+ var __freeze$s = Object.freeze;
6033
+ var __defProp$t = Object.defineProperty;
6034
+ var __template$s = (cooked, raw) => __freeze$s(__defProp$t(cooked, "raw", {
6035
+ value: __freeze$s(raw || cooked.slice())
6036
6036
  }));
6037
- var _a$r;
6037
+ var _a$s;
6038
6038
  const Root$q = styled.div(headingBaseStyle, responsiveTextAlignStyle, responsiveHeadingFont);
6039
- const SpanWithTextOverflow$1 = styled.span(_a$r || (_a$r = __template$r(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
6039
+ const SpanWithTextOverflow$1 = styled.span(_a$s || (_a$s = __template$s(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
6040
6040
  const Heading = forwardRef(function Heading2(props, ref) {
6041
6041
  const {
6042
6042
  accent = false,
@@ -6114,14 +6114,14 @@ const Inline = forwardRef(function Inline2(props, ref) {
6114
6114
  children
6115
6115
  });
6116
6116
  });
6117
- var __freeze$q = Object.freeze;
6118
- var __defProp$r = Object.defineProperty;
6119
- var __template$q = (cooked, raw) => __freeze$q(__defProp$r(cooked, "raw", {
6120
- value: __freeze$q(raw || cooked.slice())
6117
+ var __freeze$r = Object.freeze;
6118
+ var __defProp$s = Object.defineProperty;
6119
+ var __template$r = (cooked, raw) => __freeze$r(__defProp$s(cooked, "raw", {
6120
+ value: __freeze$r(raw || cooked.slice())
6121
6121
  }));
6122
- var _a$q;
6122
+ var _a$r;
6123
6123
  function kbdStyle() {
6124
- return css(_a$q || (_a$q = __template$q(["\n background: var(--card-bg2-color);\n font: inherit;\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
6124
+ return css(_a$r || (_a$r = __template$r(["\n background: var(--card-bg2-color);\n font: inherit;\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
6125
6125
  }
6126
6126
  const Root$o = styled.kbd(responsiveRadiusStyle, kbdStyle);
6127
6127
  const KBD = forwardRef(function KBD2(props, ref) {
@@ -6150,12 +6150,12 @@ const KBD = forwardRef(function KBD2(props, ref) {
6150
6150
  })
6151
6151
  });
6152
6152
  });
6153
- var __freeze$p = Object.freeze;
6154
- var __defProp$q = Object.defineProperty;
6155
- var __template$p = (cooked, raw) => __freeze$p(__defProp$q(cooked, "raw", {
6156
- value: __freeze$p(raw || cooked.slice())
6153
+ var __freeze$q = Object.freeze;
6154
+ var __defProp$r = Object.defineProperty;
6155
+ var __template$q = (cooked, raw) => __freeze$q(__defProp$r(cooked, "raw", {
6156
+ value: __freeze$q(raw || cooked.slice())
6157
6157
  }));
6158
- var _a$p, _b$g, _c$9;
6158
+ var _a$q, _b$h, _c$9;
6159
6159
  function labelBaseStyle(props) {
6160
6160
  const {
6161
6161
  $accent,
@@ -6165,16 +6165,16 @@ function labelBaseStyle(props) {
6165
6165
  const {
6166
6166
  fonts
6167
6167
  } = theme.sanity;
6168
- return css(_c$9 || (_c$9 = __template$p(["\n text-transform: uppercase;\n\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), $accent && css(_a$p || (_a$p = __template$p(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$g || (_b$g = __template$p(["\n color: var(--card-muted-fg-color);\n "]))), fonts.code.family);
6168
+ return css(_c$9 || (_c$9 = __template$q(["\n text-transform: uppercase;\n\n ", "\n\n ", "\n\n & code {\n font-family: ", ";\n border-radius: 1px;\n }\n\n & a {\n text-decoration: none;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n "])), $accent && css(_a$q || (_a$q = __template$q(["\n color: var(--card-accent-fg-color);\n "]))), $muted && css(_b$h || (_b$h = __template$q(["\n color: var(--card-muted-fg-color);\n "]))), fonts.code.family);
6169
6169
  }
6170
- var __freeze$o = Object.freeze;
6171
- var __defProp$p = Object.defineProperty;
6172
- var __template$o = (cooked, raw) => __freeze$o(__defProp$p(cooked, "raw", {
6173
- value: __freeze$o(raw || cooked.slice())
6170
+ var __freeze$p = Object.freeze;
6171
+ var __defProp$q = Object.defineProperty;
6172
+ var __template$p = (cooked, raw) => __freeze$p(__defProp$q(cooked, "raw", {
6173
+ value: __freeze$p(raw || cooked.slice())
6174
6174
  }));
6175
- var _a$o;
6175
+ var _a$p;
6176
6176
  const Root$n = styled.div(responsiveLabelFont, responsiveTextAlignStyle, labelBaseStyle);
6177
- const SpanWithTextOverflow = styled.span(_a$o || (_a$o = __template$o(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
6177
+ const SpanWithTextOverflow = styled.span(_a$p || (_a$p = __template$p(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n overflow: clip;\n"])));
6178
6178
  const Label = forwardRef(function Label2(props, ref) {
6179
6179
  const {
6180
6180
  accent,
@@ -6285,8 +6285,8 @@ const ElementQuery = forwardRef(function ElementQuery2(props, ref) {
6285
6285
  children
6286
6286
  });
6287
6287
  });
6288
- var __defProp$o = Object.defineProperty;
6289
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp$o(obj, key, {
6288
+ var __defProp$p = Object.defineProperty;
6289
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp$p(obj, key, {
6290
6290
  enumerable: true,
6291
6291
  configurable: true,
6292
6292
  writable: true,
@@ -6662,13 +6662,13 @@ function PortalProvider(props) {
6662
6662
  children
6663
6663
  });
6664
6664
  }
6665
- var __freeze$n = Object.freeze;
6666
- var __defProp$n = Object.defineProperty;
6667
- var __template$n = (cooked, raw) => __freeze$n(__defProp$n(cooked, "raw", {
6668
- value: __freeze$n(raw || cooked.slice())
6665
+ var __freeze$o = Object.freeze;
6666
+ var __defProp$o = Object.defineProperty;
6667
+ var __template$o = (cooked, raw) => __freeze$o(__defProp$o(cooked, "raw", {
6668
+ value: __freeze$o(raw || cooked.slice())
6669
6669
  }));
6670
- var _a$n;
6671
- const Root$l = styled.div(_a$n || (_a$n = __template$n(["\n display: block;\n width: 0;\n height: 0;\n position: absolute;\n overflow: hidden;\n overflow: clip;\n"])));
6670
+ var _a$o;
6671
+ const Root$l = styled.div(_a$o || (_a$o = __template$o(["\n display: block;\n width: 0;\n height: 0;\n position: absolute;\n overflow: hidden;\n overflow: clip;\n"])));
6672
6672
  const SrOnly = forwardRef(function SrOnly2(props, ref) {
6673
6673
  const {
6674
6674
  as,
@@ -6682,14 +6682,14 @@ const SrOnly = forwardRef(function SrOnly2(props, ref) {
6682
6682
  children
6683
6683
  });
6684
6684
  });
6685
- var __freeze$m = Object.freeze;
6686
- var __defProp$m = Object.defineProperty;
6687
- var __template$m = (cooked, raw) => __freeze$m(__defProp$m(cooked, "raw", {
6688
- value: __freeze$m(raw || cooked.slice())
6685
+ var __freeze$n = Object.freeze;
6686
+ var __defProp$n = Object.defineProperty;
6687
+ var __template$n = (cooked, raw) => __freeze$n(__defProp$n(cooked, "raw", {
6688
+ value: __freeze$n(raw || cooked.slice())
6689
6689
  }));
6690
- var _a$m, _b$f;
6691
- const Root$k = styled.div(_a$m || (_a$m = __template$m(["\n position: relative;\n"])));
6692
- const ItemWrapper = styled.div(_b$f || (_b$f = __template$m(["\n position: absolute;\n left: 0;\n right: 0;\n"])));
6690
+ var _a$n, _b$g;
6691
+ const Root$k = styled.div(_a$n || (_a$n = __template$n(["\n position: relative;\n"])));
6692
+ const ItemWrapper = styled.div(_b$g || (_b$g = __template$n(["\n position: absolute;\n left: 0;\n right: 0;\n"])));
6693
6693
  const VirtualList = forwardRef(function VirtualList2(props, ref) {
6694
6694
  const {
6695
6695
  as = "div",
@@ -6912,15 +6912,15 @@ function calcMaxWidth(params) {
6912
6912
  }
6913
6913
  return Math.min(currentWidth != null ? currentWidth : Infinity, (boundaryWidth || Infinity) - DEFAULT_POPOVER_PADDING * 2);
6914
6914
  }
6915
- var __freeze$l = Object.freeze;
6916
- var __defProp$l = Object.defineProperty;
6917
- var __template$l = (cooked, raw) => __freeze$l(__defProp$l(cooked, "raw", {
6918
- value: __freeze$l(raw || cooked.slice())
6915
+ var __freeze$m = Object.freeze;
6916
+ var __defProp$m = Object.defineProperty;
6917
+ var __template$m = (cooked, raw) => __freeze$m(__defProp$m(cooked, "raw", {
6918
+ value: __freeze$m(raw || cooked.slice())
6919
6919
  }));
6920
- var _a$l, _b$e, _c$8;
6921
- const Root$j = styled.div(_a$l || (_a$l = __template$l(["\n position: absolute;\n pointer-events: none;\n width: ", "px;\n height: ", "px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n display: block;\n transform-origin: ", "px ", "px;\n }\n\n [data-placement^='top'] > & {\n bottom: -", "px;\n }\n\n [data-placement^='right'] > & {\n left: -", "px;\n\n & > svg {\n transform: rotate(90deg);\n }\n }\n\n [data-placement^='left'] > & {\n right: -", "px;\n\n & > svg {\n transform: rotate(-90deg);\n }\n }\n\n [data-placement^='bottom'] > & {\n top: -", "px;\n\n & > svg {\n transform: rotate(180deg);\n }\n }\n"])), DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH / 2, DEFAULT_POPOVER_ARROW_WIDTH / 2, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH);
6922
- const BorderPath = styled.path(_b$e || (_b$e = __template$l(["\n fill: var(--card-shadow-outline-color);\n"])));
6923
- const ShapePath = styled.path(_c$8 || (_c$8 = __template$l(["\n fill: var(--card-bg-color);\n"])));
6920
+ var _a$m, _b$f, _c$8;
6921
+ const Root$j = styled.div(_a$m || (_a$m = __template$m(["\n position: absolute;\n pointer-events: none;\n width: ", "px;\n height: ", "px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n display: block;\n transform-origin: ", "px ", "px;\n }\n\n [data-placement^='top'] > & {\n bottom: -", "px;\n }\n\n [data-placement^='right'] > & {\n left: -", "px;\n\n & > svg {\n transform: rotate(90deg);\n }\n }\n\n [data-placement^='left'] > & {\n right: -", "px;\n\n & > svg {\n transform: rotate(-90deg);\n }\n }\n\n [data-placement^='bottom'] > & {\n top: -", "px;\n\n & > svg {\n transform: rotate(180deg);\n }\n }\n"])), DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH / 2, DEFAULT_POPOVER_ARROW_WIDTH / 2, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH, DEFAULT_POPOVER_ARROW_WIDTH);
6922
+ const BorderPath = styled.path(_b$f || (_b$f = __template$m(["\n fill: var(--card-shadow-outline-color);\n"])));
6923
+ const ShapePath = styled.path(_c$8 || (_c$8 = __template$m(["\n fill: var(--card-bg-color);\n"])));
6924
6924
  const PopoverArrow = forwardRef(function PopoverArrow2(props, ref) {
6925
6925
  return /* @__PURE__ */jsx(Root$j, {
6926
6926
  "data-ui": "Popover__arrow",
@@ -7250,14 +7250,14 @@ const Popover = memo(forwardRef(function Popover2(props, ref) {
7250
7250
  });
7251
7251
  }));
7252
7252
  Popover.displayName = "Popover";
7253
- var __freeze$k = Object.freeze;
7254
- var __defProp$k = Object.defineProperty;
7255
- var __template$k = (cooked, raw) => __freeze$k(__defProp$k(cooked, "raw", {
7256
- value: __freeze$k(raw || cooked.slice())
7253
+ var __freeze$l = Object.freeze;
7254
+ var __defProp$l = Object.defineProperty;
7255
+ var __template$l = (cooked, raw) => __freeze$l(__defProp$l(cooked, "raw", {
7256
+ value: __freeze$l(raw || cooked.slice())
7257
7257
  }));
7258
- var _a$k, _b$d;
7258
+ var _a$l, _b$e;
7259
7259
  function radioBaseStyle() {
7260
- return css(_a$k || (_a$k = __template$k(["\n position: relative;\n\n &:not([hidden]) {\n display: inline-block;\n }\n\n &[data-read-only] {\n outline: 1px solid red;\n }\n "])));
7260
+ return css(_a$l || (_a$l = __template$l(["\n position: relative;\n\n &:not([hidden]) {\n display: inline-block;\n }\n\n &[data-read-only] {\n outline: 1px solid red;\n }\n "])));
7261
7261
  }
7262
7262
  function inputElementStyle(props) {
7263
7263
  const {
@@ -7271,7 +7271,7 @@ function inputElementStyle(props) {
7271
7271
  } = input.radio;
7272
7272
  const color = theme.sanity.color.input;
7273
7273
  const dist = (input.radio.size - input.radio.markSize) / 2;
7274
- return css(_b$d || (_b$d = __template$k(["\n appearance: none;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n height: 100%;\n width: 100%;\n outline: none;\n z-index: 1;\n padding: 0;\n margin: 0;\n border-radius: ", ";\n border: none;\n\n /* enabled */\n & + span {\n display: block;\n position: relative;\n height: ", ";\n width: ", ";\n border-radius: ", ";\n background: ", ";\n box-shadow: ", ";\n\n &::after {\n content: '';\n position: absolute;\n top: ", ";\n left: ", ";\n height: ", ";\n width: ", ";\n border-radius: ", ";\n background: ", ";\n opacity: 0;\n }\n }\n\n /* focused */\n &:not(:disabled):focus + span {\n box-shadow: ", ";\n }\n\n &:not(:disabled):focus:not(:focus-visible) + span {\n box-shadow: ", ";\n }\n\n &:checked + span::after {\n opacity: 1;\n }\n\n /* customValidity */\n &[data-error] + span {\n background-color: ", ";\n box-shadow: ", ";\n &::after {\n background: ", ";\n }\n }\n\n /* read only */\n &[data-read-only] + span {\n box-shadow: 0 0 0 1px ", ";\n background: ", ";\n\n &::after {\n background: ", ";\n }\n }\n\n /* disabled */\n &:not([data-read-only]):disabled + span {\n box-shadow: 0 0 0 1px ", ";\n background: ", ";\n\n &::after {\n background: ", ";\n }\n }\n "])), rem(input.radio.size / 2), rem(input.radio.size), rem(input.radio.size), rem(input.radio.size / 2), color.default.enabled.bg, focusRingBorderStyle({
7274
+ return css(_b$e || (_b$e = __template$l(["\n appearance: none;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n height: 100%;\n width: 100%;\n outline: none;\n z-index: 1;\n padding: 0;\n margin: 0;\n border-radius: ", ";\n border: none;\n\n /* enabled */\n & + span {\n display: block;\n position: relative;\n height: ", ";\n width: ", ";\n border-radius: ", ";\n background: ", ";\n box-shadow: ", ";\n\n &::after {\n content: '';\n position: absolute;\n top: ", ";\n left: ", ";\n height: ", ";\n width: ", ";\n border-radius: ", ";\n background: ", ";\n opacity: 0;\n }\n }\n\n /* focused */\n &:not(:disabled):focus + span {\n box-shadow: ", ";\n }\n\n &:not(:disabled):focus:not(:focus-visible) + span {\n box-shadow: ", ";\n }\n\n &:checked + span::after {\n opacity: 1;\n }\n\n /* customValidity */\n &[data-error] + span {\n background-color: ", ";\n box-shadow: ", ";\n &::after {\n background: ", ";\n }\n }\n\n /* read only */\n &[data-read-only] + span {\n box-shadow: 0 0 0 1px ", ";\n background: ", ";\n\n &::after {\n background: ", ";\n }\n }\n\n /* disabled */\n &:not([data-read-only]):disabled + span {\n box-shadow: 0 0 0 1px ", ";\n background: ", ";\n\n &::after {\n background: ", ";\n }\n }\n "])), rem(input.radio.size / 2), rem(input.radio.size), rem(input.radio.size), rem(input.radio.size / 2), color.default.enabled.bg, focusRingBorderStyle({
7275
7275
  color: color.default.enabled.border,
7276
7276
  width: input.border.width
7277
7277
  }), rem(dist), rem(dist), rem(input.radio.markSize), rem(input.radio.markSize), rem(input.radio.markSize / 2), color.default.enabled.bg2, focusRingStyle({
@@ -7316,21 +7316,21 @@ const Radio = forwardRef(function Radio2(props, forwardedRef) {
7316
7316
  }), /* @__PURE__ */jsx("span", {})]
7317
7317
  });
7318
7318
  });
7319
- var __freeze$j = Object.freeze;
7320
- var __defProp$j = Object.defineProperty;
7321
- var __template$j = (cooked, raw) => __freeze$j(__defProp$j(cooked, "raw", {
7322
- value: __freeze$j(raw || cooked.slice())
7319
+ var __freeze$k = Object.freeze;
7320
+ var __defProp$k = Object.defineProperty;
7321
+ var __template$k = (cooked, raw) => __freeze$k(__defProp$k(cooked, "raw", {
7322
+ value: __freeze$k(raw || cooked.slice())
7323
7323
  }));
7324
- var _a$j, _b$c, _c$7, _d$5;
7324
+ var _a$k, _b$d, _c$7, _d$5;
7325
7325
  function rootStyle() {
7326
- return css(_a$j || (_a$j = __template$j(["\n position: relative;\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
7326
+ return css(_a$k || (_a$k = __template$k(["\n position: relative;\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
7327
7327
  }
7328
7328
  function inputBaseStyle(props) {
7329
7329
  const {
7330
7330
  theme
7331
7331
  } = props;
7332
7332
  const font = theme.sanity.fonts.text;
7333
- return css(_b$c || (_b$c = __template$j(["\n -webkit-font-smoothing: antialiased;\n appearance: none;\n border: 0;\n font-family: ", ";\n color: inherit;\n width: 100%;\n outline: none;\n margin: 0;\n\n &:disabled {\n opacity: 1;\n }\n "])), font.family);
7333
+ return css(_b$d || (_b$d = __template$k(["\n -webkit-font-smoothing: antialiased;\n appearance: none;\n border: 0;\n font-family: ", ";\n color: inherit;\n width: 100%;\n outline: none;\n margin: 0;\n\n &:disabled {\n opacity: 1;\n }\n "])), font.family);
7334
7334
  }
7335
7335
  function inputColorStyle(props) {
7336
7336
  const {
@@ -7343,7 +7343,7 @@ function inputColorStyle(props) {
7343
7343
  focusRing
7344
7344
  } = input.select;
7345
7345
  const color = theme.sanity.color.input;
7346
- return css(_c$7 || (_c$7 = __template$j(["\n /* enabled */\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n\n /* hovered */\n @media (hover: hover) {\n &:not(:disabled):hover {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n }\n\n /* focused */\n &:not(:disabled):focus {\n box-shadow: ", ";\n }\n\n /* read-only */\n &[data-read-only] {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n\n /* disabled */\n &:not([data-read-only]):disabled {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n "])), color.default.enabled.bg, color.default.enabled.fg, focusRingBorderStyle({
7346
+ return css(_c$7 || (_c$7 = __template$k(["\n /* enabled */\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n\n /* hovered */\n @media (hover: hover) {\n &:not(:disabled):hover {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n }\n\n /* focused */\n &:not(:disabled):focus {\n box-shadow: ", ";\n }\n\n /* read-only */\n &[data-read-only] {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n\n /* disabled */\n &:not([data-read-only]):disabled {\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n }\n "])), color.default.enabled.bg, color.default.enabled.fg, focusRingBorderStyle({
7347
7347
  color: color.default.enabled.border,
7348
7348
  width: input.border.width
7349
7349
  }), color.default.hovered.bg, color.default.hovered.fg, focusRingBorderStyle({
@@ -7387,7 +7387,7 @@ function iconBoxStyle(props) {
7387
7387
  theme
7388
7388
  } = props;
7389
7389
  const color = theme.sanity.color.input;
7390
- return css(_d$5 || (_d$5 = __template$j(["\n pointer-events: none;\n position: absolute;\n top: 0;\n right: 0;\n\n /* enabled */\n --card-fg-color: ", ";\n\n /* hover */\n @media (hover: hover) {\n select:not(disabled):not(:read-only):hover + && {\n --card-fg-color: ", ";\n }\n }\n\n /* disabled */\n select:disabled + && {\n --card-fg-color: ", ";\n }\n\n /* read-only */\n select[data-read-only] + && {\n --card-fg-color: ", ";\n }\n "])), color.default.enabled.fg, color.default.hovered.fg, color.default.disabled.fg, color.default.readOnly.fg);
7390
+ return css(_d$5 || (_d$5 = __template$k(["\n pointer-events: none;\n position: absolute;\n top: 0;\n right: 0;\n\n /* enabled */\n --card-fg-color: ", ";\n\n /* hover */\n @media (hover: hover) {\n select:not(disabled):not(:read-only):hover + && {\n --card-fg-color: ", ";\n }\n }\n\n /* disabled */\n select:disabled + && {\n --card-fg-color: ", ";\n }\n\n /* read-only */\n select[data-read-only] + && {\n --card-fg-color: ", ";\n }\n "])), color.default.enabled.fg, color.default.hovered.fg, color.default.disabled.fg, color.default.readOnly.fg);
7391
7391
  }
7392
7392
  const selectStyle = {
7393
7393
  root: rootStyle,
@@ -7474,17 +7474,17 @@ const Stack = forwardRef(function Stack2(props, ref) {
7474
7474
  ref
7475
7475
  });
7476
7476
  });
7477
- var __freeze$i = Object.freeze;
7478
- var __defProp$i = Object.defineProperty;
7479
- var __template$i = (cooked, raw) => __freeze$i(__defProp$i(cooked, "raw", {
7480
- value: __freeze$i(raw || cooked.slice())
7477
+ var __freeze$j = Object.freeze;
7478
+ var __defProp$j = Object.defineProperty;
7479
+ var __template$j = (cooked, raw) => __freeze$j(__defProp$j(cooked, "raw", {
7480
+ value: __freeze$j(raw || cooked.slice())
7481
7481
  }));
7482
- var _a$i, _b$b, _c$6, _d$4, _e$2, _f$2, _g;
7482
+ var _a$j, _b$c, _c$6, _d$4, _e$2, _f$2, _g;
7483
7483
  function switchBaseStyles() {
7484
- return css(_a$i || (_a$i = __template$i(["\n position: relative;\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
7484
+ return css(_a$j || (_a$j = __template$j(["\n position: relative;\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
7485
7485
  }
7486
7486
  function switchInputStyles() {
7487
- return css(_b$b || (_b$b = __template$i(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n opacity: 0;\n height: 100%;\n width: 100%;\n outline: none;\n padding: 0;\n margin: 0;\n\n /* Place the input element above the representation element */\n z-index: 1;\n "])));
7487
+ return css(_b$c || (_b$c = __template$j(["\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n opacity: 0;\n height: 100%;\n width: 100%;\n outline: none;\n padding: 0;\n margin: 0;\n\n /* Place the input element above the representation element */\n z-index: 1;\n "])));
7488
7488
  }
7489
7489
  function switchRepresentationStyles(props) {
7490
7490
  const {
@@ -7497,7 +7497,7 @@ function switchRepresentationStyles(props) {
7497
7497
  focusRing
7498
7498
  } = input.switch;
7499
7499
  const color = theme.sanity.color.input;
7500
- return css(_c$6 || (_c$6 = __template$i(["\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n --switch-box-shadow: none;\n\n &:not([hidden]) {\n display: block;\n }\n position: relative;\n width: ", ";\n height: ", ";\n border-radius: ", ";\n\n /* Make sure it\u2019s not possible to interact with the wrapper element */\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n box-shadow: var(--switch-box-shadow);\n border-radius: inherit;\n }\n\n /* Focus styles */\n input:focus + && {\n --switch-box-shadow: ", ";\n }\n\n input:focus:not(:focus-visible) + && {\n --switch-box-shadow: none;\n }\n\n input:checked + && {\n --switch-bg-color: var(--card-focus-ring-color);\n --switch-fg-color: ", ";\n }\n\n @media (hover: hover) {\n input:not(:disabled):hover + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n\n input:not(:disabled):checked:hover + && {\n --switch-bg-color: var(--card-focus-ring-color);\n --switch-fg-color: ", ";\n }\n }\n\n input:not([data-read-only]):disabled + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n\n input[data-read-only]:disabled + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n "])), color.default.enabled.border, color.default.enabled.bg, rem(input.switch.width), rem(input.switch.height), rem(input.switch.height / 2), focusRingStyle({
7500
+ return css(_c$6 || (_c$6 = __template$j(["\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n --switch-box-shadow: none;\n\n &:not([hidden]) {\n display: block;\n }\n position: relative;\n width: ", ";\n height: ", ";\n border-radius: ", ";\n\n /* Make sure it\u2019s not possible to interact with the wrapper element */\n pointer-events: none;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 1;\n box-shadow: var(--switch-box-shadow);\n border-radius: inherit;\n }\n\n /* Focus styles */\n input:focus + && {\n --switch-box-shadow: ", ";\n }\n\n input:focus:not(:focus-visible) + && {\n --switch-box-shadow: none;\n }\n\n input:checked + && {\n --switch-bg-color: var(--card-focus-ring-color);\n --switch-fg-color: ", ";\n }\n\n @media (hover: hover) {\n input:not(:disabled):hover + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n\n input:not(:disabled):checked:hover + && {\n --switch-bg-color: var(--card-focus-ring-color);\n --switch-fg-color: ", ";\n }\n }\n\n input:not([data-read-only]):disabled + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n\n input[data-read-only]:disabled + && {\n --switch-bg-color: ", ";\n --switch-fg-color: ", ";\n }\n "])), color.default.enabled.border, color.default.enabled.bg, rem(input.switch.width), rem(input.switch.height), rem(input.switch.height / 2), focusRingStyle({
7501
7501
  focusRing
7502
7502
  }), color.default.enabled.bg, color.default.hovered.border, color.default.hovered.bg, color.default.enabled.bg, color.default.disabled.border, color.default.disabled.bg, color.default.readOnly.border, color.default.readOnly.bg);
7503
7503
  }
@@ -7508,7 +7508,7 @@ function switchTrackStyles(props) {
7508
7508
  const {
7509
7509
  input
7510
7510
  } = theme.sanity;
7511
- return css(_d$4 || (_d$4 = __template$i(["\n &:not([hidden]) {\n display: block;\n }\n background-color: var(--switch-bg-color);\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n height: ", ";\n border-radius: ", ";\n "])), rem(input.switch.width), rem(input.switch.height), rem(input.switch.height / 2));
7511
+ return css(_d$4 || (_d$4 = __template$j(["\n &:not([hidden]) {\n display: block;\n }\n background-color: var(--switch-bg-color);\n position: absolute;\n left: 0;\n top: 0;\n width: ", ";\n height: ", ";\n border-radius: ", ";\n "])), rem(input.switch.width), rem(input.switch.height), rem(input.switch.height / 2));
7512
7512
  }
7513
7513
  function switchThumbStyles(props) {
7514
7514
  const {
@@ -7525,7 +7525,7 @@ function switchThumbStyles(props) {
7525
7525
  const checkedOffset = trackWidth - trackPadding * 2 - size;
7526
7526
  const indeterminateOffset = trackWidth / 2 - size / 2 - trackPadding;
7527
7527
  const checked = $indeterminate !== true && props.$checked === true;
7528
- return css(_g || (_g = __template$i(["\n &:not([hidden]) {\n display: block;\n }\n position: absolute;\n left: ", ";\n top: ", ";\n height: ", ";\n width: ", ";\n border-radius: ", ";\n transition-property: transform;\n transition-duration: ", "ms;\n transition-timing-function: ", ";\n background: var(--switch-fg-color);\n transform: translate3d(0, 0, 0);\n box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);\n\n ", "\n\n ", "\n "])), rem(trackPadding), rem(trackPadding), rem(size), rem(size), rem(size / 2), input.switch.transitionDurationMs, input.switch.transitionTimingFunction, checked && css(_e$2 || (_e$2 = __template$i(["\n transform: translate3d(", "px, 0, 0);\n "])), checkedOffset), $indeterminate && css(_f$2 || (_f$2 = __template$i(["\n transform: translate3d(", "px, 0, 0);\n "])), indeterminateOffset));
7528
+ return css(_g || (_g = __template$j(["\n &:not([hidden]) {\n display: block;\n }\n position: absolute;\n left: ", ";\n top: ", ";\n height: ", ";\n width: ", ";\n border-radius: ", ";\n transition-property: transform;\n transition-duration: ", "ms;\n transition-timing-function: ", ";\n background: var(--switch-fg-color);\n transform: translate3d(0, 0, 0);\n box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);\n\n ", "\n\n ", "\n "])), rem(trackPadding), rem(trackPadding), rem(size), rem(size), rem(size / 2), input.switch.transitionDurationMs, input.switch.transitionTimingFunction, checked && css(_e$2 || (_e$2 = __template$j(["\n transform: translate3d(", "px, 0, 0);\n "])), checkedOffset), $indeterminate && css(_f$2 || (_f$2 = __template$j(["\n transform: translate3d(", "px, 0, 0);\n "])), indeterminateOffset));
7529
7529
  }
7530
7530
  const Root$e = styled.span(switchBaseStyles);
7531
7531
  const Input$2 = styled.input(switchInputStyles);
@@ -7569,14 +7569,14 @@ const Switch = forwardRef(function Switch2(props, forwardedRef) {
7569
7569
  })]
7570
7570
  });
7571
7571
  });
7572
- var __freeze$h = Object.freeze;
7573
- var __defProp$h = Object.defineProperty;
7574
- var __template$h = (cooked, raw) => __freeze$h(__defProp$h(cooked, "raw", {
7575
- value: __freeze$h(raw || cooked.slice())
7572
+ var __freeze$i = Object.freeze;
7573
+ var __defProp$i = Object.defineProperty;
7574
+ var __template$i = (cooked, raw) => __freeze$i(__defProp$i(cooked, "raw", {
7575
+ value: __freeze$i(raw || cooked.slice())
7576
7576
  }));
7577
- var _a$h;
7577
+ var _a$i;
7578
7578
  const Root$d = styled.span(textInputRootStyle);
7579
- const InputRoot$1 = styled.span(_a$h || (_a$h = __template$h(["\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n"])));
7579
+ const InputRoot$1 = styled.span(_a$i || (_a$i = __template$i(["\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n"])));
7580
7580
  const Input$1 = styled.textarea(responsiveInputPaddingStyle, textInputBaseStyle, textInputFontSizeStyle);
7581
7581
  const Presentation$1 = styled.div(responsiveRadiusStyle, textInputRepresentationStyle);
7582
7582
  const TextArea = forwardRef(function TextArea2(props, forwardedRef) {
@@ -7620,30 +7620,30 @@ const TextArea = forwardRef(function TextArea2(props, forwardedRef) {
7620
7620
  })
7621
7621
  });
7622
7622
  });
7623
- var __freeze$g = Object.freeze;
7624
- var __defProp$g = Object.defineProperty;
7625
- var __template$g = (cooked, raw) => __freeze$g(__defProp$g(cooked, "raw", {
7626
- value: __freeze$g(raw || cooked.slice())
7623
+ var __freeze$h = Object.freeze;
7624
+ var __defProp$h = Object.defineProperty;
7625
+ var __template$h = (cooked, raw) => __freeze$h(__defProp$h(cooked, "raw", {
7626
+ value: __freeze$h(raw || cooked.slice())
7627
7627
  }));
7628
- var _a$g, _b$a, _c$5, _d$3, _e$1, _f$1;
7628
+ var _a$h, _b$b, _c$5, _d$3, _e$1, _f$1;
7629
7629
  const CLEAR_BUTTON_BOX_STYLE = {
7630
7630
  zIndex: 2
7631
7631
  };
7632
7632
  const Root$c = styled(Card).attrs({
7633
7633
  forwardedAs: "span"
7634
7634
  })(textInputRootStyle);
7635
- const InputRoot = styled.span(_a$g || (_a$g = __template$g(["\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n"])));
7635
+ const InputRoot = styled.span(_a$h || (_a$h = __template$h(["\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n"])));
7636
7636
  const Prefix = styled(Card).attrs({
7637
7637
  forwardedAs: "span"
7638
- })(_b$a || (_b$a = __template$g(["\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n"])));
7638
+ })(_b$b || (_b$b = __template$h(["\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n"])));
7639
7639
  const Suffix = styled(Card).attrs({
7640
7640
  forwardedAs: "span"
7641
- })(_c$5 || (_c$5 = __template$g(["\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n"])));
7641
+ })(_c$5 || (_c$5 = __template$h(["\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n"])));
7642
7642
  const Input = styled.input(responsiveInputPaddingStyle, textInputBaseStyle, textInputFontSizeStyle);
7643
7643
  const Presentation = styled.span(responsiveRadiusStyle, textInputRepresentationStyle);
7644
- const LeftBox = styled(Box)(_d$3 || (_d$3 = __template$g(["\n position: absolute;\n top: 0;\n left: 0;\n"])));
7645
- const RightBox = styled(Box)(_e$1 || (_e$1 = __template$g(["\n position: absolute;\n top: 0;\n right: 0;\n"])));
7646
- const RightCard = styled(Card)(_f$1 || (_f$1 = __template$g(["\n background-color: transparent;\n position: absolute;\n top: 0;\n right: 0;\n"])));
7644
+ const LeftBox = styled(Box)(_d$3 || (_d$3 = __template$h(["\n position: absolute;\n top: 0;\n left: 0;\n"])));
7645
+ const RightBox = styled(Box)(_e$1 || (_e$1 = __template$h(["\n position: absolute;\n top: 0;\n right: 0;\n"])));
7646
+ const RightCard = styled(Card)(_f$1 || (_f$1 = __template$h(["\n background-color: transparent;\n position: absolute;\n top: 0;\n right: 0;\n"])));
7647
7647
  const TextInputClearButton = styled(Button)({
7648
7648
  "&:not([hidden])": {
7649
7649
  display: "block"
@@ -7811,6 +7811,17 @@ function useDelayedState(initialState) {
7811
7811
  }, []);
7812
7812
  return [state, onStateChange];
7813
7813
  }
7814
+ function ConditionalWrapper(_ref27) {
7815
+ let {
7816
+ children,
7817
+ condition,
7818
+ wrapper
7819
+ } = _ref27;
7820
+ if (!condition) {
7821
+ return children;
7822
+ }
7823
+ return wrapper(children);
7824
+ }
7814
7825
  const DEFAULT_TOOLTIP_DISTANCE = 4;
7815
7826
  const DEFAULT_TOOLTIP_PADDING = 4;
7816
7827
  const DEFAULT_FALLBACK_PLACEMENTS = {
@@ -7827,15 +7838,15 @@ const DEFAULT_FALLBACK_PLACEMENTS = {
7827
7838
  "right-start": ["right", "right-end", "left-start", "top-start", "bottom-start"],
7828
7839
  "right-end": ["right", "right-start", "left-end", "top-end", "bottom-end"]
7829
7840
  };
7830
- var __freeze$f = Object.freeze;
7831
- var __defProp$f = Object.defineProperty;
7832
- var __template$f = (cooked, raw) => __freeze$f(__defProp$f(cooked, "raw", {
7833
- value: __freeze$f(raw || cooked.slice())
7841
+ var __freeze$g = Object.freeze;
7842
+ var __defProp$g = Object.defineProperty;
7843
+ var __template$g = (cooked, raw) => __freeze$g(__defProp$g(cooked, "raw", {
7844
+ value: __freeze$g(raw || cooked.slice())
7834
7845
  }));
7835
- var _a$f, _b$9, _c$4;
7836
- const Root$b = styled.div(_a$f || (_a$f = __template$f(["\n position: absolute;\n pointer-events: none;\n width: 15px;\n height: 15px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n display: block;\n transform-origin: 7.5px 7.5px;\n }\n\n /* position: absolute;\n width: 15px;\n height: 15px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n &:not([hidden]) {\n display: block;\n }\n transform-origin: 7.5px 7.5px;\n } */\n\n [data-placement^='top'] > & {\n bottom: -27px;\n }\n\n [data-placement^='right'] > & {\n left: -27px;\n\n & > svg {\n transform: rotate(90deg);\n }\n }\n\n [data-placement^='left'] > & {\n right: -27px;\n\n & > svg {\n transform: rotate(-90deg);\n }\n }\n\n [data-placement^='bottom'] > & {\n top: -27px;\n\n & > svg {\n transform: rotate(180deg);\n }\n }\n"])));
7837
- const Border = styled.path(_b$9 || (_b$9 = __template$f(["\n fill: var(--card-shadow-outline-color);\n"])));
7838
- const Shape = styled.path(_c$4 || (_c$4 = __template$f(["\n fill: var(--card-bg-color);\n"])));
7846
+ var _a$g, _b$a, _c$4;
7847
+ const Root$b = styled.div(_a$g || (_a$g = __template$g(["\n position: absolute;\n pointer-events: none;\n width: 15px;\n height: 15px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n display: block;\n transform-origin: 7.5px 7.5px;\n }\n\n /* position: absolute;\n width: 15px;\n height: 15px;\n fill: none;\n\n :empty + & {\n display: none;\n }\n\n & > svg {\n &:not([hidden]) {\n display: block;\n }\n transform-origin: 7.5px 7.5px;\n } */\n\n [data-placement^='top'] > & {\n bottom: -27px;\n }\n\n [data-placement^='right'] > & {\n left: -27px;\n\n & > svg {\n transform: rotate(90deg);\n }\n }\n\n [data-placement^='left'] > & {\n right: -27px;\n\n & > svg {\n transform: rotate(-90deg);\n }\n }\n\n [data-placement^='bottom'] > & {\n top: -27px;\n\n & > svg {\n transform: rotate(180deg);\n }\n }\n"])));
7848
+ const Border = styled.path(_b$a || (_b$a = __template$g(["\n fill: var(--card-shadow-outline-color);\n"])));
7849
+ const Shape = styled.path(_c$4 || (_c$4 = __template$g(["\n fill: var(--card-bg-color);\n"])));
7839
7850
  const TooltipArrow = forwardRef(function TooltipArrow2(props, ref) {
7840
7851
  const {
7841
7852
  ...restProps
@@ -7886,16 +7897,16 @@ function TooltipDelayGroupProvider(props) {
7886
7897
  children
7887
7898
  });
7888
7899
  }
7889
- var __freeze$e = Object.freeze;
7890
- var __defProp$e = Object.defineProperty;
7891
- var __template$e = (cooked, raw) => __freeze$e(__defProp$e(cooked, "raw", {
7892
- value: __freeze$e(raw || cooked.slice())
7900
+ var __freeze$f = Object.freeze;
7901
+ var __defProp$f = Object.defineProperty;
7902
+ var __template$f = (cooked, raw) => __freeze$f(__defProp$f(cooked, "raw", {
7903
+ value: __freeze$f(raw || cooked.slice())
7893
7904
  }));
7894
- var _a$e;
7895
- const Root$a = styled(Layer)(_a$e || (_a$e = __template$e(["\n pointer-events: none;\n max-width: ", "px;\n"])), _ref27 => {
7905
+ var _a$f;
7906
+ const Root$a = styled(Layer)(_a$f || (_a$f = __template$f(["\n pointer-events: none;\n max-width: ", "px;\n"])), _ref28 => {
7896
7907
  let {
7897
7908
  $maxWidth
7898
- } = _ref27;
7909
+ } = _ref28;
7899
7910
  return $maxWidth;
7900
7911
  });
7901
7912
  const Tooltip = forwardRef(function Tooltip2(props, ref) {
@@ -7916,6 +7927,7 @@ const Tooltip = forwardRef(function Tooltip2(props, ref) {
7916
7927
  shadow = 2,
7917
7928
  zOffset = (_c = theme.sanity.layer) == null ? void 0 : _c.tooltip.zOffset,
7918
7929
  delay,
7930
+ animate = false,
7919
7931
  ...restProps
7920
7932
  } = props;
7921
7933
  const fallbackPlacements = useArrayProp(fallbackPlacementsProp);
@@ -8105,38 +8117,68 @@ const Tooltip = forwardRef(function Tooltip2(props, ref) {
8105
8117
  style: floatingStyles,
8106
8118
  zOffset,
8107
8119
  $maxWidth: tooltipWidth,
8108
- children: /* @__PURE__ */jsxs(Card, {
8109
- "data-ui": "Tooltip__card",
8110
- "data-placement": placement,
8111
- padding,
8112
- radius: 3,
8113
- scheme,
8114
- shadow,
8115
- children: [content, arrowProp && /* @__PURE__ */jsx(TooltipArrow, {
8116
- ref: setArrow,
8117
- style: arrowStyle
8118
- })]
8120
+ children: /* @__PURE__ */jsx(ConditionalWrapper, {
8121
+ condition: animate,
8122
+ wrapper: children => /* @__PURE__ */jsx(motion.div, {
8123
+ initial: {
8124
+ opacity: 0.5,
8125
+ scale: 0.95
8126
+ },
8127
+ animate: {
8128
+ opacity: 1,
8129
+ scale: 1
8130
+ },
8131
+ exit: {
8132
+ opacity: 0,
8133
+ scale: 0.95,
8134
+ transition: {
8135
+ duration: 0.4,
8136
+ type: "spring"
8137
+ }
8138
+ },
8139
+ children
8140
+ }),
8141
+ children: /* @__PURE__ */jsxs(Card, {
8142
+ "data-ui": "Tooltip__card",
8143
+ "data-placement": placement,
8144
+ padding,
8145
+ radius: 3,
8146
+ scheme,
8147
+ shadow,
8148
+ children: [content, arrowProp && /* @__PURE__ */jsx(TooltipArrow, {
8149
+ ref: setArrow,
8150
+ style: arrowStyle
8151
+ })]
8152
+ })
8119
8153
  })
8120
8154
  });
8121
8155
  return /* @__PURE__ */jsxs(Fragment, {
8122
- children: [child, showTooltip && /* @__PURE__ */jsx(Fragment, {
8123
- children: portalProp ? /* @__PURE__ */jsx(Portal, {
8124
- __unstable_name: typeof portalProp === "string" ? portalProp : void 0,
8156
+ children: [child, /* @__PURE__ */jsx(ConditionalWrapper, {
8157
+ condition: animate,
8158
+ wrapper: children => /* @__PURE__ */jsx(AnimatePresence, {
8159
+ children
8160
+ }),
8161
+ children: showTooltip && /* @__PURE__ */jsx(ConditionalWrapper, {
8162
+ condition: !!portalProp,
8163
+ wrapper: children => /* @__PURE__ */jsx(Portal, {
8164
+ __unstable_name: typeof portalProp === "string" ? portalProp : void 0,
8165
+ children
8166
+ }),
8125
8167
  children: root
8126
- }) : root
8168
+ })
8127
8169
  })]
8128
8170
  });
8129
8171
  });
8130
- var __freeze$d = Object.freeze;
8131
- var __defProp$d = Object.defineProperty;
8132
- var __template$d = (cooked, raw) => __freeze$d(__defProp$d(cooked, "raw", {
8133
- value: __freeze$d(raw || cooked.slice())
8172
+ var __freeze$e = Object.freeze;
8173
+ var __defProp$e = Object.defineProperty;
8174
+ var __template$e = (cooked, raw) => __freeze$e(__defProp$e(cooked, "raw", {
8175
+ value: __freeze$e(raw || cooked.slice())
8134
8176
  }));
8135
- var _a$d, _b$8, _c$3, _d$2;
8136
- const Root$9 = styled.div(_a$d || (_a$d = __template$d(["\n line-height: 0;\n"])));
8137
- const ListBox = styled(Box)(_b$8 || (_b$8 = __template$d(["\n & > ul {\n list-style: none;\n padding: 0;\n margin: 0;\n }\n"])));
8138
- const rotate = keyframes(_c$3 || (_c$3 = __template$d(["\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n"])));
8139
- const AnimatedSpinnerIcon = styled(SpinnerIcon)(_d$2 || (_d$2 = __template$d(["\n animation: ", " 500ms linear infinite;\n"])), rotate);
8177
+ var _a$e, _b$9, _c$3, _d$2;
8178
+ const Root$9 = styled.div(_a$e || (_a$e = __template$e(["\n line-height: 0;\n"])));
8179
+ const ListBox = styled(Box)(_b$9 || (_b$9 = __template$e(["\n & > ul {\n list-style: none;\n padding: 0;\n margin: 0;\n }\n"])));
8180
+ const rotate = keyframes(_c$3 || (_c$3 = __template$e(["\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n"])));
8181
+ const AnimatedSpinnerIcon = styled(SpinnerIcon)(_d$2 || (_d$2 = __template$e(["\n animation: ", " 500ms linear infinite;\n"])), rotate);
8140
8182
  function AutocompleteOption(props) {
8141
8183
  const {
8142
8184
  children,
@@ -8281,10 +8323,10 @@ const InnerAutocomplete = forwardRef(function InnerAutocomplete2(props, ref) {
8281
8323
  query,
8282
8324
  value
8283
8325
  } = state;
8284
- const defaultRenderOption = useCallback(_ref28 => {
8326
+ const defaultRenderOption = useCallback(_ref29 => {
8285
8327
  let {
8286
8328
  value: value2
8287
- } = _ref28;
8329
+ } = _ref29;
8288
8330
  return /* @__PURE__ */jsx(Card, {
8289
8331
  "data-as": "button",
8290
8332
  padding: paddingProp,
@@ -8660,14 +8702,14 @@ const InnerAutocomplete = forwardRef(function InnerAutocomplete2(props, ref) {
8660
8702
  });
8661
8703
  });
8662
8704
  const Autocomplete = InnerAutocomplete;
8663
- var __freeze$c = Object.freeze;
8664
- var __defProp$c = Object.defineProperty;
8665
- var __template$c = (cooked, raw) => __freeze$c(__defProp$c(cooked, "raw", {
8666
- value: __freeze$c(raw || cooked.slice())
8705
+ var __freeze$d = Object.freeze;
8706
+ var __defProp$d = Object.defineProperty;
8707
+ var __template$d = (cooked, raw) => __freeze$d(__defProp$d(cooked, "raw", {
8708
+ value: __freeze$d(raw || cooked.slice())
8667
8709
  }));
8668
- var _a$c, _b$7;
8669
- const Root$8 = styled.ol(_a$c || (_a$c = __template$c(["\n margin: 0;\n padding: 0;\n display: flex;\n list-style: none;\n align-items: center;\n white-space: nowrap;\n line-height: 0;\n"])));
8670
- const ExpandButton = styled(Button)(_b$7 || (_b$7 = __template$c(["\n appearance: none;\n margin: -4px;\n"])));
8710
+ var _a$d, _b$8;
8711
+ const Root$8 = styled.ol(_a$d || (_a$d = __template$d(["\n margin: 0;\n padding: 0;\n display: flex;\n list-style: none;\n align-items: center;\n white-space: nowrap;\n line-height: 0;\n"])));
8712
+ const ExpandButton = styled(Button)(_b$8 || (_b$8 = __template$d(["\n appearance: none;\n margin: -4px;\n"])));
8671
8713
  const Breadcrumbs = forwardRef(function Breadcrumbs2(props, ref) {
8672
8714
  const {
8673
8715
  children,
@@ -8738,10 +8780,16 @@ const Breadcrumbs = forwardRef(function Breadcrumbs2(props, ref) {
8738
8780
  });
8739
8781
  });
8740
8782
  const BORDER_OFFSET_X = 12;
8741
- function dialogStyle(_ref29) {
8783
+ var __freeze$c = Object.freeze;
8784
+ var __defProp$c = Object.defineProperty;
8785
+ var __template$c = (cooked, raw) => __freeze$c(__defProp$c(cooked, "raw", {
8786
+ value: __freeze$c(raw || cooked.slice())
8787
+ }));
8788
+ var _a$c, _b$7;
8789
+ function dialogStyle(_ref30) {
8742
8790
  let {
8743
8791
  theme
8744
- } = _ref29;
8792
+ } = _ref30;
8745
8793
  const color = theme.sanity.color.base;
8746
8794
  return {
8747
8795
  "&:not([hidden])": {
@@ -8770,6 +8818,10 @@ function responsiveDialogPositionStyle(props) {
8770
8818
  }
8771
8819
  }));
8772
8820
  }
8821
+ function animationDialogStyle(props) {
8822
+ if (!props.animate) return css(_a$c || (_a$c = __template$c([""])));
8823
+ return css(_b$7 || (_b$7 = __template$c(["\n @keyframes zoomIn {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n }\n @keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n animation: fadeIn 200ms ease-out;\n // Animates the dialog card.\n & > [data-ui='DialogCard'] {\n animation: zoomIn 200ms ease-out;\n }\n "])));
8824
+ }
8773
8825
  const key$3 = Symbol.for("@sanity/ui/context/dialog");
8774
8826
  globalScope[key$3] = globalScope[key$3] || createContext({
8775
8827
  version: 0
@@ -8788,7 +8840,7 @@ function isTargetWithinScope(boundaryElement, portalElement, target) {
8788
8840
  if (!boundaryElement || !portalElement) return true;
8789
8841
  return containsOrEqualsElement(boundaryElement, target) || containsOrEqualsElement(portalElement, target);
8790
8842
  }
8791
- const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDialogPositionStyle);
8843
+ const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDialogPositionStyle, animationDialogStyle);
8792
8844
  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"])));
8793
8845
  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"])));
8794
8846
  const DialogLayout = styled(Flex)(_c$2 || (_c$2 = __template$b(["\n flex: 1;\n min-height: 0;\n width: 100%;\n"])));
@@ -8957,6 +9009,7 @@ const Dialog = forwardRef(function Dialog2(props, ref) {
8957
9009
  scheme,
8958
9010
  width: widthProp = 0,
8959
9011
  zOffset: zOffsetProp = dialog.zOffset || ((_a2 = theme.sanity.layer) == null ? void 0 : _a2.dialog.zOffset),
9012
+ animate = false,
8960
9013
  ...restProps
8961
9014
  } = props;
8962
9015
  const portal = usePortal();
@@ -9022,6 +9075,7 @@ const Dialog = forwardRef(function Dialog2(props, ref) {
9022
9075
  ref,
9023
9076
  role: "dialog",
9024
9077
  zOffset,
9078
+ animate,
9025
9079
  children: [/* @__PURE__ */jsx("div", {
9026
9080
  ref: preDivRef,
9027
9081
  tabIndex: 0
@@ -9828,15 +9882,15 @@ var __template$6 = (cooked, raw) => __freeze$6(__defProp$6(cooked, "raw", {
9828
9882
  var _a$6, _b$3, _c$1, _d;
9829
9883
  const keyframe = keyframes(_a$6 || (_a$6 = __template$6(["\n 0% {\n background-position: 100%;\n }\n 100% {\n background-position: -100%;\n }\n"])));
9830
9884
  const animation = 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);
9831
- const skeletonStyle = 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"])), _ref30 => {
9885
+ const skeletonStyle = 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"])), _ref31 => {
9832
9886
  let {
9833
9887
  $visible
9834
- } = _ref30;
9888
+ } = _ref31;
9835
9889
  return $visible ? 1 : 0;
9836
- }, _ref31 => {
9890
+ }, _ref32 => {
9837
9891
  let {
9838
9892
  $animated
9839
- } = _ref31;
9893
+ } = _ref32;
9840
9894
  return $animated ? animation : css(_c$1 || (_c$1 = __template$6(["\n background-color: var(--card-skeleton-color-from);\n "])));
9841
9895
  });
9842
9896
  const Root$4 = styled(Box)(responsiveRadiusStyle, skeletonStyle);
@@ -9867,12 +9921,12 @@ const Skeleton = forwardRef(function Skeleton2(props, ref) {
9867
9921
  ref
9868
9922
  });
9869
9923
  });
9870
- const Root$3 = styled(Skeleton)(_ref32 => {
9924
+ const Root$3 = styled(Skeleton)(_ref33 => {
9871
9925
  let {
9872
9926
  $size,
9873
9927
  $style,
9874
9928
  theme
9875
- } = _ref32;
9929
+ } = _ref33;
9876
9930
  const {
9877
9931
  media
9878
9932
  } = theme.sanity;
@@ -10222,12 +10276,12 @@ function ToastProvider(props) {
10222
10276
  paddingY,
10223
10277
  children: /* @__PURE__ */jsx(AnimatePresence, {
10224
10278
  initial: false,
10225
- children: state.map(_ref33 => {
10279
+ children: state.map(_ref34 => {
10226
10280
  let {
10227
10281
  dismiss,
10228
10282
  id,
10229
10283
  params
10230
- } = _ref33;
10284
+ } = _ref34;
10231
10285
  return /* @__PURE__ */jsx(motion.div, {
10232
10286
  animate: {
10233
10287
  opacity: 1,