@sanity/ui 0.37.16 → 0.37.19

package/lib/{sanity-ui.modern.mjs → sanity-ui.modern.js}

@@ -1884,18 +1884,20 @@ const color = createColorTheme({
     name
   }) => {
     if (name === 'default') {
-      const _skeletonFrom = dark ? hues.gray[900].hex : hues.gray[100].hex;
+      const _tints = hues.gray;
+
+      const _skeletonFrom = dark ? _tints[900].hex : _tints[100].hex;
 
       return {
         fg: dark ? white$1.hex : black$1.hex,
         bg: dark ? black$1.hex : white$1.hex,
-        border: hues.gray[dark ? 800 : 200].hex,
+        border: _tints[dark ? 800 : 200].hex,
         focusRing: hues.blue[dark ? 500 : 500].hex,
         shadow: {
-          outline: rgba(hues.gray[500].hex, 0.4),
-          umbra: rgba(dark ? black$1.hex : hues.gray[500].hex, 0.2),
-          penumbra: rgba(dark ? black$1.hex : hues.gray[500].hex, 0.14),
-          ambient: rgba(dark ? black$1.hex : hues.gray[500].hex, 0.12)
+          outline: rgba(_tints[500].hex, 0.4),
+          umbra: dark ? rgba(_tints[950].hex, 0.4) : rgba(_tints[500].hex, 0.2),
+          penumbra: dark ? rgba(_tints[950].hex, 0.28) : rgba(_tints[500].hex, 0.14),
+          ambient: dark ? rgba(_tints[950].hex, 0.24) : rgba(_tints[500].hex, 0.12)
         },
         skeleton: {
           from: _skeletonFrom,
@@ -1905,18 +1907,18 @@ const color = createColorTheme({
     }
 
     if (name === 'transparent') {
-      const _tints = tones.default;
-      const _skeletonFrom2 = _tints[dark ? 800 : 200].hex;
+      const _tints2 = tones.default;
+      const _skeletonFrom2 = _tints2[dark ? 800 : 200].hex;
       return {
-        fg: _tints[dark ? 100 : 900].hex,
-        bg: _tints[dark ? 950 : 50].hex,
-        border: _tints[dark ? 800 : 300].hex,
+        fg: _tints2[dark ? 100 : 900].hex,
+        bg: _tints2[dark ? 950 : 50].hex,
+        border: _tints2[dark ? 800 : 300].hex,
         focusRing: hues.blue[500].hex,
         shadow: {
-          outline: rgba(_tints[500].hex, dark ? 0.2 : 0.4),
-          umbra: rgba(dark ? black$1.hex : _tints[500].hex, 0.2),
-          penumbra: rgba(dark ? black$1.hex : _tints[500].hex, 0.14),
-          ambient: rgba(dark ? black$1.hex : _tints[500].hex, 0.12)
+          outline: rgba(_tints2[500].hex, 0.4),
+          umbra: dark ? rgba(_tints2[900].hex, 0.4) : rgba(_tints2[500].hex, 0.2),
+          penumbra: dark ? rgba(_tints2[900].hex, 0.28) : rgba(_tints2[500].hex, 0.14),
+          ambient: dark ? rgba(_tints2[900].hex, 0.24) : rgba(_tints2[500].hex, 0.12)
         },
         skeleton: {
           from: _skeletonFrom2,
@@ -1933,10 +1935,10 @@ const color = createColorTheme({
       border: tints[dark ? 800 : 200].hex,
       focusRing: tints[500].hex,
       shadow: {
-        outline: rgba(tints[500].hex, dark ? 0.2 : 0.4),
-        umbra: rgba(dark ? black$1.hex : tints[500].hex, 0.2),
-        penumbra: rgba(dark ? black$1.hex : tints[500].hex, 0.14),
-        ambient: rgba(dark ? black$1.hex : tints[500].hex, 0.12)
+        outline: rgba(tints[500].hex, 0.4),
+        umbra: dark ? rgba(tints[900].hex, 0.4) : rgba(tints[500].hex, 0.2),
+        penumbra: dark ? rgba(tints[900].hex, 0.28) : rgba(tints[500].hex, 0.14),
+        ambient: dark ? rgba(tints[900].hex, 0.24) : rgba(tints[500].hex, 0.12)
       },
       skeleton: {
         from: skeletonFrom,
@@ -7524,6 +7526,7 @@ const TextArea = /*#__PURE__*/forwardRef(function TextArea(props, forwardedRef)
     "data-ui": "TextArea"
   }, /*#__PURE__*/React.createElement(InputRoot$1, null, /*#__PURE__*/React.createElement(Input$1, _extends({
     "data-as": "textarea",
+    "data-scheme": rootTheme.scheme,
     "data-tone": rootTheme.tone
   }, restProps, {
     "$fontSize": useArrayProp(fontSize),
@@ -7539,6 +7542,7 @@ const TextArea = /*#__PURE__*/forwardRef(function TextArea(props, forwardedRef)
     "$radius": useArrayProp(radius),
     "$scheme": rootTheme.scheme,
     "$tone": rootTheme.tone,
+    "data-scheme": rootTheme.scheme,
     "data-tone": rootTheme.tone
   })));
 });
@@ -8718,7 +8722,7 @@ function dialogStyle({
     alignItems: 'center',
     justifyContent: 'center',
     outline: 'none',
-    background: color.shadow.penumbra
+    background: color.shadow.umbra
   };
 }
 function responsiveDialogPositionStyle(props) {
@@ -11103,4 +11107,4 @@ const TreeItem = /*#__PURE__*/memo(function TreeItem(props) {
 });
 
 export { Autocomplete, Avatar, AvatarCounter, AvatarStack, Badge, BoundaryElementProvider, Box, Breadcrumbs, Button, Card, Checkbox, Code, CodeSkeleton, Container, Dialog, DialogContext, DialogProvider, ElementQuery, ErrorBoundary, Flex, Grid, Heading, HeadingSkeleton, Hotkeys, Inline, KBD, Label, LabelSkeleton, Layer, LayerProvider, Menu, MenuButton, MenuDivider, MenuGroup, MenuItem, Popover, Portal, PortalProvider, Radio, Select, Skeleton, Spinner, SrOnly, Stack, Switch, Tab, TabList, TabPanel, Text, TextArea, TextInput, TextSkeleton, ThemeColorProvider, ThemeProvider, Toast, ToastProvider, Tooltip, Tree, TreeItem, VirtualList, _ResizeObserver, _elementSizeObserver, _fillCSSObject, _getArrayProp, _getResponsiveSpace, _hasFocus, _isEnterToClickElement, _isScrollable, _raf, _raf2, _responsive, attemptFocus, createColorTheme, focusFirstDescendant, focusLastDescendant, hexToRgb, hslToRgb, isFocusable, isHTMLAnchorElement, isHTMLButtonElement, isHTMLElement, isHTMLInputElement, isHTMLSelectElement, isHTMLTextAreaElement, multiply$1 as multiply, parseColor, rem, responsiveCodeFontStyle, responsiveHeadingFont, responsiveLabelFont, responsiveTextAlignStyle, responsiveTextFont, rgbToHex, rgbToHsl, rgba, screen$1 as screen, studioTheme, useArrayProp, useBoundaryElement, useClickOutside, useCustomValidity, useDialog, useElementRect, useElementSize, useForwardedRef, useGlobalKeyDown, useLayer, useMediaIndex, usePortal, usePrefersDark, useRootTheme, useTheme, useToast, useTree };
-//# sourceMappingURL=sanity-ui.modern.mjs.map
+//# sourceMappingURL=sanity-ui.modern.js.map