@react-spectrum/s2 0.3.2-nightly.5038 → 0.4.0

package/dist/TextField.css

@@ -1,5 +1,5 @@
 @layer _.a {
-  .k1 {
+  .k3 {
     height: auto;
   }
 
@@ -74,23 +74,23 @@
     line-height: 1.3;
   }
 
-  .-aqrvqh_k-o {
+  .-aqrvqh_k-q {
     --field-height: 2rem;
   }
 
-  .-aqrvqh_k-i {
+  .-aqrvqh_k-k {
     --field-height: 1.25rem;
   }
 
-  .-aqrvqh_k-k {
+  .-aqrvqh_k-m {
     --field-height: 1.5rem;
   }
 
-  .-aqrvqh_k-p {
+  .-aqrvqh_k-r {
     --field-height: 2.5rem;
   }
 
-  .-aqrvqh_k-v {
+  .-aqrvqh_k-x {
     --field-height: 3rem;
   }
 
@@ -98,7 +98,7 @@
     --field-gap: calc((var(--field-height)  - var(--u, 0px)  - var(--v, 0px)  - 1lh) / 2);
   }
 
-  .jd {
+  .je {
     column-gap: .75rem;
   }
 
@@ -180,23 +180,23 @@
     overflow-x: hidden;
   }
 
-  .-_375tou_o-o {
+  .-_375tou_o-q {
     --o: 2rem;
   }
 
-  .-_375tou_o-i {
+  .-_375tou_o-k {
     --o: 1.25rem;
   }
 
-  .-_375tou_o-k {
+  .-_375tou_o-m {
     --o: 1.5rem;
   }
 
-  .-_375tou_o-p {
+  .-_375tou_o-r {
     --o: 2.5rem;
   }
 
-  .-_375tou_o-v {
+  .-_375tou_o-x {
     --o: 3rem;
   }
 }
@@ -231,23 +231,23 @@
       font-size: 1.375rem;
     }
 
-    .-aqrvqh_k-bp {
+    .-aqrvqh_k-br {
       --field-height: 2.5rem;
     }
 
-    .-aqrvqh_k-bj {
+    .-aqrvqh_k-bl {
       --field-height: 1.5625rem;
     }
 
-    .-aqrvqh_k-bl {
+    .-aqrvqh_k-bn {
       --field-height: 1.875rem;
     }
 
-    .-aqrvqh_k-bs {
+    .-aqrvqh_k-bu {
       --field-height: 3.125rem;
     }
 
-    .-aqrvqh_k-bw {
+    .-aqrvqh_k-by {
       --field-height: 3.75rem;
     }
 
@@ -255,23 +255,23 @@
       min-width: 0;
     }
 
-    .-_375tou_o-bp {
+    .-_375tou_o-br {
       --o: 2.5rem;
     }
 
-    .-_375tou_o-bj {
+    .-_375tou_o-bl {
       --o: 1.5625rem;
     }
 
-    .-_375tou_o-bl {
+    .-_375tou_o-bn {
       --o: 1.875rem;
     }
 
-    .-_375tou_o-bs {
+    .-_375tou_o-bu {
       --o: 3.125rem;
     }
 
-    .-_375tou_o-bw {
+    .-_375tou_o-by {
       --o: 3.75rem;
     }
   }

package/dist/TextField.css.map

@@ -1 +1 @@
-{"mappings":"AC0EqB;EAAA;;;;EAqDe;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAuEnB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA5HI;EAqDe;;;;;AArDf;;AAqDe;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAuEnB;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA","sources":["b5f6eedb906c59d7","packages/@react-spectrum/s2/src/TextField.tsx"],"sourcesContent":["@import \"ab36e6acf2667a8b\";\n@import \"67d58da798418a3e\";\n@import \"83cde29013713f83\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  TextArea as AriaTextArea,\n  TextAreaContext as AriaTextAreaContext,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps,\n  ContextValue,\n  InputContext,\n  useSlottedContext\n} from 'react-aria-components';\nimport {centerPadding, field, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {mergeRefs} from '@react-aria/utils';\nimport {style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'children' | 'className' | 'style'>, StyleProps, SpectrumLabelableProps, HelpTextProps {\n  /**\n   * The size of the text field.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, TextFieldRef>>(null);\n\nfunction TextField(props: TextFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextFieldContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}>\n      <Input />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextFields are text inputs that allow users to input custom text entries\n * with a keyboard. Various decorations can be displayed around the field to\n * communicate the entry requirements.\n */\nlet _TextField = forwardRef(TextField);\nexport {_TextField as TextField};\n\nexport interface TextAreaProps extends Omit<TextFieldProps, 'type' | 'pattern'> {}\n\nexport const TextAreaContext = createContext<ContextValue<TextAreaProps, TextFieldRef<HTMLTextAreaElement>>>(null);\n\nfunction TextArea(props: TextAreaProps, ref: Ref<TextFieldRef<HTMLTextAreaElement>>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextAreaContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}\n      fieldGroupCss={style({\n        alignItems: 'baseline',\n        height: 'auto'\n      })}>\n      <TextAreaInput />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextAreas are multiline text inputs, useful for cases where users have\n * a sizable amount of text to enter. They allow for all customizations that\n * are available to text fields.\n */\nlet _TextArea = forwardRef(TextArea);\nexport {_TextArea as TextArea};\n\nfunction TextFieldBase(props: TextFieldProps & {children: ReactNode, fieldGroupCss?: StyleString}, ref: Ref<TextFieldRef<HTMLInputElement | HTMLTextAreaElement>>) {\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useRef<HTMLDivElement>(null);\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    label,\n    description,\n    errorMessage,\n    necessityIndicator,\n    labelPosition = 'top',\n    labelAlign = 'start',\n    fieldGroupCss,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...textFieldProps\n  } = props;\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n  return (\n    <AriaTextField\n      {...textFieldProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        size: props.size,\n        labelPosition,\n        isInForm: !!formContext\n      }, props.styles)}>\n      {composeRenderProps(props.children, (children, {isDisabled, isInvalid}) => (<>\n        <FieldLabel\n          isDisabled={isDisabled}\n          isRequired={props.isRequired}\n          size={props.size}\n          labelPosition={labelPosition}\n          labelAlign={labelAlign}\n          necessityIndicator={necessityIndicator}\n          contextualHelp={props.contextualHelp}>\n          {label}\n        </FieldLabel>\n        {/* TODO: set GroupContext in RAC TextField */}\n        <FieldGroup role=\"presentation\" isDisabled={isDisabled} isInvalid={isInvalid} size={props.size} styles={fieldGroupCss}>\n          <InputContext.Consumer>\n            {ctx => (\n              <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                {children}\n              </InputContext.Provider>\n            )}\n          </InputContext.Consumer>\n          {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n        </FieldGroup>\n        <HelpText\n          size={props.size}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          description={description}>\n          {errorMessage}\n        </HelpText>\n      </>))}\n    </AriaTextField>\n  );\n}\n\nlet _TextFieldBase = forwardRef(TextFieldBase);\n\nfunction TextAreaInput() {\n  // Force re-render when value changes so we update the height.\n  useSlottedContext(AriaTextAreaContext) ?? {};\n  let onHeightChange = (input: HTMLTextAreaElement) => {\n    // TODO: only do this if an explicit height is not given?\n    if (input) {\n      let prevAlignment = input.style.alignSelf;\n      let prevOverflow = input.style.overflow;\n      // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it.\n      // The measure/applied height is also incorrect/reset if we turn on and off\n      // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n      let isFirefox = 'MozAppearance' in input.style;\n      if (!isFirefox) {\n        input.style.overflow = 'hidden';\n      }\n      input.style.alignSelf = 'start';\n      input.style.height = 'auto';\n      // offsetHeight - clientHeight accounts for the border/padding.\n      input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;\n      input.style.overflow = prevOverflow;\n      input.style.alignSelf = prevAlignment;\n    }\n  };\n\n  return (\n    <AriaTextArea\n      ref={onHeightChange}\n      // Workaround for baseline alignment bug in Safari.\n      // https://bugs.webkit.org/show_bug.cgi?id=142968\n      placeholder=\" \"\n      className={style({\n        paddingX: 0,\n        paddingY: centerPadding(),\n        minHeight: 'control',\n        boxSizing: 'border-box',\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        lineHeight: '[inherit]',\n        flexGrow: 1,\n        minWidth: 0,\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        resize: 'none',\n        overflowX: 'hidden'\n      })} />\n  );\n}\n"],"names":[],"version":3,"file":"TextField.css.map"}
+{"mappings":"AC0EqB;EAAA;;;;EAqDe;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAuEnB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AA5HI;EAqDe;;;;;AArDf;;AAqDe;EAAA;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAuEnB;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;IAAA;;;;;;AAAA","sources":["b5f6eedb906c59d7","packages/@react-spectrum/s2/src/TextField.tsx"],"sourcesContent":["@import \"ab36e6acf2667a8b\";\n@import \"67d58da798418a3e\";\n@import \"83cde29013713f83\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  TextArea as AriaTextArea,\n  TextAreaContext as AriaTextAreaContext,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps,\n  ContextValue,\n  InputContext,\n  useSlottedContext\n} from 'react-aria-components';\nimport {centerPadding, field, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {mergeRefs} from '@react-aria/utils';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'children' | 'className' | 'style'>, StyleProps, SpectrumLabelableProps, HelpTextProps {\n  /**\n   * The size of the text field.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, TextFieldRef>>(null);\n\nfunction TextField(props: TextFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextFieldContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}>\n      <Input />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextFields are text inputs that allow users to input custom text entries\n * with a keyboard. Various decorations can be displayed around the field to\n * communicate the entry requirements.\n */\nlet _TextField = forwardRef(TextField);\nexport {_TextField as TextField};\n\nexport interface TextAreaProps extends Omit<TextFieldProps, 'type' | 'pattern'> {}\n\nexport const TextAreaContext = createContext<ContextValue<TextAreaProps, TextFieldRef<HTMLTextAreaElement>>>(null);\n\nfunction TextArea(props: TextAreaProps, ref: Ref<TextFieldRef<HTMLTextAreaElement>>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextAreaContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}\n      fieldGroupCss={style({\n        alignItems: 'baseline',\n        height: 'auto'\n      })}>\n      <TextAreaInput />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextAreas are multiline text inputs, useful for cases where users have\n * a sizable amount of text to enter. They allow for all customizations that\n * are available to text fields.\n */\nlet _TextArea = forwardRef(TextArea);\nexport {_TextArea as TextArea};\n\nfunction TextFieldBase(props: TextFieldProps & {children: ReactNode, fieldGroupCss?: StyleString}, ref: Ref<TextFieldRef<HTMLInputElement | HTMLTextAreaElement>>) {\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useRef<HTMLDivElement>(null);\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    label,\n    description,\n    errorMessage,\n    necessityIndicator,\n    labelPosition = 'top',\n    labelAlign = 'start',\n    fieldGroupCss,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...textFieldProps\n  } = props;\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n  return (\n    <AriaTextField\n      {...textFieldProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        size: props.size,\n        labelPosition,\n        isInForm: !!formContext\n      }, props.styles)}>\n      {composeRenderProps(props.children, (children, {isDisabled, isInvalid}) => (<>\n        <FieldLabel\n          isDisabled={isDisabled}\n          isRequired={props.isRequired}\n          size={props.size}\n          labelPosition={labelPosition}\n          labelAlign={labelAlign}\n          necessityIndicator={necessityIndicator}\n          contextualHelp={props.contextualHelp}>\n          {label}\n        </FieldLabel>\n        {/* TODO: set GroupContext in RAC TextField */}\n        <FieldGroup role=\"presentation\" isDisabled={isDisabled} isInvalid={isInvalid} size={props.size} styles={fieldGroupCss}>\n          <InputContext.Consumer>\n            {ctx => (\n              <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                {children}\n              </InputContext.Provider>\n            )}\n          </InputContext.Consumer>\n          {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n        </FieldGroup>\n        <HelpText\n          size={props.size}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          description={description}>\n          {errorMessage}\n        </HelpText>\n      </>))}\n    </AriaTextField>\n  );\n}\n\nlet _TextFieldBase = forwardRef(TextFieldBase);\n\nfunction TextAreaInput() {\n  // Force re-render when value changes so we update the height.\n  useSlottedContext(AriaTextAreaContext) ?? {};\n  let onHeightChange = (input: HTMLTextAreaElement) => {\n    // TODO: only do this if an explicit height is not given?\n    if (input) {\n      let prevAlignment = input.style.alignSelf;\n      let prevOverflow = input.style.overflow;\n      // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it.\n      // The measure/applied height is also incorrect/reset if we turn on and off\n      // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n      let isFirefox = 'MozAppearance' in input.style;\n      if (!isFirefox) {\n        input.style.overflow = 'hidden';\n      }\n      input.style.alignSelf = 'start';\n      input.style.height = 'auto';\n      // offsetHeight - clientHeight accounts for the border/padding.\n      input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;\n      input.style.overflow = prevOverflow;\n      input.style.alignSelf = prevAlignment;\n    }\n  };\n\n  return (\n    <AriaTextArea\n      ref={onHeightChange}\n      // Workaround for baseline alignment bug in Safari.\n      // https://bugs.webkit.org/show_bug.cgi?id=142968\n      placeholder=\" \"\n      className={style({\n        paddingX: 0,\n        paddingY: centerPadding(),\n        minHeight: 'control',\n        boxSizing: 'border-box',\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        lineHeight: '[inherit]',\n        flexGrow: 1,\n        minWidth: 0,\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        resize: 'none',\n        overflowX: 'hidden'\n      })} />\n  );\n}\n"],"names":[],"version":3,"file":"TextField.css.map"}

package/dist/TextField.mjs

@@ -1,7 +1,7 @@
 import "./TextField.css";
 import {FieldErrorIcon as $9afd80978c252040$export$bda0d075e0e342c9, FieldGroup as $9afd80978c252040$export$f0fe469072bc6950, FieldLabel as $9afd80978c252040$export$1acdcf5a973a8414, HelpText as $9afd80978c252040$export$a67c0bc59081311a, Input as $9afd80978c252040$export$f5b8910cec6cf069} from "./Field.mjs";
 import {FormContext as $9b916426527cebe7$export$c24727297075ec6a, useFormProps as $9b916426527cebe7$export$a6b5be5c6b451665} from "./Form.mjs";
-import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "./useSpectrumContextProps.mjs";
+import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
 import {jsx as $fsr8S$jsx, jsxs as $fsr8S$jsxs, Fragment as $fsr8S$Fragment} from "react/jsx-runtime";
 import {TextField as $fsr8S$TextField, composeRenderProps as $fsr8S$composeRenderProps, InputContext as $fsr8S$InputContext, useSlottedContext as $fsr8S$useSlottedContext, TextAreaContext as $fsr8S$TextAreaContext, TextArea as $fsr8S$TextArea} from "react-aria-components";
 import {createContext as $fsr8S$createContext, forwardRef as $fsr8S$forwardRef, useRef as $fsr8S$useRef, useContext as $fsr8S$useContext, useImperativeHandle as $fsr8S$useImperativeHandle} from "react";
@@ -46,7 +46,7 @@ function $d946f50010ba937f$var$TextArea(props, ref) {
     return /*#__PURE__*/ (0, $fsr8S$jsx)($d946f50010ba937f$var$_TextFieldBase, {
         ...props,
         ref: ref,
-        fieldGroupCss: " . _1d k1",
+        fieldGroupCss: " . _1d k3",
         children: /*#__PURE__*/ (0, $fsr8S$jsx)($d946f50010ba937f$var$TextAreaInput, {})
     });
 }
@@ -123,23 +123,23 @@ function $d946f50010ba937f$var$TextFieldBase(props, ref) {
             rules += ' _f-1x99dlob';
             rules += ' _fa';
             if (props.size === "XL") {
-                rules += ' -aqrvqh_k-bw';
-                rules += ' -aqrvqh_k-v';
+                rules += ' -aqrvqh_k-by';
+                rules += ' -aqrvqh_k-x';
             } else if (props.size === "L") {
-                rules += ' -aqrvqh_k-bs';
-                rules += ' -aqrvqh_k-p';
+                rules += ' -aqrvqh_k-bu';
+                rules += ' -aqrvqh_k-r';
             } else if (props.size === "S") {
+                rules += ' -aqrvqh_k-bn';
+                rules += ' -aqrvqh_k-m';
+            } else if (props.size === "XS") {
                 rules += ' -aqrvqh_k-bl';
                 rules += ' -aqrvqh_k-k';
-            } else if (props.size === "XS") {
-                rules += ' -aqrvqh_k-bj';
-                rules += ' -aqrvqh_k-i';
             } else {
-                rules += ' -aqrvqh_k-bp';
-                rules += ' -aqrvqh_k-o';
+                rules += ' -aqrvqh_k-br';
+                rules += ' -aqrvqh_k-q';
             }
             rules += ' -_1inj1bc_i--prjw07';
-            rules += ' jd';
+            rules += ' je';
             rules += ' __R-yksgrp';
             return rules;
         }({
@@ -240,20 +240,20 @@ function $d946f50010ba937f$var$TextAreaInput() {
             rules += ' __Ia';
             rules += ' __vb';
             if (props.size === "XL") {
-                rules += ' -_375tou_o-bw';
-                rules += ' -_375tou_o-v';
+                rules += ' -_375tou_o-by';
+                rules += ' -_375tou_o-x';
             } else if (props.size === "L") {
-                rules += ' -_375tou_o-bs';
-                rules += ' -_375tou_o-p';
+                rules += ' -_375tou_o-bu';
+                rules += ' -_375tou_o-r';
             } else if (props.size === "S") {
+                rules += ' -_375tou_o-bn';
+                rules += ' -_375tou_o-m';
+            } else if (props.size === "XS") {
                 rules += ' -_375tou_o-bl';
                 rules += ' -_375tou_o-k';
-            } else if (props.size === "XS") {
-                rules += ' -_375tou_o-bj';
-                rules += ' -_375tou_o-i';
             } else {
-                rules += ' -_375tou_o-bp';
-                rules += ' -_375tou_o-o';
+                rules += ' -_375tou_o-br';
+                rules += ' -_375tou_o-q';
             }
             return rules;
         }

package/dist/TextField.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/TextField.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  TextArea as AriaTextArea,\n  TextAreaContext as AriaTextAreaContext,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps,\n  ContextValue,\n  InputContext,\n  useSlottedContext\n} from 'react-aria-components';\nimport {centerPadding, field, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {mergeRefs} from '@react-aria/utils';\nimport {style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'children' | 'className' | 'style'>, StyleProps, SpectrumLabelableProps, HelpTextProps {\n  /**\n   * The size of the text field.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, TextFieldRef>>(null);\n\nfunction TextField(props: TextFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextFieldContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}>\n      <Input />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextFields are text inputs that allow users to input custom text entries\n * with a keyboard. Various decorations can be displayed around the field to\n * communicate the entry requirements.\n */\nlet _TextField = forwardRef(TextField);\nexport {_TextField as TextField};\n\nexport interface TextAreaProps extends Omit<TextFieldProps, 'type' | 'pattern'> {}\n\nexport const TextAreaContext = createContext<ContextValue<TextAreaProps, TextFieldRef<HTMLTextAreaElement>>>(null);\n\nfunction TextArea(props: TextAreaProps, ref: Ref<TextFieldRef<HTMLTextAreaElement>>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextAreaContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}\n      fieldGroupCss={style({\n        alignItems: 'baseline',\n        height: 'auto'\n      })}>\n      <TextAreaInput />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextAreas are multiline text inputs, useful for cases where users have\n * a sizable amount of text to enter. They allow for all customizations that\n * are available to text fields.\n */\nlet _TextArea = forwardRef(TextArea);\nexport {_TextArea as TextArea};\n\nfunction TextFieldBase(props: TextFieldProps & {children: ReactNode, fieldGroupCss?: StyleString}, ref: Ref<TextFieldRef<HTMLInputElement | HTMLTextAreaElement>>) {\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useRef<HTMLDivElement>(null);\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    label,\n    description,\n    errorMessage,\n    necessityIndicator,\n    labelPosition = 'top',\n    labelAlign = 'start',\n    fieldGroupCss,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...textFieldProps\n  } = props;\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n  return (\n    <AriaTextField\n      {...textFieldProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        size: props.size,\n        labelPosition,\n        isInForm: !!formContext\n      }, props.styles)}>\n      {composeRenderProps(props.children, (children, {isDisabled, isInvalid}) => (<>\n        <FieldLabel\n          isDisabled={isDisabled}\n          isRequired={props.isRequired}\n          size={props.size}\n          labelPosition={labelPosition}\n          labelAlign={labelAlign}\n          necessityIndicator={necessityIndicator}\n          contextualHelp={props.contextualHelp}>\n          {label}\n        </FieldLabel>\n        {/* TODO: set GroupContext in RAC TextField */}\n        <FieldGroup role=\"presentation\" isDisabled={isDisabled} isInvalid={isInvalid} size={props.size} styles={fieldGroupCss}>\n          <InputContext.Consumer>\n            {ctx => (\n              <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                {children}\n              </InputContext.Provider>\n            )}\n          </InputContext.Consumer>\n          {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n        </FieldGroup>\n        <HelpText\n          size={props.size}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          description={description}>\n          {errorMessage}\n        </HelpText>\n      </>))}\n    </AriaTextField>\n  );\n}\n\nlet _TextFieldBase = forwardRef(TextFieldBase);\n\nfunction TextAreaInput() {\n  // Force re-render when value changes so we update the height.\n  useSlottedContext(AriaTextAreaContext) ?? {};\n  let onHeightChange = (input: HTMLTextAreaElement) => {\n    // TODO: only do this if an explicit height is not given?\n    if (input) {\n      let prevAlignment = input.style.alignSelf;\n      let prevOverflow = input.style.overflow;\n      // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it.\n      // The measure/applied height is also incorrect/reset if we turn on and off\n      // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n      let isFirefox = 'MozAppearance' in input.style;\n      if (!isFirefox) {\n        input.style.overflow = 'hidden';\n      }\n      input.style.alignSelf = 'start';\n      input.style.height = 'auto';\n      // offsetHeight - clientHeight accounts for the border/padding.\n      input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;\n      input.style.overflow = prevOverflow;\n      input.style.alignSelf = prevAlignment;\n    }\n  };\n\n  return (\n    <AriaTextArea\n      ref={onHeightChange}\n      // Workaround for baseline alignment bug in Safari.\n      // https://bugs.webkit.org/show_bug.cgi?id=142968\n      placeholder=\" \"\n      className={style({\n        paddingX: 0,\n        paddingY: centerPadding(),\n        minHeight: 'control',\n        boxSizing: 'border-box',\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        lineHeight: '[inherit]',\n        flexGrow: 1,\n        minWidth: 0,\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        resize: 'none',\n        overflowX: 'hidden'\n      })} />\n  );\n}\n"],"names":[],"version":3,"file":"TextField.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/TextField.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  TextArea as AriaTextArea,\n  TextAreaContext as AriaTextAreaContext,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps,\n  ContextValue,\n  InputContext,\n  useSlottedContext\n} from 'react-aria-components';\nimport {centerPadding, field, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {createContext, forwardRef, ReactNode, Ref, useContext, useImperativeHandle, useRef} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {HelpTextProps, SpectrumLabelableProps} from '@react-types/shared';\nimport {mergeRefs} from '@react-aria/utils';\nimport {style} from '../style' with {type: 'macro'};\nimport {StyleString} from '../style/types';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface TextFieldProps extends Omit<AriaTextFieldProps, 'children' | 'className' | 'style'>, StyleProps, SpectrumLabelableProps, HelpTextProps {\n  /**\n   * The size of the text field.\n   *\n   * @default 'M'\n   */\n  size?: 'S' | 'M' | 'L' | 'XL'\n}\n\nexport const TextFieldContext = createContext<ContextValue<TextFieldProps, TextFieldRef>>(null);\n\nfunction TextField(props: TextFieldProps, ref: Ref<TextFieldRef>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextFieldContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}>\n      <Input />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextFields are text inputs that allow users to input custom text entries\n * with a keyboard. Various decorations can be displayed around the field to\n * communicate the entry requirements.\n */\nlet _TextField = forwardRef(TextField);\nexport {_TextField as TextField};\n\nexport interface TextAreaProps extends Omit<TextFieldProps, 'type' | 'pattern'> {}\n\nexport const TextAreaContext = createContext<ContextValue<TextAreaProps, TextFieldRef<HTMLTextAreaElement>>>(null);\n\nfunction TextArea(props: TextAreaProps, ref: Ref<TextFieldRef<HTMLTextAreaElement>>) {\n  [props, ref] = useSpectrumContextProps(props, ref, TextAreaContext);\n  return (\n    <_TextFieldBase\n      {...props}\n      ref={ref}\n      fieldGroupCss={style({\n        alignItems: 'baseline',\n        height: 'auto'\n      })}>\n      <TextAreaInput />\n    </_TextFieldBase>\n  );\n}\n\n/**\n * TextAreas are multiline text inputs, useful for cases where users have\n * a sizable amount of text to enter. They allow for all customizations that\n * are available to text fields.\n */\nlet _TextArea = forwardRef(TextArea);\nexport {_TextArea as TextArea};\n\nfunction TextFieldBase(props: TextFieldProps & {children: ReactNode, fieldGroupCss?: StyleString}, ref: Ref<TextFieldRef<HTMLInputElement | HTMLTextAreaElement>>) {\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useRef<HTMLDivElement>(null);\n  let formContext = useContext(FormContext);\n  props = useFormProps(props);\n  let {\n    label,\n    description,\n    errorMessage,\n    necessityIndicator,\n    labelPosition = 'top',\n    labelAlign = 'start',\n    fieldGroupCss,\n    UNSAFE_style,\n    UNSAFE_className = '',\n    ...textFieldProps\n  } = props;\n\n  // Expose imperative interface for ref\n  useImperativeHandle(ref, () => ({\n    ...createFocusableRef(domRef, inputRef),\n    select() {\n      if (inputRef.current) {\n        inputRef.current.select();\n      }\n    },\n    getInputElement() {\n      return inputRef.current;\n    }\n  }));\n\n  return (\n    <AriaTextField\n      {...textFieldProps}\n      ref={domRef}\n      style={UNSAFE_style}\n      className={UNSAFE_className + style(field(), getAllowedOverrides())({\n        size: props.size,\n        labelPosition,\n        isInForm: !!formContext\n      }, props.styles)}>\n      {composeRenderProps(props.children, (children, {isDisabled, isInvalid}) => (<>\n        <FieldLabel\n          isDisabled={isDisabled}\n          isRequired={props.isRequired}\n          size={props.size}\n          labelPosition={labelPosition}\n          labelAlign={labelAlign}\n          necessityIndicator={necessityIndicator}\n          contextualHelp={props.contextualHelp}>\n          {label}\n        </FieldLabel>\n        {/* TODO: set GroupContext in RAC TextField */}\n        <FieldGroup role=\"presentation\" isDisabled={isDisabled} isInvalid={isInvalid} size={props.size} styles={fieldGroupCss}>\n          <InputContext.Consumer>\n            {ctx => (\n              <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n                {children}\n              </InputContext.Provider>\n            )}\n          </InputContext.Consumer>\n          {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n        </FieldGroup>\n        <HelpText\n          size={props.size}\n          isDisabled={isDisabled}\n          isInvalid={isInvalid}\n          description={description}>\n          {errorMessage}\n        </HelpText>\n      </>))}\n    </AriaTextField>\n  );\n}\n\nlet _TextFieldBase = forwardRef(TextFieldBase);\n\nfunction TextAreaInput() {\n  // Force re-render when value changes so we update the height.\n  useSlottedContext(AriaTextAreaContext) ?? {};\n  let onHeightChange = (input: HTMLTextAreaElement) => {\n    // TODO: only do this if an explicit height is not given?\n    if (input) {\n      let prevAlignment = input.style.alignSelf;\n      let prevOverflow = input.style.overflow;\n      // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it.\n      // The measure/applied height is also incorrect/reset if we turn on and off\n      // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062\n      let isFirefox = 'MozAppearance' in input.style;\n      if (!isFirefox) {\n        input.style.overflow = 'hidden';\n      }\n      input.style.alignSelf = 'start';\n      input.style.height = 'auto';\n      // offsetHeight - clientHeight accounts for the border/padding.\n      input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;\n      input.style.overflow = prevOverflow;\n      input.style.alignSelf = prevAlignment;\n    }\n  };\n\n  return (\n    <AriaTextArea\n      ref={onHeightChange}\n      // Workaround for baseline alignment bug in Safari.\n      // https://bugs.webkit.org/show_bug.cgi?id=142968\n      placeholder=\" \"\n      className={style({\n        paddingX: 0,\n        paddingY: centerPadding(),\n        minHeight: 'control',\n        boxSizing: 'border-box',\n        backgroundColor: 'transparent',\n        color: '[inherit]',\n        fontFamily: '[inherit]',\n        fontSize: '[inherit]',\n        fontWeight: '[inherit]',\n        lineHeight: '[inherit]',\n        flexGrow: 1,\n        minWidth: 0,\n        outlineStyle: 'none',\n        borderStyle: 'none',\n        resize: 'none',\n        overflowX: 'hidden'\n      })} />\n  );\n}\n"],"names":[],"version":3,"file":"TextField.mjs.map"}

package/dist/ToggleButton.cjs

@@ -3,8 +3,10 @@ var $6e265ff388155b91$exports = require("./ActionButton.cjs");
 var $e991cbcdf82ced71$exports = require("./CenterBaseline.cjs");
 var $bde97c91243ed164$exports = require("../icons/Icon.cjs");
 var $2061c83559b50a66$exports = require("./pressScale.cjs");
+var $5eb75e0c130e0669$exports = require("../icons/Skeleton.cjs");
 var $6367bc87eb7d24ad$exports = require("./Content.cjs");
-var $ac757a4c2bd72aee$exports = require("./useSpectrumContextProps.cjs");
+var $bfa4962d90c8af48$exports = require("./Form.cjs");
+var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
 var $kyLWK$reactjsxruntime = require("react/jsx-runtime");
 var $kyLWK$reactariacomponents = require("react-aria-components");
 var $kyLWK$react = require("react");
@@ -37,9 +39,12 @@ $parcel$export(module.exports, "ToggleButton", () => $d16e5203405a91b7$export$d2
 
 
 
+
+
 const $d16e5203405a91b7$export$43506d75ebd2e218 = /*#__PURE__*/ (0, $kyLWK$react.createContext)(null);
 function $d16e5203405a91b7$var$ToggleButton(props, ref) {
     [props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $d16e5203405a91b7$export$43506d75ebd2e218);
+    props = (0, $bfa4962d90c8af48$exports.useFormProps)(props);
     let domRef = (0, $kyLWK$reactspectrumutils.useFocusableRef)(ref);
     return /*#__PURE__*/ (0, $kyLWK$reactjsxruntime.jsx)((0, $kyLWK$reactariacomponents.ToggleButton), {
         ...props,
@@ -50,10 +55,15 @@ function $d16e5203405a91b7$var$ToggleButton(props, ref) {
                 staticColor: props.staticColor,
                 size: props.size,
                 isQuiet: props.isQuiet,
-                isEmphasized: props.isEmphasized
+                isEmphasized: props.isEmphasized,
+                isPending: false
             }, props.styles),
         children: /*#__PURE__*/ (0, $kyLWK$reactjsxruntime.jsx)((0, $kyLWK$reactariacomponents.Provider), {
             values: [
+                [
+                    (0, $5eb75e0c130e0669$exports.SkeletonContext),
+                    null
+                ],
                 [
                     (0, $6367bc87eb7d24ad$exports.TextContext),
                     {

package/dist/ToggleButton.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AAsBM,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAyE;AAExH,SAAS,mCAAa,KAAwB,EAAE,GAAoC;IAClF,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,qBACE,gCAAC,CAAA,GAAA,uCAAc;QACZ,GAAG,KAAK;QACT,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,mCAAQ,EAAE;gBACnE,GAAG,WAAW;gBACd,aAAa,MAAM,WAAW;gBAC9B,MAAM,MAAM,IAAI;gBAChB,SAAS,MAAM,OAAO;gBACtB,cAAc,MAAM,YAAY;YAClC,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+C;iBAAE;gBACtE;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F;AAEA;;;CAGC,GACD,IAAI,0DAAgB,CAAA,GAAA,uBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;AAwBM,MAAM,0DAAsB,CAAA,GAAA,0BAAY,EAAyE;AAExH,SAAS,mCAAa,KAAwB,EAAE,GAAoC;IAClF,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE;IAC7B,qBACE,gCAAC,CAAA,GAAA,uCAAc;QACZ,GAAG,KAAK;QACT,KAAK;QACL,OAAO,CAAA,GAAA,oCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,mCAAQ,EAAE;gBACnE,GAAG,WAAW;gBACd,aAAa,MAAM,WAAW;gBAC9B,MAAM,MAAM,IAAI;gBAChB,SAAS,MAAM,OAAO;gBACtB,cAAc,MAAM,YAAY;gBAChC,WAAW;YACb,GAAG,MAAM,MAAM;kBACf,cAAA,gCAAC,CAAA,GAAA,mCAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBAAC,MAAM;oBAA+C;iBAAE;gBACtE;oBAAC,CAAA,GAAA,qCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,wCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,8BAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F;AAEA;;;CAGC,GACD,IAAI,0DAAgB,CAAA,GAAA,uBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  props = useFormProps(props as any);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized,\n        isPending: false\n      }, props.styles)}>\n      <Provider\n        values={[\n          [SkeletonContext, null],\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.cjs.map"}

package/dist/ToggleButton.css.map

@@ -1 +1 @@
-{"mappings":"ACmDiC;EAAA;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAHa;;AAEyB","sources":["bc1013d4d937a6f8","packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["@import \"2356498b79989caa\";\n@import \"00644bdfe594b970\";\n@import \"2645bae9c4681078\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.css.map"}
+{"mappings":"ACwDiC;EAAA;;;;EAAA;;;;EAAA;;;;EAEyB;;;;EACtC;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAHa;;AAEyB","sources":["bc1013d4d937a6f8","packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["@import \"2356498b79989caa\";\n@import \"00644bdfe594b970\";\n@import \"2645bae9c4681078\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  props = useFormProps(props as any);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized,\n        isPending: false\n      }, props.styles)}>\n      <Provider\n        values={[\n          [SkeletonContext, null],\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.css.map"}

package/dist/ToggleButton.mjs

@@ -3,8 +3,10 @@ import {btnStyles as $da878a05ab4a403e$export$446543cff2a0f496} from "./ActionBu
 import {centerBaseline as $1f4b04be3f24aae3$export$9d7e2342a7e53afa} from "./CenterBaseline.mjs";
 import {IconContext as $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed} from "../icons/Icon.mjs";
 import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
+import {SkeletonContext as $5ad421ec19460c48$export$74e166679b1f49ee} from "../icons/Skeleton.mjs";
 import {Text as $8e847109a6ab556d$export$5f1af8db9871e1d6, TextContext as $8e847109a6ab556d$export$9afb8bc826b033ea} from "./Content.mjs";
-import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "./useSpectrumContextProps.mjs";
+import {useFormProps as $9b916426527cebe7$export$a6b5be5c6b451665} from "./Form.mjs";
+import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
 import {jsx as $fpet3$jsx} from "react/jsx-runtime";
 import {ToggleButton as $fpet3$ToggleButton, Provider as $fpet3$Provider} from "react-aria-components";
 import {createContext as $fpet3$createContext, forwardRef as $fpet3$forwardRef} from "react";
@@ -30,9 +32,12 @@ import {useFocusableRef as $fpet3$useFocusableRef} from "@react-spectrum/utils";
 
 
 
+
+
 const $fe4c9df7420c3c9f$export$43506d75ebd2e218 = /*#__PURE__*/ (0, $fpet3$createContext)(null);
 function $fe4c9df7420c3c9f$var$ToggleButton(props, ref) {
     [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $fe4c9df7420c3c9f$export$43506d75ebd2e218);
+    props = (0, $9b916426527cebe7$export$a6b5be5c6b451665)(props);
     let domRef = (0, $fpet3$useFocusableRef)(ref);
     return /*#__PURE__*/ (0, $fpet3$jsx)((0, $fpet3$ToggleButton), {
         ...props,
@@ -43,10 +48,15 @@ function $fe4c9df7420c3c9f$var$ToggleButton(props, ref) {
                 staticColor: props.staticColor,
                 size: props.size,
                 isQuiet: props.isQuiet,
-                isEmphasized: props.isEmphasized
+                isEmphasized: props.isEmphasized,
+                isPending: false
             }, props.styles),
         children: /*#__PURE__*/ (0, $fpet3$jsx)((0, $fpet3$Provider), {
             values: [
+                [
+                    (0, $5ad421ec19460c48$export$74e166679b1f49ee),
+                    null
+                ],
                 [
                     (0, $8e847109a6ab556d$export$9afb8bc826b033ea),
                     {

package/dist/ToggleButton.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AAsBM,MAAM,0DAAsB,CAAA,GAAA,oBAAY,EAAyE;AAExH,SAAS,mCAAa,KAAwB,EAAE,GAAoC;IAClF,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,qBACE,gBAAC,CAAA,GAAA,mBAAc;QACZ,GAAG,KAAK;QACT,KAAK;QACL,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,yCAAQ,EAAE;gBACnE,GAAG,WAAW;gBACd,aAAa,MAAM,WAAW;gBAC9B,MAAM,MAAM,IAAI;gBAChB,SAAS,MAAM,OAAO;gBACtB,cAAc,MAAM,YAAY;YAClC,GAAG,MAAM,MAAM;kBACf,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBAAC,MAAM;oBAA+C;iBAAE;gBACtE;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gBAAC,CAAA,GAAA,yCAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F;AAEA;;;CAGC,GACD,IAAI,0DAAgB,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized\n      }, props.styles)}>\n      <Provider\n        values={[\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.mjs.map"}
+{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;AAwBM,MAAM,0DAAsB,CAAA,GAAA,oBAAY,EAAyE;AAExH,SAAS,mCAAa,KAAwB,EAAE,GAAoC;IAClF,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,QAAQ,CAAA,GAAA,yCAAW,EAAE;IACrB,IAAI,SAAS,CAAA,GAAA,sBAAc,EAAE;IAC7B,qBACE,gBAAC,CAAA,GAAA,mBAAc;QACZ,GAAG,KAAK;QACT,KAAK;QACL,OAAO,CAAA,GAAA,yCAAS,EAAE,QAAQ,MAAM,YAAY;QAC5C,WAAW,CAAA,cAAe,AAAC,CAAA,MAAM,gBAAgB,IAAI,EAAC,IAAK,CAAA,GAAA,yCAAQ,EAAE;gBACnE,GAAG,WAAW;gBACd,aAAa,MAAM,WAAW;gBAC9B,MAAM,MAAM,IAAI;gBAChB,SAAS,MAAM,OAAO;gBACtB,cAAc,MAAM,YAAY;gBAChC,WAAW;YACb,GAAG,MAAM,MAAM;kBACf,cAAA,gBAAC,CAAA,GAAA,eAAO;YACN,QAAQ;gBACN;oBAAC,CAAA,GAAA,yCAAc;oBAAG;iBAAK;gBACvB;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBAAC,MAAM;oBAA+C;iBAAE;gBACtE;oBAAC,CAAA,GAAA,yCAAU;oBAAG;wBACZ,QAAQ,CAAA,GAAA,yCAAa,EAAE;4BAAC,MAAM;4BAAQ,MAAM;wBAAmB;wBAC/D,MAAM;oBACR;iBAAE;aACH;sBACA,OAAO,MAAM,QAAQ,KAAK,yBAAW,gBAAC,CAAA,GAAA,yCAAG;0BAAG,MAAM,QAAQ;iBAAW,MAAM,QAAQ;;;AAI5F;AAEA;;;CAGC,GACD,IAAI,0DAAgB,CAAA,GAAA,iBAAS,EAAE","sources":["packages/@react-spectrum/s2/src/ToggleButton.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonStyleProps, btnStyles} from './ActionButton';\nimport {centerBaseline} from './CenterBaseline';\nimport {ContextValue, Provider, ToggleButton as RACToggleButton, ToggleButtonProps as RACToggleButtonProps} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {fontRelative, style} from '../style' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {pressScale} from './pressScale';\nimport {SkeletonContext} from './Skeleton';\nimport {StyleProps} from './style-utils';\nimport {Text, TextContext} from './Content';\nimport {useFocusableRef} from '@react-spectrum/utils';\nimport {useFormProps} from './Form';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ToggleButtonProps extends Omit<RACToggleButtonProps, 'className' | 'style' | 'children' | 'onHover' | 'onHoverStart' | 'onHoverEnd' | 'onHoverChange'>, StyleProps, ActionButtonStyleProps {\n  /** The content to display in the button. */\n  children?: ReactNode,\n  /** Whether the button should be displayed with an [emphasized style](https://spectrum.adobe.com/page/action-button/#Emphasis). */\n  isEmphasized?: boolean\n}\n\nexport const ToggleButtonContext = createContext<ContextValue<ToggleButtonProps, FocusableRefValue<HTMLButtonElement>>>(null);\n\nfunction ToggleButton(props: ToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ToggleButtonContext);\n  props = useFormProps(props as any);\n  let domRef = useFocusableRef(ref);\n  return (\n    <RACToggleButton\n      {...props}\n      ref={domRef}\n      style={pressScale(domRef, props.UNSAFE_style)}\n      className={renderProps => (props.UNSAFE_className || '') + btnStyles({\n        ...renderProps,\n        staticColor: props.staticColor,\n        size: props.size,\n        isQuiet: props.isQuiet,\n        isEmphasized: props.isEmphasized,\n        isPending: false\n      }, props.styles)}>\n      <Provider\n        values={[\n          [SkeletonContext, null],\n          [TextContext, {styles: style({paddingY: '--labelPadding', order: 1})}],\n          [IconContext, {\n            render: centerBaseline({slot: 'icon', styles: style({order: 0})}),\n            styles: style({size: fontRelative(20), marginStart: '--iconMargin', flexShrink: 0})\n          }]\n        ]}>\n        {typeof props.children === 'string' ? <Text>{props.children}</Text> : props.children}\n      </Provider>\n    </RACToggleButton>\n  );\n}\n\n/**\n * ToggleButtons allow users to toggle a selection on or off, for example\n * switching between two states or modes.\n */\nlet _ToggleButton = forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"ToggleButton.mjs.map"}

package/dist/Tooltip.cjs

@@ -36,8 +36,8 @@ const $d3b6a84aebe66f8d$var$tooltip = function anonymous(props) {
     else rules += ' _A-10jn6wd';
     rules += ' _2d';
     rules += ' _1c';
-    rules += ' rbK';
-    rules += ' rH';
+    rules += ' rbM';
+    rules += ' rJ';
     rules += ' o-375tou';
     rules += ' __na';
     rules += ' _c-bc1l9oh';
@@ -69,14 +69,14 @@ const $d3b6a84aebe66f8d$var$tooltip = function anonymous(props) {
     rules += ' _wh';
     rules += ' _xh';
     rules += ' _yh';
-    rules += ' CH';
-    rules += ' DH';
+    rules += ' CI';
+    rules += ' DI';
     rules += ' E-1dbqcch';
     rules += ' F-1dbqcch';
-    rules += ' Ac';
-    rules += ' Bc';
-    rules += ' yc';
-    rules += ' zc';
+    rules += ' Ad';
+    rules += ' Bd';
+    rules += ' yd';
+    rules += ' zd';
     if (props.isExiting) rules += ' _S-xkqmqx';
     else if (props.isEntering) rules += ' _S-xkqmqx';
     if (props.isExiting) rules += ' _T-375xx3';
@@ -84,16 +84,16 @@ const $d3b6a84aebe66f8d$var$tooltip = function anonymous(props) {
     if (props.isExiting) rules += ' _Yc';
     if (props.isExiting) rules += ' _Vb';
     else if (props.isEntering) rules += ' _Va';
-    if (props.placement === "right") rules += ' -s75z33_A-J';
-    else if (props.placement === "left") rules += ' -s75z33_A-b';
+    if (props.placement === "right") rules += ' -s75z33_A-K';
+    else if (props.placement === "left") rules += ' -s75z33_A-c';
     else if (props.placement === "bottom") rules += ' -s75z33_A-a';
     else if (props.placement === "top") rules += ' -s75z33_A-a';
     if (props.placement === "right") rules += ' -s75z34_A-a';
     else if (props.placement === "left") rules += ' -s75z34_A-a';
-    else if (props.placement === "bottom") rules += ' -s75z34_A-J';
-    else if (props.placement === "top") rules += ' -s75z34_A-b';
-    rules += ' -_375tou_o-bl';
-    rules += ' -_375tou_o-k';
+    else if (props.placement === "bottom") rules += ' -s75z34_A-K';
+    else if (props.placement === "top") rules += ' -s75z34_A-c';
+    rules += ' -_375tou_o-bn';
+    rules += ' -_375tou_o-m';
     rules += ' -_375tp0_u-ab';
     rules += ' -_375tp1_v-ab';
     return rules;

package/dist/Tooltip.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAoCD,MAAM;AAYN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEN,MAAM;;;;;;;;;;;;AAmBN,IAAI,oEAAgC,CAAA,GAAA,0BAAY,EAAuB,CAAC;AAExE,SAAS,8BAAQ,KAAmB,EAAE,GAA2B;IAC/D,IAAI,YAAC,QAAQ,gBAAE,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IACtD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,oBACF,gBAAgB,eAChB,WAAW,UACX,MAAM,aACN,YAAY,mBACZ,UAAU,EACX,GAAG,CAAA,GAAA,uBAAS,EAAE;IACf,IAAI,cAAc,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,4CAAiB;IAC9C,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,oCAAQ;IAClC,IAAI,CAAC,cAAc,gBAAgB,GAAG,CAAA,GAAA,qBAAO,EAAE;IAE/C,0DAA0D;IAC1D,IAAI,aAAa,CAAA,GAAA,wBAAU,EAAE,CAAC;QAC3B,OAA4C,OAAO,GAAG;QACvD,IAAI,IAAI;YACN,GAAG,IAAI,GAAG;YACV,GAAG,GAAG,GAAG;YACT,IAAI,uBAAuB,OAAO,gBAAgB,CAAC,IAAI,YAAY;YACnE,IAAI,yBAAyB,IAC3B,gBAAgB,SAAS,sBAAsB;QAEnD;IACF,GAAG;QAAC;QAAQ;QAAW;KAAO;IAE9B,qBACE,gCAAC,CAAA,GAAA,kCAAU;QACR,GAAG,KAAK;QACT,qBAAqB;QACrB,kBAAkB;QAClB,aAAa;QACb,QAAQ;QACR,WAAW;QACX,YAAY;QACZ,KAAK;QACL,OAAO;QACP,WAAW,CAAA,cAAe,mBAAmB,8BAAQ;gBAAC,GAAG,WAAW;6BAAE;YAAW;kBAChF,CAAA,4BACC;;kCACE,gCAAC,CAAA,GAAA,uCAAW;kCACV,cAAA,gCAAC;4BAAI,WAAW,kCAAY;4BAAc,OAAM;4BAA6B,OAAM;4BAAK,QAAO;4BAAI,SAAQ;sCACzG,cAAA,gCAAC;gCAAK,GAAE;;;;oBAGX;;;;AAKX;AAOO,SAAS,0CAAe,KAA0B;IACvD,IAAI,oBACF,gBAAgB,eAChB,WAAW,UACX,MAAM,aACN,SAAS,cACT,UAAU,EACV,GAAG,cACJ,GAAG;IAEJ,qBACE,gCAAC,CAAA,GAAA,yCAAiB;QAAG,GAAG,YAAY;kBAClC,cAAA,gCAAC,oDAA8B,QAAQ;YACrC,OAAO;gBACL,kBAAkB;gBAClB,aAAa;gBACb,QAAQ;gBACR,WAAW;gBACX,YAAY;YACd;sBACC,MAAM,QAAQ;;;AAIvB;AAGA;;CAEC,GACD,IAAI,0DAAW,CAAA,GAAA,uBAAS,EAAE;AAOnB,SAAS,0CAAgB,KAAgB;IAC9C,qBAAO,gCAAC;AACV","sources":["packages/@react-spectrum/s2/src/Tooltip.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  Tooltip as AriaTooltip,\n  TooltipProps as AriaTooltipProps,\n  TooltipTrigger as AriaTooltipTrigger,\n  TooltipTriggerComponentProps as AriaTooltipTriggerComponentProps,\n  OverlayArrow,\n  TooltipRenderProps,\n  useLocale\n} from 'react-aria-components';\nimport {centerPadding, colorScheme, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ColorScheme} from '@react-types/provider';\nimport {ColorSchemeContext} from './Provider';\nimport {createContext, forwardRef, MutableRefObject, ReactNode, useCallback, useContext, useState} from 'react';\nimport {DOMRef} from '@react-types/shared';\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {style} from '../style/spectrum-theme' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\n\nexport interface TooltipTriggerProps extends Omit<AriaTooltipTriggerComponentProps, 'children' | 'closeDelay'>, Pick<AriaTooltipProps, 'shouldFlip' | 'containerPadding' | 'offset' | 'crossOffset'> {\n  /** The content of the tooltip. */\n  children?: ReactNode,\n  /**\n   * The placement of the element with respect to its anchor element.\n   *\n   * @default 'top'\n   */\n  placement?: 'start' | 'end' | 'right' | 'left' | 'top' | 'bottom'\n}\n\nexport interface TooltipProps extends Omit<AriaTooltipProps, 'children' | 'className' | 'style' | 'triggerRef' | 'UNSTABLE_portalContainer' | 'isEntering' | 'isExiting' | 'placement' | 'containerPadding' |  'offset' | 'crossOffset' |  'shouldFlip' | 'arrowBoundaryOffset' | 'isOpen' | 'defaultOpen' | 'onOpenChange'>, UnsafeStyles {\n  /** The content of the tooltip. */\n  children?: ReactNode\n}\n\nconst slide = keyframes(`\n  from {\n    transform: translate(var(--originX), var(--originY));\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n`);\n\nconst tooltip = style<TooltipRenderProps & {colorScheme: ColorScheme | 'light dark' | null}>({\n  ...colorScheme(),\n  justifyContent: 'center',\n  alignItems: 'center',\n  maxWidth: 160,\n  minHeight: 24,\n  boxSizing: 'border-box',\n  font: 'ui-sm',\n  color: {\n    default: 'gray-25',\n    forcedColors: 'ButtonText'\n  },\n  borderWidth: {\n    forcedColors: 1\n  },\n  borderStyle: {\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: 'transparent'\n  },\n  backgroundColor: 'neutral',\n  borderRadius: 'control',\n  paddingX: 'edge-to-text',\n  paddingY: centerPadding(),\n  margin: 8,\n  animation: {\n    isEntering: slide,\n    isExiting: slide\n  },\n  animationDuration: {\n    isEntering: 200,\n    isExiting: 200\n  },\n  animationDirection: {\n    isEntering: 'normal',\n    isExiting: 'reverse'\n  },\n  animationTimingFunction: {\n    isExiting: 'in'\n  },\n  '--originX': {\n    type: 'marginTop',\n    value: {\n      placement: {\n        top: 0,\n        bottom: 0,\n        left: 4,\n        right: -4\n      }\n    }\n  },\n  '--originY': {\n    type: 'marginTop',\n    value: {\n      placement: {\n        top: 4,\n        bottom: -4,\n        left: 0,\n        right: -0\n      }\n    }\n  }\n});\n\nconst arrowStyles = style<TooltipRenderProps>({\n  display: 'block',\n  fill: 'gray-800',\n  rotate: {\n    placement: {\n      top: 0,\n      bottom: '180deg',\n      left: '-90deg',\n      right: '90deg'\n    }\n  },\n  translateX: {\n    placement: {\n      left: '[-25%]',\n      right: '[25%]'\n    }\n  }\n});\n\nlet InternalTooltipTriggerContext = createContext<TooltipTriggerProps>({});\n\nfunction Tooltip(props: TooltipProps, ref: DOMRef<HTMLDivElement>) {\n  let {children, UNSAFE_style, UNSAFE_className = ''} = props;\n  let domRef = useDOMRef(ref);\n  let {\n    containerPadding,\n    crossOffset,\n    offset,\n    placement = 'top',\n    shouldFlip\n  } = useContext(InternalTooltipTriggerContext);\n  let colorScheme = useContext(ColorSchemeContext);\n  let {locale, direction} = useLocale();\n  let [borderRadius, setBorderRadius] = useState(0);\n\n  // TODO: should we pass through lang and dir props in RAC?\n  let tooltipRef = useCallback((el: HTMLDivElement) => {\n    (domRef as MutableRefObject<HTMLDivElement>).current = el;\n    if (el) {\n      el.lang = locale;\n      el.dir = direction;\n      let spectrumBorderRadius = window.getComputedStyle(el).borderRadius;\n      if (spectrumBorderRadius !== '') {\n        setBorderRadius(parseInt(spectrumBorderRadius, 10));\n      }\n    }\n  }, [locale, direction, domRef]);\n\n  return (\n    <AriaTooltip\n      {...props}\n      arrowBoundaryOffset={borderRadius}\n      containerPadding={containerPadding}\n      crossOffset={crossOffset}\n      offset={offset}\n      placement={placement}\n      shouldFlip={shouldFlip}\n      ref={tooltipRef}\n      style={UNSAFE_style}\n      className={renderProps => UNSAFE_className + tooltip({...renderProps, colorScheme})}>\n      {renderProps => (\n        <>\n          <OverlayArrow>\n            <svg className={arrowStyles(renderProps)} xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"5\" viewBox=\"0 0 10 5\">\n              <path d=\"M4.29289 4.29289L0 0H10L5.70711 4.29289C5.31658 4.68342 4.68342 4.68342 4.29289 4.29289Z\" />\n            </svg>\n          </OverlayArrow>\n          {children}\n        </>\n      )}\n    </AriaTooltip>\n  );\n}\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerProps) {\n  let {\n    containerPadding,\n    crossOffset,\n    offset,\n    placement,\n    shouldFlip,\n    ...triggerProps\n  } = props;\n\n  return (\n    <AriaTooltipTrigger {...triggerProps}>\n      <InternalTooltipTriggerContext.Provider\n        value={{\n          containerPadding: containerPadding,\n          crossOffset: crossOffset,\n          offset: offset,\n          placement: placement,\n          shouldFlip: shouldFlip\n        }}>\n        {props.children}\n      </InternalTooltipTriggerContext.Provider>\n    </AriaTooltipTrigger>\n  );\n}\n\n\n/**\n * Display container for Tooltip content. Has a directional arrow dependent on its placement.\n */\nlet _Tooltip = forwardRef(Tooltip);\nexport {_Tooltip as Tooltip};\n\n\n// This is purely so that storybook generates the types for both Menu and MenuTrigger\ninterface ICombined extends Omit<TooltipProps, 'placement'>, TooltipTriggerProps {}\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport function CombinedTooltip(props: ICombined) {\n  return <div />;\n}\n"],"names":[],"version":3,"file":"Tooltip.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAoCD,MAAM;AAYN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEN,MAAM;;;;;;;;;;;;AAmBN,IAAI,oEAAgC,CAAA,GAAA,0BAAY,EAAuB,CAAC;AAExE,SAAS,8BAAQ,KAAmB,EAAE,GAA2B;IAC/D,IAAI,YAAC,QAAQ,gBAAE,YAAY,oBAAE,mBAAmB,IAAG,GAAG;IACtD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,oBACF,gBAAgB,eAChB,WAAW,UACX,MAAM,aACN,YAAY,mBACZ,UAAU,EACX,GAAG,CAAA,GAAA,uBAAS,EAAE;IACf,IAAI,cAAc,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,4CAAiB;IAC9C,IAAI,UAAC,MAAM,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,oCAAQ;IAClC,IAAI,CAAC,cAAc,gBAAgB,GAAG,CAAA,GAAA,qBAAO,EAAE;IAE/C,0DAA0D;IAC1D,IAAI,aAAa,CAAA,GAAA,wBAAU,EAAE,CAAC;QAC3B,OAA4C,OAAO,GAAG;QACvD,IAAI,IAAI;YACN,GAAG,IAAI,GAAG;YACV,GAAG,GAAG,GAAG;YACT,IAAI,uBAAuB,OAAO,gBAAgB,CAAC,IAAI,YAAY;YACnE,IAAI,yBAAyB,IAC3B,gBAAgB,SAAS,sBAAsB;QAEnD;IACF,GAAG;QAAC;QAAQ;QAAW;KAAO;IAE9B,qBACE,gCAAC,CAAA,GAAA,kCAAU;QACR,GAAG,KAAK;QACT,qBAAqB;QACrB,kBAAkB;QAClB,aAAa;QACb,QAAQ;QACR,WAAW;QACX,YAAY;QACZ,KAAK;QACL,OAAO;QACP,WAAW,CAAA,cAAe,mBAAmB,8BAAQ;gBAAC,GAAG,WAAW;6BAAE;YAAW;kBAChF,CAAA,4BACC;;kCACE,gCAAC,CAAA,GAAA,uCAAW;kCACV,cAAA,gCAAC;4BAAI,WAAW,kCAAY;4BAAc,OAAM;4BAA6B,OAAM;4BAAK,QAAO;4BAAI,SAAQ;sCACzG,cAAA,gCAAC;gCAAK,GAAE;;;;oBAGX;;;;AAKX;AAOO,SAAS,0CAAe,KAA0B;IACvD,IAAI,oBACF,gBAAgB,eAChB,WAAW,UACX,MAAM,aACN,SAAS,cACT,UAAU,EACV,GAAG,cACJ,GAAG;IAEJ,qBACE,gCAAC,CAAA,GAAA,yCAAiB;QAAG,GAAG,YAAY;kBAClC,cAAA,gCAAC,oDAA8B,QAAQ;YACrC,OAAO;gBACL,kBAAkB;gBAClB,aAAa;gBACb,QAAQ;gBACR,WAAW;gBACX,YAAY;YACd;sBACC,MAAM,QAAQ;;;AAIvB;AAGA;;CAEC,GACD,IAAI,0DAAW,CAAA,GAAA,uBAAS,EAAE;AAOnB,SAAS,0CAAgB,KAAgB;IAC9C,qBAAO,gCAAC;AACV","sources":["packages/@react-spectrum/s2/src/Tooltip.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  Tooltip as AriaTooltip,\n  TooltipProps as AriaTooltipProps,\n  TooltipTrigger as AriaTooltipTrigger,\n  TooltipTriggerComponentProps as AriaTooltipTriggerComponentProps,\n  OverlayArrow,\n  TooltipRenderProps,\n  useLocale\n} from 'react-aria-components';\nimport {centerPadding, colorScheme, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ColorScheme} from '@react-types/provider';\nimport {ColorSchemeContext} from './Provider';\nimport {createContext, forwardRef, MutableRefObject, ReactNode, useCallback, useContext, useState} from 'react';\nimport {DOMRef} from '@react-types/shared';\nimport {keyframes} from '../style/style-macro' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\n\nexport interface TooltipTriggerProps extends Omit<AriaTooltipTriggerComponentProps, 'children' | 'closeDelay'>, Pick<AriaTooltipProps, 'shouldFlip' | 'containerPadding' | 'offset' | 'crossOffset'> {\n  /** The content of the tooltip. */\n  children?: ReactNode,\n  /**\n   * The placement of the element with respect to its anchor element.\n   *\n   * @default 'top'\n   */\n  placement?: 'start' | 'end' | 'right' | 'left' | 'top' | 'bottom'\n}\n\nexport interface TooltipProps extends Omit<AriaTooltipProps, 'children' | 'className' | 'style' | 'triggerRef' | 'UNSTABLE_portalContainer' | 'isEntering' | 'isExiting' | 'placement' | 'containerPadding' |  'offset' | 'crossOffset' |  'shouldFlip' | 'arrowBoundaryOffset' | 'isOpen' | 'defaultOpen' | 'onOpenChange'>, UnsafeStyles {\n  /** The content of the tooltip. */\n  children?: ReactNode\n}\n\nconst slide = keyframes(`\n  from {\n    transform: translate(var(--originX), var(--originY));\n    opacity: 0;\n  }\n\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n`);\n\nconst tooltip = style<TooltipRenderProps & {colorScheme: ColorScheme | 'light dark' | null}>({\n  ...colorScheme(),\n  justifyContent: 'center',\n  alignItems: 'center',\n  maxWidth: 160,\n  minHeight: 24,\n  boxSizing: 'border-box',\n  font: 'ui-sm',\n  color: {\n    default: 'gray-25',\n    forcedColors: 'ButtonText'\n  },\n  borderWidth: {\n    forcedColors: 1\n  },\n  borderStyle: {\n    forcedColors: 'solid'\n  },\n  borderColor: {\n    forcedColors: 'transparent'\n  },\n  backgroundColor: 'neutral',\n  borderRadius: 'control',\n  paddingX: 'edge-to-text',\n  paddingY: centerPadding(),\n  margin: 8,\n  animation: {\n    isEntering: slide,\n    isExiting: slide\n  },\n  animationDuration: {\n    isEntering: 200,\n    isExiting: 200\n  },\n  animationDirection: {\n    isEntering: 'normal',\n    isExiting: 'reverse'\n  },\n  animationTimingFunction: {\n    isExiting: 'in'\n  },\n  '--originX': {\n    type: 'marginTop',\n    value: {\n      placement: {\n        top: 0,\n        bottom: 0,\n        left: 4,\n        right: -4\n      }\n    }\n  },\n  '--originY': {\n    type: 'marginTop',\n    value: {\n      placement: {\n        top: 4,\n        bottom: -4,\n        left: 0,\n        right: -0\n      }\n    }\n  }\n});\n\nconst arrowStyles = style<TooltipRenderProps>({\n  display: 'block',\n  fill: 'gray-800',\n  rotate: {\n    placement: {\n      top: 0,\n      bottom: '180deg',\n      left: '-90deg',\n      right: '90deg'\n    }\n  },\n  translateX: {\n    placement: {\n      left: '[-25%]',\n      right: '[25%]'\n    }\n  }\n});\n\nlet InternalTooltipTriggerContext = createContext<TooltipTriggerProps>({});\n\nfunction Tooltip(props: TooltipProps, ref: DOMRef<HTMLDivElement>) {\n  let {children, UNSAFE_style, UNSAFE_className = ''} = props;\n  let domRef = useDOMRef(ref);\n  let {\n    containerPadding,\n    crossOffset,\n    offset,\n    placement = 'top',\n    shouldFlip\n  } = useContext(InternalTooltipTriggerContext);\n  let colorScheme = useContext(ColorSchemeContext);\n  let {locale, direction} = useLocale();\n  let [borderRadius, setBorderRadius] = useState(0);\n\n  // TODO: should we pass through lang and dir props in RAC?\n  let tooltipRef = useCallback((el: HTMLDivElement) => {\n    (domRef as MutableRefObject<HTMLDivElement>).current = el;\n    if (el) {\n      el.lang = locale;\n      el.dir = direction;\n      let spectrumBorderRadius = window.getComputedStyle(el).borderRadius;\n      if (spectrumBorderRadius !== '') {\n        setBorderRadius(parseInt(spectrumBorderRadius, 10));\n      }\n    }\n  }, [locale, direction, domRef]);\n\n  return (\n    <AriaTooltip\n      {...props}\n      arrowBoundaryOffset={borderRadius}\n      containerPadding={containerPadding}\n      crossOffset={crossOffset}\n      offset={offset}\n      placement={placement}\n      shouldFlip={shouldFlip}\n      ref={tooltipRef}\n      style={UNSAFE_style}\n      className={renderProps => UNSAFE_className + tooltip({...renderProps, colorScheme})}>\n      {renderProps => (\n        <>\n          <OverlayArrow>\n            <svg className={arrowStyles(renderProps)} xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"5\" viewBox=\"0 0 10 5\">\n              <path d=\"M4.29289 4.29289L0 0H10L5.70711 4.29289C5.31658 4.68342 4.68342 4.68342 4.29289 4.29289Z\" />\n            </svg>\n          </OverlayArrow>\n          {children}\n        </>\n      )}\n    </AriaTooltip>\n  );\n}\n\n/**\n * TooltipTrigger wraps around a trigger element and a Tooltip. It handles opening and closing\n * the Tooltip when the user hovers over or focuses the trigger, and positioning the Tooltip\n * relative to the trigger.\n */\nexport function TooltipTrigger(props: TooltipTriggerProps) {\n  let {\n    containerPadding,\n    crossOffset,\n    offset,\n    placement,\n    shouldFlip,\n    ...triggerProps\n  } = props;\n\n  return (\n    <AriaTooltipTrigger {...triggerProps}>\n      <InternalTooltipTriggerContext.Provider\n        value={{\n          containerPadding: containerPadding,\n          crossOffset: crossOffset,\n          offset: offset,\n          placement: placement,\n          shouldFlip: shouldFlip\n        }}>\n        {props.children}\n      </InternalTooltipTriggerContext.Provider>\n    </AriaTooltipTrigger>\n  );\n}\n\n\n/**\n * Display container for Tooltip content. Has a directional arrow dependent on its placement.\n */\nlet _Tooltip = forwardRef(Tooltip);\nexport {_Tooltip as Tooltip};\n\n\n// This is purely so that storybook generates the types for both Menu and MenuTrigger\ninterface ICombined extends Omit<TooltipProps, 'placement'>, TooltipTriggerProps {}\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport function CombinedTooltip(props: ICombined) {\n  return <div />;\n}\n"],"names":[],"version":3,"file":"Tooltip.cjs.map"}