npm - @sanity/ui - Versions diffs - 4.0.6 → 4.0.7 - Mend

@sanity/ui 4.0.6 → 4.0.7

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 (46) hide show

package/dist/{textInput-Cp2Jvgw1.js.map → textInput-B6ZZJSOj.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"textInput-Cp2Jvgw1.js","names":["() => {\n ref.current?.setCustomValidity(customValidity \|\| '')\n }","[customValidity, ref]","ref.current?.setCustomValidity","border = true","disabled = false","fontSizeProp = 2","gap = 3","paddingProp = 3","radiusProp = 2","type = 'text'","_getArrayProp(fontSizeProp)","_getArrayProp(paddingProp)","_getArrayProp(radiusProp)","_getArrayProp(gap)","() => ref.current","useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n }, [])","(event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n }","useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n },\n [onClear, ref],\n )","prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n )","useMemo(\n () =>\n prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n ),\n [prefix, radius],\n )","IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )","!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )","<Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>","scheme","tone","border ? '' : undefined","useMemo(\n () => (\n <Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>\n ),\n [\n __unstable_disableFocusRing,\n border,\n fontSize,\n IconComponent,\n IconRightComponent,\n padding,\n radius,\n rootTheme,\n $hasClearButton,\n $hasPrefix,\n $hasSuffix,\n ],\n )","padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n })","(v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }","useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }),\n [padding],\n )","padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n })","(v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }","useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }),\n [padding],\n )","!disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n )","useMemo(\n () =>\n !disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n ),\n [\n clearButton,\n clearButtonBoxPadding,\n clearButtonPadding,\n clearButtonProps,\n customValidity,\n disabled,\n fontSize,\n handleClearClick,\n handleClearMouseDown,\n radius,\n readOnly,\n ],\n )","suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n )","useMemo(\n () =>\n suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n ),\n [radius, suffix],\n )","<Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />","$hasIconRight \|\| $hasClearButton","<InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>","<StyledTextInput data-ui=\"TextInput\" tone={rootTheme.tone}>\n {prefixNode}\n\n <InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>\n\n {suffixNode}\n </StyledTextInput>","v"],"sources":["../src/core/helpers/animation.ts","../src/core/helpers/focus.ts","../src/core/hooks/useCustomValidity.ts","../src/core/styles/input/responsiveInputPaddingStyle.ts","../src/core/styles/input/textInputStyle.ts","../src/core/primitives/textInput/textInput.tsx"],"sourcesContent":["/*\n @internal\n /\nexport function _raf(fn: () => void): () => void {\n const frameId = requestAnimationFrame(fn)\n\n return () => {\n cancelAnimationFrame(frameId)\n }\n}\n\n/\n @internal\n /\nexport function _raf2(fn: () => void): () => void {\n let innerDispose: (() => void) \| null = null\n\n const outerDispose = _raf(() => {\n innerDispose = _raf(fn)\n })\n\n return () => {\n if (innerDispose) innerDispose()\n\n outerDispose()\n }\n}\n","import {\n isHTMLAnchorElement,\n isHTMLButtonElement,\n isHTMLElement,\n isHTMLInputElement,\n isHTMLSelectElement,\n isHTMLTextAreaElement,\n} from './element'\n\n// export const globalFocusState = {\n// IgnoreUtilFocusChanges: false,\n// }\n\n/\n @internal\n /\nexport function _hasFocus(element: HTMLElement): boolean {\n return Boolean(document.activeElement) && element.contains(document.activeElement)\n}\n\n/\n @internal\n /\nexport function isFocusable(element: HTMLElement): boolean {\n if (\n element.tabIndex > 0 \|\|\n (element.tabIndex === 0 && element.getAttribute('tabIndex') !== null)\n ) {\n return true\n }\n\n if (isHTMLAnchorElement(element)) {\n return Boolean(element.href) && element.rel !== 'ignore'\n }\n\n if (isHTMLInputElement(element)) {\n return element.type !== 'hidden' && element.type !== 'file' && !element.disabled\n }\n\n if (\n isHTMLButtonElement(element) \|\|\n isHTMLSelectElement(element) \|\|\n isHTMLTextAreaElement(element)\n ) {\n return !element.disabled\n }\n\n return false\n}\n\n/\n @internal\n /\nexport function attemptFocus(element: HTMLElement): boolean {\n if (!isFocusable(element)) {\n return false\n }\n\n // globalFocusState.IgnoreUtilFocusChanges = true\n\n try {\n element.focus()\n } catch {\n // ignore\n }\n\n // globalFocusState.IgnoreUtilFocusChanges = false\n\n return document.activeElement === element\n}\n\n/\n @internal\n /\nexport function focusFirstDescendant(element: HTMLElement): boolean {\n for (let i = 0; i < element.childNodes.length; i++) {\n const child = element.childNodes[i]\n\n if (isHTMLElement(child) && (attemptFocus(child) \|\| focusFirstDescendant(child))) {\n return true\n }\n }\n\n return false\n}\n\n/\n @internal\n /\nexport function focusLastDescendant(element: HTMLElement): boolean {\n for (let i = element.childNodes.length - 1; i >= 0; i--) {\n const child = element.childNodes[i]\n\n if (isHTMLElement(child) && (attemptFocus(child) \|\| focusLastDescendant(child))) {\n return true\n }\n }\n\n return false\n}\n","import {useEffect} from 'react'\n\n/\n @beta\n /\nexport function useCustomValidity(\n ref: {current: null \| {setCustomValidity: (validity: string) => void}},\n customValidity: string \| undefined,\n): void {\n useEffect(() => {\n ref.current?.setCustomValidity(customValidity \|\| '')\n }, [customValidity, ref])\n}\n","import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, rem} from '../helpers'\nimport {ThemeProps} from '../types'\n\nexport interface TextInputResponsivePaddingStyleProps {\n $fontSize: number[]\n $iconLeft?: boolean\n $iconRight?: boolean\n $padding: number[]\n $space: number[]\n}\n\nexport function responsiveInputPaddingStyle(\n props: TextInputResponsivePaddingStyleProps & ThemeProps,\n): CSSObject[] {\n const {$fontSize, $iconLeft, $iconRight, $padding, $space} = props\n const {font, media, space} = getTheme_v2(props.theme)\n const len = Math.max($padding.length, $space.length, $fontSize.length)\n const _padding: number[] = []\n const _space: number[] = []\n const _fontSize: number[] = []\n\n for (let i = 0; i < len; i += 1) {\n _fontSize[i] = $fontSize[i] === undefined ? _fontSize[i - 1] : $fontSize[i]\n _padding[i] = $padding[i] === undefined ? _padding[i - 1] : $padding[i]\n _space[i] = $space[i] === undefined ? _space[i - 1] : $space[i]\n }\n\n return _responsive(media, _padding, (_, i) => {\n const size = font.text.sizes[_fontSize[i]] \|\| font.text.sizes[2]\n const emSize = size.lineHeight - size.ascenderHeight - size.descenderHeight\n const p = space[_padding[i]]\n const s = space[_space[i]]\n\n const styles = {\n paddingTop: rem(p - size.ascenderHeight),\n paddingRight: rem(p),\n paddingBottom: rem(p - size.descenderHeight),\n paddingLeft: rem(p),\n }\n\n if ($iconRight) styles.paddingRight = rem(p + emSize + s)\n if ($iconLeft) styles.paddingLeft = rem(p + emSize + s)\n\n return styles\n })\n}\n\nexport function responsiveInputPaddingIconRightStyle(\n props: {\n $fontSize: number[]\n $padding: number[]\n $space: number[]\n } & ThemeProps,\n): CSSObject[] {\n return responsiveInputPaddingStyle({...props, $iconRight: true})\n}\n","import {css} from 'styled-components'\n\nimport {ThemeColorSchemeKey} from '../../../theme/system/color/_system'\nimport {CSSObject} from '../../../theme/system/css'\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {CardTone} from '../../types/card'\nimport {focusRingBorderStyle, focusRingStyle} from '../focusRing'\nimport {_responsive, rem} from '../helpers'\nimport {ThemeProps} from '../types'\n\n/\n @internal\n /\nexport interface TextInputInputStyleProps {\n $fontSize: number[]\n $scheme: ThemeColorSchemeKey\n $tone: CardTone\n $weight?: ThemeFontWeightKey\n}\n\n/\n @internal\n /\nexport interface TextInputRepresentationStyleProps {\n $hasPrefix?: boolean\n $hasSuffix?: boolean\n $scheme: ThemeColorSchemeKey\n $tone: CardTone\n $unstableDisableFocusRing?: boolean\n}\n\nconst ROOT_STYLE = css`\n &:not([hidden]) {\n display: flex;\n }\n\n align-items: center;\n`\n\nexport function textInputRootStyle(): ReturnType<typeof css> {\n return ROOT_STYLE\n}\n\nexport function textInputBaseStyle(\n props: TextInputInputStyleProps & ThemeProps,\n): ReturnType<typeof css> {\n const {$scheme, $tone, $weight} = props\n const {color, font} = getTheme_v2(props.theme)\n\n return css`\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: ${font.text.family};\n font-weight: ${($weight && font.text.weights[$weight]) \|\| font.text.weights.regular};\n margin: 0;\n position: relative;\n z-index: 1;\n display: block;\n\n / NOTE: This is a hack to disable Chrome’s 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='${$scheme}'][data-tone='${$tone}'] {\n --input-fg-color: ${color.input.default.enabled.fg};\n --input-placeholder-color: ${color.input.default.enabled.placeholder};\n\n / enabled /\n &:not(:invalid):not(:disabled):not(:read-only) {\n --input-fg-color: ${color.input.default.enabled.fg};\n --input-placeholder-color: ${color.input.default.enabled.placeholder};\n }\n\n / disabled /\n &:not(:invalid):disabled {\n --input-fg-color: ${color.input.default.disabled.fg};\n --input-placeholder-color: ${color.input.default.disabled.placeholder};\n }\n\n / invalid /\n &:invalid {\n --input-fg-color: ${color.input.invalid.enabled.fg};\n --input-placeholder-color: ${color.input.invalid.enabled.placeholder};\n }\n\n / readOnly /\n &:read-only {\n --input-fg-color: ${color.input.default.readOnly.fg};\n --input-placeholder-color: ${color.input.default.readOnly.placeholder};\n }\n }\n `\n}\n\nexport function textInputFontSizeStyle(props: TextInputInputStyleProps & ThemeProps): CSSObject[] {\n const {font, media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$fontSize, (sizeIndex) => {\n const size = font.text.sizes[sizeIndex] \|\| font.text.sizes[2]\n\n return {\n fontSize: rem(size.fontSize),\n lineHeight: `${size.lineHeight / size.fontSize}`,\n }\n })\n}\n\nexport function textInputRepresentationStyle(\n props: TextInputRepresentationStyleProps & ThemeProps,\n): ReturnType<typeof css> {\n const {$hasPrefix, $hasSuffix, $scheme, $tone, $unstableDisableFocusRing} = props\n const {color, input} = getTheme_v2(props.theme)\n\n return css`\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: ${$hasPrefix ? 0 : undefined};\n border-bottom-left-radius: ${$hasPrefix ? 0 : undefined};\n border-top-right-radius: ${$hasSuffix ? 0 : undefined};\n border-bottom-right-radius: ${$hasSuffix ? 0 : undefined};\n\n &[data-scheme='${$scheme}'][data-tone='${$tone}'] {\n --card-bg-color: ${color.input.default.enabled.bg};\n --card-fg-color: ${color.input.default.enabled.fg};\n\n / enabled /\n :not(:disabled) + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.enabled.border,\n width: input.border.width,\n })};\n }\n\n /* invalid /\n :not(:disabled):invalid + & {\n --card-bg-color: ${color.input.invalid.enabled.bg};\n --card-fg-color: ${color.input.invalid.enabled.fg};\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.enabled.border,\n width: input.border.width,\n })};\n }\n }\n\n /* focused /\n :not(:disabled):focus + & {\n &[data-border] {\n --input-box-shadow: ${\n $unstableDisableFocusRing\n ? undefined\n : focusRingStyle({\n border: {color: color.input.default.enabled.border, width: input.border.width},\n focusRing: input.text.focusRing,\n })\n };\n }\n\n &:not([data-border]) {\n --input-box-shadow: ${\n $unstableDisableFocusRing\n ? undefined\n : focusRingStyle({focusRing: input.text.focusRing})\n };\n }\n }\n\n /* disabled /\n :not(:invalid):disabled + & {\n --card-bg-color: ${color.input.default.disabled.bg} !important;\n --card-fg-color: ${color.input.default.disabled.fg} !important;\n --card-icon-color: ${color.input.default.disabled.fg} !important;\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.disabled.border,\n width: input.border.width,\n })};\n }\n }\n\n :invalid:disabled + & {\n --card-bg-color: ${color.input.invalid.disabled.bg} !important;\n --card-fg-color: ${color.input.invalid.disabled.fg} !important;\n --card-icon-color: ${color.input.invalid.disabled.fg} !important;\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.disabled.border,\n width: input.border.width,\n })};\n }\n }\n\n / readOnly /\n :not(:invalid):read-only + & {\n --card-bg-color: ${color.input.default.readOnly.bg} !important;\n --card-fg-color: ${color.input.default.readOnly.fg} !important;\n }\n\n :invalid:read-only + & {\n --card-bg-color: ${color.input.invalid.readOnly.bg} !important;\n --card-fg-color: ${color.input.invalid.readOnly.fg} !important;\n }\n\n / hovered /\n @media (hover: hover) {\n :not(:disabled):not(:read-only):not(:invalid):hover + & {\n --card-bg-color: ${color.input.default.hovered.bg};\n --card-fg-color: ${color.input.default.hovered.fg};\n }\n\n :invalid:not(:disabled):not(:read-only):hover + & {\n --card-bg-color: ${color.input.invalid.hovered.bg};\n --card-fg-color: ${color.input.invalid.hovered.fg};\n }\n\n :not(:disabled):not(:read-only):not(:invalid):not(:focus):hover + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.hovered.border,\n width: input.border.width,\n })};\n }\n\n :invalid:not(:disabled):not(:read-only):not(:focus):hover + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.hovered.border,\n width: input.border.width,\n })};\n }\n }\n }\n `\n}\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {isValidElement, useCallback, useImperativeHandle, useMemo, useRef} from 'react'\nimport {isValidElementType} from 'react-is'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {EMPTY_RECORD} from '../../constants'\nimport {useCustomValidity} from '../../hooks/useCustomValidity'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {\n responsiveInputPaddingStyle,\n TextInputResponsivePaddingStyleProps,\n} from '../../styles/input/responsiveInputPaddingStyle'\nimport {\n textInputBaseStyle,\n textInputFontSizeStyle,\n TextInputInputStyleProps,\n textInputRepresentationStyle,\n TextInputRepresentationStyleProps,\n textInputRootStyle,\n} from '../../styles/input/textInputStyle'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {useRootTheme} from '../../theme/useRootTheme'\nimport {Radius} from '../../types/radius'\nimport {Box} from '../box/box'\nimport {Button, ButtonOwnProps} from '../button/button'\nimport {Card} from '../card/card'\nimport {Text} from '../text/text'\n\n/\n @public\n /\nexport type TextInputClearButtonProps = ButtonOwnProps &\n Omit<React.HTMLProps<HTMLButtonElement>, 'as' \| 'onClick' \| 'onMouseDown' \| 'ref'>\n\n/\n @public\n /\nexport type TextInputType =\n \| 'search'\n \| 'date'\n \| 'datetime-local'\n \| 'email'\n \| 'url'\n \| 'month'\n \| 'number'\n \| 'password'\n \| 'tel'\n \| 'time'\n \| 'text'\n \| 'week'\n \| 'color'\n\n/\n @public\n /\nexport interface TextInputProps {\n /\n @beta\n /\n __unstable_disableFocusRing?: boolean\n border?: boolean\n /\n @beta\n /\n clearButton?: boolean \| TextInputClearButtonProps\n customValidity?: string\n fontSize?: number \| number[]\n // oxlint-disable-next-line no-redundant-type-constituents\n icon?: React.ElementType \| React.ReactNode\n // oxlint-disable-next-line no-redundant-type-constituents\n iconRight?: React.ElementType \| React.ReactNode\n /\n @beta\n /\n onClear?: () => void\n padding?: number \| number[]\n prefix?: React.ReactNode\n radius?: Radius \| Radius[]\n /\n @deprecated Use `gap` instead.\n /\n space?: never\n gap?: number \| number[]\n suffix?: React.ReactNode\n type?: TextInputType\n weight?: ThemeFontWeightKey\n}\n\nconst CLEAR_BUTTON_BOX_STYLE: React.CSSProperties = {zIndex: 2}\n\nconst StyledTextInput = styled(Card).attrs({forwardedAs: 'span'})(textInputRootStyle)\n\nconst InputRoot = styled.span`\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n`\n\nconst Prefix = styled(Card).attrs({forwardedAs: 'span'})`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n`\n\nconst Suffix = styled(Card).attrs({forwardedAs: 'span'})`\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n`\n\nconst Input = styled.input<TextInputResponsivePaddingStyleProps & TextInputInputStyleProps>(\n responsiveInputPaddingStyle,\n textInputBaseStyle,\n textInputFontSizeStyle,\n)\n\nconst Presentation = styled.span<ResponsiveRadiusStyleProps & TextInputRepresentationStyleProps>(\n responsiveRadiusStyle,\n textInputRepresentationStyle,\n)\n\nconst LeftBox = styled(Box)`\n position: absolute;\n top: 0;\n left: 0;\n`\n\nconst RightBox = styled(Box)`\n position: absolute;\n top: 0;\n right: 0;\n`\n\nconst RightCard = styled(Card)`\n background-color: transparent;\n position: absolute;\n top: 0;\n right: 0;\n`\n\nconst TextInputClearButton = styled(Button)({\n '&:not([hidden])': {\n display: 'block',\n },\n})\n\n/\n Single line text input.\n \n @public\n */\nexport function TextInput(\n props: TextInputProps & Omit<React.HTMLProps<HTMLInputElement>, 'as' \| 'prefix' \| 'type'>,\n) {\n const {\n __unstable_disableFocusRing,\n border = true,\n clearButton,\n disabled = false,\n fontSize: fontSizeProp = 2,\n gap = 3,\n icon: IconComponent,\n iconRight: IconRightComponent,\n onClear,\n padding: paddingProp = 3,\n prefix,\n radius: radiusProp = 2,\n readOnly,\n ref: forwardedRef,\n suffix,\n customValidity,\n type = 'text',\n weight,\n ...restProps\n } = props\n const ref = useRef<HTMLInputElement \| null>(null)\n\n const rootTheme = useRootTheme()\n\n const fontSize = _getArrayProp(fontSizeProp)\n const padding = _getArrayProp(paddingProp)\n const radius = _getArrayProp(radiusProp)\n const space = _getArrayProp(gap)\n\n // Transient properties\n const $hasClearButton = Boolean(clearButton)\n const $hasIcon = Boolean(IconComponent)\n const $hasIconRight = Boolean(IconRightComponent)\n const $hasSuffix = Boolean(suffix)\n const $hasPrefix = Boolean(prefix)\n\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(\n forwardedRef,\n () => ref.current,\n )\n\n useCustomValidity(ref, customValidity)\n\n // Prevent the clear button from taking the focus away from the input\n const handleClearMouseDown = useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n }, [])\n\n const handleClearClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n },\n [onClear, ref],\n )\n\n // Render prefix (memoized)\n const prefixNode = useMemo(\n () =>\n prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n ),\n [prefix, radius],\n )\n\n // Render presentation (memoized)\n const presentationNode = useMemo(\n () => (\n <Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>\n ),\n [\n __unstable_disableFocusRing,\n border,\n fontSize,\n IconComponent,\n IconRightComponent,\n padding,\n radius,\n rootTheme,\n $hasClearButton,\n $hasPrefix,\n $hasSuffix,\n ],\n )\n\n // Render clear button (memoized)\n const clearButtonBoxPadding = useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }),\n [padding],\n )\n const clearButtonPadding = useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }),\n [padding],\n )\n const clearButtonProps: TextInputClearButtonProps = useMemo(\n () => (typeof clearButton === 'object' ? clearButton : EMPTY_RECORD),\n [clearButton],\n )\n const clearButtonNode = useMemo(\n () =>\n !disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n ),\n [\n clearButton,\n clearButtonBoxPadding,\n clearButtonPadding,\n clearButtonProps,\n customValidity,\n disabled,\n fontSize,\n handleClearClick,\n handleClearMouseDown,\n radius,\n readOnly,\n ],\n )\n\n // Render suffix (memoized)\n const suffixNode = useMemo(\n () =>\n suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n ),\n [radius, suffix],\n )\n\n return (\n <StyledTextInput data-ui=\"TextInput\" tone={rootTheme.tone}>\n {prefixNode}\n\n <InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>\n\n {suffixNode}\n </StyledTextInput>\n )\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"textInput-B6ZZJSOj.js","names":["() => {\n ref.current?.setCustomValidity(customValidity \|\| '')\n }","[customValidity, ref]","ref.current?.setCustomValidity","border = true","disabled = false","fontSizeProp = 2","gap = 3","paddingProp = 3","radiusProp = 2","type = 'text'","_getArrayProp(fontSizeProp)","_getArrayProp(paddingProp)","_getArrayProp(radiusProp)","_getArrayProp(gap)","() => ref.current","useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n }, [])","(event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n }","useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n },\n [onClear, ref],\n )","prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n )","useMemo(\n () =>\n prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n ),\n [prefix, radius],\n )","IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )","!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )","<Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>","scheme","tone","border ? '' : undefined","useMemo(\n () => (\n <Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>\n ),\n [\n __unstable_disableFocusRing,\n border,\n fontSize,\n IconComponent,\n IconRightComponent,\n padding,\n radius,\n rootTheme,\n $hasClearButton,\n $hasPrefix,\n $hasSuffix,\n ],\n )","padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n })","(v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }","useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }),\n [padding],\n )","padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n })","(v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }","useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }),\n [padding],\n )","!disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n )","useMemo(\n () =>\n !disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n ),\n [\n clearButton,\n clearButtonBoxPadding,\n clearButtonPadding,\n clearButtonProps,\n customValidity,\n disabled,\n fontSize,\n handleClearClick,\n handleClearMouseDown,\n radius,\n readOnly,\n ],\n )","suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n )","useMemo(\n () =>\n suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n ),\n [radius, suffix],\n )","<Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />","$hasIconRight \|\| $hasClearButton","<InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>","<StyledTextInput data-ui=\"TextInput\" tone={rootTheme.tone}>\n {prefixNode}\n\n <InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>\n\n {suffixNode}\n </StyledTextInput>","v"],"sources":["../src/core/helpers/animation.ts","../src/core/helpers/focus.ts","../src/core/hooks/useCustomValidity.ts","../src/core/styles/input/responsiveInputPaddingStyle.ts","../src/core/styles/input/textInputStyle.ts","../src/core/primitives/textInput/textInput.tsx"],"sourcesContent":["/*\n @internal\n /\nexport function _raf(fn: () => void): () => void {\n const frameId = requestAnimationFrame(fn)\n\n return () => {\n cancelAnimationFrame(frameId)\n }\n}\n\n/\n @internal\n /\nexport function _raf2(fn: () => void): () => void {\n let innerDispose: (() => void) \| null = null\n\n const outerDispose = _raf(() => {\n innerDispose = _raf(fn)\n })\n\n return () => {\n if (innerDispose) innerDispose()\n\n outerDispose()\n }\n}\n","import {\n isHTMLAnchorElement,\n isHTMLButtonElement,\n isHTMLElement,\n isHTMLInputElement,\n isHTMLSelectElement,\n isHTMLTextAreaElement,\n} from './element'\n\n// export const globalFocusState = {\n// IgnoreUtilFocusChanges: false,\n// }\n\n/\n @internal\n /\nexport function _hasFocus(element: HTMLElement): boolean {\n return Boolean(document.activeElement) && element.contains(document.activeElement)\n}\n\n/\n @internal\n /\nexport function isFocusable(element: HTMLElement): boolean {\n if (\n element.tabIndex > 0 \|\|\n (element.tabIndex === 0 && element.getAttribute('tabIndex') !== null)\n ) {\n return true\n }\n\n if (isHTMLAnchorElement(element)) {\n return Boolean(element.href) && element.rel !== 'ignore'\n }\n\n if (isHTMLInputElement(element)) {\n return element.type !== 'hidden' && element.type !== 'file' && !element.disabled\n }\n\n if (\n isHTMLButtonElement(element) \|\|\n isHTMLSelectElement(element) \|\|\n isHTMLTextAreaElement(element)\n ) {\n return !element.disabled\n }\n\n return false\n}\n\n/\n @internal\n /\nexport function attemptFocus(element: HTMLElement): boolean {\n if (!isFocusable(element)) {\n return false\n }\n\n // globalFocusState.IgnoreUtilFocusChanges = true\n\n try {\n element.focus()\n } catch {\n // ignore\n }\n\n // globalFocusState.IgnoreUtilFocusChanges = false\n\n return document.activeElement === element\n}\n\n/\n @internal\n /\nexport function focusFirstDescendant(element: HTMLElement): boolean {\n for (let i = 0; i < element.childNodes.length; i++) {\n const child = element.childNodes[i]\n\n if (isHTMLElement(child) && (attemptFocus(child) \|\| focusFirstDescendant(child))) {\n return true\n }\n }\n\n return false\n}\n\n/\n @internal\n /\nexport function focusLastDescendant(element: HTMLElement): boolean {\n for (let i = element.childNodes.length - 1; i >= 0; i--) {\n const child = element.childNodes[i]\n\n if (isHTMLElement(child) && (attemptFocus(child) \|\| focusLastDescendant(child))) {\n return true\n }\n }\n\n return false\n}\n","import {useEffect} from 'react'\n\n/\n @beta\n /\nexport function useCustomValidity(\n ref: {current: null \| {setCustomValidity: (validity: string) => void}},\n customValidity: string \| undefined,\n): void {\n useEffect(() => {\n ref.current?.setCustomValidity(customValidity \|\| '')\n }, [customValidity, ref])\n}\n","import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, rem} from '../helpers'\nimport {ThemeProps} from '../types'\n\nexport interface TextInputResponsivePaddingStyleProps {\n $fontSize: number[]\n $iconLeft?: boolean\n $iconRight?: boolean\n $padding: number[]\n $space: number[]\n}\n\nexport function responsiveInputPaddingStyle(\n props: TextInputResponsivePaddingStyleProps & ThemeProps,\n): CSSObject[] {\n const {$fontSize, $iconLeft, $iconRight, $padding, $space} = props\n const {font, media, space} = getTheme_v2(props.theme)\n const len = Math.max($padding.length, $space.length, $fontSize.length)\n const _padding: number[] = []\n const _space: number[] = []\n const _fontSize: number[] = []\n\n for (let i = 0; i < len; i += 1) {\n _fontSize[i] = $fontSize[i] === undefined ? _fontSize[i - 1] : $fontSize[i]\n _padding[i] = $padding[i] === undefined ? _padding[i - 1] : $padding[i]\n _space[i] = $space[i] === undefined ? _space[i - 1] : $space[i]\n }\n\n return _responsive(media, _padding, (_, i) => {\n const size = font.text.sizes[_fontSize[i]] \|\| font.text.sizes[2]\n const emSize = size.lineHeight - size.ascenderHeight - size.descenderHeight\n const p = space[_padding[i]]\n const s = space[_space[i]]\n\n const styles = {\n paddingTop: rem(p - size.ascenderHeight),\n paddingRight: rem(p),\n paddingBottom: rem(p - size.descenderHeight),\n paddingLeft: rem(p),\n }\n\n if ($iconRight) styles.paddingRight = rem(p + emSize + s)\n if ($iconLeft) styles.paddingLeft = rem(p + emSize + s)\n\n return styles\n })\n}\n\nexport function responsiveInputPaddingIconRightStyle(\n props: {\n $fontSize: number[]\n $padding: number[]\n $space: number[]\n } & ThemeProps,\n): CSSObject[] {\n return responsiveInputPaddingStyle({...props, $iconRight: true})\n}\n","import {css} from 'styled-components'\n\nimport {ThemeColorSchemeKey} from '../../../theme/system/color/_system'\nimport {CSSObject} from '../../../theme/system/css'\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {CardTone} from '../../types/card'\nimport {focusRingBorderStyle, focusRingStyle} from '../focusRing'\nimport {_responsive, rem} from '../helpers'\nimport {ThemeProps} from '../types'\n\n/\n @internal\n /\nexport interface TextInputInputStyleProps {\n $fontSize: number[]\n $scheme: ThemeColorSchemeKey\n $tone: CardTone\n $weight?: ThemeFontWeightKey\n}\n\n/\n @internal\n /\nexport interface TextInputRepresentationStyleProps {\n $hasPrefix?: boolean\n $hasSuffix?: boolean\n $scheme: ThemeColorSchemeKey\n $tone: CardTone\n $unstableDisableFocusRing?: boolean\n}\n\nconst ROOT_STYLE = css`\n &:not([hidden]) {\n display: flex;\n }\n\n align-items: center;\n`\n\nexport function textInputRootStyle(): ReturnType<typeof css> {\n return ROOT_STYLE\n}\n\nexport function textInputBaseStyle(\n props: TextInputInputStyleProps & ThemeProps,\n): ReturnType<typeof css> {\n const {$scheme, $tone, $weight} = props\n const {color, font} = getTheme_v2(props.theme)\n\n return css`\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: ${font.text.family};\n font-weight: ${($weight && font.text.weights[$weight]) \|\| font.text.weights.regular};\n margin: 0;\n position: relative;\n z-index: 1;\n display: block;\n\n / NOTE: This is a hack to disable Chrome’s 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='${$scheme}'][data-tone='${$tone}'] {\n --input-fg-color: ${color.input.default.enabled.fg};\n --input-placeholder-color: ${color.input.default.enabled.placeholder};\n\n / enabled /\n &:not(:invalid):not(:disabled):not(:read-only) {\n --input-fg-color: ${color.input.default.enabled.fg};\n --input-placeholder-color: ${color.input.default.enabled.placeholder};\n }\n\n / disabled /\n &:not(:invalid):disabled {\n --input-fg-color: ${color.input.default.disabled.fg};\n --input-placeholder-color: ${color.input.default.disabled.placeholder};\n }\n\n / invalid /\n &:invalid {\n --input-fg-color: ${color.input.invalid.enabled.fg};\n --input-placeholder-color: ${color.input.invalid.enabled.placeholder};\n }\n\n / readOnly /\n &:read-only {\n --input-fg-color: ${color.input.default.readOnly.fg};\n --input-placeholder-color: ${color.input.default.readOnly.placeholder};\n }\n }\n `\n}\n\nexport function textInputFontSizeStyle(props: TextInputInputStyleProps & ThemeProps): CSSObject[] {\n const {font, media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$fontSize, (sizeIndex) => {\n const size = font.text.sizes[sizeIndex] \|\| font.text.sizes[2]\n\n return {\n fontSize: rem(size.fontSize),\n lineHeight: `${size.lineHeight / size.fontSize}`,\n }\n })\n}\n\nexport function textInputRepresentationStyle(\n props: TextInputRepresentationStyleProps & ThemeProps,\n): ReturnType<typeof css> {\n const {$hasPrefix, $hasSuffix, $scheme, $tone, $unstableDisableFocusRing} = props\n const {color, input} = getTheme_v2(props.theme)\n\n return css`\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: ${$hasPrefix ? 0 : undefined};\n border-bottom-left-radius: ${$hasPrefix ? 0 : undefined};\n border-top-right-radius: ${$hasSuffix ? 0 : undefined};\n border-bottom-right-radius: ${$hasSuffix ? 0 : undefined};\n\n &[data-scheme='${$scheme}'][data-tone='${$tone}'] {\n --card-bg-color: ${color.input.default.enabled.bg};\n --card-fg-color: ${color.input.default.enabled.fg};\n\n / enabled /\n :not(:disabled) + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.enabled.border,\n width: input.border.width,\n })};\n }\n\n /* invalid /\n :not(:disabled):invalid + & {\n --card-bg-color: ${color.input.invalid.enabled.bg};\n --card-fg-color: ${color.input.invalid.enabled.fg};\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.enabled.border,\n width: input.border.width,\n })};\n }\n }\n\n /* focused /\n :not(:disabled):focus + & {\n &[data-border] {\n --input-box-shadow: ${\n $unstableDisableFocusRing\n ? undefined\n : focusRingStyle({\n border: {color: color.input.default.enabled.border, width: input.border.width},\n focusRing: input.text.focusRing,\n })\n };\n }\n\n &:not([data-border]) {\n --input-box-shadow: ${\n $unstableDisableFocusRing\n ? undefined\n : focusRingStyle({focusRing: input.text.focusRing})\n };\n }\n }\n\n /* disabled /\n :not(:invalid):disabled + & {\n --card-bg-color: ${color.input.default.disabled.bg} !important;\n --card-fg-color: ${color.input.default.disabled.fg} !important;\n --card-icon-color: ${color.input.default.disabled.fg} !important;\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.disabled.border,\n width: input.border.width,\n })};\n }\n }\n\n :invalid:disabled + & {\n --card-bg-color: ${color.input.invalid.disabled.bg} !important;\n --card-fg-color: ${color.input.invalid.disabled.fg} !important;\n --card-icon-color: ${color.input.invalid.disabled.fg} !important;\n\n &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.disabled.border,\n width: input.border.width,\n })};\n }\n }\n\n / readOnly /\n :not(:invalid):read-only + & {\n --card-bg-color: ${color.input.default.readOnly.bg} !important;\n --card-fg-color: ${color.input.default.readOnly.fg} !important;\n }\n\n :invalid:read-only + & {\n --card-bg-color: ${color.input.invalid.readOnly.bg} !important;\n --card-fg-color: ${color.input.invalid.readOnly.fg} !important;\n }\n\n / hovered /\n @media (hover: hover) {\n :not(:disabled):not(:read-only):not(:invalid):hover + & {\n --card-bg-color: ${color.input.default.hovered.bg};\n --card-fg-color: ${color.input.default.hovered.fg};\n }\n\n :invalid:not(:disabled):not(:read-only):hover + & {\n --card-bg-color: ${color.input.invalid.hovered.bg};\n --card-fg-color: ${color.input.invalid.hovered.fg};\n }\n\n :not(:disabled):not(:read-only):not(:invalid):not(:focus):hover + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.default.hovered.border,\n width: input.border.width,\n })};\n }\n\n :invalid:not(:disabled):not(:read-only):not(:focus):hover + &[data-border] {\n --input-box-shadow: ${focusRingBorderStyle({\n color: color.input.invalid.hovered.border,\n width: input.border.width,\n })};\n }\n }\n }\n `\n}\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {isValidElement, useCallback, useImperativeHandle, useMemo, useRef} from 'react'\nimport {isValidElementType} from 'react-is'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {EMPTY_RECORD} from '../../constants'\nimport {useCustomValidity} from '../../hooks/useCustomValidity'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {\n responsiveInputPaddingStyle,\n TextInputResponsivePaddingStyleProps,\n} from '../../styles/input/responsiveInputPaddingStyle'\nimport {\n textInputBaseStyle,\n textInputFontSizeStyle,\n TextInputInputStyleProps,\n textInputRepresentationStyle,\n TextInputRepresentationStyleProps,\n textInputRootStyle,\n} from '../../styles/input/textInputStyle'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {useRootTheme} from '../../theme/useRootTheme'\nimport {Radius} from '../../types/radius'\nimport {Box} from '../box/box'\nimport {Button, ButtonOwnProps} from '../button/button'\nimport {Card} from '../card/card'\nimport {Text} from '../text/text'\n\n/\n @public\n /\nexport type TextInputClearButtonProps = ButtonOwnProps &\n Omit<React.HTMLProps<HTMLButtonElement>, 'as' \| 'onClick' \| 'onMouseDown' \| 'ref'>\n\n/\n @public\n /\nexport type TextInputType =\n \| 'search'\n \| 'date'\n \| 'datetime-local'\n \| 'email'\n \| 'url'\n \| 'month'\n \| 'number'\n \| 'password'\n \| 'tel'\n \| 'time'\n \| 'text'\n \| 'week'\n \| 'color'\n\n/\n @public\n /\nexport interface TextInputProps {\n /\n @beta\n /\n __unstable_disableFocusRing?: boolean\n border?: boolean\n /\n @beta\n /\n clearButton?: boolean \| TextInputClearButtonProps\n customValidity?: string\n fontSize?: number \| number[]\n // oxlint-disable-next-line no-redundant-type-constituents\n icon?: React.ElementType \| React.ReactNode\n // oxlint-disable-next-line no-redundant-type-constituents\n iconRight?: React.ElementType \| React.ReactNode\n /\n @beta\n /\n onClear?: () => void\n padding?: number \| number[]\n prefix?: React.ReactNode\n radius?: Radius \| Radius[]\n /\n @deprecated Use `gap` instead.\n /\n space?: never\n gap?: number \| number[]\n suffix?: React.ReactNode\n type?: TextInputType\n weight?: ThemeFontWeightKey\n}\n\nconst CLEAR_BUTTON_BOX_STYLE: React.CSSProperties = {zIndex: 2}\n\nconst StyledTextInput = styled(Card).attrs({forwardedAs: 'span'})(textInputRootStyle)\n\nconst InputRoot = styled.span`\n flex: 1;\n min-width: 0;\n display: block;\n position: relative;\n`\n\nconst Prefix = styled(Card).attrs({forwardedAs: 'span'})`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n`\n\nconst Suffix = styled(Card).attrs({forwardedAs: 'span'})`\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n & > span {\n display: block;\n margin: -1px;\n }\n`\n\nconst Input = styled.input<TextInputResponsivePaddingStyleProps & TextInputInputStyleProps>(\n responsiveInputPaddingStyle,\n textInputBaseStyle,\n textInputFontSizeStyle,\n)\n\nconst Presentation = styled.span<ResponsiveRadiusStyleProps & TextInputRepresentationStyleProps>(\n responsiveRadiusStyle,\n textInputRepresentationStyle,\n)\n\nconst LeftBox = styled(Box)`\n position: absolute;\n top: 0;\n left: 0;\n`\n\nconst RightBox = styled(Box)`\n position: absolute;\n top: 0;\n right: 0;\n`\n\nconst RightCard = styled(Card)`\n background-color: transparent;\n position: absolute;\n top: 0;\n right: 0;\n`\n\nconst TextInputClearButton = styled(Button)({\n '&:not([hidden])': {\n display: 'block',\n },\n})\n\n/\n Single line text input.\n \n @public\n */\nexport function TextInput(\n props: TextInputProps & Omit<React.HTMLProps<HTMLInputElement>, 'as' \| 'prefix' \| 'type'>,\n) {\n const {\n __unstable_disableFocusRing,\n border = true,\n clearButton,\n disabled = false,\n fontSize: fontSizeProp = 2,\n gap = 3,\n icon: IconComponent,\n iconRight: IconRightComponent,\n onClear,\n padding: paddingProp = 3,\n prefix,\n radius: radiusProp = 2,\n readOnly,\n ref: forwardedRef,\n suffix,\n customValidity,\n type = 'text',\n weight,\n ...restProps\n } = props\n const ref = useRef<HTMLInputElement \| null>(null)\n\n const rootTheme = useRootTheme()\n\n const fontSize = _getArrayProp(fontSizeProp)\n const padding = _getArrayProp(paddingProp)\n const radius = _getArrayProp(radiusProp)\n const space = _getArrayProp(gap)\n\n // Transient properties\n const $hasClearButton = Boolean(clearButton)\n const $hasIcon = Boolean(IconComponent)\n const $hasIconRight = Boolean(IconRightComponent)\n const $hasSuffix = Boolean(suffix)\n const $hasPrefix = Boolean(prefix)\n\n useImperativeHandle<HTMLInputElement \| null, HTMLInputElement \| null>(\n forwardedRef,\n () => ref.current,\n )\n\n useCustomValidity(ref, customValidity)\n\n // Prevent the clear button from taking the focus away from the input\n const handleClearMouseDown = useCallback((event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n }, [])\n\n const handleClearClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n event.preventDefault()\n event.stopPropagation()\n\n if (onClear) onClear()\n\n // Focus the input, in case focus has been lost when clicking the clear button\n ref.current?.focus()\n },\n [onClear, ref],\n )\n\n // Render prefix (memoized)\n const prefixNode = useMemo(\n () =>\n prefix && (\n <Prefix borderTop borderLeft borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{prefix}</span>\n </Prefix>\n ),\n [prefix, radius],\n )\n\n // Render presentation (memoized)\n const presentationNode = useMemo(\n () => (\n <Presentation\n $hasPrefix={$hasPrefix}\n $unstableDisableFocusRing={__unstable_disableFocusRing}\n $hasSuffix={$hasSuffix}\n $radius={radius}\n $scheme={rootTheme.scheme}\n $tone={rootTheme.tone}\n data-border={border ? '' : undefined}\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n >\n {IconComponent && (\n <LeftBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </LeftBox>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <RightBox padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </RightBox>\n )}\n </Presentation>\n ),\n [\n __unstable_disableFocusRing,\n border,\n fontSize,\n IconComponent,\n IconRightComponent,\n padding,\n radius,\n rootTheme,\n $hasClearButton,\n $hasPrefix,\n $hasSuffix,\n ],\n )\n\n // Render clear button (memoized)\n const clearButtonBoxPadding = useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 1\n if (v === 2) return 1\n\n return v - 2\n }),\n [padding],\n )\n const clearButtonPadding = useMemo(\n () =>\n padding.map((v) => {\n if (v === 0) return 0\n if (v === 1) return 0\n if (v === 2) return 1\n\n return v - 1\n }),\n [padding],\n )\n const clearButtonProps: TextInputClearButtonProps = useMemo(\n () => (typeof clearButton === 'object' ? clearButton : EMPTY_RECORD),\n [clearButton],\n )\n const clearButtonNode = useMemo(\n () =>\n !disabled &&\n !readOnly &&\n clearButton && (\n <RightCard\n forwardedAs=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <TextInputClearButton\n aria-label=\"Clear\"\n data-qa=\"clear-button\"\n fontSize={fontSize}\n icon={CloseIcon}\n mode=\"bleed\"\n padding={clearButtonPadding}\n radius={radius}\n {...clearButtonProps}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </RightCard>\n ),\n [\n clearButton,\n clearButtonBoxPadding,\n clearButtonPadding,\n clearButtonProps,\n customValidity,\n disabled,\n fontSize,\n handleClearClick,\n handleClearMouseDown,\n radius,\n readOnly,\n ],\n )\n\n // Render suffix (memoized)\n const suffixNode = useMemo(\n () =>\n suffix && (\n <Suffix borderTop borderRight borderBottom radius={radius} sizing=\"border\" tone=\"inherit\">\n <span>{suffix}</span>\n </Suffix>\n ),\n [radius, suffix],\n )\n\n return (\n <StyledTextInput data-ui=\"TextInput\" tone={rootTheme.tone}>\n {prefixNode}\n\n <InputRoot>\n <Input\n data-as=\"input\"\n data-scheme={rootTheme.scheme}\n data-tone={rootTheme.tone}\n {...restProps}\n $fontSize={fontSize}\n $iconLeft={$hasIcon}\n $iconRight={$hasIconRight \|\| $hasClearButton}\n $padding={padding}\n $scheme={rootTheme.scheme}\n $space={space}\n $tone={rootTheme.tone}\n $weight={weight}\n disabled={disabled}\n readOnly={readOnly}\n ref={ref}\n type={type}\n />\n\n {presentationNode}\n {clearButtonNode}\n </InputRoot>\n\n {suffixNode}\n </StyledTextInput>\n )\n}\n"],"mappings":"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"}

