@sanity/ui 2.0.0-alpha.15 → 2.0.0-alpha.17

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.
Files changed (40) hide show
  1. package/dist/index.d.ts +79 -1
  2. package/dist/index.esm.js +15 -14
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +15 -14
  5. package/dist/index.js.map +1 -1
  6. package/package.json +2 -2
  7. package/src/components/autocomplete/autocomplete.tsx +6 -0
  8. package/src/components/dialog/dialog.tsx +12 -12
  9. package/src/components/hotkeys/hotkeys.tsx +2 -0
  10. package/src/components/menu/menu.tsx +2 -0
  11. package/src/components/menu/menuButton.tsx +2 -0
  12. package/src/components/toast/toast.tsx +4 -0
  13. package/src/primitives/_selectable/style.ts +2 -0
  14. package/src/primitives/avatar/avatar.tsx +2 -0
  15. package/src/primitives/badge/badge.tsx +2 -0
  16. package/src/primitives/box/box.tsx +3 -0
  17. package/src/primitives/button/styles.ts +1 -0
  18. package/src/primitives/card/card.tsx +3 -0
  19. package/src/primitives/card/styles.ts +2 -0
  20. package/src/primitives/checkbox/checkbox.tsx +2 -0
  21. package/src/primitives/code/code.tsx +1 -0
  22. package/src/primitives/container/container.tsx +2 -0
  23. package/src/primitives/flex/flex.tsx +2 -0
  24. package/src/primitives/grid/grid.tsx +2 -0
  25. package/src/primitives/heading/heading.tsx +2 -0
  26. package/src/primitives/inline/inline.tsx +3 -0
  27. package/src/primitives/kbd/kbd.tsx +2 -0
  28. package/src/primitives/label/label.tsx +2 -0
  29. package/src/primitives/popover/popover.tsx +6 -1
  30. package/src/primitives/radio/radio.tsx +2 -0
  31. package/src/primitives/select/select.tsx +2 -0
  32. package/src/primitives/select/styles.ts +2 -0
  33. package/src/primitives/spinner/spinner.tsx +2 -0
  34. package/src/primitives/stack/stack.tsx +2 -0
  35. package/src/primitives/switch/switch.tsx +4 -0
  36. package/src/primitives/text/text.tsx +3 -0
  37. package/src/primitives/textArea/textArea.tsx +3 -0
  38. package/src/primitives/textInput/textInput.tsx +2 -0
  39. package/src/primitives/tooltip/tooltip.tsx +3 -0
  40. package/src/primitives/types.ts +4 -0
package/dist/index.js CHANGED
@@ -5452,7 +5452,7 @@ function buttonBaseStyles(_ref24) {
5452
5452
  let {
5453
5453
  $width
5454
5454
  } = _ref24;
5455
- return styled.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" && styled.css(_a$x || (_a$x = __template$x(["\n width: -webkit-fill-available;\n width: stretch;\n "]))));
5455
+ return styled.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" && styled.css(_a$x || (_a$x = __template$x(["\n width: -moz-available;\n width: -webkit-fill-available;\n width: stretch;\n "]))));
5456
5456
  }
5457
5457
  const buttonTheme = {
5458
5458
  border: {
@@ -5630,7 +5630,7 @@ function cardBaseStyle(props) {
5630
5630
  theme
5631
5631
  } = props;
5632
5632
  const space = theme.sanity.space;
5633
- return styled.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: 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 && styled.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]));
5633
+ return styled.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 && styled.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]));
5634
5634
  }
5635
5635
  function cardColorStyle(props) {
5636
5636
  var _a2, _b2;
@@ -7328,7 +7328,7 @@ var __template$j = (cooked, raw) => __freeze$j(__defProp$j(cooked, "raw", {
7328
7328
  }));
7329
7329
  var _a$j, _b$c, _c$7, _d$5;
7330
7330
  function rootStyle() {
7331
- return styled.css(_a$j || (_a$j = __template$j(["\n position: relative;\n width: stretch;\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
7331
+ return styled.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 "])));
7332
7332
  }
7333
7333
  function inputBaseStyle(props) {
7334
7334
  const {
@@ -8860,26 +8860,27 @@ const DialogCard = react.forwardRef(function DialogCard2(props, ref) {
8860
8860
  children: [showHeader && /* @__PURE__ */jsxRuntime.jsx(DialogHeader, {
8861
8861
  $isContentScrollable: isContentScrollable,
8862
8862
  $hasScrolledFromTop: hasScrolledFromTop,
8863
- paddingLeft: 4,
8864
- paddingRight: 3,
8865
- paddingY: 3,
8866
8863
  children: /* @__PURE__ */jsxRuntime.jsxs(Flex, {
8867
8864
  align: "center",
8868
8865
  children: [/* @__PURE__ */jsxRuntime.jsx(Box, {
8869
8866
  flex: 1,
8867
+ margin: 1,
8868
+ padding: 4,
8870
8869
  children: header && /* @__PURE__ */jsxRuntime.jsx(Text, {
8871
8870
  id: labelId,
8872
8871
  size: 1,
8873
8872
  weight: "medium",
8874
8873
  children: header
8875
8874
  })
8876
- }), showCloseButton && /* @__PURE__ */jsxRuntime.jsx(Button, {
8877
- "aria-label": "Close dialog",
8878
- disabled: !onClose,
8879
- icon: icons.CloseIcon,
8880
- mode: "bleed",
8881
- onClick: onClose,
8882
- padding: 3
8875
+ }), showCloseButton && /* @__PURE__ */jsxRuntime.jsx(Box, {
8876
+ padding: 3,
8877
+ children: /* @__PURE__ */jsxRuntime.jsx(Button, {
8878
+ "aria-label": "Close dialog",
8879
+ disabled: !onClose,
8880
+ icon: icons.CloseIcon,
8881
+ mode: "bleed",
8882
+ onClick: onClose
8883
+ })
8883
8884
  })]
8884
8885
  })
8885
8886
  }), /* @__PURE__ */jsxRuntime.jsx(DialogContent, {
@@ -9509,7 +9510,7 @@ var __template$7 = (cooked, raw) => __freeze$7(__defProp$7(cooked, "raw", {
9509
9510
  }));
9510
9511
  var _a$7, _b$4;
9511
9512
  function selectableBaseStyle() {
9512
- return styled.css(_a$7 || (_a$7 = __template$7(["\n background-color: inherit;\n color: inherit;\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: stretch;\n }\n\n /* &:is(a) */\n &[data-as='a'] {\n text-decoration: none;\n }\n "])));
9513
+ return styled.css(_a$7 || (_a$7 = __template$7(["\n background-color: inherit;\n color: inherit;\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 text-decoration: none;\n }\n "])));
9513
9514
  }
9514
9515
  function selectableColorStyle(props) {
9515
9516
  var _a2, _b2;