@sanity/ui 4.0.7 → 4.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{arrow-CL8xmdbg.js → arrow-DKn5YKdy.js} +6 -5
- package/dist/arrow-DKn5YKdy.js.map +1 -0
- package/dist/autocomplete.d.ts +2 -2
- package/dist/autocomplete.d.ts.map +1 -1
- package/dist/autocomplete.js +37 -41
- package/dist/autocomplete.js.map +1 -1
- package/dist/breadcrumbs.d.ts +2 -2
- package/dist/breadcrumbs.d.ts.map +1 -1
- package/dist/breadcrumbs.js +30 -32
- package/dist/breadcrumbs.js.map +1 -1
- package/dist/{button-DQH2KIbq.js → button-Dh_M2fYx.js} +10 -10
- package/dist/button-Dh_M2fYx.js.map +1 -0
- package/dist/button-dnqMFkWg.d.ts.map +1 -1
- package/dist/code.d.ts +2 -2
- package/dist/code.d.ts.map +1 -1
- package/dist/{factory-BA3gEfyI.js → factory-BzXTX8_Q.js} +2 -2
- package/dist/{factory-BA3gEfyI.js.map → factory-BzXTX8_Q.js.map} +1 -1
- package/dist/{flex-CySCBzQm.js → flex-DmbDG2ks.js} +2 -2
- package/dist/{flex-CySCBzQm.js.map → flex-DmbDG2ks.js.map} +1 -1
- package/dist/{getElementRef-5HZQ-Owu.js → getElementRef-Jw7gY0eV.js} +13 -2
- package/dist/getElementRef-Jw7gY0eV.js.map +1 -0
- package/dist/{grid-I2TNptX-.js → grid-6JSgMj1O.js} +2 -2
- package/dist/{grid-I2TNptX-.js.map → grid-6JSgMj1O.js.map} +1 -1
- package/dist/{hotkeys-BPlacpG8.js → hotkeys-uSArGPzR.js} +28 -28
- package/dist/hotkeys-uSArGPzR.js.map +1 -0
- package/dist/index.d.ts +156 -156
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +317 -351
- package/dist/index.js.map +1 -1
- package/dist/layer-BfwisMR6.js +61 -0
- package/dist/layer-BfwisMR6.js.map +1 -0
- package/dist/layer-ChlP9Ik6.d.ts.map +1 -1
- package/dist/menu.d.ts +6 -6
- package/dist/menu.d.ts.map +1 -1
- package/dist/menu.js +50 -38
- package/dist/menu.js.map +1 -1
- package/dist/{popover-CEbjxiPx.js → popover-myCXZV_F.js} +34 -33
- package/dist/popover-myCXZV_F.js.map +1 -0
- package/dist/popover.js +1 -1
- package/dist/{stack-BGFEokua.js → stack-rsNFPq2-.js} +2 -2
- package/dist/{stack-BGFEokua.js.map → stack-rsNFPq2-.js.map} +1 -1
- package/dist/styles.css +408 -0
- package/dist/{textInput-B6ZZJSOj.js → textInput-DAaORuky.js} +38 -50
- package/dist/textInput-DAaORuky.js.map +1 -0
- package/dist/theme.d.ts +33 -33
- package/dist/theme.d.ts.map +1 -1
- package/dist/theme.js +1 -1
- package/dist/toast.d.ts +4 -4
- package/dist/toast.d.ts.map +1 -1
- package/dist/toast.js +80 -76
- package/dist/toast.js.map +1 -1
- package/dist/tooltip.d.ts +5 -5
- package/dist/tooltip.d.ts.map +1 -1
- package/dist/tooltip.js +97 -99
- package/dist/tooltip.js.map +1 -1
- package/dist/{useLayer-jUJIz8mh.js → useLayer-D1usxIE0.js} +2 -2
- package/dist/{useLayer-jUJIz8mh.js.map → useLayer-D1usxIE0.js.map} +1 -1
- package/package.json +10 -9
- package/dist/arrow-CL8xmdbg.js.map +0 -1
- package/dist/button-DQH2KIbq.js.map +0 -1
- package/dist/getElementRef-5HZQ-Owu.js.map +0 -1
- package/dist/hotkeys-BPlacpG8.js.map +0 -1
- package/dist/layer-DGn7KJIB.js +0 -61
- package/dist/layer-DGn7KJIB.js.map +0 -1
- package/dist/popover-CEbjxiPx.js.map +0 -1
- package/dist/textInput-B6ZZJSOj.js.map +0 -1
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { a as rem, i as _responsive, n as _getArrayProp, s as EMPTY_RECORD } from "./helpers-C8xxXAQC.js";
|
|
2
2
|
import { a as isHTMLElement, c as isHTMLTextAreaElement, i as isHTMLButtonElement, o as isHTMLInputElement, r as isHTMLAnchorElement, s as isHTMLSelectElement } from "./element-BYgCE_iK.js";
|
|
3
3
|
import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
|
|
4
|
-
import { l as useRootTheme, m as focusRingStyle, p as focusRingBorderStyle, s as Card, v as responsiveRadiusStyle, y as Box } from "./useLayer-
|
|
5
|
-
import { n as Text } from "./stack-
|
|
6
|
-
import { t as Button } from "./button-
|
|
4
|
+
import { l as useRootTheme, m as focusRingStyle, p as focusRingBorderStyle, s as Card, v as responsiveRadiusStyle, y as Box } from "./useLayer-D1usxIE0.js";
|
|
5
|
+
import { n as Text } from "./stack-rsNFPq2-.js";
|
|
6
|
+
import { t as Button } from "./button-Dh_M2fYx.js";
|
|
7
7
|
import { c } from "react/compiler-runtime";
|
|
8
|
+
import { clsx } from "clsx/lite";
|
|
8
9
|
import { isValidElement, useEffect, useImperativeHandle, useRef } from "react";
|
|
9
10
|
import { css, styled } from "styled-components";
|
|
10
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -100,10 +101,6 @@ function responsiveInputPaddingIconRightStyle(props) {
|
|
|
100
101
|
$iconRight: !0
|
|
101
102
|
});
|
|
102
103
|
}
|
|
103
|
-
const ROOT_STYLE = css`&:not([hidden]){display:flex;}align-items:center;`;
|
|
104
|
-
function textInputRootStyle() {
|
|
105
|
-
return ROOT_STYLE;
|
|
106
|
-
}
|
|
107
104
|
function textInputBaseStyle(props) {
|
|
108
105
|
let { $scheme, $tone, $weight } = props, { color, font } = getTheme_v2(props.theme);
|
|
109
106
|
return css`appearance:none;background:none;border:0;border-radius:0;outline:none;width:100%;box-sizing:border-box;font-family:${font.text.family};font-weight:${$weight && font.text.weights[$weight] || font.text.weights.regular};margin:0;position:relative;z-index:1;display:block;&:-webkit-autofill,&:-webkit-autofill:hover,&:-webkit-autofill:focus,&:-webkit-autofill:active{-webkit-text-fill-color:var(--input-fg-color) !important;transition:background-color 5000s;transition-delay:86400s;}&[data-as='textarea']{resize:none;}color:var(--input-fg-color);&::placeholder{color:var(--input-placeholder-color);}&[data-scheme='${$scheme}'][data-tone='${$tone}']{--input-fg-color:${color.input.default.enabled.fg};--input-placeholder-color:${color.input.default.enabled.placeholder};&:not(:invalid):not(:disabled):not(:read-only){--input-fg-color:${color.input.default.enabled.fg};--input-placeholder-color:${color.input.default.enabled.placeholder};}&:not(:invalid):disabled{--input-fg-color:${color.input.default.disabled.fg};--input-placeholder-color:${color.input.default.disabled.placeholder};}&:invalid{--input-fg-color:${color.input.invalid.enabled.fg};--input-placeholder-color:${color.input.invalid.enabled.placeholder};}&:read-only{--input-fg-color:${color.input.default.readOnly.fg};--input-placeholder-color:${color.input.default.readOnly.placeholder};}}`;
|
|
@@ -146,37 +143,14 @@ function textInputRepresentationStyle(props) {
|
|
|
146
143
|
width: input.border.width
|
|
147
144
|
})};}}}`;
|
|
148
145
|
}
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
componentId: "sc-zwsvc0-0"
|
|
152
|
-
})(textInputRootStyle), InputRoot = styled.span.withConfig({
|
|
153
|
-
displayName: "InputRoot",
|
|
154
|
-
componentId: "sc-zwsvc0-1"
|
|
155
|
-
})`flex:1;min-width:0;display:block;position:relative;`, Prefix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
|
|
156
|
-
displayName: "Prefix",
|
|
157
|
-
componentId: "sc-zwsvc0-2"
|
|
158
|
-
})`border-top-right-radius:0;border-bottom-right-radius:0;& > span{display:block;margin:-1px;}`, Suffix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
|
|
159
|
-
displayName: "Suffix",
|
|
160
|
-
componentId: "sc-zwsvc0-3"
|
|
161
|
-
})`border-top-left-radius:0;border-bottom-left-radius:0;& > span{display:block;margin:-1px;}`, Input = /* @__PURE__ */ styled.input.withConfig({
|
|
146
|
+
var inputRoot = "_1lyk8y1", textInputRoot = "_1lyk8y0";
|
|
147
|
+
const CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Input = /* @__PURE__ */ styled.input.withConfig({
|
|
162
148
|
displayName: "Input",
|
|
163
|
-
componentId: "sc-
|
|
149
|
+
componentId: "sc-fkdyjt-0"
|
|
164
150
|
})(responsiveInputPaddingStyle, textInputBaseStyle, textInputFontSizeStyle), Presentation = /* @__PURE__ */ styled.span.withConfig({
|
|
165
151
|
displayName: "Presentation",
|
|
166
|
-
componentId: "sc-
|
|
167
|
-
})(responsiveRadiusStyle, textInputRepresentationStyle)
|
|
168
|
-
displayName: "LeftBox",
|
|
169
|
-
componentId: "sc-zwsvc0-6"
|
|
170
|
-
})`position:absolute;top:0;left:0;`, RightBox = styled(Box).withConfig({
|
|
171
|
-
displayName: "RightBox",
|
|
172
|
-
componentId: "sc-zwsvc0-7"
|
|
173
|
-
})`position:absolute;top:0;right:0;`, RightCard = styled(Card).withConfig({
|
|
174
|
-
displayName: "RightCard",
|
|
175
|
-
componentId: "sc-zwsvc0-8"
|
|
176
|
-
})`background-color:transparent;position:absolute;top:0;right:0;`, TextInputClearButton = /* @__PURE__ */ styled(Button).withConfig({
|
|
177
|
-
displayName: "TextInputClearButton",
|
|
178
|
-
componentId: "sc-zwsvc0-9"
|
|
179
|
-
})({ "&:not([hidden])": { display: "block" } });
|
|
152
|
+
componentId: "sc-fkdyjt-1"
|
|
153
|
+
})(responsiveRadiusStyle, textInputRepresentationStyle);
|
|
180
154
|
/**
|
|
181
155
|
* Single line text input.
|
|
182
156
|
*
|
|
@@ -200,17 +174,20 @@ function TextInput(props) {
|
|
|
200
174
|
event_0.preventDefault(), event_0.stopPropagation(), onClear && onClear(), ref.current?.focus();
|
|
201
175
|
}, $[29] = onClear, $[30] = t12);
|
|
202
176
|
let handleClearClick = t12, t13;
|
|
203
|
-
$[31] !== prefix || $[32] !== radius ? (t13 = prefix && /* @__PURE__ */ jsx(
|
|
177
|
+
$[31] !== prefix || $[32] !== radius ? (t13 = prefix && /* @__PURE__ */ jsx(Card, {
|
|
204
178
|
borderTop: !0,
|
|
205
179
|
borderLeft: !0,
|
|
206
180
|
borderBottom: !0,
|
|
181
|
+
className: "_8fnjkq3",
|
|
182
|
+
as: "span",
|
|
207
183
|
radius,
|
|
208
184
|
sizing: "border",
|
|
209
185
|
tone: "inherit",
|
|
210
186
|
children: /* @__PURE__ */ jsx("span", { children: prefix })
|
|
211
187
|
}), $[31] = prefix, $[32] = radius, $[33] = t13) : t13 = $[33];
|
|
212
188
|
let prefixNode = t13, t14 = border ? "" : void 0, t15;
|
|
213
|
-
$[34] !== IconComponent || $[35] !== fontSize || $[36] !== padding ? (t15 = IconComponent && /* @__PURE__ */ jsx(
|
|
189
|
+
$[34] !== IconComponent || $[35] !== fontSize || $[36] !== padding ? (t15 = IconComponent && /* @__PURE__ */ jsx(Box, {
|
|
190
|
+
className: "_8fnjkq0",
|
|
214
191
|
padding,
|
|
215
192
|
children: /* @__PURE__ */ jsxs(Text, {
|
|
216
193
|
size: fontSize,
|
|
@@ -218,7 +195,8 @@ function TextInput(props) {
|
|
|
218
195
|
})
|
|
219
196
|
}), $[34] = IconComponent, $[35] = fontSize, $[36] = padding, $[37] = t15) : t15 = $[37];
|
|
220
197
|
let t16;
|
|
221
|
-
$[38] !== $hasClearButton || $[39] !== IconRightComponent || $[40] !== fontSize || $[41] !== padding ? (t16 = !$hasClearButton && IconRightComponent && /* @__PURE__ */ jsx(
|
|
198
|
+
$[38] !== $hasClearButton || $[39] !== IconRightComponent || $[40] !== fontSize || $[41] !== padding ? (t16 = !$hasClearButton && IconRightComponent && /* @__PURE__ */ jsx(Box, {
|
|
199
|
+
className: "_8fnjkq1",
|
|
222
200
|
padding,
|
|
223
201
|
children: /* @__PURE__ */ jsxs(Text, {
|
|
224
202
|
size: fontSize,
|
|
@@ -243,12 +221,13 @@ function TextInput(props) {
|
|
|
243
221
|
let clearButtonBoxPadding = t18, t19;
|
|
244
222
|
$[55] === padding ? t19 = $[56] : (t19 = padding.map(_temp3), $[55] = padding, $[56] = t19);
|
|
245
223
|
let clearButtonPadding = t19, clearButtonProps = typeof clearButton == "object" ? clearButton : EMPTY_RECORD, t20;
|
|
246
|
-
$[57] !== clearButton || $[58] !== clearButtonBoxPadding || $[59] !== clearButtonPadding || $[60] !== clearButtonProps || $[61] !== customValidity || $[62] !== disabled || $[63] !== fontSize || $[64] !== handleClearClick || $[65] !== radius || $[66] !== readOnly ? (t20 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(
|
|
247
|
-
|
|
224
|
+
$[57] !== clearButton || $[58] !== clearButtonBoxPadding || $[59] !== clearButtonPadding || $[60] !== clearButtonProps || $[61] !== customValidity || $[62] !== disabled || $[63] !== fontSize || $[64] !== handleClearClick || $[65] !== radius || $[66] !== readOnly ? (t20 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(Card, {
|
|
225
|
+
className: "_8fnjkq5",
|
|
226
|
+
as: "span",
|
|
248
227
|
padding: clearButtonBoxPadding,
|
|
249
228
|
style: CLEAR_BUTTON_BOX_STYLE,
|
|
250
229
|
tone: customValidity ? "critical" : "inherit",
|
|
251
|
-
children: /* @__PURE__ */ jsx(
|
|
230
|
+
children: /* @__PURE__ */ jsx(Button, {
|
|
252
231
|
"aria-label": "Clear",
|
|
253
232
|
"data-qa": "clear-button",
|
|
254
233
|
fontSize,
|
|
@@ -257,15 +236,18 @@ function TextInput(props) {
|
|
|
257
236
|
padding: clearButtonPadding,
|
|
258
237
|
radius,
|
|
259
238
|
...clearButtonProps,
|
|
239
|
+
className: clsx("_8fnjkq2", clearButtonProps.className),
|
|
260
240
|
onClick: handleClearClick,
|
|
261
241
|
onMouseDown: handleClearMouseDown
|
|
262
242
|
})
|
|
263
243
|
}), $[57] = clearButton, $[58] = clearButtonBoxPadding, $[59] = clearButtonPadding, $[60] = clearButtonProps, $[61] = customValidity, $[62] = disabled, $[63] = fontSize, $[64] = handleClearClick, $[65] = radius, $[66] = readOnly, $[67] = t20) : t20 = $[67];
|
|
264
244
|
let clearButtonNode = t20, t21;
|
|
265
|
-
$[68] !== radius || $[69] !== suffix ? (t21 = suffix && /* @__PURE__ */ jsx(
|
|
245
|
+
$[68] !== radius || $[69] !== suffix ? (t21 = suffix && /* @__PURE__ */ jsx(Card, {
|
|
266
246
|
borderTop: !0,
|
|
267
247
|
borderRight: !0,
|
|
268
248
|
borderBottom: !0,
|
|
249
|
+
className: "_8fnjkq4",
|
|
250
|
+
as: "span",
|
|
269
251
|
radius,
|
|
270
252
|
sizing: "border",
|
|
271
253
|
tone: "inherit",
|
|
@@ -291,14 +273,20 @@ function TextInput(props) {
|
|
|
291
273
|
type
|
|
292
274
|
}), $[71] = $hasIcon, $[72] = disabled, $[73] = fontSize, $[74] = padding, $[75] = readOnly, $[76] = restProps, $[77] = rootTheme.scheme, $[78] = rootTheme.tone, $[79] = space, $[80] = t22, $[81] = type, $[82] = weight, $[83] = t23) : t23 = $[83];
|
|
293
275
|
let t24;
|
|
294
|
-
$[84] !== clearButtonNode || $[85] !== presentationNode || $[86] !== t23 ? (t24 = /* @__PURE__ */ jsxs(
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
276
|
+
$[84] !== clearButtonNode || $[85] !== presentationNode || $[86] !== t23 ? (t24 = /* @__PURE__ */ jsxs("span", {
|
|
277
|
+
className: inputRoot,
|
|
278
|
+
children: [
|
|
279
|
+
t23,
|
|
280
|
+
presentationNode,
|
|
281
|
+
clearButtonNode
|
|
282
|
+
]
|
|
283
|
+
}), $[84] = clearButtonNode, $[85] = presentationNode, $[86] = t23, $[87] = t24) : t24 = $[87];
|
|
299
284
|
let t25;
|
|
300
|
-
return $[88] !== prefixNode || $[89] !== rootTheme.tone || $[90] !== suffixNode || $[91] !== t24 ? (t25 = /* @__PURE__ */ jsxs(
|
|
285
|
+
return $[88] !== prefixNode || $[89] !== rootTheme.tone || $[90] !== suffixNode || $[91] !== t24 ? (t25 = /* @__PURE__ */ jsxs(Card, {
|
|
286
|
+
as: "span",
|
|
287
|
+
className: textInputRoot,
|
|
301
288
|
"data-ui": "TextInput",
|
|
289
|
+
display: "flex",
|
|
302
290
|
tone: rootTheme.tone,
|
|
303
291
|
children: [
|
|
304
292
|
prefixNode,
|
|
@@ -316,6 +304,6 @@ function _temp2(v) {
|
|
|
316
304
|
function _temp(event) {
|
|
317
305
|
event.preventDefault(), event.stopPropagation();
|
|
318
306
|
}
|
|
319
|
-
export {
|
|
307
|
+
export { textInputFontSizeStyle as a, responsiveInputPaddingStyle as c, attemptFocus as d, focusFirstDescendant as f, _raf2 as g, _raf as h, textInputBaseStyle as i, useCustomValidity as l, isFocusable as m, inputRoot as n, textInputRepresentationStyle as o, focusLastDescendant as p, textInputRoot as r, responsiveInputPaddingIconRightStyle as s, TextInput as t, _hasFocus as u };
|
|
320
308
|
|
|
321
|
-
//# sourceMappingURL=textInput-
|
|
309
|
+
//# sourceMappingURL=textInput-DAaORuky.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textInput-DAaORuky.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 <Card\n borderTop\n borderLeft\n borderBottom\n className={textInputPrefix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{prefix}</span>\n </Card>\n )","useMemo(\n () =>\n prefix && (\n <Card\n borderTop\n borderLeft\n borderBottom\n className={textInputPrefix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{prefix}</span>\n </Card>\n ),\n [prefix, radius],\n )","IconComponent && (\n <Box className={textInputLeftBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </Box>\n )","!$hasClearButton && IconRightComponent && (\n <Box className={textInputRightBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </Box>\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 <Box className={textInputLeftBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </Box>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <Box className={textInputRightBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </Box>\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 <Box className={textInputLeftBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </Box>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <Box className={textInputRightBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </Box>\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 <Card\n className={textInputRightCard}\n as=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <Button\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 className={clsx(textInputClearButton, clearButtonProps.className)}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </Card>\n )","clearButtonProps.className","useMemo(\n () =>\n !disabled &&\n !readOnly &&\n clearButton && (\n <Card\n className={textInputRightCard}\n as=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <Button\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 className={clsx(textInputClearButton, clearButtonProps.className)}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </Card>\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 <Card\n borderTop\n borderRight\n borderBottom\n className={textInputSuffix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{suffix}</span>\n </Card>\n )","useMemo(\n () =>\n suffix && (\n <Card\n borderTop\n borderRight\n borderBottom\n className={textInputSuffix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{suffix}</span>\n </Card>\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","<span className={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 </span>","<Card\n as=\"span\"\n className={textInputRoot}\n data-ui=\"TextInput\"\n display=\"flex\"\n tone={rootTheme.tone}\n >\n {prefixNode}\n\n <span className={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 </span>\n\n {suffixNode}\n </Card>","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/styles/input/textInput.css.ts","../src/core/primitives/textInput/textInput.css.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\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 {style} from '@vanilla-extract/css'\n\nexport const textInputRoot = style({\n alignItems: 'center',\n selectors: {\n '&:not([hidden])': {\n display: 'flex',\n },\n },\n})\n\nexport const inputRoot = style({\n flex: 1,\n minWidth: 0,\n display: 'block',\n position: 'relative',\n})\n","import {globalStyle, style} from '@vanilla-extract/css'\n\nexport const textInputLeftBox = style({\n position: 'absolute',\n top: 0,\n left: 0,\n})\n\nexport const textInputRightBox = style({\n position: 'absolute',\n top: 0,\n right: 0,\n})\n\nexport const textInputClearButton = style({\n selectors: {\n '&:not([hidden])': {\n display: 'block',\n },\n },\n})\n\nexport const textInputPrefix = style({\n selectors: {\n '&&': {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n },\n})\n\nglobalStyle(`${textInputPrefix} > span`, {\n display: 'block',\n margin: -1,\n})\n\nexport const textInputSuffix = style({\n selectors: {\n '&&': {\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n },\n },\n})\n\nglobalStyle(`${textInputSuffix} > span`, {\n display: 'block',\n margin: -1,\n})\n\nexport const textInputRightCard = style({\n position: 'absolute',\n top: 0,\n right: 0,\n selectors: {\n '&&': {\n backgroundColor: 'transparent',\n },\n },\n})\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {clsx} from 'clsx/lite'\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} 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\nimport {inputRoot, textInputRoot} from '../../styles/input/textInput.css'\nimport {\n textInputClearButton,\n textInputLeftBox,\n textInputPrefix,\n textInputRightBox,\n textInputRightCard,\n textInputSuffix,\n} from './textInput.css'\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 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\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 <Card\n borderTop\n borderLeft\n borderBottom\n className={textInputPrefix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{prefix}</span>\n </Card>\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 <Box className={textInputLeftBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n </Box>\n )}\n\n {!$hasClearButton && IconRightComponent && (\n <Box className={textInputRightBox} padding={padding}>\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n </Box>\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 <Card\n className={textInputRightCard}\n as=\"span\"\n padding={clearButtonBoxPadding}\n style={CLEAR_BUTTON_BOX_STYLE}\n tone={customValidity ? 'critical' : 'inherit'}\n >\n <Button\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 className={clsx(textInputClearButton, clearButtonProps.className)}\n onClick={handleClearClick}\n onMouseDown={handleClearMouseDown}\n />\n </Card>\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 <Card\n borderTop\n borderRight\n borderBottom\n className={textInputSuffix}\n as=\"span\"\n radius={radius}\n sizing=\"border\"\n tone=\"inherit\"\n >\n <span>{suffix}</span>\n </Card>\n ),\n [radius, suffix],\n )\n\n return (\n <Card\n as=\"span\"\n className={textInputRoot}\n data-ui=\"TextInput\"\n display=\"flex\"\n tone={rootTheme.tone}\n >\n {prefixNode}\n\n <span className={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 </span>\n\n {suffixNode}\n </Card>\n )\n}\n"],"mappings":"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"}
|
package/dist/theme.d.ts
CHANGED
|
@@ -3,15 +3,15 @@ import { a as ThemeFontWeightKey, i as ThemeFontWeight, n as ThemeFontKey, o as
|
|
|
3
3
|
import { $ as ThemeColorInputState_v2, A as ThemeColorMutedTone, B as ThemeColorBase, C as ThemeColorSpotKey, D as ThemeColorSelectableState, E as ThemeColorSelectable, F as ThemeColorCardState, G as ThemeInput_v2, H as ThemeColorToneKey, I as ThemeColorButton, J as ThemeColorSchemes_v2, K as ThemeColorCard_v2, L as ThemeColorButtonState, M as ThemeColorInputState, N as ThemeColorInputStates, O as ThemeColorSelectableStates, P as ThemeColorCard, Q as ThemeColorInputMode_v2, R as ThemeColorButtonStates, S as ThemeColorSpot, T as ThemeColorSolidTone, U as ThemeColorGenericState, V as ThemeColorName, W as ThemeAvatar, X as ThemeColorSelectableTone_v2, Y as ThemeColorShadow, Z as ThemeColorSelectable_v2, _ as Theme_v2, _t as ThemeColorSyntax, a as rgbToHex, at as ThemeColorKBD, b as ThemeColorScheme, bt as RGBA, c as screen, ct as ThemeColorAvatarHue_v2, d as ThemeColorBuilderOpts, dt as ThemeFocusRing, et as ThemeColorInput_v2, f as createColorTheme, ft as ThemeStyles, g as Theme, gt as ThemeLayer, h as RootTheme_v2, ht as ThemeShadow, i as hslToRgb, it as ThemeColorState_v2, j as ThemeColorInput, k as ThemeColorMuted, l as multiply, lt as ThemeColorAvatar_v2, m as RootTheme, mt as ThemeBoxShadow, n as parseColor, nt as ThemeColorButtonTone_v2, o as rgbToHsl, ot as ThemeColorBadgeTone_v2, p as BaseTheme, pt as CSSObject, q as ThemeColorScheme_v2, r as hexToRgb, rt as ThemeColorButton_v2, s as rgbaToRGBA, st as ThemeColorBadge_v2, t as rgba, tt as ThemeColorButtonMode_v2, u as PartialThemeColorBuilderOpts, ut as ThemeAvatar_v2, v as ThemeInput, vt as HSL, w as ThemeColorSolid, x as ThemeColorSchemes, y as ThemeColor, yt as RGB, z as ThemeColorButtonTones } from "./rgba-BSYaEUW6.js";
|
|
4
4
|
import { ColorHueKey, ColorTint, ColorTintKey } from "@sanity/color";
|
|
5
5
|
/** @public */
|
|
6
|
-
declare const COLOR_CONFIG_STATE_KEYS: readonly ['_hue', 'bg', 'fg', 'border', 'focusRing', 'muted/fg', 'accent/fg', 'link/fg', 'code/bg', 'code/fg', 'skeleton/from', 'skeleton/to', 'status/dot', 'status/icon'];
|
|
6
|
+
export declare const COLOR_CONFIG_STATE_KEYS: readonly ['_hue', 'bg', 'fg', 'border', 'focusRing', 'muted/fg', 'accent/fg', 'link/fg', 'code/bg', 'code/fg', 'skeleton/from', 'skeleton/to', 'status/dot', 'status/icon'];
|
|
7
7
|
/** @public */
|
|
8
8
|
type ColorConfigStateKey = (typeof COLOR_CONFIG_STATE_KEYS)[number];
|
|
9
9
|
/** @public */
|
|
10
|
-
declare const COLOR_CONFIG_CARD_KEYS: readonly ["_hue", "bg", "fg", "border", "focusRing", "muted/fg", "accent/fg", "link/fg", "code/bg", "code/fg", "skeleton/from", "skeleton/to", "status/dot", "status/icon", "_hue", "bg", "fg", "border", "focusRing", "shadow/outline", "shadow/umbra", "shadow/penumbra", "shadow/ambient"];
|
|
10
|
+
export declare const COLOR_CONFIG_CARD_KEYS: readonly ["_hue", "bg", "fg", "border", "focusRing", "muted/fg", "accent/fg", "link/fg", "code/bg", "code/fg", "skeleton/from", "skeleton/to", "status/dot", "status/icon", "_hue", "bg", "fg", "border", "focusRing", "shadow/outline", "shadow/umbra", "shadow/penumbra", "shadow/ambient"];
|
|
11
11
|
/** @public */
|
|
12
12
|
type ColorConfigCardKey = (typeof COLOR_CONFIG_CARD_KEYS)[number];
|
|
13
13
|
/** @public */
|
|
14
|
-
declare const COLOR_CONFIG_BLEND_KEYS: readonly ['_blend'];
|
|
14
|
+
export declare const COLOR_CONFIG_BLEND_KEYS: readonly ['_blend'];
|
|
15
15
|
/** @public */
|
|
16
16
|
type ColorConfigBlendKey = (typeof COLOR_CONFIG_BLEND_KEYS)[number];
|
|
17
17
|
/** @public */
|
|
@@ -23,27 +23,27 @@ type ThemeColorTokenValue = [ColorConfigValue, ColorConfigValue];
|
|
|
23
23
|
/** @public */
|
|
24
24
|
type ColorBlendModeTokenValue = [ThemeColorBlendModeKey, ThemeColorBlendModeKey];
|
|
25
25
|
/** @public */
|
|
26
|
-
declare const COLOR_CONFIG_AVATAR_COLORS: readonly ["*", ...ColorHueKey[]];
|
|
26
|
+
export declare const COLOR_CONFIG_AVATAR_COLORS: readonly ["*", ...ColorHueKey[]];
|
|
27
27
|
/** @public */
|
|
28
28
|
type ColorConfigAvatarColor = (typeof COLOR_CONFIG_AVATAR_COLORS)[number];
|
|
29
29
|
/** @public */
|
|
30
|
-
declare const COLOR_CONFIG_CARD_TONES: readonly ["*", "transparent", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
30
|
+
export declare const COLOR_CONFIG_CARD_TONES: readonly ["*", "transparent", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
31
31
|
/** @public */
|
|
32
32
|
type ColorConfigCardTone = (typeof COLOR_CONFIG_CARD_TONES)[number];
|
|
33
33
|
/** @public */
|
|
34
|
-
declare const COLOR_CONFIG_STATE_TONES: readonly ["*", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
34
|
+
export declare const COLOR_CONFIG_STATE_TONES: readonly ["*", "default", "neutral", "primary", "suggest", "positive", "caution", "critical"];
|
|
35
35
|
/** @public */
|
|
36
36
|
type ColorConfigStateTone = (typeof COLOR_CONFIG_STATE_TONES)[number];
|
|
37
37
|
/** @public */
|
|
38
|
-
declare const COLOR_CONFIG_STATES: readonly ["*", "enabled", "hovered", "pressed", "selected", "disabled"];
|
|
38
|
+
export declare const COLOR_CONFIG_STATES: readonly ["*", "enabled", "hovered", "pressed", "selected", "disabled"];
|
|
39
39
|
/** @public */
|
|
40
40
|
type ColorConfigState = (typeof COLOR_CONFIG_STATES)[number];
|
|
41
41
|
/** @public */
|
|
42
|
-
declare const COLOR_CONFIG_INPUT_MODES: readonly ["*", "default", "invalid"];
|
|
42
|
+
export declare const COLOR_CONFIG_INPUT_MODES: readonly ["*", "default", "invalid"];
|
|
43
43
|
/** @public */
|
|
44
44
|
type ColorConfigInputMode = (typeof COLOR_CONFIG_INPUT_MODES)[number];
|
|
45
45
|
/** @public */
|
|
46
|
-
declare const COLOR_CONFIG_INPUT_STATES: readonly ["*", "enabled", "hovered", "readOnly", "disabled"];
|
|
46
|
+
export declare const COLOR_CONFIG_INPUT_STATES: readonly ["*", "enabled", "hovered", "readOnly", "disabled"];
|
|
47
47
|
/** @public */
|
|
48
48
|
type ColorConfigInputState = (typeof COLOR_CONFIG_INPUT_STATES)[number];
|
|
49
49
|
/** @public */
|
|
@@ -192,30 +192,30 @@ interface ThemeConfig {
|
|
|
192
192
|
style?: ThemeStyles;
|
|
193
193
|
}
|
|
194
194
|
/** @internal */
|
|
195
|
-
declare function buildTheme(config?: ThemeConfig): RootTheme;
|
|
195
|
+
export declare function buildTheme(config?: ThemeConfig): RootTheme;
|
|
196
196
|
/**
|
|
197
197
|
* Apply the \`mix\` blend mode
|
|
198
198
|
* @internal
|
|
199
199
|
*/
|
|
200
|
-
declare function mix(b: RGB | RGBA, s: RGB | RGBA, weight: number): RGB;
|
|
200
|
+
export declare function mix(b: RGB | RGBA, s: RGB | RGBA, weight: number): RGB;
|
|
201
201
|
/** @internal */
|
|
202
|
-
declare function getContrastRatio(bg: string, fg: string): number;
|
|
202
|
+
export declare function getContrastRatio(bg: string, fg: string): number;
|
|
203
203
|
/** @internal */
|
|
204
|
-
declare function isColorConfigBaseTone(str: string): str is ColorConfigCardTone;
|
|
204
|
+
export declare function isColorConfigBaseTone(str: string): str is ColorConfigCardTone;
|
|
205
205
|
/** @internal */
|
|
206
|
-
declare function isColorConfigBaseKey(str: string): str is ColorConfigCardKey;
|
|
206
|
+
export declare function isColorConfigBaseKey(str: string): str is ColorConfigCardKey;
|
|
207
207
|
/** @internal */
|
|
208
|
-
declare function isColorConfigStateKey(str: string): str is ColorConfigStateKey;
|
|
208
|
+
export declare function isColorConfigStateKey(str: string): str is ColorConfigStateKey;
|
|
209
209
|
/** @internal */
|
|
210
|
-
declare function isColorConfigStateTone(str: string): str is ColorConfigStateTone;
|
|
210
|
+
export declare function isColorConfigStateTone(str: string): str is ColorConfigStateTone;
|
|
211
211
|
/** @internal */
|
|
212
|
-
declare function isColorConfigBlendKey(str: string): str is ColorConfigBlendKey;
|
|
212
|
+
export declare function isColorConfigBlendKey(str: string): str is ColorConfigBlendKey;
|
|
213
213
|
/** @internal */
|
|
214
|
-
declare function isColorTokenValue(str: string): str is ColorConfigValue;
|
|
214
|
+
export declare function isColorTokenValue(str: string): str is ColorConfigValue;
|
|
215
215
|
/** @internal */
|
|
216
|
-
declare function isColorValue(str: string): str is 'black' | 'white';
|
|
216
|
+
export declare function isColorValue(str: string): str is 'black' | 'white';
|
|
217
217
|
/** @internal */
|
|
218
|
-
declare function isColorOpacityValue(str: string): str is ColorConfigOpacityValue;
|
|
218
|
+
export declare function isColorOpacityValue(str: string): str is ColorConfigOpacityValue;
|
|
219
219
|
/** @internal */
|
|
220
220
|
interface TokenBaseKeyNode {
|
|
221
221
|
type: 'base';
|
|
@@ -253,28 +253,28 @@ interface TokenBlendModeValueNode {
|
|
|
253
253
|
/** @internal */
|
|
254
254
|
type TokenValueNode = TokenColorValueNode | TokenHueValueNode | TokenBlendModeValueNode;
|
|
255
255
|
/** @internal */
|
|
256
|
-
declare function parseTokenKey(str: string): TokenKeyNode | undefined;
|
|
256
|
+
export declare function parseTokenKey(str: string): TokenKeyNode | undefined;
|
|
257
257
|
/** @internal */
|
|
258
|
-
declare function parseTokenValue(str: string): TokenValueNode | undefined;
|
|
258
|
+
export declare function parseTokenValue(str: string): TokenValueNode | undefined;
|
|
259
259
|
/** @internal */
|
|
260
|
-
declare function getScopedTheme(themeProp: RootTheme | RootTheme_v2, scheme: ThemeColorSchemeKey, tone: ThemeColorCardToneKey): Theme;
|
|
260
|
+
export declare function getScopedTheme(themeProp: RootTheme | RootTheme_v2, scheme: ThemeColorSchemeKey, tone: ThemeColorCardToneKey): Theme;
|
|
261
261
|
/** @internal */
|
|
262
|
-
declare function isColorBlendModeValue(str: string): str is ThemeColorBlendModeKey;
|
|
262
|
+
export declare function isColorBlendModeValue(str: string): str is ThemeColorBlendModeKey;
|
|
263
263
|
/** @internal */
|
|
264
|
-
declare function isColorHueKey(str: string): str is ColorHueKey;
|
|
264
|
+
export declare function isColorHueKey(str: string): str is ColorHueKey;
|
|
265
265
|
/** @internal */
|
|
266
|
-
declare function isColorTintKey(str: string): str is ColorTintKey;
|
|
266
|
+
export declare function isColorTintKey(str: string): str is ColorTintKey;
|
|
267
267
|
/** @internal */
|
|
268
|
-
declare function isColorButtonMode(str: string): str is ThemeColorButtonModeKey;
|
|
268
|
+
export declare function isColorButtonMode(str: string): str is ThemeColorButtonModeKey;
|
|
269
269
|
/** @public */
|
|
270
|
-
declare function getTheme_v2(theme: Theme): Theme_v2;
|
|
270
|
+
export declare function getTheme_v2(theme: Theme): Theme_v2;
|
|
271
271
|
/** @internal */
|
|
272
|
-
declare function is_v0(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme;
|
|
272
|
+
export declare function is_v0(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme;
|
|
273
273
|
/** @internal */
|
|
274
|
-
declare function is_v2(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme_v2;
|
|
274
|
+
export declare function is_v2(themeProp: RootTheme | RootTheme_v2): themeProp is RootTheme_v2;
|
|
275
275
|
/** @internal */
|
|
276
|
-
declare function v0_v2(v0: RootTheme): RootTheme_v2;
|
|
276
|
+
export declare function v0_v2(v0: RootTheme): RootTheme_v2;
|
|
277
277
|
/** @internal */
|
|
278
|
-
declare function v2_v0(v2: RootTheme_v2): RootTheme;
|
|
279
|
-
export { type BaseTheme,
|
|
278
|
+
export declare function v2_v0(v2: RootTheme_v2): RootTheme;
|
|
279
|
+
export { type BaseTheme, type CSSObject, type ColorBlendModeTokenValue, type ColorConfigAvatarColor, type ColorConfigBlendKey, type ColorConfigCardKey, type ColorConfigCardTone, type ColorConfigInputMode, type ColorConfigInputState, type ColorConfigOpacityValue, type ColorConfigState, type ColorConfigStateKey, type ColorConfigStateTone, type ColorConfigValue, type HSL, type PartialThemeColorBuilderOpts, type RGB, type RGBA, type RootTheme, type RootTheme_v2, THEME_COLOR_AVATAR_COLORS, THEME_COLOR_BLEND_MODES, THEME_COLOR_BUTTON_MODES, THEME_COLOR_CARD_TONES, THEME_COLOR_INPUT_MODES, THEME_COLOR_INPUT_STATES, THEME_COLOR_SCHEMES, THEME_COLOR_STATES, THEME_COLOR_STATE_TONES, type Theme, type ThemeAvatar, type ThemeAvatar_v2, type ThemeBoxShadow, type ThemeColor, type ThemeColorAvatarColorKey, type ThemeColorAvatarHueTokens, type ThemeColorAvatarHue_v2, type ThemeColorAvatarTokens, type ThemeColorAvatar_v2, type ThemeColorBadgeTokens, type ThemeColorBadgeToneTokens, type ThemeColorBadgeTone_v2, type ThemeColorBadge_v2, type ThemeColorBase, type ThemeColorBaseTokens, type ThemeColorBlendModeKey, type ThemeColorBuilderOpts, type ThemeColorButton, type ThemeColorButtonModeKey, type ThemeColorButtonMode_v2, type ThemeColorButtonState, type ThemeColorButtonStates, type ThemeColorButtonTokens, type ThemeColorButtonTone_v2, type ThemeColorButtonTones, type ThemeColorButton_v2, type ThemeColorCard, type ThemeColorCardState, type ThemeColorCardToneKey, type ThemeColorCard_v2, type ThemeColorGenericState, type ThemeColorInput, type ThemeColorInputModeKey, type ThemeColorInputMode_v2, type ThemeColorInputState, type ThemeColorInputStateKey, type ThemeColorInputStateTokens, type ThemeColorInputState_v2, type ThemeColorInputStates, type ThemeColorInputTokens, type ThemeColorInput_v2, type ThemeColorKBD, type ThemeColorMuted, type ThemeColorMutedTone, type ThemeColorName, type ThemeColorPalette, type ThemeColorScheme, type ThemeColorSchemeKey, type ThemeColorScheme_v2, type ThemeColorSchemes, type ThemeColorSchemes_v2, type ThemeColorSelectable, type ThemeColorSelectableState, type ThemeColorSelectableStates, type ThemeColorSelectableTone_v2, type ThemeColorSelectable_v2, type ThemeColorShadow, type ThemeColorSolid, type ThemeColorSolidTone, type ThemeColorSpot, type ThemeColorSpotKey, type ThemeColorStateKey, type ThemeColorStateTokens, type ThemeColorStateToneKey, type ThemeColorState_v2, type ThemeColorStatesTokens, type ThemeColorSyntax, type ThemeColorTokenValue, type ThemeColorTokens, type ThemeColorToneKey, type ThemeConfig, type ThemeFocusRing, type ThemeFont, type ThemeFontKey, type ThemeFontSize, type ThemeFontWeight, type ThemeFontWeightKey, type ThemeFonts, type ThemeInput, type ThemeInput_v2, type ThemeLayer, type ThemeShadow, type ThemeStyles, type Theme_v2, type TokenBaseKeyNode, type TokenBlendModeValueNode, type TokenButtonKeyNode, type TokenColorValueNode, type TokenHueValueNode, type TokenKeyNode, type TokenValueNode, createColorTheme, hexToRgb, hslToRgb, multiply, parseColor, rgbToHex, rgbToHsl, rgba, rgbaToRGBA, screen };
|
|
280
280
|
//# sourceMappingURL=theme.d.ts.map
|
package/dist/theme.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","names":[],"sources":["../src/theme/config/system.ts","../src/theme/config/tokens/color/types.ts","../src/theme/config/types.ts","../src/theme/build/buildTheme.ts","../src/theme/build/lib/color-fns/blend/mix.ts","../src/theme/build/lib/color-fns/contrastRatio.ts","../src/theme/config/helpers.ts","../src/theme/config/tokens/types.ts","../src/theme/config/tokens/parseTokenKey.ts","../src/theme/config/tokens/parseTokenValue.ts","../src/theme/getScopedTheme.ts","../src/theme/system/color/_helpers.ts","../src/theme/versioning/getTheme_v2.ts","../src/theme/versioning/is_v0.ts","../src/theme/versioning/is_v2.ts","../src/theme/versioning/v0_v2.ts","../src/theme/versioning/v2_v0.ts"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"theme.d.ts","names":[],"sources":["../src/theme/config/system.ts","../src/theme/config/tokens/color/types.ts","../src/theme/config/types.ts","../src/theme/build/buildTheme.ts","../src/theme/build/lib/color-fns/blend/mix.ts","../src/theme/build/lib/color-fns/contrastRatio.ts","../src/theme/config/helpers.ts","../src/theme/config/tokens/types.ts","../src/theme/config/tokens/parseTokenKey.ts","../src/theme/config/tokens/parseTokenValue.ts","../src/theme/getScopedTheme.ts","../src/theme/system/color/_helpers.ts","../src/theme/versioning/getTheme_v2.ts","../src/theme/versioning/is_v0.ts","../src/theme/versioning/is_v2.ts","../src/theme/versioning/v0_v2.ts","../src/theme/versioning/v2_v0.ts"],"mappings":"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"}
|
package/dist/theme.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
|
|
2
2
|
import { i as is_v2, n as v2_v0, r as v0_v2, t as getScopedTheme } from "./getScopedTheme-C-sZsyAz.js";
|
|
3
|
-
import { A as COLOR_CONFIG_STATE_TONES, B as THEME_COLOR_INPUT_STATES, C as COLOR_CONFIG_BLEND_KEYS, D as COLOR_CONFIG_INPUT_STATES, E as COLOR_CONFIG_INPUT_MODES, F as THEME_COLOR_AVATAR_COLORS, H as THEME_COLOR_STATES, I as THEME_COLOR_BLEND_MODES, L as THEME_COLOR_BUTTON_MODES, M as isColorButtonMode, N as isColorHueKey, O as COLOR_CONFIG_STATES, P as isColorTintKey, R as THEME_COLOR_CARD_TONES, S as COLOR_CONFIG_AVATAR_COLORS, T as COLOR_CONFIG_CARD_TONES, U as THEME_COLOR_STATE_TONES, V as THEME_COLOR_SCHEMES, _ as isColorConfigStateKey, a as rgba, b as isColorTokenValue, c as hslToRgb, d as rgbaToRGBA, f as mix, g as isColorConfigBlendKey, h as isColorConfigBaseTone, i as multiply, j as isColorBlendModeValue, k as COLOR_CONFIG_STATE_KEYS, l as rgbToHex, m as isColorConfigBaseKey, n as buildTheme, o as parseColor, p as parseTokenValue, r as screen, s as hexToRgb, t as createColorTheme, u as rgbToHsl, v as isColorConfigStateTone, w as COLOR_CONFIG_CARD_KEYS, x as isColorValue, y as isColorOpacityValue, z as THEME_COLOR_INPUT_MODES } from "./factory-
|
|
3
|
+
import { A as COLOR_CONFIG_STATE_TONES, B as THEME_COLOR_INPUT_STATES, C as COLOR_CONFIG_BLEND_KEYS, D as COLOR_CONFIG_INPUT_STATES, E as COLOR_CONFIG_INPUT_MODES, F as THEME_COLOR_AVATAR_COLORS, H as THEME_COLOR_STATES, I as THEME_COLOR_BLEND_MODES, L as THEME_COLOR_BUTTON_MODES, M as isColorButtonMode, N as isColorHueKey, O as COLOR_CONFIG_STATES, P as isColorTintKey, R as THEME_COLOR_CARD_TONES, S as COLOR_CONFIG_AVATAR_COLORS, T as COLOR_CONFIG_CARD_TONES, U as THEME_COLOR_STATE_TONES, V as THEME_COLOR_SCHEMES, _ as isColorConfigStateKey, a as rgba, b as isColorTokenValue, c as hslToRgb, d as rgbaToRGBA, f as mix, g as isColorConfigBlendKey, h as isColorConfigBaseTone, i as multiply, j as isColorBlendModeValue, k as COLOR_CONFIG_STATE_KEYS, l as rgbToHex, m as isColorConfigBaseKey, n as buildTheme, o as parseColor, p as parseTokenValue, r as screen, s as hexToRgb, t as createColorTheme, u as rgbToHsl, v as isColorConfigStateTone, w as COLOR_CONFIG_CARD_KEYS, x as isColorValue, y as isColorOpacityValue, z as THEME_COLOR_INPUT_MODES } from "./factory-BzXTX8_Q.js";
|
|
4
4
|
/** @internal */
|
|
5
5
|
function getContrastRatio(bg, fg) {
|
|
6
6
|
let rgb1 = parseColor(bg), rgb2 = parseColor(fg), c1 = rgb_lrgb(rgb1), c2 = rgb_lrgb(rgb2), l1 = lrgb_luminance(c1), l2 = lrgb_luminance(c2);
|
package/dist/toast.d.ts
CHANGED
|
@@ -18,7 +18,7 @@ interface ToastProps {
|
|
|
18
18
|
*
|
|
19
19
|
* @public
|
|
20
20
|
*/
|
|
21
|
-
declare function Toast(props: ToastProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'height' | 'ref' | 'title' | 'onAnimationStart' | 'onDragStart' | 'onDragEnd' | 'onDrag'>): React.JSX.Element;
|
|
21
|
+
export declare function Toast(props: ToastProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'height' | 'ref' | 'title' | 'onAnimationStart' | 'onDragStart' | 'onDragEnd' | 'onDrag'>): React.JSX.Element;
|
|
22
22
|
/**
|
|
23
23
|
* @public
|
|
24
24
|
*/
|
|
@@ -39,7 +39,7 @@ interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {
|
|
|
39
39
|
/**
|
|
40
40
|
* @public
|
|
41
41
|
*/
|
|
42
|
-
declare function ToastProvider(props: ToastProviderProps): React.JSX.Element;
|
|
42
|
+
export declare function ToastProvider(props: ToastProviderProps): React.JSX.Element;
|
|
43
43
|
/**
|
|
44
44
|
* @public
|
|
45
45
|
*/
|
|
@@ -68,6 +68,6 @@ interface ToastContextValue {
|
|
|
68
68
|
/**
|
|
69
69
|
* @public
|
|
70
70
|
*/
|
|
71
|
-
declare function useToast(): ToastContextValue;
|
|
72
|
-
export {
|
|
71
|
+
export declare function useToast(): ToastContextValue;
|
|
72
|
+
export type { ToastContextValue, ToastParams, ToastProps, ToastProviderProps };
|
|
73
73
|
//# sourceMappingURL=toast.d.ts.map
|
package/dist/toast.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.d.ts","names":[],"sources":["../src/core/components/toast/toast.tsx","../src/core/components/toast/toastLayer.tsx","../src/core/components/toast/toastProvider.tsx","../src/core/components/toast/types.ts","../src/core/components/toast/useToast.ts"],"mappings":"
|
|
1
|
+
{"version":3,"file":"toast.d.ts","names":[],"sources":["../src/core/components/toast/toast.tsx","../src/core/components/toast/toastLayer.tsx","../src/core/components/toast/toastProvider.tsx","../src/core/components/toast/types.ts","../src/core/components/toast/useToast.ts"],"mappings":"AAoBA;;;UAAiB;EACf;EACA,cAAc,MAAM;EACpB;EACA;EACA,QAAQ,MAAM;EACd;EACA;EACA;;;;;;;;;wBAqBc,MACd,OAAO,aACL,KACE,MAAM,UAAU,oHAUnB,MAAM,IAAI;;;;UCtDI;EACf,UAAU,MAAM;EAChB;EACA;EACA;EACA;;;;;UCQe,2BAA2B,KAAK;EAC/C,WAAW,MAAM;EACjB;;;;;wBAMc,cAAc,OAAO,qBAAqB,MAAM,IAAI;;;;UC1BnD;EACf;EACA,cAAc,MAAM;EACpB;EACA;EACA;EACA,QAAQ,MAAM;EACd;;;;;UAMe;EACf;;;;;;;EAOA,OAAO,QAAQ;;;;;wBCfD,YAAY"}
|