package/dist/toast.js CHANGED Viewed

@@ -1,10 +1,10 @@
 "use client";
 import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
-import { d as createGlobalScopedContext, i as usePrefersReducedMotion, n as LayerProvider, r as isRecord, s as Card, t as useLayer, y as Box } from "./useLayer-DzgZ2cTe.js";
-import { t as Flex } from "./flex-CDMKJ54v.js";
-import { n as Text, t as Stack } from "./stack-BKKeh5M0.js";
-import { t as Button } from "./button-DPIMguMh.js";
-import { t as Grid } from "./grid-CFhbAO8d.js";
+import { d as createGlobalScopedContext, i as usePrefersReducedMotion, n as LayerProvider, r as isRecord, s as Card, t as useLayer, y as Box } from "./useLayer-jUJIz8mh.js";
+import { t as Flex } from "./flex-CySCBzQm.js";
+import { n as Text, t as Stack } from "./stack-BGFEokua.js";
+import { t as Button } from "./button-DQH2KIbq.js";
+import { t as Grid } from "./grid-I2TNptX-.js";
 import { c } from "react/compiler-runtime";
 import { startTransition, useContext, useState, useSyncExternalStore } from "react";
 import { styled } from "styled-components";

package/dist/toast.js.map CHANGED Viewed

	@@ -1 +1 @@
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']","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 )","<TextBox 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 </TextBox>","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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )","<MotionToast\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 forwardedAs=\"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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )}\n </MotionToast>","hasDuration ? '' : undefined","() => true","() => false","padding = 4","gap = 3","{zIndex}","<StyledLayer\n forwardedAs=\"ul\"\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 </StyledLayer>","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.tsx","../src/core/hooks/useMounted.ts","../src/core/components/toast/toastContext.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 {styled} from 'styled-components'\n\nimport {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {Card, type CardProps} from '../../primitives/card/card'\nimport {Flex} from '../../primitives/flex/flex'\nimport type {ButtonTone} from '../../types/button'\n\nconst LOADING_BAR_HEIGHT = 2\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\nexport const TextBox = styled(Flex)`\n overflow-x: auto;\n`\n\nexport const StyledToast = styled(Card)`\n pointer-events: all;\n width: 100%;\n position: relative;\n overflow: hidden;\n overflow: clip;\n\n &[data-has-duration] {\n padding-bottom: calc(${LOADING_BAR_HEIGHT}px / 2);\n }\n`\n\nexport const LoadingBar = styled.div`\n display: flex;\n position: absolute;\n bottom: 0px;\n top: 0px;\n left: 0px;\n right: 0px;\n pointer-events: none;\n z-index: -1;\n overflow: hidden;\n overflow: clip;\n background: transparent;\n align-items: flex-end;\n will-change: opacity;\n`\n\nexport const LoadingBarMask = styled(Card)`\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 z-index: 1;\n`\n\ntype LoadingBarProgressProps = Omit<CardProps, 'tone'> & {\n tone: ThemeColorStateToneKey\n}\nexport const LoadingBarProgress = styled<React.ComponentType<LoadingBarProgressProps>>(Card)`\n display: block;\n height: 100%;\n width: 100%;\n transform-origin: 0% 50%;\n background-color: ${(props) => {\n const {color} = getTheme_v2(props.theme)\n\n return color.button.default[props.tone].enabled.bg\n }};\n`\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {motion, stagger, type Variant, type Variants} from 'motion/react'\n\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {Box} from '../../primitives/box/box'\nimport {Button} from '../../primitives/button/button'\nimport {Flex} from '../../primitives/flex/flex'\nimport {Stack} from '../../primitives/stack/stack'\nimport {Text} from '../../primitives/text/text'\nimport {\n BUTTON_TONE,\n LoadingBar,\n LoadingBarMask,\n LoadingBarProgress,\n STATUS_CARD_TONE,\n StyledToast,\n TextBox,\n} from './styles'\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 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 <MotionToast\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 forwardedAs=\"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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )}\n </MotionToast>\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 MotionToast = motion.create(StyledToast)\nconst MotionFlex = motion.create(Flex)\nconst MotionText = motion.create(Text)\nconst MotionLoadingBar = motion.create(LoadingBar)\nconst MotionLoadingBarProgress = motion.create(LoadingBarProgress)\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 {styled} from 'styled-components'\n\nimport {Grid} from '../../primitives/grid/grid'\nimport {useLayer} from '../../utils/layer/useLayer'\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 <StyledLayer\n forwardedAs=\"ul\"\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 </StyledLayer>\n )\n}\n\nconst StyledLayer = styled(Grid)`\n box-sizing: border-box;\n position: fixed;\n right: 0;\n bottom: 0;\n list-style: none;\n pointer-events: none;\n max-width: 420px;\n width: 100%;\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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"}
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']","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 )","<TextBox 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 </TextBox>","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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )","<MotionToast\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 forwardedAs=\"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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )}\n </MotionToast>","hasDuration ? '' : undefined","() => true","() => false","padding = 4","gap = 3","{zIndex}","<StyledLayer\n forwardedAs=\"ul\"\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 </StyledLayer>","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.tsx","../src/core/hooks/useMounted.ts","../src/core/components/toast/toastContext.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 {styled} from 'styled-components'\n\nimport {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {Card, type CardProps} from '../../primitives/card/card'\nimport {Flex} from '../../primitives/flex/flex'\nimport type {ButtonTone} from '../../types/button'\n\nconst LOADING_BAR_HEIGHT = 2\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\nexport const TextBox = styled(Flex)`\n overflow-x: auto;\n`\n\nexport const StyledToast = styled(Card)`\n pointer-events: all;\n width: 100%;\n position: relative;\n overflow: hidden;\n overflow: clip;\n\n &[data-has-duration] {\n padding-bottom: calc(${LOADING_BAR_HEIGHT}px / 2);\n }\n`\n\nexport const LoadingBar = styled.div`\n display: flex;\n position: absolute;\n bottom: 0px;\n top: 0px;\n left: 0px;\n right: 0px;\n pointer-events: none;\n z-index: -1;\n overflow: hidden;\n overflow: clip;\n background: transparent;\n align-items: flex-end;\n will-change: opacity;\n`\n\nexport const LoadingBarMask = styled(Card)`\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 z-index: 1;\n`\n\ntype LoadingBarProgressProps = Omit<CardProps, 'tone'> & {\n tone: ThemeColorStateToneKey\n}\nexport const LoadingBarProgress = styled<React.ComponentType<LoadingBarProgressProps>>(Card)`\n display: block;\n height: 100%;\n width: 100%;\n transform-origin: 0% 50%;\n background-color: ${(props) => {\n const {color} = getTheme_v2(props.theme)\n\n return color.button.default[props.tone].enabled.bg\n }};\n`\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {motion, stagger, type Variant, type Variants} from 'motion/react'\n\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {Box} from '../../primitives/box/box'\nimport {Button} from '../../primitives/button/button'\nimport {Flex} from '../../primitives/flex/flex'\nimport {Stack} from '../../primitives/stack/stack'\nimport {Text} from '../../primitives/text/text'\nimport {\n BUTTON_TONE,\n LoadingBar,\n LoadingBarMask,\n LoadingBarProgress,\n STATUS_CARD_TONE,\n StyledToast,\n TextBox,\n} from './styles'\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 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 <MotionToast\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 forwardedAs=\"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 <TextBox 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 </TextBox>\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 <MotionLoadingBar variants={content} transition={transition}>\n <LoadingBarMask tone={cardTone} radius={radius} />\n <MotionLoadingBarProgress\n key={`progress-${updatedAt}`}\n tone={cardTone}\n initial={{scaleX: 0}}\n animate={{scaleX: 1}}\n transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n onAnimationComplete={onClose}\n />\n </MotionLoadingBar>\n )}\n </MotionToast>\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 MotionToast = motion.create(StyledToast)\nconst MotionFlex = motion.create(Flex)\nconst MotionText = motion.create(Text)\nconst MotionLoadingBar = motion.create(LoadingBar)\nconst MotionLoadingBarProgress = motion.create(LoadingBarProgress)\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 {styled} from 'styled-components'\n\nimport {Grid} from '../../primitives/grid/grid'\nimport {useLayer} from '../../utils/layer/useLayer'\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 <StyledLayer\n forwardedAs=\"ul\"\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 </StyledLayer>\n )\n}\n\nconst StyledLayer = styled(Grid)`\n box-sizing: border-box;\n position: fixed;\n right: 0;\n bottom: 0;\n list-style: none;\n pointer-events: none;\n max-width: 420px;\n width: 100%;\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.js CHANGED Viewed

