@sanity/ui 2.0.0-alpha.21 → 2.0.0-alpha.22
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.d.ts +2 -0
- package/dist/index.esm.js +18 -11
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +18 -11
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/autocomplete/autocomplete.tsx +1 -1
- package/src/components/toast/toast.tsx +8 -3
- package/src/primitives/badge/styles.ts +3 -1
- package/src/primitives/tooltip/constants.ts +1 -0
- package/src/primitives/tooltip/tooltip.tsx +13 -5
package/dist/index.d.ts
CHANGED
|
@@ -3426,6 +3426,7 @@ export declare interface ToastProps {
|
|
|
3426
3426
|
closable?: boolean
|
|
3427
3427
|
description?: React.ReactNode
|
|
3428
3428
|
onClose?: () => void
|
|
3429
|
+
radius?: number | number[]
|
|
3429
3430
|
title?: React.ReactNode
|
|
3430
3431
|
status?: 'error' | 'warning' | 'success' | 'info'
|
|
3431
3432
|
}
|
|
@@ -3541,6 +3542,7 @@ export declare interface TooltipDelayGroupProviderProps {
|
|
|
3541
3542
|
export declare interface TooltipProps extends Omit<LayerProps, 'as'> {
|
|
3542
3543
|
/** @deprecated Use `fallbackPlacements` instead. */
|
|
3543
3544
|
allowedAutoPlacements?: Placement[]
|
|
3545
|
+
arrow?: boolean
|
|
3544
3546
|
boundaryElement?: HTMLElement | null
|
|
3545
3547
|
children?: React.ReactElement
|
|
3546
3548
|
content?: React.ReactNode
|
package/dist/index.esm.js
CHANGED
|
@@ -5320,7 +5320,8 @@ function badgeStyle(props) {
|
|
|
5320
5320
|
const palette = theme.sanity.color[$mode === "outline" ? "muted" : "solid"];
|
|
5321
5321
|
const color = palette[$tone] || palette.default;
|
|
5322
5322
|
return {
|
|
5323
|
-
|
|
5323
|
+
"--card-fg-color": color.enabled.fg,
|
|
5324
|
+
backgroundColor: color.enabled.bg2,
|
|
5324
5325
|
color: color.enabled.fg,
|
|
5325
5326
|
boxShadow: "inset 0 0 0 1px ".concat(color.enabled.border),
|
|
5326
5327
|
cursor: "default",
|
|
@@ -7803,6 +7804,7 @@ function useDelayedState(initialState) {
|
|
|
7803
7804
|
}, []);
|
|
7804
7805
|
return [state, onStateChange];
|
|
7805
7806
|
}
|
|
7807
|
+
const DEFAULT_TOOLTIP_DISTANCE = 4;
|
|
7806
7808
|
const DEFAULT_TOOLTIP_PADDING = 4;
|
|
7807
7809
|
const DEFAULT_FALLBACK_PLACEMENTS = {
|
|
7808
7810
|
top: ["bottom", "left", "right"],
|
|
@@ -7898,6 +7900,7 @@ const Tooltip = forwardRef(function Tooltip2(props, ref) {
|
|
|
7898
7900
|
const boundaryElementContext = useBoundaryElement();
|
|
7899
7901
|
const theme = useTheme();
|
|
7900
7902
|
const {
|
|
7903
|
+
arrow: arrowProp = true,
|
|
7901
7904
|
boundaryElement = boundaryElementContext == null ? void 0 : boundaryElementContext.element,
|
|
7902
7905
|
children: childProp,
|
|
7903
7906
|
content,
|
|
@@ -7932,19 +7935,21 @@ const Tooltip = forwardRef(function Tooltip2(props, ref) {
|
|
|
7932
7935
|
rootBoundary
|
|
7933
7936
|
}));
|
|
7934
7937
|
ret.push(offset({
|
|
7935
|
-
mainAxis:
|
|
7938
|
+
mainAxis: DEFAULT_TOOLTIP_DISTANCE
|
|
7936
7939
|
}));
|
|
7937
7940
|
ret.push(shift({
|
|
7938
7941
|
boundary: boundaryElement || void 0,
|
|
7939
7942
|
rootBoundary,
|
|
7940
7943
|
padding: DEFAULT_TOOLTIP_PADDING
|
|
7941
7944
|
}));
|
|
7942
|
-
|
|
7943
|
-
|
|
7944
|
-
|
|
7945
|
-
|
|
7945
|
+
if (arrowProp) {
|
|
7946
|
+
ret.push(arrow({
|
|
7947
|
+
element: arrowRef,
|
|
7948
|
+
padding: 2
|
|
7949
|
+
}));
|
|
7950
|
+
}
|
|
7946
7951
|
return ret;
|
|
7947
|
-
}, [boundaryElement, fallbackPlacements]);
|
|
7952
|
+
}, [arrowProp, boundaryElement, fallbackPlacements]);
|
|
7948
7953
|
const {
|
|
7949
7954
|
floatingStyles,
|
|
7950
7955
|
placement,
|
|
@@ -8104,7 +8109,7 @@ const Tooltip = forwardRef(function Tooltip2(props, ref) {
|
|
|
8104
8109
|
radius: 3,
|
|
8105
8110
|
scheme,
|
|
8106
8111
|
shadow,
|
|
8107
|
-
children: [content, /* @__PURE__ */jsx(TooltipArrow, {
|
|
8112
|
+
children: [content, arrowProp && /* @__PURE__ */jsx(TooltipArrow, {
|
|
8108
8113
|
ref: setArrow,
|
|
8109
8114
|
style: arrowStyle
|
|
8110
8115
|
})]
|
|
@@ -8249,7 +8254,7 @@ const InnerAutocomplete = forwardRef(function InnerAutocomplete2(props, ref) {
|
|
|
8249
8254
|
padding: paddingProp = 3,
|
|
8250
8255
|
popover = EMPTY_RECORD,
|
|
8251
8256
|
prefix,
|
|
8252
|
-
radius =
|
|
8257
|
+
radius = 2,
|
|
8253
8258
|
readOnly,
|
|
8254
8259
|
relatedElements,
|
|
8255
8260
|
renderOption: renderOptionProp,
|
|
@@ -10074,6 +10079,7 @@ function Toast(props) {
|
|
|
10074
10079
|
closable,
|
|
10075
10080
|
description,
|
|
10076
10081
|
onClose,
|
|
10082
|
+
radius = 3,
|
|
10077
10083
|
title,
|
|
10078
10084
|
status,
|
|
10079
10085
|
...restProps
|
|
@@ -10085,7 +10091,7 @@ function Toast(props) {
|
|
|
10085
10091
|
role,
|
|
10086
10092
|
...restProps,
|
|
10087
10093
|
marginTop: 3,
|
|
10088
|
-
radius
|
|
10094
|
+
radius,
|
|
10089
10095
|
shadow: 2,
|
|
10090
10096
|
tone: cardTone,
|
|
10091
10097
|
children: /* @__PURE__ */jsxs(Flex, {
|
|
@@ -10096,7 +10102,8 @@ function Toast(props) {
|
|
|
10096
10102
|
children: /* @__PURE__ */jsxs(Stack, {
|
|
10097
10103
|
space: 3,
|
|
10098
10104
|
children: [title && /* @__PURE__ */jsx(Text, {
|
|
10099
|
-
|
|
10105
|
+
size: 1,
|
|
10106
|
+
weight: "medium",
|
|
10100
10107
|
children: title
|
|
10101
10108
|
}), description && /* @__PURE__ */jsx(Text, {
|
|
10102
10109
|
muted: true,
|