@sanity/ui 4.2.0 → 5.0.0-alpha.10
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/README.md +194 -28
- package/bin/sanity-ui.js +14 -0
- package/dist/_chunks-es/LazyRefractor.js +20 -0
- package/dist/_chunks-es/LazyRefractor.js.map +1 -0
- package/dist/cli/checks.js +148 -0
- package/dist/cli/config.js +23 -0
- package/dist/cli/detect.js +181 -0
- package/dist/cli/doctor.js +49 -0
- package/dist/cli/index.js +69 -0
- package/dist/cli/init.js +189 -0
- package/dist/cli/install.js +79 -0
- package/dist/cli/log.js +66 -0
- package/dist/cli/selfPackage.js +11 -0
- package/dist/cli/styles.js +185 -0
- package/dist/cli/test-utils.js +8 -0
- package/dist/cli/tsconfig.js +236 -0
- package/dist/cli/types.js +1 -0
- package/dist/cli/versions.js +45 -0
- package/dist/index.d.ts +1203 -1469
- package/dist/index.js +2123 -1989
- package/dist/index.js.map +1 -1
- package/dist/polyfills.d.ts +1 -0
- package/dist/polyfills.js +5 -0
- package/dist/polyfills.js.map +1 -0
- package/dist/styles.css +1 -547
- package/package.json +57 -58
- package/src/cli/checks.test.ts +38 -0
- package/src/cli/checks.ts +200 -0
- package/src/cli/config.ts +44 -0
- package/src/cli/detect.test.ts +191 -0
- package/src/cli/detect.ts +205 -0
- package/src/cli/doctor.test.ts +52 -0
- package/src/cli/doctor.ts +65 -0
- package/src/cli/index.ts +77 -0
- package/src/cli/init.ts +225 -0
- package/src/cli/install.test.ts +52 -0
- package/src/cli/install.ts +108 -0
- package/src/cli/log.ts +79 -0
- package/src/cli/selfPackage.ts +14 -0
- package/src/cli/styles.test.ts +130 -0
- package/src/cli/styles.ts +205 -0
- package/src/cli/test-utils.ts +10 -0
- package/src/cli/tsconfig.test.ts +174 -0
- package/src/cli/tsconfig.ts +282 -0
- package/src/cli/types.ts +77 -0
- package/src/cli/versions.test.ts +35 -0
- package/src/cli/versions.ts +41 -0
- package/src/components/badge/Badge.tsx +53 -0
- package/src/components/badge/badge.css +6 -0
- package/src/components/badge/badge.props.ts +31 -0
- package/src/components/box/Box.tsx +30 -0
- package/src/components/box/box.css +4 -0
- package/src/components/box/box.props.ts +29 -0
- package/src/components/button/Button.tsx +78 -0
- package/src/components/button/button.css +72 -0
- package/src/components/button/button.props.ts +122 -0
- package/src/components/card/Card.tsx +31 -0
- package/src/components/card/card.css +4 -0
- package/src/components/card/card.props.ts +58 -0
- package/src/components/checkbox/Checkbox.tsx +64 -0
- package/src/components/checkbox/checkbox.css +100 -0
- package/src/components/checkbox/checkbox.props.ts +33 -0
- package/src/components/code/Code.tsx +38 -0
- package/src/components/code/LazyRefractor.tsx +9 -0
- package/src/components/code/code.css +40 -0
- package/src/components/code/code.props.ts +44 -0
- package/src/components/container/Container.tsx +30 -0
- package/src/components/container/container.css +4 -0
- package/src/components/container/container.props.ts +28 -0
- package/src/components/dialog/Dialog.tsx +139 -0
- package/src/components/dialog/dialog.css +49 -0
- package/src/components/dialog/dialog.props.ts +45 -0
- package/src/components/divider/Divider.tsx +23 -0
- package/src/components/divider/divider.props.ts +9 -0
- package/src/components/eyebrow/Eyebrow.tsx +54 -0
- package/src/components/eyebrow/eyebrow.css +11 -0
- package/src/components/eyebrow/eyebrow.props.ts +28 -0
- package/src/components/flex/Flex.tsx +30 -0
- package/src/components/flex/flex.css +4 -0
- package/src/components/flex/flex.props.ts +33 -0
- package/src/components/grid/Grid.tsx +30 -0
- package/src/components/grid/grid.css +4 -0
- package/src/components/grid/grid.props.ts +33 -0
- package/src/components/h-stack/HStack.tsx +34 -0
- package/src/components/h-stack/hStack.props.ts +17 -0
- package/src/components/heading/Heading.tsx +54 -0
- package/src/components/heading/heading.css +9 -0
- package/src/components/heading/heading.props.ts +31 -0
- package/src/components/icon/Icon.tsx +24 -0
- package/src/components/icon/icon.css +17 -0
- package/src/components/icon/icon.props.ts +35 -0
- package/src/components/icon-button/IconButton.tsx +32 -0
- package/src/components/icon-button/iconButton.props.ts +31 -0
- package/src/components/index.css +28 -0
- package/src/components/indicator/Indicator.tsx +42 -0
- package/src/components/indicator/indicator.css +4 -0
- package/src/components/indicator/indicator.props.ts +24 -0
- package/src/components/indicator-stack/IndicatorStack.tsx +31 -0
- package/src/components/indicator-stack/indicator-stack.css +7 -0
- package/src/components/indicator-stack/indicatorStack.props.ts +15 -0
- package/src/components/inline/Inline.tsx +38 -0
- package/src/components/inline/inline.css +4 -0
- package/src/components/inline/inline.props.ts +100 -0
- package/src/components/label/Label.tsx +34 -0
- package/src/components/label/label.css +3 -0
- package/src/components/label/label.props.ts +25 -0
- package/src/components/link/Link.tsx +29 -0
- package/src/components/link/link.css +12 -0
- package/src/components/link/link.props.ts +23 -0
- package/src/components/list/List.tsx +167 -0
- package/src/components/list/list.css +25 -0
- package/src/components/list/list.props.ts +130 -0
- package/src/components/popover/Popover.tsx +85 -0
- package/src/components/popover/popover.css +21 -0
- package/src/components/popover/popover.props.ts +38 -0
- package/src/components/press-area/PressArea.tsx +29 -0
- package/src/components/press-area/press-area.css +22 -0
- package/src/components/press-area/pressArea.props.ts +16 -0
- package/src/components/radio/Radio.tsx +48 -0
- package/src/components/radio/radio.css +97 -0
- package/src/components/radio/radio.props.ts +25 -0
- package/src/components/skip-to-content/SkipToContent.tsx +35 -0
- package/src/components/skip-to-content/skip-to-content.css +9 -0
- package/src/components/skip-to-content/skipToContent.props.ts +25 -0
- package/src/components/spinner/Spinner.tsx +28 -0
- package/src/components/spinner/spinner.css +10 -0
- package/src/components/spinner/spinner.props.ts +19 -0
- package/src/components/switch/Switch.tsx +48 -0
- package/src/components/switch/switch.css +119 -0
- package/src/components/switch/switch.props.ts +25 -0
- package/src/components/text/Text.tsx +53 -0
- package/src/components/text/text.css +9 -0
- package/src/components/text/text.props.ts +28 -0
- package/src/components/tooltip/Tooltip.tsx +97 -0
- package/src/components/tooltip/tooltip.css +31 -0
- package/src/components/tooltip/tooltip.props.ts +36 -0
- package/src/components/tooltip-group/TooltipGroup.tsx +64 -0
- package/src/components/tooltip-group/tooltipGroup.props.ts +15 -0
- package/src/components/v-stack/VStack.tsx +32 -0
- package/src/components/v-stack/vStack.props.ts +17 -0
- package/src/components/visually-hidden/VisuallyHidden.tsx +29 -0
- package/src/components/visually-hidden/visually-hidden.css +9 -0
- package/src/components/visually-hidden/visuallyHidden.props.ts +23 -0
- package/src/css/classes/dynamic/flex-child.css +5 -0
- package/src/css/classes/dynamic/grid-child.css +8 -0
- package/src/css/classes/dynamic/grid-parent.css +6 -0
- package/src/css/classes/dynamic/height.css +5 -0
- package/src/css/classes/dynamic/index.css +7 -0
- package/src/css/classes/dynamic/line-clamp.css +5 -0
- package/src/css/classes/dynamic/readme.md +3 -0
- package/src/css/classes/dynamic/width.css +7 -0
- package/src/css/classes/dynamic/z-index.css +3 -0
- package/src/css/classes/generic/display.css +10 -0
- package/src/css/classes/generic/flex.css +24 -0
- package/src/css/classes/generic/grid.css +7 -0
- package/src/css/classes/generic/index.css +7 -0
- package/src/css/classes/generic/overflow.css +19 -0
- package/src/css/classes/generic/placement.css +202 -0
- package/src/css/classes/generic/position.css +7 -0
- package/src/css/classes/generic/readme.md +3 -0
- package/src/css/classes/generic/text-align.css +5 -0
- package/src/css/classes/index.css +4 -0
- package/src/css/classes/local/animation.css +4 -0
- package/src/css/classes/local/border.css +20 -0
- package/src/css/classes/local/index.css +6 -0
- package/src/css/classes/local/readme.md +3 -0
- package/src/css/classes/local/text-overflow.css +5 -0
- package/src/css/classes/local/text-trim.css +45 -0
- package/src/css/classes/local/tone.css +75 -0
- package/src/css/classes/local/top-anchor.css +4 -0
- package/src/css/classes/system/color.css +223 -0
- package/src/css/classes/system/container.css +8 -0
- package/src/css/classes/system/font-family.css +2 -0
- package/src/css/classes/system/font-weight.css +4 -0
- package/src/css/classes/system/gap.css +37 -0
- package/src/css/classes/system/index.css +10 -0
- package/src/css/classes/system/inset.css +56 -0
- package/src/css/classes/system/margin.css +148 -0
- package/src/css/classes/system/padding.css +78 -0
- package/src/css/classes/system/radius.css +10 -0
- package/src/css/classes/system/readme.md +3 -0
- package/src/css/classes/system/shadow.css +6 -0
- package/src/css/classes/system/typography.css +31 -0
- package/src/css/global/font-face.css +20 -0
- package/src/css/global/index.css +2 -0
- package/src/css/global/reset.css +76 -0
- package/src/css/tokens/index.css +3 -0
- package/src/css/tokens/opacity.css +6 -0
- package/src/css/tokens/semantic.css +25 -0
- package/src/css/tokens/surface.css +27 -0
- package/src/hooks/useIsClient.ts +10 -0
- package/src/index.css +18 -0
- package/src/index.ts +65 -0
- package/src/polyfills.ts +15 -0
- package/src/props/border.ts +51 -0
- package/src/props/flexChild.ts +29 -0
- package/src/props/flexParent.ts +47 -0
- package/src/props/gap.ts +31 -0
- package/src/props/gridChild.ts +50 -0
- package/src/props/gridParent.ts +45 -0
- package/src/props/height.ts +29 -0
- package/src/props/layout.ts +44 -0
- package/src/props/margin.ts +59 -0
- package/src/props/overflow.ts +30 -0
- package/src/props/padding.ts +59 -0
- package/src/props/placement.ts +16 -0
- package/src/props/position.ts +52 -0
- package/src/props/shadow.ts +15 -0
- package/src/props/tone.ts +15 -0
- package/src/props/typography.ts +62 -0
- package/src/props/width.ts +29 -0
- package/src/props/zIndex.ts +15 -0
- package/src/styles.css.d.ts +1 -0
- package/src/styles.css.node.js +2 -0
- package/src/styles.css.test.ts +24 -0
- package/src/types/Button.ts +8 -0
- package/src/types/Code.ts +6 -0
- package/src/types/Container.ts +3 -0
- package/src/types/Density.ts +3 -0
- package/src/types/Display.ts +11 -0
- package/src/types/Eyebrow.ts +3 -0
- package/src/types/Flex.ts +22 -0
- package/src/types/FontWeight.ts +3 -0
- package/src/types/Grid.ts +3 -0
- package/src/types/Heading.ts +6 -0
- package/src/types/Icon.ts +3 -0
- package/src/types/Interactive.ts +8 -0
- package/src/types/List.ts +2 -0
- package/src/types/Overflow.ts +3 -0
- package/src/types/Placement.ts +16 -0
- package/src/types/Position.ts +3 -0
- package/src/types/PropDef.ts +73 -0
- package/src/types/Radius.ts +3 -0
- package/src/types/Responsive.ts +10 -0
- package/src/types/Shadow.ts +3 -0
- package/src/types/Space.ts +15 -0
- package/src/types/Text.ts +3 -0
- package/src/types/TextAlign.ts +3 -0
- package/src/types/Tone.ts +3 -0
- package/src/utils/getProps.test.ts +156 -0
- package/src/utils/getProps.ts +156 -0
- package/src/utils/mergeTriggerProps.ts +66 -0
- package/src/utils/renderPortal.tsx +14 -0
- package/src/utils/suffixClassName.ts +5 -0
- package/src/version.ts +3 -0
- package/LICENSE +0 -21
- package/dist/_system-CTe2lb5l.d.ts +0 -40
- package/dist/_system-CTe2lb5l.d.ts.map +0 -1
- package/dist/arrow-BmX6qbAS.js +0 -170
- package/dist/arrow-BmX6qbAS.js.map +0 -1
- package/dist/autocomplete.d.ts +0 -140
- package/dist/autocomplete.d.ts.map +0 -1
- package/dist/autocomplete.js +0 -470
- package/dist/autocomplete.js.map +0 -1
- package/dist/breadcrumbs.d.ts +0 -18
- package/dist/breadcrumbs.d.ts.map +0 -1
- package/dist/breadcrumbs.js +0 -119
- package/dist/breadcrumbs.js.map +0 -1
- package/dist/button-BNyKSDyA.js +0 -180
- package/dist/button-BNyKSDyA.js.map +0 -1
- package/dist/button-dnqMFkWg.d.ts +0 -76
- package/dist/button-dnqMFkWg.d.ts.map +0 -1
- package/dist/card-C0a0wQTc.d.ts +0 -7
- package/dist/card-C0a0wQTc.d.ts.map +0 -1
- package/dist/code.d.ts +0 -20
- package/dist/code.d.ts.map +0 -1
- package/dist/code.js +0 -90
- package/dist/code.js.map +0 -1
- package/dist/codeFontStyle-84SMhFtI.js +0 -11
- package/dist/codeFontStyle-84SMhFtI.js.map +0 -1
- package/dist/component-DVlwaWB-.d.ts +0 -25
- package/dist/component-DVlwaWB-.d.ts.map +0 -1
- package/dist/element-BYgCE_iK.js +0 -51
- package/dist/element-BYgCE_iK.js.map +0 -1
- package/dist/factory-BzXTX8_Q.js +0 -3056
- package/dist/factory-BzXTX8_Q.js.map +0 -1
- package/dist/flex-DmbDG2ks.js +0 -76
- package/dist/flex-DmbDG2ks.js.map +0 -1
- package/dist/font-EtfxKPUz.d.ts +0 -49
- package/dist/font-EtfxKPUz.d.ts.map +0 -1
- package/dist/getElementRef-Jw7gY0eV.js +0 -102
- package/dist/getElementRef-Jw7gY0eV.js.map +0 -1
- package/dist/getScopedTheme-C-sZsyAz.js +0 -267
- package/dist/getScopedTheme-C-sZsyAz.js.map +0 -1
- package/dist/getTheme_v2-y09KqtEb.js +0 -487
- package/dist/getTheme_v2-y09KqtEb.js.map +0 -1
- package/dist/grid-6JSgMj1O.js +0 -115
- package/dist/grid-6JSgMj1O.js.map +0 -1
- package/dist/helpers-C8xxXAQC.js +0 -63
- package/dist/helpers-C8xxXAQC.js.map +0 -1
- package/dist/hotkeys-CaHsQlsO.js +0 -168
- package/dist/hotkeys-CaHsQlsO.js.map +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/layer-Bl5R3uNR.js +0 -61
- package/dist/layer-Bl5R3uNR.js.map +0 -1
- package/dist/layer-ChlP9Ik6.d.ts +0 -242
- package/dist/layer-ChlP9Ik6.d.ts.map +0 -1
- package/dist/menu.d.ts +0 -146
- package/dist/menu.d.ts.map +0 -1
- package/dist/menu.js +0 -626
- package/dist/menu.js.map +0 -1
- package/dist/popover-B7-28L8y.js +0 -408
- package/dist/popover-B7-28L8y.js.map +0 -1
- package/dist/popover-CMlQeKn0.d.ts +0 -96
- package/dist/popover-CMlQeKn0.d.ts.map +0 -1
- package/dist/popover.d.ts +0 -2
- package/dist/popover.js +0 -3
- package/dist/refractor-CC48DwHi.js +0 -20
- package/dist/refractor-CC48DwHi.js.map +0 -1
- package/dist/responsiveFont-CilwaORG.js +0 -55
- package/dist/responsiveFont-CilwaORG.js.map +0 -1
- package/dist/rgba-BSYaEUW6.d.ts +0 -846
- package/dist/rgba-BSYaEUW6.d.ts.map +0 -1
- package/dist/selectable-B0GUIL74.d.ts +0 -7
- package/dist/selectable-B0GUIL74.d.ts.map +0 -1
- package/dist/stack-rsNFPq2-.js +0 -112
- package/dist/stack-rsNFPq2-.js.map +0 -1
- package/dist/styles-css.d.ts +0 -2
- package/dist/styles-css.js +0 -4
- package/dist/textInput-pSfQjkmx.js +0 -313
- package/dist/textInput-pSfQjkmx.js.map +0 -1
- package/dist/theme.d.ts +0 -280
- package/dist/theme.d.ts.map +0 -1
- package/dist/theme.js +0 -55
- package/dist/theme.js.map +0 -1
- package/dist/toast.d.ts +0 -73
- package/dist/toast.d.ts.map +0 -1
- package/dist/toast.js +0 -302
- package/dist/toast.js.map +0 -1
- package/dist/tooltip.d.ts +0 -88
- package/dist/tooltip.d.ts.map +0 -1
- package/dist/tooltip.js +0 -435
- package/dist/tooltip.js.map +0 -1
- package/dist/useClickOutsideEvent-wGLGWBZN.js +0 -36
- package/dist/useClickOutsideEvent-wGLGWBZN.js.map +0 -1
- package/dist/useElementSize-BJvbGHq8.js +0 -51
- package/dist/useElementSize-BJvbGHq8.js.map +0 -1
- package/dist/useLayer-D1usxIE0.js +0 -712
- package/dist/useLayer-D1usxIE0.js.map +0 -1
package/dist/toast.js
DELETED
|
@@ -1,302 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { _ as useTheme_v2, d as createGlobalScopedContext, i as usePrefersReducedMotion, n as LayerProvider, r as isRecord, s as Card, t as useLayer, y as Box } from "./useLayer-D1usxIE0.js";
|
|
3
|
-
import { t as Flex } from "./flex-DmbDG2ks.js";
|
|
4
|
-
import { n as Text, t as Stack } from "./stack-rsNFPq2-.js";
|
|
5
|
-
import { t as Button } from "./button-BNyKSDyA.js";
|
|
6
|
-
import { t as Grid } from "./grid-6JSgMj1O.js";
|
|
7
|
-
import { c } from "react/compiler-runtime";
|
|
8
|
-
import { clsx } from "clsx/lite";
|
|
9
|
-
import { startTransition, useContext, useState, useSyncExternalStore } from "react";
|
|
10
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
11
|
-
import { AnimatePresence, motion, stagger } from "motion/react";
|
|
12
|
-
import { CloseIcon } from "@sanity/icons/Close";
|
|
13
|
-
const STATUS_CARD_TONE = {
|
|
14
|
-
error: "critical",
|
|
15
|
-
warning: "caution",
|
|
16
|
-
success: "positive",
|
|
17
|
-
info: "neutral"
|
|
18
|
-
}, BUTTON_TONE = {
|
|
19
|
-
error: "critical",
|
|
20
|
-
warning: "caution",
|
|
21
|
-
success: "positive",
|
|
22
|
-
info: "neutral"
|
|
23
|
-
};
|
|
24
|
-
var loadingBarProgress = "_1a5lj7y4", toast = "_1a5lj7y0", toastText = "_1a5lj7y1";
|
|
25
|
-
const ROLES = {
|
|
26
|
-
error: "alert",
|
|
27
|
-
warning: "alert",
|
|
28
|
-
success: "alert",
|
|
29
|
-
info: "alert"
|
|
30
|
-
};
|
|
31
|
-
/**
|
|
32
|
-
* The `Toast` component gives feedback to users when an action has taken place.
|
|
33
|
-
*
|
|
34
|
-
* Toasts can be closed with a close button, or auto-dismiss after a certain timeout.
|
|
35
|
-
*
|
|
36
|
-
* @public
|
|
37
|
-
*/
|
|
38
|
-
function Toast(props) {
|
|
39
|
-
let $ = c(54), className, closable, description, duration, onClose, restProps, status, t0, title, updatedAt;
|
|
40
|
-
$[0] === props ? (className = $[1], closable = $[2], description = $[3], duration = $[4], onClose = $[5], restProps = $[6], status = $[7], t0 = $[8], title = $[9], updatedAt = $[10]) : ({className, closable, description, duration, onClose, radius: t0, title, status, updatedAt, ...restProps} = props, $[0] = props, $[1] = className, $[2] = closable, $[3] = description, $[4] = duration, $[5] = onClose, $[6] = restProps, $[7] = status, $[8] = t0, $[9] = title, $[10] = updatedAt);
|
|
41
|
-
let radius = t0 === void 0 ? 3 : t0, cardTone = status ? STATUS_CARD_TONE[status] : "default", buttonTone = status ? BUTTON_TONE[status] : "default", role = status ? ROLES[status] : "status", visualDuration = usePrefersReducedMotion() ? 0 : .26, t1;
|
|
42
|
-
$[11] === visualDuration ? t1 = $[12] : (t1 = visualDuration ? {
|
|
43
|
-
type: "spring",
|
|
44
|
-
visualDuration,
|
|
45
|
-
bounce: .25
|
|
46
|
-
} : { duration: 0 }, $[11] = visualDuration, $[12] = t1);
|
|
47
|
-
let transition = t1, hasDuration = duration && isFinite(duration) && duration < 20736e5, t2;
|
|
48
|
-
$[13] === Symbol.for("react.memo_cache_sentinel") ? (t2 = ["hidden", "initial"], $[13] = t2) : t2 = $[13];
|
|
49
|
-
let initial = t2, t3;
|
|
50
|
-
$[14] === Symbol.for("react.memo_cache_sentinel") ? (t3 = ["visible", "slideIn"], $[14] = t3) : t3 = $[14];
|
|
51
|
-
let animate = t3, t4;
|
|
52
|
-
$[15] === Symbol.for("react.memo_cache_sentinel") ? (t4 = ["hidden", "slideOut"], $[15] = t4) : t4 = $[15];
|
|
53
|
-
let exit = t4, t5;
|
|
54
|
-
$[16] === className ? t5 = $[17] : (t5 = clsx(toast, className), $[16] = className, $[17] = t5);
|
|
55
|
-
let t6 = hasDuration ? "" : void 0, t7;
|
|
56
|
-
$[18] === title ? t7 = $[19] : (t7 = title && /* @__PURE__ */ jsx(Text, {
|
|
57
|
-
size: 1,
|
|
58
|
-
weight: "medium",
|
|
59
|
-
children: title
|
|
60
|
-
}), $[18] = title, $[19] = t7);
|
|
61
|
-
let t8;
|
|
62
|
-
$[20] !== description || $[21] !== transition ? (t8 = description && /* @__PURE__ */ jsx(MotionText, {
|
|
63
|
-
muted: !0,
|
|
64
|
-
size: 1,
|
|
65
|
-
variants: content,
|
|
66
|
-
transition,
|
|
67
|
-
children: description
|
|
68
|
-
}), $[20] = description, $[21] = transition, $[22] = t8) : t8 = $[22];
|
|
69
|
-
let t9;
|
|
70
|
-
$[23] !== t7 || $[24] !== t8 ? (t9 = /* @__PURE__ */ jsx(Flex, {
|
|
71
|
-
className: toastText,
|
|
72
|
-
flex: 1,
|
|
73
|
-
padding: 3,
|
|
74
|
-
children: /* @__PURE__ */ jsxs(Stack, {
|
|
75
|
-
gap: 3,
|
|
76
|
-
children: [t7, t8]
|
|
77
|
-
})
|
|
78
|
-
}), $[23] = t7, $[24] = t8, $[25] = t9) : t9 = $[25];
|
|
79
|
-
let t10;
|
|
80
|
-
$[26] !== buttonTone || $[27] !== closable || $[28] !== onClose ? (t10 = closable && /* @__PURE__ */ jsx(Box, {
|
|
81
|
-
padding: 1,
|
|
82
|
-
children: /* @__PURE__ */ jsx(Button, {
|
|
83
|
-
as: "button",
|
|
84
|
-
icon: CloseIcon,
|
|
85
|
-
mode: "bleed",
|
|
86
|
-
padding: 2,
|
|
87
|
-
tone: buttonTone,
|
|
88
|
-
onClick: onClose,
|
|
89
|
-
style: { verticalAlign: "top" }
|
|
90
|
-
})
|
|
91
|
-
}), $[26] = buttonTone, $[27] = closable, $[28] = onClose, $[29] = t10) : t10 = $[29];
|
|
92
|
-
let t11;
|
|
93
|
-
$[30] !== t10 || $[31] !== t9 || $[32] !== transition ? (t11 = /* @__PURE__ */ jsxs(MotionFlex, {
|
|
94
|
-
align: "flex-start",
|
|
95
|
-
variants: content,
|
|
96
|
-
transition,
|
|
97
|
-
children: [t9, t10]
|
|
98
|
-
}), $[30] = t10, $[31] = t9, $[32] = transition, $[33] = t11) : t11 = $[33];
|
|
99
|
-
let t12;
|
|
100
|
-
$[34] !== cardTone || $[35] !== duration || $[36] !== hasDuration || $[37] !== onClose || $[38] !== radius || $[39] !== transition || $[40] !== updatedAt || $[41] !== visualDuration ? (t12 = hasDuration && /* @__PURE__ */ jsxs(motion.div, {
|
|
101
|
-
className: "_1a5lj7y2",
|
|
102
|
-
"data-ui": "ToastLoadingBar",
|
|
103
|
-
variants: content,
|
|
104
|
-
transition,
|
|
105
|
-
children: [/* @__PURE__ */ jsx(Card, {
|
|
106
|
-
className: "_1a5lj7y3",
|
|
107
|
-
tone: cardTone,
|
|
108
|
-
radius
|
|
109
|
-
}), /* @__PURE__ */ jsx(LoadingBarProgress, {
|
|
110
|
-
duration,
|
|
111
|
-
onComplete: onClose,
|
|
112
|
-
tone: cardTone,
|
|
113
|
-
visualDuration
|
|
114
|
-
}, `progress-${updatedAt}`)]
|
|
115
|
-
}), $[34] = cardTone, $[35] = duration, $[36] = hasDuration, $[37] = onClose, $[38] = radius, $[39] = transition, $[40] = updatedAt, $[41] = visualDuration, $[42] = t12) : t12 = $[42];
|
|
116
|
-
let t13;
|
|
117
|
-
return $[43] !== cardTone || $[44] !== radius || $[45] !== restProps || $[46] !== role || $[47] !== t11 || $[48] !== t12 || $[49] !== t5 || $[50] !== t6 || $[51] !== transition || $[52] !== visualDuration ? (t13 = /* @__PURE__ */ jsxs(MotionCard, {
|
|
118
|
-
className: t5,
|
|
119
|
-
"data-ui": "Toast",
|
|
120
|
-
role,
|
|
121
|
-
...restProps,
|
|
122
|
-
"data-has-duration": t6,
|
|
123
|
-
custom: visualDuration,
|
|
124
|
-
radius,
|
|
125
|
-
shadow: 2,
|
|
126
|
-
tone: cardTone,
|
|
127
|
-
as: "li",
|
|
128
|
-
layout: "position",
|
|
129
|
-
variants: container,
|
|
130
|
-
initial,
|
|
131
|
-
animate,
|
|
132
|
-
exit,
|
|
133
|
-
transition,
|
|
134
|
-
children: [t11, t12]
|
|
135
|
-
}), $[43] = cardTone, $[44] = radius, $[45] = restProps, $[46] = role, $[47] = t11, $[48] = t12, $[49] = t5, $[50] = t6, $[51] = transition, $[52] = visualDuration, $[53] = t13) : t13 = $[53], t13;
|
|
136
|
-
}
|
|
137
|
-
function LoadingBarProgress(props) {
|
|
138
|
-
let $ = c(12), { duration, onComplete, tone, visualDuration } = props, { color } = useTheme_v2(), t0 = color.button.default[tone], t1;
|
|
139
|
-
$[0] === t0.enabled.bg ? t1 = $[1] : (t1 = { "--toast-loading-bar-bg": t0.enabled.bg }, $[0] = t0.enabled.bg, $[1] = t1);
|
|
140
|
-
let t2, t3;
|
|
141
|
-
$[2] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { scaleX: 0 }, t3 = { scaleX: 1 }, $[2] = t2, $[3] = t3) : (t2 = $[2], t3 = $[3]);
|
|
142
|
-
let t4 = duration / 1e3, t5;
|
|
143
|
-
$[4] !== t4 || $[5] !== visualDuration ? (t5 = {
|
|
144
|
-
delay: visualDuration,
|
|
145
|
-
duration: t4,
|
|
146
|
-
ease: "linear"
|
|
147
|
-
}, $[4] = t4, $[5] = visualDuration, $[6] = t5) : t5 = $[6];
|
|
148
|
-
let t6;
|
|
149
|
-
return $[7] !== onComplete || $[8] !== t1 || $[9] !== t5 || $[10] !== tone ? (t6 = /* @__PURE__ */ jsx(MotionCard, {
|
|
150
|
-
className: loadingBarProgress,
|
|
151
|
-
tone,
|
|
152
|
-
style: t1,
|
|
153
|
-
initial: t2,
|
|
154
|
-
animate: t3,
|
|
155
|
-
transition: t5,
|
|
156
|
-
onAnimationComplete: onComplete
|
|
157
|
-
}), $[7] = onComplete, $[8] = t1, $[9] = t5, $[10] = tone, $[11] = t6) : t6 = $[11], t6;
|
|
158
|
-
}
|
|
159
|
-
const container = {
|
|
160
|
-
initial: {
|
|
161
|
-
y: 32,
|
|
162
|
-
scale: .5,
|
|
163
|
-
zIndex: 1
|
|
164
|
-
},
|
|
165
|
-
hidden: { opacity: 0 },
|
|
166
|
-
visible: (visualDuration) => visualDuration ? {
|
|
167
|
-
opacity: 1,
|
|
168
|
-
transition: {
|
|
169
|
-
when: "beforeChildren",
|
|
170
|
-
delayChildren: stagger(visualDuration / 3),
|
|
171
|
-
duration: visualDuration / 3
|
|
172
|
-
}
|
|
173
|
-
} : { opacity: 1 },
|
|
174
|
-
slideIn: {
|
|
175
|
-
y: 0,
|
|
176
|
-
scale: 1
|
|
177
|
-
},
|
|
178
|
-
slideOut: {
|
|
179
|
-
zIndex: 0,
|
|
180
|
-
scale: .75
|
|
181
|
-
}
|
|
182
|
-
}, content = {
|
|
183
|
-
initial: { willChange: "transform" },
|
|
184
|
-
hidden: { opacity: 0 },
|
|
185
|
-
visible: { opacity: 1 }
|
|
186
|
-
}, MotionCard = motion.create(Card), MotionFlex = motion.create(Flex), MotionText = motion.create(Text);
|
|
187
|
-
/**
|
|
188
|
-
* Some components should only render after mounting to the DOM, and not be rendered at all during SSR renderToString or equivalent.
|
|
189
|
-
* @public
|
|
190
|
-
*/
|
|
191
|
-
function useMounted() {
|
|
192
|
-
return useSyncExternalStore(subscribe, _temp$1, _temp2);
|
|
193
|
-
}
|
|
194
|
-
function _temp2() {
|
|
195
|
-
return !1;
|
|
196
|
-
}
|
|
197
|
-
function _temp$1() {
|
|
198
|
-
return !0;
|
|
199
|
-
}
|
|
200
|
-
const subscribe = () => () => {}, ToastContext = createGlobalScopedContext("@sanity/ui/context/toast", null);
|
|
201
|
-
var toastLayer = "_1ojgmwx0";
|
|
202
|
-
/**
|
|
203
|
-
* @internal
|
|
204
|
-
*/
|
|
205
|
-
function ToastLayer(props) {
|
|
206
|
-
let $ = c(9), { children, padding: t0, paddingX, paddingY, gap: t1 } = props, padding = t0 === void 0 ? 4 : t0, gap = t1 === void 0 ? 3 : t1, { zIndex } = useLayer(), t2;
|
|
207
|
-
$[0] === zIndex ? t2 = $[1] : (t2 = { zIndex }, $[0] = zIndex, $[1] = t2);
|
|
208
|
-
let t3;
|
|
209
|
-
return $[2] !== children || $[3] !== gap || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(Grid, {
|
|
210
|
-
as: "ul",
|
|
211
|
-
className: toastLayer,
|
|
212
|
-
"data-ui": "ToastProvider",
|
|
213
|
-
padding,
|
|
214
|
-
paddingX,
|
|
215
|
-
paddingY,
|
|
216
|
-
gap,
|
|
217
|
-
gridTemplateColumns: 1,
|
|
218
|
-
style: t2,
|
|
219
|
-
children
|
|
220
|
-
}), $[2] = children, $[3] = gap, $[4] = padding, $[5] = paddingX, $[6] = paddingY, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
|
|
221
|
-
}
|
|
222
|
-
let toastId = 0;
|
|
223
|
-
/** @internal */
|
|
224
|
-
function generateToastId() {
|
|
225
|
-
return String(toastId++);
|
|
226
|
-
}
|
|
227
|
-
/**
|
|
228
|
-
* @public
|
|
229
|
-
*/
|
|
230
|
-
function ToastProvider(props) {
|
|
231
|
-
let $ = c(13), { children, padding, paddingX, paddingY, gap, zOffset: t0 } = props, zOffset = t0 === void 0 ? 1 : t0, t1;
|
|
232
|
-
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = [], $[0] = t1) : t1 = $[0];
|
|
233
|
-
let [state, setState] = useState(t1), mounted = useMounted(), t2;
|
|
234
|
-
if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
|
|
235
|
-
let push = (params) => {
|
|
236
|
-
let id = params.id || generateToastId(), duration = params.duration || 5e3;
|
|
237
|
-
return startTransition(() => {
|
|
238
|
-
setState((prevState) => {
|
|
239
|
-
if (duration === .01) return prevState.filter((toast) => toast.id !== id);
|
|
240
|
-
let dismiss = () => startTransition(() => setState((currentState) => currentState.filter((toast_0) => toast_0.id !== id)));
|
|
241
|
-
return [...prevState.filter((toast_1) => toast_1.id !== id), {
|
|
242
|
-
dismiss,
|
|
243
|
-
id,
|
|
244
|
-
updatedAt: Date.now(),
|
|
245
|
-
params: {
|
|
246
|
-
...params,
|
|
247
|
-
duration
|
|
248
|
-
}
|
|
249
|
-
}];
|
|
250
|
-
});
|
|
251
|
-
}), id;
|
|
252
|
-
};
|
|
253
|
-
t2 = {
|
|
254
|
-
version: 0,
|
|
255
|
-
push
|
|
256
|
-
}, $[1] = t2;
|
|
257
|
-
} else t2 = $[1];
|
|
258
|
-
let value = t2, t3;
|
|
259
|
-
$[2] !== gap || $[3] !== mounted || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== state || $[8] !== zOffset ? (t3 = mounted && /* @__PURE__ */ jsx(LayerProvider, {
|
|
260
|
-
zOffset,
|
|
261
|
-
children: /* @__PURE__ */ jsx(ToastLayer, {
|
|
262
|
-
padding,
|
|
263
|
-
paddingX,
|
|
264
|
-
paddingY,
|
|
265
|
-
gap,
|
|
266
|
-
children: /* @__PURE__ */ jsx(AnimatePresence, {
|
|
267
|
-
initial: !1,
|
|
268
|
-
mode: "popLayout",
|
|
269
|
-
children: state.map(_temp)
|
|
270
|
-
})
|
|
271
|
-
})
|
|
272
|
-
}), $[2] = gap, $[3] = mounted, $[4] = padding, $[5] = paddingX, $[6] = paddingY, $[7] = state, $[8] = zOffset, $[9] = t3) : t3 = $[9];
|
|
273
|
-
let t4;
|
|
274
|
-
return $[10] !== children || $[11] !== t3 ? (t4 = /* @__PURE__ */ jsxs(ToastContext.Provider, {
|
|
275
|
-
value,
|
|
276
|
-
children: [children, t3]
|
|
277
|
-
}), $[10] = children, $[11] = t3, $[12] = t4) : t4 = $[12], t4;
|
|
278
|
-
}
|
|
279
|
-
function _temp(t0) {
|
|
280
|
-
let { dismiss: dismiss_0, id: id_0, params: params_0, updatedAt } = t0;
|
|
281
|
-
return /* @__PURE__ */ jsx(Toast, {
|
|
282
|
-
closable: params_0.closable,
|
|
283
|
-
description: params_0.description,
|
|
284
|
-
onClose: dismiss_0,
|
|
285
|
-
status: params_0.status,
|
|
286
|
-
title: params_0.title,
|
|
287
|
-
duration: params_0.duration,
|
|
288
|
-
updatedAt
|
|
289
|
-
}, id_0);
|
|
290
|
-
}
|
|
291
|
-
/**
|
|
292
|
-
* @public
|
|
293
|
-
*/
|
|
294
|
-
function useToast() {
|
|
295
|
-
let value = useContext(ToastContext);
|
|
296
|
-
if (!value) throw Error("useToast(): missing context value");
|
|
297
|
-
if (!isRecord(value) || value.version !== 0) throw Error("useToast(): the context value is not compatible");
|
|
298
|
-
return value;
|
|
299
|
-
}
|
|
300
|
-
export { Toast, ToastProvider, useToast };
|
|
301
|
-
|
|
302
|
-
//# sourceMappingURL=toast.js.map
|
package/dist/toast.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"toast.js","names":["radius = 3","visualDuration\n ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n : {duration: 0}","['hidden', 'initial']","['visible', 'slideIn']","['hidden', 'slideOut']","clsx(toast, className)","title && (\n <Text size={1} weight=\"medium\">\n {title}\n </Text>\n )","description && (\n <MotionText muted size={1} variants={content} transition={transition}>\n {description}\n </MotionText>\n )","<Flex className={toastText} flex={1} padding={3}>\n <Stack gap={3}>\n {title && (\n <Text size={1} weight=\"medium\">\n {title}\n </Text>\n )}\n {description && (\n <MotionText muted size={1} variants={content} transition={transition}>\n {description}\n </MotionText>\n )}\n </Stack>\n </Flex>","closable && (\n <Box padding={1}>\n <Button\n as=\"button\"\n icon={CloseIcon}\n mode=\"bleed\"\n padding={2}\n tone={buttonTone}\n onClick={onClose}\n style={{verticalAlign: 'top'}}\n />\n </Box>\n )","<MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n <Flex className={toastText} flex={1} padding={3}>\n <Stack gap={3}>\n {title && (\n <Text size={1} weight=\"medium\">\n {title}\n </Text>\n )}\n {description && (\n <MotionText muted size={1} variants={content} transition={transition}>\n {description}\n </MotionText>\n )}\n </Stack>\n </Flex>\n\n {closable && (\n <Box padding={1}>\n <Button\n as=\"button\"\n icon={CloseIcon}\n mode=\"bleed\"\n padding={2}\n tone={buttonTone}\n onClick={onClose}\n style={{verticalAlign: 'top'}}\n />\n </Box>\n )}\n </MotionFlex>","hasDuration && (\n <motion.div\n className={loadingBar}\n data-ui=\"ToastLoadingBar\"\n variants={content}\n transition={transition}\n >\n <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n <LoadingBarProgress\n key={`progress-${updatedAt}`}\n duration={duration}\n onComplete={onClose}\n tone={cardTone}\n visualDuration={visualDuration}\n />\n </motion.div>\n )","motion.div","<MotionCard\n className={clsx(toast, className)}\n data-ui=\"Toast\"\n role={role}\n {...restProps}\n data-has-duration={hasDuration ? '' : undefined}\n custom={visualDuration}\n radius={radius}\n shadow={2}\n tone={cardTone}\n as=\"li\"\n layout=\"position\"\n variants={container}\n initial={initial}\n animate={animate}\n exit={exit}\n transition={transition}\n >\n <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n <Flex className={toastText} flex={1} padding={3}>\n <Stack gap={3}>\n {title && (\n <Text size={1} weight=\"medium\">\n {title}\n </Text>\n )}\n {description && (\n <MotionText muted size={1} variants={content} transition={transition}>\n {description}\n </MotionText>\n )}\n </Stack>\n </Flex>\n\n {closable && (\n <Box padding={1}>\n <Button\n as=\"button\"\n icon={CloseIcon}\n mode=\"bleed\"\n padding={2}\n tone={buttonTone}\n onClick={onClose}\n style={{verticalAlign: 'top'}}\n />\n </Box>\n )}\n </MotionFlex>\n {hasDuration && (\n <motion.div\n className={loadingBar}\n data-ui=\"ToastLoadingBar\"\n variants={content}\n transition={transition}\n >\n <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n <LoadingBarProgress\n key={`progress-${updatedAt}`}\n duration={duration}\n onComplete={onClose}\n tone={cardTone}\n visualDuration={visualDuration}\n />\n </motion.div>\n )}\n </MotionCard>","hasDuration ? '' : undefined","{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}","bg","color.button.default[tone]","{scaleX: 0}","{scaleX: 1}","{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}","duration / 1_000","<MotionCard\n className={loadingBarProgress}\n tone={tone}\n style={{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onComplete}\n />","() => true","() => false","padding = 4","gap = 3","{zIndex}","<Grid\n as=\"ul\"\n className={toastLayer}\n data-ui=\"ToastProvider\"\n padding={padding}\n paddingX={paddingX}\n paddingY={paddingY}\n gap={gap}\n gridTemplateColumns={1}\n style={{zIndex}}\n >\n {children}\n </Grid>","zOffset = 1","[]","{version: 0.0, push}","toast","useMemo(() => {\n const push = (params: ToastParams) => {\n const id = params.id || generateToastId()\n const duration = params.duration || 5000\n\n startTransition(() => {\n setState((prevState): ToastState => {\n /**\n * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n */\n if (duration === 0.01) {\n return prevState.filter((toast) => toast.id !== id)\n }\n\n /**\n * Creates a function to dismiss this specific toast.\n * This function will be passed to the Toast component\n * and called either on close button click or after duration.\n */\n const dismiss = () =>\n startTransition(() =>\n setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n )\n\n /**\n * Create updated state by:\n * 1. Removing any existing toast with the same ID (prevents duplicates)\n * 2. Adding the new toast with its dismiss handler\n * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n */\n return [\n ...prevState.filter((toast) => toast.id !== id),\n {\n dismiss,\n id,\n updatedAt: Date.now(),\n params: {...params, duration},\n },\n ]\n })\n })\n\n return id\n }\n\n return {version: 0.0, push}\n }, [])","mounted && (\n <LayerProvider zOffset={zOffset}>\n <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n <AnimatePresence initial={false} mode=\"popLayout\">\n {state.map(({dismiss, id, params, updatedAt}) => (\n <Toast\n key={id}\n closable={params.closable}\n description={params.description}\n onClose={dismiss}\n status={params.status}\n title={params.title}\n duration={params.duration}\n updatedAt={updatedAt}\n />\n ))}\n </AnimatePresence>\n </ToastLayer>\n </LayerProvider>\n )","({dismiss, id, params, updatedAt}) => (\n <Toast\n key={id}\n closable={params.closable}\n description={params.description}\n onClose={dismiss}\n status={params.status}\n title={params.title}\n duration={params.duration}\n updatedAt={updatedAt}\n />\n )","<ToastContext.Provider value={value}>\n {children}\n {mounted && (\n <LayerProvider zOffset={zOffset}>\n <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n <AnimatePresence initial={false} mode=\"popLayout\">\n {state.map(({dismiss, id, params, updatedAt}) => (\n <Toast\n key={id}\n closable={params.closable}\n description={params.description}\n onClose={dismiss}\n status={params.status}\n title={params.title}\n duration={params.duration}\n updatedAt={updatedAt}\n />\n ))}\n </AnimatePresence>\n </ToastLayer>\n </LayerProvider>\n )}\n </ToastContext.Provider>","ToastContext.Provider","{dismiss, id, params, updatedAt}","params","dismiss","id"],"sources":["../src/core/components/toast/styles.ts","../src/core/components/toast/toast.css.ts","../src/core/components/toast/toast.tsx","../src/core/hooks/useMounted.ts","../src/core/components/toast/toastContext.ts","../src/core/components/toast/toastLayer.css.ts","../src/core/components/toast/toastLayer.tsx","../src/core/components/toast/toastState.ts","../src/core/components/toast/toastProvider.tsx","../src/core/components/toast/useToast.ts"],"sourcesContent":["import {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport type {ButtonTone} from '../../types/button'\n\nexport const STATUS_CARD_TONE = {\n error: 'critical',\n warning: 'caution',\n success: 'positive',\n info: 'neutral',\n} satisfies {[key: string]: ThemeColorStateToneKey}\n\nexport const BUTTON_TONE = {\n error: 'critical',\n warning: 'caution',\n success: 'positive',\n info: 'neutral',\n} satisfies {[key: string]: ButtonTone}\n","import {style} from '@vanilla-extract/css'\n\nconst LOADING_BAR_HEIGHT = 2\n\nexport const toast = style({\n pointerEvents: 'all',\n width: '100%',\n position: 'relative',\n overflow: ['hidden', 'clip'],\n selectors: {\n '&[data-has-duration]': {\n paddingBottom: `calc(${LOADING_BAR_HEIGHT}px / 2)`,\n },\n },\n})\n\nexport const toastText = style({\n overflowX: 'auto',\n})\n\nexport const loadingBar = style({\n display: 'flex',\n position: 'absolute',\n bottom: '0px',\n top: '0px',\n left: '0px',\n right: '0px',\n pointerEvents: 'none',\n zIndex: -1,\n overflow: ['hidden', 'clip'],\n background: 'transparent',\n alignItems: 'flex-end',\n willChange: 'opacity',\n})\n\nexport const loadingBarMask = style({\n position: 'absolute',\n top: 0,\n left: `-${LOADING_BAR_HEIGHT}px`,\n right: `-${LOADING_BAR_HEIGHT}px`,\n bottom: `${LOADING_BAR_HEIGHT}px`,\n zIndex: 1,\n})\n\nexport const loadingBarProgress = style({\n display: 'block',\n height: '100%',\n width: '100%',\n transformOrigin: '0% 50%',\n selectors: {\n '&&': {\n backgroundColor: 'var(--toast-loading-bar-bg)',\n },\n },\n})\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {clsx} from 'clsx/lite'\nimport {motion, stagger, type Variant, type Variants} from 'motion/react'\n\nimport {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {Box} from '../../primitives/box/box'\nimport {Button} from '../../primitives/button/button'\nimport {Card} from '../../primitives/card/card'\nimport {Flex} from '../../primitives/flex/flex'\nimport {Stack} from '../../primitives/stack/stack'\nimport {Text} from '../../primitives/text/text'\nimport {useTheme_v2} from '../../theme/useTheme'\nimport {BUTTON_TONE, STATUS_CARD_TONE} from './styles'\n\nimport {loadingBar, loadingBarMask, loadingBarProgress, toast, toastText} from './toast.css'\n\n/**\n * @public\n */\nexport interface ToastProps {\n closable?: boolean\n description?: React.ReactNode\n onClose: () => void\n radius?: number | number[]\n title?: React.ReactNode\n status?: 'error' | 'warning' | 'success' | 'info'\n duration?: number\n updatedAt?: number\n}\n\nconst ROLES = {\n error: 'alert',\n warning: 'alert',\n success: 'alert',\n info: 'alert',\n} as const\n\n// Support pattern used by Sanity Studio, that works around the lack of `duration: Infinity` support in older @sanity/ui versions\n// https://developer.mozilla.org/en-US/docs/Web/API/setTimeout#maximum_delay_value\nconst LONG_ENOUGH_BUT_NOT_TOO_LONG = 1000 * 60 * 60 * 24 * 24\n\n/**\n * The `Toast` component gives feedback to users when an action has taken place.\n *\n * Toasts can be closed with a close button, or auto-dismiss after a certain timeout.\n *\n * @public\n */\nexport function Toast(\n props: ToastProps &\n Omit<\n React.HTMLProps<HTMLDivElement>,\n | 'as'\n | 'height'\n | 'ref'\n | 'title'\n | 'onAnimationStart'\n | 'onDragStart'\n | 'onDragEnd'\n | 'onDrag'\n >,\n): React.JSX.Element {\n const {\n className,\n closable,\n description,\n duration,\n onClose,\n radius = 3,\n title,\n status,\n updatedAt,\n ...restProps\n } = props\n const cardTone = status ? STATUS_CARD_TONE[status] : 'default'\n const buttonTone = status ? BUTTON_TONE[status] : 'default'\n const role = status ? ROLES[status] : 'status'\n\n const prefersReducedMotion = usePrefersReducedMotion()\n\n const visualDuration: number = prefersReducedMotion ? 0 : 0.26\n const transition = visualDuration\n ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n : {duration: 0}\n\n const hasDuration = duration && isFinite(duration) && duration < LONG_ENOUGH_BUT_NOT_TOO_LONG\n const initial: ContainerVariants[] = ['hidden', 'initial']\n const animate: ContainerVariants[] = ['visible', 'slideIn']\n const exit: ContainerVariants[] = ['hidden', 'slideOut']\n\n return (\n <MotionCard\n className={clsx(toast, className)}\n data-ui=\"Toast\"\n role={role}\n {...restProps}\n data-has-duration={hasDuration ? '' : undefined}\n custom={visualDuration}\n radius={radius}\n shadow={2}\n tone={cardTone}\n as=\"li\"\n layout=\"position\"\n variants={container}\n initial={initial}\n animate={animate}\n exit={exit}\n transition={transition}\n >\n <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n <Flex className={toastText} flex={1} padding={3}>\n <Stack gap={3}>\n {title && (\n <Text size={1} weight=\"medium\">\n {title}\n </Text>\n )}\n {description && (\n <MotionText muted size={1} variants={content} transition={transition}>\n {description}\n </MotionText>\n )}\n </Stack>\n </Flex>\n\n {closable && (\n <Box padding={1}>\n <Button\n as=\"button\"\n icon={CloseIcon}\n mode=\"bleed\"\n padding={2}\n tone={buttonTone}\n onClick={onClose}\n style={{verticalAlign: 'top'}}\n />\n </Box>\n )}\n </MotionFlex>\n {hasDuration && (\n <motion.div\n className={loadingBar}\n data-ui=\"ToastLoadingBar\"\n variants={content}\n transition={transition}\n >\n <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n <LoadingBarProgress\n key={`progress-${updatedAt}`}\n duration={duration}\n onComplete={onClose}\n tone={cardTone}\n visualDuration={visualDuration}\n />\n </motion.div>\n )}\n </MotionCard>\n )\n}\n\ninterface LoadingBarProgressProps {\n duration: number\n onComplete: () => void\n tone: ThemeColorStateToneKey\n visualDuration: number\n}\n\nfunction LoadingBarProgress(props: LoadingBarProgressProps) {\n const {duration, onComplete, tone, visualDuration} = props\n const {color} = useTheme_v2()\n\n return (\n <MotionCard\n className={loadingBarProgress}\n tone={tone}\n style={{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onComplete}\n />\n )\n}\n\nconst container = {\n initial: {y: 32, scale: 0.5, zIndex: 1},\n hidden: {opacity: 0},\n visible: (visualDuration: number) => {\n if (!visualDuration) return {opacity: 1}\n\n return {\n opacity: 1,\n transition: {\n when: 'beforeChildren',\n delayChildren: stagger(visualDuration / 3),\n duration: visualDuration / 3,\n },\n }\n },\n slideIn: {\n y: 0,\n scale: 1,\n },\n slideOut: {\n zIndex: 0,\n scale: 0.75,\n },\n} satisfies Variants\ntype ContainerVariants = keyof typeof container\n\nconst content = {\n initial: {\n willChange: 'transform',\n },\n hidden: {\n opacity: 0,\n },\n visible: {\n opacity: 1,\n },\n} satisfies Partial<Record<ContainerVariants, Variant>>\n\nconst MotionCard = motion.create(Card)\nconst MotionFlex = motion.create(Flex)\nconst MotionText = motion.create(Text)\n","import {useSyncExternalStore} from 'react'\n\n/**\n * Some components should only render after mounting to the DOM, and not be rendered at all during SSR renderToString or equivalent.\n * @public\n */\nexport function useMounted(): boolean {\n return useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n )\n}\n\nconst subscribe = () => () => {}\n","import {createGlobalScopedContext} from '../../lib/createGlobalScopedContext'\nimport {ToastContextValue} from './types'\n\nexport const ToastContext = createGlobalScopedContext<ToastContextValue | null>(\n '@sanity/ui/context/toast',\n null,\n)\n","import {style} from '@vanilla-extract/css'\n\nexport const toastLayer = style({\n boxSizing: 'border-box',\n position: 'fixed',\n right: 0,\n bottom: 0,\n listStyle: 'none',\n pointerEvents: 'none',\n maxWidth: '420px',\n width: '100%',\n})\n","import {Grid} from '../../primitives/grid/grid'\nimport {useLayer} from '../../utils/layer/useLayer'\n\nimport {toastLayer} from './toastLayer.css'\n\n/**\n * @public\n */\nexport interface ToastLayerProps {\n children: React.ReactNode\n padding?: number | number[]\n paddingX?: number | number[]\n paddingY?: number | number[]\n gap?: number | number[]\n}\n\n/**\n * @internal\n */\nexport function ToastLayer(props: ToastLayerProps): React.JSX.Element {\n const {children, padding = 4, paddingX, paddingY, gap = 3} = props\n const {zIndex} = useLayer()\n\n return (\n <Grid\n as=\"ul\"\n className={toastLayer}\n data-ui=\"ToastProvider\"\n padding={padding}\n paddingX={paddingX}\n paddingY={paddingY}\n gap={gap}\n gridTemplateColumns={1}\n style={{zIndex}}\n >\n {children}\n </Grid>\n )\n}\n","let toastId = 0\n\n/** @internal */\nexport function generateToastId(): string {\n return String(toastId++)\n}\n","import {AnimatePresence} from 'motion/react'\nimport {startTransition, useMemo, useState} from 'react'\n\nimport {useMounted} from '../../hooks/useMounted'\nimport {LayerProvider} from '../../utils/layer/layerProvider'\nimport {Toast} from './toast'\nimport {ToastContext} from './toastContext'\nimport {ToastLayer, type ToastLayerProps} from './toastLayer'\nimport {generateToastId} from './toastState'\nimport {ToastContextValue, ToastParams} from './types'\n\ntype ToastState = {\n dismiss: () => void\n id: string\n updatedAt: number\n params: ToastParams\n}[]\n\n/**\n * @public\n */\nexport interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {\n children?: React.ReactNode\n zOffset?: number | number[]\n}\n\n/**\n * @public\n */\nexport function ToastProvider(props: ToastProviderProps): React.JSX.Element {\n const {children, padding, paddingX, paddingY, gap, zOffset = 1} = props\n const [state, setState] = useState<ToastState>([])\n const mounted = useMounted()\n\n const value: ToastContextValue = useMemo(() => {\n const push = (params: ToastParams) => {\n const id = params.id || generateToastId()\n const duration = params.duration || 5000\n\n startTransition(() => {\n setState((prevState): ToastState => {\n /**\n * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n */\n if (duration === 0.01) {\n return prevState.filter((toast) => toast.id !== id)\n }\n\n /**\n * Creates a function to dismiss this specific toast.\n * This function will be passed to the Toast component\n * and called either on close button click or after duration.\n */\n const dismiss = () =>\n startTransition(() =>\n setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n )\n\n /**\n * Create updated state by:\n * 1. Removing any existing toast with the same ID (prevents duplicates)\n * 2. Adding the new toast with its dismiss handler\n * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n */\n return [\n ...prevState.filter((toast) => toast.id !== id),\n {\n dismiss,\n id,\n updatedAt: Date.now(),\n params: {...params, duration},\n },\n ]\n })\n })\n\n return id\n }\n\n return {version: 0.0, push}\n }, [])\n\n return (\n <ToastContext.Provider value={value}>\n {children}\n {mounted && (\n <LayerProvider zOffset={zOffset}>\n <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n <AnimatePresence initial={false} mode=\"popLayout\">\n {state.map(({dismiss, id, params, updatedAt}) => (\n <Toast\n key={id}\n closable={params.closable}\n description={params.description}\n onClose={dismiss}\n status={params.status}\n title={params.title}\n duration={params.duration}\n updatedAt={updatedAt}\n />\n ))}\n </AnimatePresence>\n </ToastLayer>\n </LayerProvider>\n )}\n </ToastContext.Provider>\n )\n}\n","import {useContext} from 'react'\n\nimport {isRecord} from '../../lib/isRecord'\nimport {ToastContext} from './toastContext'\nimport {ToastContextValue} from './types'\n\n/**\n * @public\n */\nexport function useToast(): ToastContextValue {\n const value = useContext(ToastContext)\n\n if (!value) {\n throw new Error('useToast(): missing context value')\n }\n\n // NOTE: This check is for future-compatiblity\n // - If the value is not an object, it’s not compatible with the current version\n // - If the value is an object, but doesn’t have `version: 0.0`, it’s not compatible with the current version\n if (!isRecord(value) || value.version !== 0.0) {\n throw new Error('useToast(): the context value is not compatible')\n }\n\n return value\n}\n"],"mappings":"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"}
|
package/dist/tooltip.d.ts
DELETED
|
@@ -1,88 +0,0 @@
|
|
|
1
|
-
import { i as Delay, n as LayerProps, r as Placement } from "./layer-ChlP9Ik6.js";
|
|
2
|
-
import { s as ThemeColorSchemeKey } from "./_system-CTe2lb5l.js";
|
|
3
|
-
/**
|
|
4
|
-
* @public
|
|
5
|
-
*/
|
|
6
|
-
interface TooltipProps extends Omit<LayerProps, 'as'> {
|
|
7
|
-
/** @deprecated Use `fallbackPlacements` instead. */
|
|
8
|
-
allowedAutoPlacements?: never;
|
|
9
|
-
arrow?: boolean;
|
|
10
|
-
boundaryElement?: HTMLElement | null;
|
|
11
|
-
children?: React.JSX.Element;
|
|
12
|
-
content?: React.ReactNode;
|
|
13
|
-
disabled?: boolean;
|
|
14
|
-
fallbackPlacements?: Placement[];
|
|
15
|
-
padding?: number | number[];
|
|
16
|
-
placement?: Placement;
|
|
17
|
-
/** Whether or not to render the tooltip in a portal element. */
|
|
18
|
-
portal?: boolean | string;
|
|
19
|
-
radius?: number | number[];
|
|
20
|
-
scheme?: ThemeColorSchemeKey;
|
|
21
|
-
shadow?: number | number[];
|
|
22
|
-
/**
|
|
23
|
-
* Adds a delay to open or close the tooltip.
|
|
24
|
-
*
|
|
25
|
-
* If only a `number` is passed, it will be used for both opening and closing.
|
|
26
|
-
*
|
|
27
|
-
* If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
|
|
28
|
-
*
|
|
29
|
-
* @public
|
|
30
|
-
* @defaultValue 0
|
|
31
|
-
*/
|
|
32
|
-
delay?: Delay;
|
|
33
|
-
/**
|
|
34
|
-
* Whether the tooltip should animate in and out.
|
|
35
|
-
*
|
|
36
|
-
* @beta
|
|
37
|
-
* @defaultValue false
|
|
38
|
-
*/
|
|
39
|
-
animate?: boolean;
|
|
40
|
-
}
|
|
41
|
-
/**
|
|
42
|
-
* Tooltips display information when hovering, focusing or tapping.
|
|
43
|
-
*
|
|
44
|
-
* @public
|
|
45
|
-
*/
|
|
46
|
-
export declare function Tooltip(props: TooltipProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'children' | 'content'>): import("react").JSX.Element;
|
|
47
|
-
/**
|
|
48
|
-
* @beta
|
|
49
|
-
*/
|
|
50
|
-
interface TooltipDelayGroupContextValue {
|
|
51
|
-
setIsGroupActive: (nextState: React.SetStateAction<boolean>, delay?: number | undefined) => void;
|
|
52
|
-
setOpenTooltipId: (nextId: string | null, delay?: number | undefined) => void;
|
|
53
|
-
openDelay: number;
|
|
54
|
-
closeDelay: number;
|
|
55
|
-
openTooltipId: string | null;
|
|
56
|
-
}
|
|
57
|
-
/**
|
|
58
|
-
* @beta
|
|
59
|
-
*/
|
|
60
|
-
export declare const TooltipDelayGroupContext: import("react").Context<TooltipDelayGroupContextValue | null>;
|
|
61
|
-
/**
|
|
62
|
-
* @public
|
|
63
|
-
* */
|
|
64
|
-
interface TooltipDelayGroupProviderProps {
|
|
65
|
-
children?: React.ReactNode;
|
|
66
|
-
/**
|
|
67
|
-
* Handles the delays to open or close a tooltip inside a group
|
|
68
|
-
*
|
|
69
|
-
* If only a `number` is passed, it will be used for both opening and closing.
|
|
70
|
-
*
|
|
71
|
-
* If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
|
|
72
|
-
*
|
|
73
|
-
* @public
|
|
74
|
-
*/
|
|
75
|
-
delay: Delay;
|
|
76
|
-
}
|
|
77
|
-
/**
|
|
78
|
-
* @public
|
|
79
|
-
* Provides context for a group of tooltip elements that should share a delay
|
|
80
|
-
* which temporarily becomes 1 ms after the first floating element of the group opens.
|
|
81
|
-
*/
|
|
82
|
-
export declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
|
|
83
|
-
/**
|
|
84
|
-
* @beta
|
|
85
|
-
*/
|
|
86
|
-
export declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
|
|
87
|
-
export type { TooltipDelayGroupContextValue, TooltipDelayGroupProviderProps, TooltipProps };
|
|
88
|
-
//# sourceMappingURL=tooltip.d.ts.map
|
package/dist/tooltip.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.d.ts","names":[],"sources":["../src/core/primitives/tooltip/tooltip.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/types.ts","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupContext.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/useTooltipDelayGroup.ts"],"mappings":";;;;;UAyDiB,qBAAqB,KAAK;;EAEzC;EACA;EACA,kBAAkB;EAClB,WAAW,MAAM,IAAI;EACrB,UAAU,MAAM;EAChB;EACA,qBAAqB;EACrB;EACA,YAAY;;EAEZ;EACA;EACA,SAAS;EACT;;;;;;;;;;;EAWA,QAAQ;;;;;;;EAOR;;;;;;;wBAQc,QACd,OAAO,eAAe,KAAK,MAAM,UAAU,kEAA+C,IAAA;;;;UChG3E;EAEf,mBAAmB,WAAW,MAAM,yBAAyB;EAE7D,mBAAmB,uBAAuB;EAC1C;EACA;EACA;;;;;qBCJW,0CAAwB,QAAA;;;;UCIpB;EACf,WAAW,MAAM;;;;;;;;;;EAUjB,OAAO;;;;;;;wBAQO,0BACd,OAAO,iCACN,MAAM,IAAI;;;;wBCvBG,wBAAwB"}
|