@@ -1,9 +1,9 @@
 "use client";
-import { c as POPOVER_MOTION_PROPS, n as _getArrayProp } from "./helpers-CmuDTEVl.js";
-import { _ as useTheme_v2, d as createGlobalScopedContext, i as usePrefersReducedMotion, s as Card } from "./useLayer-DzgZ2cTe.js";
+import { c as POPOVER_MOTION_PROPS, n as _getArrayProp } from "./helpers-C8xxXAQC.js";
+import { _ as useTheme_v2, d as createGlobalScopedContext, i as usePrefersReducedMotion, s as Card } from "./useLayer-jUJIz8mh.js";
 import { n as AnimateActivity, r as origin, t as getElementRef } from "./getElementRef-5HZQ-Owu.js";
-import { a as useBoundaryElement, n as Portal, r as usePortal, t as Arrow } from "./arrow-BBpqkhzC.js";
-import { t as Layer } from "./layer-BQuAIq9M.js";
+import { a as useBoundaryElement, n as Portal, r as usePortal, t as Arrow } from "./arrow-CL8xmdbg.js";
+import { t as Layer } from "./layer-DGn7KJIB.js";
 import { c } from "react/compiler-runtime";
 import { Activity, cloneElement, useContext, useEffect, useId, useImperativeHandle, useLayoutEffect, useRef, useState } from "react";
 import { styled } from "styled-components";
@@ -117,13 +117,13 @@ const DEFAULT_FALLBACK_PLACEMENTS = {
 	]
 }, MotionCard = styled(motion.create(Card)).withConfig({
 	displayName: "MotionCard",
-	componentId: "sc-49dg4z-0"
+	componentId: "sc-0hzi5o-0"
 })`will-change:transform;`;
 /**
 * @internal
 */
 function TooltipCard(props) {
-	let $ = c(49), animate, arrow, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, ref, restProps, scheme, shadow, style;
+	let $ = c(41), animate, arrow, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, ref, restProps, scheme, shadow, style;
 	$[0] === props ? (animate = $[1], arrow = $[2], arrowRef = $[3], arrowX = $[4], arrowY = $[5], children = $[6], originX = $[7], originY = $[8], padding = $[9], placement = $[10], radius = $[11], ref = $[12], restProps = $[13], scheme = $[14], shadow = $[15], style = $[16]) : ({animate, arrow, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, ref, scheme, shadow, style, ...restProps} = props, $[0] = props, $[1] = animate, $[2] = arrow, $[3] = arrowRef, $[4] = arrowX, $[5] = arrowY, $[6] = children, $[7] = originX, $[8] = originY, $[9] = padding, $[10] = placement, $[11] = radius, $[12] = ref, $[13] = restProps, $[14] = scheme, $[15] = shadow, $[16] = style);
 	let t0 = animate ? "transform" : void 0, t1;
 	$[17] !== originX || $[18] !== originY || $[19] !== style || $[20] !== t0 ? (t1 = {
@@ -139,22 +139,16 @@ function TooltipCard(props) {
 		right: void 0,
 		bottom: void 0
 	}, $[22] = t2, $[23] = t3, $[24] = t4) : t4 = $[24];
-	let arrowStyle = t4, t5;
-	$[25] === animate ? t5 = $[26] : (t5 = animate ? ["hidden", "initial"] : void 0, $[25] = animate, $[26] = t5);
-	let t6;
-	$[27] === animate ? t6 = $[28] : (t6 = animate ? ["visible", "scaleIn"] : void 0, $[27] = animate, $[28] = t6);
-	let t7;
-	$[29] === animate ? t7 = $[30] : (t7 = animate ? ["hidden", "scaleOut"] : void 0, $[29] = animate, $[30] = t7);
-	let t8;
-	$[31] !== arrow || $[32] !== arrowRef || $[33] !== arrowStyle ? (t8 = arrow && /* @__PURE__ */ jsx(Arrow, {
+	let arrowStyle = t4, t5 = animate ? POPOVER_MOTION_PROPS : void 0, t6;
+	$[25] !== arrow || $[26] !== arrowRef || $[27] !== arrowStyle ? (t6 = arrow && /* @__PURE__ */ jsx(Arrow, {
 		ref: arrowRef,
 		style: arrowStyle,
 		width: 15,
 		height: 6,
 		radius: 2
-	}), $[31] = arrow, $[32] = arrowRef, $[33] = arrowStyle, $[34] = t8) : t8 = $[34];
-	let t9;
-	return $[35] !== children || $[36] !== padding || $[37] !== placement || $[38] !== radius || $[39] !== ref || $[40] !== restProps || $[41] !== rootStyle || $[42] !== scheme || $[43] !== shadow || $[44] !== t5 || $[45] !== t6 || $[46] !== t7 || $[47] !== t8 ? (t9 = /* @__PURE__ */ jsxs(MotionCard, {
+	}), $[25] = arrow, $[26] = arrowRef, $[27] = arrowStyle, $[28] = t6) : t6 = $[28];
+	let t7;
+	return $[29] !== children || $[30] !== padding || $[31] !== placement || $[32] !== radius || $[33] !== ref || $[34] !== restProps || $[35] !== rootStyle || $[36] !== scheme || $[37] !== shadow || $[38] !== t5 || $[39] !== t6 ? (t7 = /* @__PURE__ */ jsxs(MotionCard, {
 		"data-ui": "Tooltip__card",
 		...restProps,
 		"data-placement": placement,
@@ -164,13 +158,9 @@ function TooltipCard(props) {
 		scheme,
 		shadow,
 		style: rootStyle,
-		variants: POPOVER_MOTION_PROPS.card,
-		transition: POPOVER_MOTION_PROPS.transition,
-		initial: t5,
-		animate: t6,
-		exit: t7,
-		children: [children, t8]
-	}), $[35] = children, $[36] = padding, $[37] = placement, $[38] = radius, $[39] = ref, $[40] = restProps, $[41] = rootStyle, $[42] = scheme, $[43] = shadow, $[44] = t5, $[45] = t6, $[46] = t7, $[47] = t8, $[48] = t9) : t9 = $[48], t9;
+		...t5,
+		children: [children, t6]
+	}), $[29] = children, $[30] = padding, $[31] = placement, $[32] = radius, $[33] = ref, $[34] = restProps, $[35] = rootStyle, $[36] = scheme, $[37] = shadow, $[38] = t5, $[39] = t6, $[40] = t7) : t7 = $[40], t7;
 }
 /**
 * @beta