@react-spectrum/button 3.6.0 → 3.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/main.css +1 -2
- package/dist/main.js +428 -420
- package/dist/main.js.map +1 -1
- package/dist/module.js +411 -379
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +4 -4
- package/dist/types.d.ts.map +1 -1
- package/package.json +12 -12
- package/src/ActionButton.tsx +6 -0
- package/dist/main.css.map +0 -1
package/dist/module.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./node_modules/@adobe/spectrum-css-temp/components/button/vars.css","./packages/@react-spectrum/button/src/Button.tsx","./packages/@react-spectrum/button/src/ActionButton.tsx","./packages/@react-spectrum/button/src/FieldButton.tsx","./packages/@react-spectrum/button/src/LogicButton.tsx","./packages/@react-spectrum/button/src/ClearButton.tsx","./packages/@react-spectrum/button/src/ToggleButton.tsx"],"sourcesContent":["function $parcel$interopDefault(a) {\n return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n Object.keys(source).forEach(function(key) {\n if (key === 'default' || key === '__esModule') {\n return;\n }\n\n Object.defineProperty(dest, key, {\n enumerable: true,\n get: function get() {\n return source[key];\n },\n });\n });\n\n return dest;\n}\n\nfunction $parcel$missingModule(name) {\n var err = new Error(\"Cannot find module '\" + name + \"'\");\n err.code = 'MODULE_NOT_FOUND';\n throw err;\n}\n\nvar $parcel$global =\n typeof globalThis !== 'undefined'\n ? globalThis\n : typeof self !== 'undefined'\n ? self\n : typeof window !== 'undefined'\n ? window\n : typeof global !== 'undefined'\n ? global\n : {};\n","/*\n * Copyright 2020 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\n@import './index.css';\n@import './skin.css';\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ElementType, ReactElement} from 'react';\nimport {SpectrumButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\n// todo: CSS hasn't caught up yet, map\nlet VARIANT_MAPPING = {\n negative: 'warning'\n};\n\nfunction Button<T extends ElementType = 'button'>(props: SpectrumButtonProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useSlotProps(props, 'button');\n let {\n elementType: ElementType = 'button',\n children,\n variant,\n isQuiet,\n isDisabled,\n autoFocus,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n let buttonVariant = variant;\n if (VARIANT_MAPPING[variant]) {\n buttonVariant = VARIANT_MAPPING[variant];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <ElementType\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-Button',\n `spectrum-Button--${buttonVariant}`,\n {\n 'spectrum-Button--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Button-label')\n }\n }}>\n {typeof children === 'string'\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </ElementType>\n </FocusRing>\n );\n}\n\n/**\n * Buttons allow users to perform an action or to navigate to another page.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = React.forwardRef(Button) as <T extends ElementType = 'button'>(props: SpectrumButtonProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_Button as Button};\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumActionButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction ActionButton(props: SpectrumActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n props = useSlotProps(props, 'actionButton');\n let {\n isQuiet,\n isDisabled,\n staticColor,\n children,\n autoFocus,\n ...otherProps\n } = props;\n\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ActionButton',\n {\n 'spectrum-ActionButton--quiet': isQuiet,\n 'spectrum-ActionButton--staticColor': !!staticColor,\n 'spectrum-ActionButton--staticWhite': staticColor === 'white',\n 'spectrum-ActionButton--staticBlack': staticColor === 'black',\n 'is-active': isPressed,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-ActionButton-label')\n }\n }}>\n {typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </button>\n </FocusRing>\n );\n}\n\n/**\n * ActionButtons allow users to perform an action.\n * They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.\n */\nlet _ActionButton = React.forwardRef(ActionButton);\nexport {_ActionButton as ActionButton};\n","/*\n * Copyright 2020 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 {ButtonProps} from '@react-types/button';\nimport {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\n\ninterface FieldButtonProps extends ButtonProps, DOMProps, StyleProps {\n isQuiet?: boolean,\n isActive?: boolean,\n validationState?: 'valid' | 'invalid',\n focusRingClass?: string\n}\n\n// @private\nfunction FieldButton(props: FieldButtonProps, ref: FocusableRef) {\n props = useSlotProps(props, 'button');\n let {\n isQuiet,\n isDisabled,\n validationState,\n children,\n autoFocus,\n isActive,\n focusRingClass,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref) as RefObject<HTMLButtonElement>;\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring', focusRingClass)} autoFocus={autoFocus}>\n <button\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-FieldButton',\n {\n 'spectrum-FieldButton--quiet': isQuiet,\n 'is-active': isActive || isPressed,\n 'is-disabled': isDisabled,\n 'spectrum-FieldButton--invalid': validationState === 'invalid',\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n }\n }}>\n {children}\n </SlotProvider>\n </button>\n </FocusRing>\n );\n}\n\nlet _FieldButton = React.forwardRef(FieldButton);\nexport {_FieldButton as FieldButton};\n","/*\n * Copyright 2020 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 {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumLogicButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction LogicButton(props: SpectrumLogicButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n let {\n variant,\n children,\n isDisabled,\n autoFocus,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-LogicButton',\n {\n [`spectrum-LogicButton--${variant}`]: variant,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <span className={classNames(styles, 'spectrum-Button-label')}>{children}</span>\n </button>\n </FocusRing>\n );\n}\n\n/**\n * A LogicButton displays an operator within a boolean logic sequence.\n */\nlet _LogicButton = React.forwardRef(LogicButton);\nexport {_LogicButton as LogicButton};\n","/*\n * Copyright 2020 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 {AriaButtonElementTypeProps, ButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport CrossSmall from '@spectrum-icons/ui/CrossSmall';\nimport {DOMProps, FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ElementType} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\n\ninterface ClearButtonProps<T extends ElementType = 'button'> extends ButtonProps, AriaButtonElementTypeProps<T>, DOMProps, StyleProps {\n focusClassName?: string,\n variant?: 'overBackground',\n excludeFromTabOrder?: boolean,\n preventFocus?: boolean\n}\n\nfunction ClearButton(props: ClearButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n let {\n children = <CrossSmall UNSAFE_className={styles['spectrum-Icon']} />,\n focusClassName,\n variant,\n autoFocus,\n isDisabled,\n preventFocus,\n elementType = preventFocus ? 'div' : 'button' as ElementType,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton({...props, elementType}, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n // For cases like the clear button in a search field, remove the tabIndex so\n // iOS 14 with VoiceOver doesn't focus the button and hide the keyboard when\n // moving the cursor over the clear button.\n if (preventFocus) {\n delete buttonProps.tabIndex;\n }\n\n let ElementType = elementType;\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring', focusClassName)} autoFocus={autoFocus}>\n <ElementType\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ClearButton',\n {\n [`spectrum-ClearButton--${variant}`]: variant,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n {children}\n </ElementType>\n </FocusRing>\n );\n}\n\nlet _ClearButton = React.forwardRef(ClearButton);\nexport {_ClearButton as ClearButton};\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumToggleButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useToggleButton} from '@react-aria/button';\nimport {useToggleState} from '@react-stately/toggle';\n\nfunction ToggleButton(props: SpectrumToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n let {\n isQuiet,\n isDisabled,\n isEmphasized,\n staticColor,\n children,\n autoFocus,\n ...otherProps\n } = props;\n\n let domRef = useFocusableRef(ref);\n let state = useToggleState(props);\n let {buttonProps, isPressed} = useToggleButton(props, state, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ActionButton',\n {\n 'spectrum-ActionButton--quiet': isQuiet,\n 'spectrum-ActionButton--emphasized': isEmphasized,\n 'spectrum-ActionButton--staticColor': !!staticColor,\n 'spectrum-ActionButton--staticWhite': staticColor === 'white',\n 'spectrum-ActionButton--staticBlack': staticColor === 'black',\n 'is-active': isPressed,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered,\n 'is-selected': state.isSelected\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-ActionButton-label')\n }\n }}>\n {typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </button>\n </FocusRing>\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 = React.forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":["$parcel$interopDefault","a","__esModule","default","VARIANT_MAPPING","negative","Button","props","ref","useProviderProps","useSlotProps","elementType","ElementType","children","variant","isQuiet","isDisabled","autoFocus","otherProps","domRef","useFocusableRef","buttonProps","isPressed","useButton","hoverProps","isHovered","useHover","styleProps","useStyleProps","buttonVariant","classNames","mergeProps","className","icon","size","UNSAFE_className","text","_Button","React","forwardRef","ActionButton","staticColor","isTextOnly","Children","toArray","every","c","isValidElement","_ActionButton","FieldButton","validationState","isActive","focusRingClass","_FieldButton","LogicButton","_LogicButton","ClearButton","focusClassName","preventFocus","tabIndex","_ClearButton","ToggleButton","isEmphasized","state","useToggleState","useToggleButton","isSelected","_ToggleButton"],"version":3,"file":"module.js.map"}
|
1
|
+
{"mappings":"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","sources":["packages/@react-spectrum/button/src/index.ts","packages/@react-spectrum/button/src/Button.tsx","packages/@adobe/spectrum-css-temp/components/button/vars.css","packages/@react-spectrum/button/src/ActionButton.tsx","packages/@react-spectrum/button/src/FieldButton.tsx","packages/@react-spectrum/button/src/LogicButton.tsx","packages/@react-spectrum/button/src/ClearButton.tsx","packages/@react-spectrum/button/src/ToggleButton.tsx"],"sourcesContent":["/*\n * Copyright 2020 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\n/// <reference types=\"css-module-types\" />\n\nexport * from './Button';\nexport * from './ActionButton';\nexport * from './FieldButton';\nexport * from './LogicButton';\nexport * from './ClearButton';\nexport * from './ToggleButton';\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ElementType, ReactElement} from 'react';\nimport {SpectrumButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\n// todo: CSS hasn't caught up yet, map\nlet VARIANT_MAPPING = {\n negative: 'warning'\n};\n\nfunction Button<T extends ElementType = 'button'>(props: SpectrumButtonProps<T>, ref: FocusableRef<HTMLElement>) {\n props = useProviderProps(props);\n props = useSlotProps(props, 'button');\n let {\n elementType: ElementType = 'button',\n children,\n variant,\n isQuiet,\n isDisabled,\n autoFocus,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n let buttonVariant = variant;\n if (VARIANT_MAPPING[variant]) {\n buttonVariant = VARIANT_MAPPING[variant];\n }\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <ElementType\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-Button',\n `spectrum-Button--${buttonVariant}`,\n {\n 'spectrum-Button--quiet': isQuiet,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-Button-label')\n }\n }}>\n {typeof children === 'string'\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </ElementType>\n </FocusRing>\n );\n}\n\n/**\n * Buttons allow users to perform an action or to navigate to another page.\n * They have multiple styles for various needs, and are ideal for calling attention to\n * where a user needs to do something in order to move forward in a flow.\n */\nlet _Button = React.forwardRef(Button) as <T extends ElementType = 'button'>(props: SpectrumButtonProps<T> & {ref?: FocusableRef<HTMLElement>}) => ReactElement;\nexport {_Button as Button};\n","/*\n * Copyright 2020 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\n@import './index.css';\n@import './skin.css';\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport CornerTriangle from '@spectrum-icons/ui/CornerTriangle';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumActionButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction ActionButton(props: SpectrumActionButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n props = useSlotProps(props, 'actionButton');\n let {\n isQuiet,\n isDisabled,\n staticColor,\n children,\n autoFocus,\n // @ts-ignore (private)\n holdAffordance,\n ...otherProps\n } = props;\n\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ActionButton',\n {\n 'spectrum-ActionButton--quiet': isQuiet,\n 'spectrum-ActionButton--staticColor': !!staticColor,\n 'spectrum-ActionButton--staticWhite': staticColor === 'white',\n 'spectrum-ActionButton--staticBlack': staticColor === 'black',\n 'is-active': isPressed,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n {holdAffordance &&\n <CornerTriangle UNSAFE_className={classNames(styles, 'spectrum-ActionButton-hold')} />\n }\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-ActionButton-label')\n }\n }}>\n {typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </button>\n </FocusRing>\n );\n}\n\n/**\n * ActionButtons allow users to perform an action.\n * They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.\n */\nlet _ActionButton = React.forwardRef(ActionButton);\nexport {_ActionButton as ActionButton};\n","/*\n * Copyright 2020 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 {ButtonProps} from '@react-types/button';\nimport {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';\nimport {DOMProps, FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {RefObject} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\n\ninterface FieldButtonProps extends ButtonProps, DOMProps, StyleProps {\n isQuiet?: boolean,\n isActive?: boolean,\n validationState?: 'valid' | 'invalid',\n focusRingClass?: string\n}\n\n// @private\nfunction FieldButton(props: FieldButtonProps, ref: FocusableRef) {\n props = useSlotProps(props, 'button');\n let {\n isQuiet,\n isDisabled,\n validationState,\n children,\n autoFocus,\n isActive,\n focusRingClass,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref) as RefObject<HTMLButtonElement>;\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring', focusRingClass)} autoFocus={autoFocus}>\n <button\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-FieldButton',\n {\n 'spectrum-FieldButton--quiet': isQuiet,\n 'is-active': isActive || isPressed,\n 'is-disabled': isDisabled,\n 'spectrum-FieldButton--invalid': validationState === 'invalid',\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n }\n }}>\n {children}\n </SlotProvider>\n </button>\n </FocusRing>\n );\n}\n\nlet _FieldButton = React.forwardRef(FieldButton);\nexport {_FieldButton as FieldButton};\n","/*\n * Copyright 2020 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 {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumLogicButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\nfunction LogicButton(props: SpectrumLogicButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n let {\n variant,\n children,\n isDisabled,\n autoFocus,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton(props, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-LogicButton',\n {\n [`spectrum-LogicButton--${variant}`]: variant,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n <span className={classNames(styles, 'spectrum-Button-label')}>{children}</span>\n </button>\n </FocusRing>\n );\n}\n\n/**\n * A LogicButton displays an operator within a boolean logic sequence.\n */\nlet _LogicButton = React.forwardRef(LogicButton);\nexport {_LogicButton as LogicButton};\n","/*\n * Copyright 2020 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 {AriaButtonElementTypeProps, ButtonProps} from '@react-types/button';\nimport {classNames, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport CrossSmall from '@spectrum-icons/ui/CrossSmall';\nimport {DOMProps, FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ElementType} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {useButton} from '@react-aria/button';\nimport {useHover} from '@react-aria/interactions';\n\ninterface ClearButtonProps<T extends ElementType = 'button'> extends ButtonProps, AriaButtonElementTypeProps<T>, DOMProps, StyleProps {\n focusClassName?: string,\n variant?: 'overBackground',\n excludeFromTabOrder?: boolean,\n preventFocus?: boolean\n}\n\nfunction ClearButton(props: ClearButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n let {\n children = <CrossSmall UNSAFE_className={styles['spectrum-Icon']} />,\n focusClassName,\n variant,\n autoFocus,\n isDisabled,\n preventFocus,\n elementType = preventFocus ? 'div' : 'button' as ElementType,\n ...otherProps\n } = props;\n let domRef = useFocusableRef(ref);\n let {buttonProps, isPressed} = useButton({...props, elementType}, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n\n // For cases like the clear button in a search field, remove the tabIndex so\n // iOS 14 with VoiceOver doesn't focus the button and hide the keyboard when\n // moving the cursor over the clear button.\n if (preventFocus) {\n delete buttonProps.tabIndex;\n }\n\n let ElementType = elementType;\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring', focusClassName)} autoFocus={autoFocus}>\n <ElementType\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ClearButton',\n {\n [`spectrum-ClearButton--${variant}`]: variant,\n 'is-disabled': isDisabled,\n 'is-active': isPressed,\n 'is-hovered': isHovered\n },\n styleProps.className\n )\n }>\n {children}\n </ElementType>\n </FocusRing>\n );\n}\n\nlet _ClearButton = React.forwardRef(ClearButton);\nexport {_ClearButton as ClearButton};\n","/*\n * Copyright 2020 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 {classNames, SlotProvider, useFocusableRef, useStyleProps} from '@react-spectrum/utils';\nimport {FocusableRef} from '@react-types/shared';\nimport {FocusRing} from '@react-aria/focus';\nimport {mergeProps} from '@react-aria/utils';\nimport React from 'react';\nimport {SpectrumToggleButtonProps} from '@react-types/button';\nimport styles from '@adobe/spectrum-css-temp/components/button/vars.css';\nimport {Text} from '@react-spectrum/text';\nimport {useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useToggleButton} from '@react-aria/button';\nimport {useToggleState} from '@react-stately/toggle';\n\nfunction ToggleButton(props: SpectrumToggleButtonProps, ref: FocusableRef<HTMLButtonElement>) {\n props = useProviderProps(props);\n let {\n isQuiet,\n isDisabled,\n isEmphasized,\n staticColor,\n children,\n autoFocus,\n ...otherProps\n } = props;\n\n let domRef = useFocusableRef(ref);\n let state = useToggleState(props);\n let {buttonProps, isPressed} = useToggleButton(props, state, domRef);\n let {hoverProps, isHovered} = useHover({isDisabled});\n let {styleProps} = useStyleProps(otherProps);\n let isTextOnly = React.Children.toArray(props.children).every(c => !React.isValidElement(c));\n\n return (\n <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n <button\n {...styleProps}\n {...mergeProps(buttonProps, hoverProps)}\n ref={domRef}\n className={\n classNames(\n styles,\n 'spectrum-ActionButton',\n {\n 'spectrum-ActionButton--quiet': isQuiet,\n 'spectrum-ActionButton--emphasized': isEmphasized,\n 'spectrum-ActionButton--staticColor': !!staticColor,\n 'spectrum-ActionButton--staticWhite': staticColor === 'white',\n 'spectrum-ActionButton--staticBlack': staticColor === 'black',\n 'is-active': isPressed,\n 'is-disabled': isDisabled,\n 'is-hovered': isHovered,\n 'is-selected': state.isSelected\n },\n styleProps.className\n )\n }>\n <SlotProvider\n slots={{\n icon: {\n size: 'S',\n UNSAFE_className: classNames(styles, 'spectrum-Icon')\n },\n text: {\n UNSAFE_className: classNames(styles, 'spectrum-ActionButton-label')\n }\n }}>\n {typeof children === 'string' || isTextOnly\n ? <Text>{children}</Text>\n : children}\n </SlotProvider>\n </button>\n </FocusRing>\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 = React.forwardRef(ToggleButton);\nexport {_ToggleButton as ToggleButton};\n"],"names":[],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts
CHANGED
@@ -1,14 +1,14 @@
|
|
1
|
-
import
|
1
|
+
import { FocusableRef, DOMProps, StyleProps } from "@react-types/shared";
|
2
|
+
import React, { ReactElement, ElementType } from "react";
|
2
3
|
import { SpectrumButtonProps, SpectrumActionButtonProps, ButtonProps, SpectrumLogicButtonProps, AriaButtonElementTypeProps, SpectrumToggleButtonProps } from "@react-types/button";
|
3
|
-
import { DOMProps, StyleProps } from "@react-types/shared";
|
4
4
|
/**
|
5
5
|
* Buttons allow users to perform an action or to navigate to another page.
|
6
6
|
* They have multiple styles for various needs, and are ideal for calling attention to
|
7
7
|
* where a user needs to do something in order to move forward in a flow.
|
8
8
|
*/
|
9
9
|
export let Button: <T extends React.ElementType<any> = "button">(props: SpectrumButtonProps<T> & {
|
10
|
-
ref?:
|
11
|
-
}) =>
|
10
|
+
ref?: FocusableRef<HTMLElement>;
|
11
|
+
}) => ReactElement;
|
12
12
|
/**
|
13
13
|
* ActionButtons allow users to perform an action.
|
14
14
|
* They’re used for similar, task-based options within a workflow, and are ideal for interfaces where buttons aren’t meant to draw a lot of attention.
|
package/dist/types.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"mappings":"
|
1
|
+
{"mappings":";;;AA0FA;;;;GAIG;AACH,OAAA,IAAI;UAAgH,aAAa,WAAW,CAAC;MAAM,YAAY,CAAC;ACNhK;;;GAGG;AACH,OAAA,IAAI,qLAA8C,CAAC;ACvEnD,0BAA2B,SAAQ,WAAW,EAAE,QAAQ,EAAE,UAAU;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAqDD,OAAA,IAAI,+JAA4C,CAAC;AClBjD;;GAEG;AACH,OAAA,IAAI,mLAA4C,CAAC;AC1CjD,2BAA2B,CAAC,SAAS,WAAW,GAAG,QAAQ,CAAE,SAAQ,WAAW,EAAE,2BAA2B,CAAC,CAAC,EAAE,QAAQ,EAAE,UAAU;IACnI,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,YAAY,CAAC,EAAE,OAAO,CAAA;CACvB;AAmDD,OAAA,IAAI,qLAA4C,CAAC;ACQjD;;;GAGG;AACH,OAAA,IAAI,qLAA8C,CAAC","sources":["packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/Button.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/ActionButton.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/FieldButton.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/LogicButton.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/ClearButton.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/ToggleButton.tsx","packages/@react-spectrum/button/src/packages/@react-spectrum/button/src/index.ts","packages/@react-spectrum/button/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\n * Copyright 2020 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\n/// <reference types=\"css-module-types\" />\n\nexport * from './Button';\nexport * from './ActionButton';\nexport * from './FieldButton';\nexport * from './LogicButton';\nexport * from './ClearButton';\nexport * from './ToggleButton';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@react-spectrum/button",
|
3
|
-
"version": "3.
|
3
|
+
"version": "3.7.2",
|
4
4
|
"description": "Spectrum UI components in React",
|
5
5
|
"license": "Apache-2.0",
|
6
6
|
"main": "dist/main.js",
|
@@ -32,16 +32,16 @@
|
|
32
32
|
},
|
33
33
|
"dependencies": {
|
34
34
|
"@babel/runtime": "^7.6.2",
|
35
|
-
"@react-aria/button": "^3.
|
36
|
-
"@react-aria/focus": "^3.5.
|
37
|
-
"@react-aria/interactions": "^3.
|
38
|
-
"@react-aria/utils": "^3.
|
39
|
-
"@react-spectrum/text": "^3.1.
|
40
|
-
"@react-spectrum/utils": "^3.6.
|
41
|
-
"@react-stately/toggle": "^3.2.
|
42
|
-
"@react-types/button": "^3.4.
|
43
|
-
"@react-types/shared": "^3.
|
44
|
-
"@spectrum-icons/ui": "^3.2.
|
35
|
+
"@react-aria/button": "^3.4.2",
|
36
|
+
"@react-aria/focus": "^3.5.3",
|
37
|
+
"@react-aria/interactions": "^3.8.2",
|
38
|
+
"@react-aria/utils": "^3.11.3",
|
39
|
+
"@react-spectrum/text": "^3.1.6",
|
40
|
+
"@react-spectrum/utils": "^3.6.6",
|
41
|
+
"@react-stately/toggle": "^3.2.6",
|
42
|
+
"@react-types/button": "^3.4.4",
|
43
|
+
"@react-types/shared": "^3.11.2",
|
44
|
+
"@spectrum-icons/ui": "^3.2.4"
|
45
45
|
},
|
46
46
|
"devDependencies": {
|
47
47
|
"@adobe/spectrum-css-temp": "3.0.0-alpha.1",
|
@@ -54,5 +54,5 @@
|
|
54
54
|
"publishConfig": {
|
55
55
|
"access": "public"
|
56
56
|
},
|
57
|
-
"gitHead": "
|
57
|
+
"gitHead": "ed8d8d984c2f7f2c31e8b18795b97858a95e4729"
|
58
58
|
}
|
package/src/ActionButton.tsx
CHANGED
@@ -11,6 +11,7 @@
|
|
11
11
|
*/
|
12
12
|
|
13
13
|
import {classNames, SlotProvider, useFocusableRef, useSlotProps, useStyleProps} from '@react-spectrum/utils';
|
14
|
+
import CornerTriangle from '@spectrum-icons/ui/CornerTriangle';
|
14
15
|
import {FocusableRef} from '@react-types/shared';
|
15
16
|
import {FocusRing} from '@react-aria/focus';
|
16
17
|
import {mergeProps} from '@react-aria/utils';
|
@@ -31,6 +32,8 @@ function ActionButton(props: SpectrumActionButtonProps, ref: FocusableRef<HTMLBu
|
|
31
32
|
staticColor,
|
32
33
|
children,
|
33
34
|
autoFocus,
|
35
|
+
// @ts-ignore (private)
|
36
|
+
holdAffordance,
|
34
37
|
...otherProps
|
35
38
|
} = props;
|
36
39
|
|
@@ -62,6 +65,9 @@ function ActionButton(props: SpectrumActionButtonProps, ref: FocusableRef<HTMLBu
|
|
62
65
|
styleProps.className
|
63
66
|
)
|
64
67
|
}>
|
68
|
+
{holdAffordance &&
|
69
|
+
<CornerTriangle UNSAFE_className={classNames(styles, 'spectrum-ActionButton-hold')} />
|
70
|
+
}
|
65
71
|
<SlotProvider
|
66
72
|
slots={{
|
67
73
|
icon: {
|
package/dist/main.css.map
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
{"mappings":"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","sources":["./node_modules/@adobe/spectrum-css-temp/components/button/index.css","./node_modules/@adobe/spectrum-css-temp/components/button/skin.css"],"sourcesContent":["/*\nCopyright 2019 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\n@import '../commons/index.css';\n\n:root {\n /* Todo: fix in DNA, should have been zero */\n --spectrum-fieldbutton-quiet-border-size: 0;\n --spectrum-fieldbutton-disabled-border-size: 0;\n --spectrum-fieldbutton-quiet-margin: 0;\n --spectrum-fieldbutton-quiet-padding: 0;\n\n /* Hardcoded for wrapping study, needs to be in DNA */\n --spectrum-button-padding-y: var(--spectrum-global-dimension-size-50);\n --spectrum-button-line-height: 1.3;\n}\n\n%spectrum-BaseButton {\n /* Contain halo */\n position: relative;\n\n display: inline-flex;\n box-sizing: border-box;\n\n align-items: center;\n justify-content: center;\n\n /* Show the button overflow in Edge. */\n overflow: visible;\n\n /* Remove button the margin in Firefox and Safari. */\n margin: 0;\n\n border-style: solid;\n\n /* Remove the inheritance of text transform on button in Edge, Firefox, and IE. */\n text-transform: none;\n -webkit-font-smoothing: antialiased;\n /* Font smoothing for Firefox */\n -moz-osx-font-smoothing: grayscale;\n\n button& {\n /* Correct the inability to style clickable types in iOS and Safari. */\n -webkit-appearance: button;\n }\n\n /* Adjacent buttons should be aligned correctly */\n vertical-align: top;\n\n transition: background var(--spectrum-global-animation-duration-100) ease-out,\n border-color var(--spectrum-global-animation-duration-100) ease-out,\n color var(--spectrum-global-animation-duration-100) ease-out,\n box-shadow var(--spectrum-global-animation-duration-100) ease-out;\n\n text-decoration: none;\n font-family: var(--spectrum-font-family-base);\n\n line-height: var(--spectrum-button-line-height);\n\n user-select: none;\n -webkit-user-select: none;\n touch-action: none; /* prevent touch scrolling on buttons */\n\n cursor: default;\n\n isolation: isolate;\n\n &:focus {\n outline: none;\n }\n &:focus-ring {\n z-index: 3;\n }\n\n /* Fix Firefox */\n &::-moz-focus-inner {\n border: 0;\n\n /* Remove the inner border and padding for button in Firefox. */\n border-style: none;\n padding: 0;\n\n /* Use uppercase PX so values don't get converted to rem */\n margin-block-start: -2PX;\n margin-block-end: -2PX;\n }\n\n &:disabled,\n &.is-disabled {\n cursor: default;\n }\n\n .spectrum-Icon {\n max-block-size: 100%;\n flex-shrink: 0;\n order: 0; /* always be before the label, regardless of DOM order */\n\n transition: background var(--spectrum-global-animation-duration-100) ease-out,\n fill var(--spectrum-global-animation-duration-100) ease-out;\n box-sizing: initial;\n }\n\n}\n\n%spectrum-ButtonWithFocusRing {\n &:after {\n border-radius: calc(var(--spectrum-button-primary-border-radius) + var(--spectrum-alias-focus-ring-gap));\n content: '';\n display: block;\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -1);\n transform: translateX(0); /* Forces FF to render on the pixel grid */\n\n transition: box-shadow var(--spectrum-global-animation-duration-100) ease-out,\n margin var(--spectrum-global-animation-duration-100) ease-out;\n }\n\n &:focus-ring {\n &:after {\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -2);\n }\n }\n}\n\n.spectrum-Button {\n @inherit: %spectrum-BaseButton;\n @inherit: %spectrum-ButtonWithFocusRing;\n\n border-width: var(--spectrum-button-primary-border-size);\n border-style: solid;\n border-radius: var(--spectrum-button-primary-border-radius);\n\n min-block-size: var(--spectrum-button-primary-height);\n block-size: 0%;\n min-inline-size: var(--spectrum-button-primary-min-width);\n\n padding: var(--spectrum-button-padding-y) calc(var(--spectrum-button-primary-padding-x) - var(--spectrum-button-primary-border-size));\n\n /* @hack: fix button text vertical alignment at 14px */\n padding-block-end: calc(var(--spectrum-button-padding-y) + 1px);\n padding-block-start: calc(var(--spectrum-button-padding-y) - 1px);\n\n font-size: var(--spectrum-button-primary-text-size);\n font-weight: var(--spectrum-button-primary-text-font-weight);\n\n &:hover,\n &:active {\n box-shadow: none;\n }\n\n /* there should be space between the icon and text no matter the DOM order */\n .spectrum-Icon + .spectrum-Button-label {\n margin-inline-start: var(--spectrum-button-primary-text-gap);\n }\n\n .spectrum-Button-label + .spectrum-Icon {\n margin-inline-end: var(--spectrum-button-primary-text-gap);\n }\n}\n\na.spectrum-Button,\na.spectrum-ActionButton {\n /* Remove appearance for clickable types in iOS and Safari. */\n -webkit-appearance: none;\n /* Make link text not selectable */\n user-select: none;\n cursor: pointer;\n}\n\n.spectrum-ActionButton {\n @inherit: %spectrum-BaseButton;\n position: relative;\n\n block-size: var(--spectrum-actionbutton-height);\n min-inline-size: var(--spectrum-actionbutton-min-width);\n\n /* Use icon padding by default as it's smaller */\n padding: 0;\n\n border-width: var(--spectrum-actionbutton-border-size);\n border-radius: var(--spectrum-actionbutton-border-radius);\n\n font-size: var(--spectrum-actionbutton-text-size);\n font-weight: var(--spectrum-actionbutton-text-font-weight);\n\n /* icon should always have padding at the start */\n .spectrum-Icon {\n padding-inline-start: var(--spectrum-actionbutton-icon-padding-x);\n }\n\n /* label should always have padding at the end */\n .spectrum-ActionButton-label {\n padding-inline-end: var(--spectrum-actionbutton-text-padding-x);\n }\n\n /* icon + text buttons should have padding between the text and icon no matter the order */\n .spectrum-Icon + .spectrum-ActionButton-label {\n padding-inline-start: var(--spectrum-actionbutton-icon-padding-x);\n }\n\n .spectrum-ActionButton-label:not([hidden]) + .spectrum-Icon {\n padding-inline-end: var(--spectrum-actionbutton-icon-padding-x);\n }\n\n /* text only buttons should have padding at the start */\n .spectrum-ActionButton-label:only-child,\n .spectrum-ActionButton-hold + .spectrum-ActionButton-label:last-child {\n padding-inline-start: var(--spectrum-actionbutton-text-padding-x);\n }\n\n /* icon only buttons should have padding at the end */\n .spectrum-Icon:only-child,\n .spectrum-ActionButton-hold + .spectrum-Icon:last-child {\n padding-inline-end: var(--spectrum-actionbutton-icon-padding-x);\n }\n}\n\n.spectrum-ActionButton-hold {\n position: absolute;\n inset-inline-end: var(--spectrum-actionbutton-hold-icon-padding-right);\n inset-block-end: var(--spectrum-actionbutton-hold-icon-padding-bottom);\n}\n\n[dir='rtl'] .spectrum-ActionButton-hold {\n transform: rotate(90deg);\n}\n\n.spectrum-ActionButton-label,\n.spectrum-Button-label {\n align-self: center;\n justify-self: center;\n order: 1; /* always be after the icon, regardless of DOM order */\n\n /* Fixes horizontal alignment of text in anchor buttons */\n text-align: center;\n\n /* @safari10 Workaround for https://bugs.webkit.org/show_bug.cgi?id=169700 */\n inline-size: 100%;\n\n &:empty {\n display: none;\n }\n}\n\n\n.spectrum-ActionButton-label {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.spectrum-ActionButton--quiet {\n border-width: var(--spectrum-actionbutton-quiet-border-size);\n border-radius: var(--spectrum-actionbutton-quiet-border-radius);\n\n font-size: var(--spectrum-actionbutton-quiet-text-size);\n font-weight: var(--spectrum-actionbutton-quiet-text-font-weight);\n}\n\n.spectrum-ActionButton--emphasized,\n.spectrum-ActionButton--staticColor {\n @inherit: %spectrum-ButtonWithFocusRing;\n\n &:after {\n /* Override border-radius set in %spectrum-ButtonWithFocusRing since this is not a pill button */\n border-radius: calc(var(--spectrum-actionbutton-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n\n &:focus-ring {\n &:after {\n /* action buttons only have a 1px border, not 2px */\n margin: calc(calc(var(--spectrum-alias-focus-ring-gap) * -1) - var(--spectrum-actionbutton-quiet-border-size));\n }\n }\n}\n\n.spectrum-LogicButton {\n @inherit: %spectrum-BaseButton;\n @inherit: %spectrum-ButtonWithFocusRing;\n\n block-size: var(--spectrum-logicbutton-and-height);\n padding: var(--spectrum-logicbutton-and-padding-x);\n\n border-width: var(--spectrum-logicbutton-and-border-size);\n border-radius: var(--spectrum-logicbutton-and-border-radius);\n\n font-size: var(--spectrum-logicbutton-and-text-size);\n font-weight: var(--spectrum-logicbutton-and-text-font-weight);\n line-height: 0;\n\n &:after {\n /* Override border-radius set in %spectrum-ButtonWithFocusRing since this is not a pill button */\n border-radius: calc(var(--spectrum-logicbutton-and-border-radius) + var(--spectrum-alias-focus-ring-gap));\n }\n}\n\n.spectrum-FieldButton {\n @inherit: %spectrum-BaseButton;\n\n block-size: var(--spectrum-dropdown-height);\n\n padding: 0 var(--spectrum-dropdown-padding-x);\n\n font-family: inherit;\n font-weight: normal;\n font-size: var(--spectrum-dropdown-text-size);\n line-height: normal;\n -webkit-font-smoothing: initial;\n\n cursor: default;\n outline: none;\n}\n\n.spectrum-FieldButton {\n margin: 0;\n padding-block: 0;\n padding-inline: var(--spectrum-dropdown-padding-x);\n\n border-width: var(--spectrum-dropdown-border-size);\n border-style: solid;\n border-radius: var(--spectrum-border-radius);\n\n transition: background-color var(--spectrum-global-animation-duration-100),\n box-shadow var(--spectrum-global-animation-duration-100),\n border-color var(--spectrum-global-animation-duration-100);\n\n &:disabled,\n &.is-disabled {\n border-width: var(--spectrum-fieldbutton-disabled-border-size);\n cursor: default;\n }\n\n &.is-open {\n border-width: var(--spectrum-dropdown-border-size);\n }\n}\n\n.spectrum-FieldButton--quiet {\n margin: var(--spectrum-fieldbutton-quiet-margin);\n padding: var(--spectrum-fieldbutton-quiet-padding);\n\n border-width: var(--spectrum-fieldbutton-quiet-border-size);\n border-radius: var(--spectrum-fieldbutton-quiet-border-radius);\n &:disabled,\n &.is-disabled {\n &:focus-ring {\n box-shadow: none;\n }\n }\n}\n\n.spectrum-ClearButton {\n @inherit: %spectrum-BaseButton;\n @inherit: %spectrum-ButtonWithFocusRing;\n\n inline-size: var(--spectrum-clearbutton-medium-width);\n block-size: var(--spectrum-clearbutton-medium-height);\n\n border-radius: 100%;\n\n padding: 0;\n margin: 0;\n\n border: none;\n\n > .spectrum-Icon {\n /* @safari10 Workaround for https://bugs.webkit.org/show_bug.cgi?id=169700 */\n margin-block: 0;\n margin-inline: auto;\n }\n}\n\n.spectrum-ClearButton--overBackground {\n &:focus-ring {\n &:after {\n /* Adjust margin because ClearButton does not have a border */\n margin: calc(var(--spectrum-alias-focus-ring-gap) * -1);\n }\n }\n}\n\n@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {\n .spectrum-ClearButton {\n > .spectrum-Icon {\n /* @ie11 Workaround for regression caused by fix for https://bugs.webkit.org/show_bug.cgi?id=169700 */\n margin: 0;\n }\n }\n}\n\n.spectrum-ClearButton--small {\n inline-size: var(--spectrum-clearbutton-small-width);\n block-size: var(--spectrum-clearbutton-small-height);\n}\n","/*\nCopyright 2019 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\n:root {\n /* Overridden because of the way we draw focus rings */\n --spectrum-actionbutton-quiet-border-size-key-focus: 1px;\n}\n\n.spectrum-LogicButton,\n.spectrum-Button,\n.spectrum-ActionButton--emphasized {\n &:focus-ring,\n &.is-focused {\n &:after {\n box-shadow: 0 0 0 var(--spectrum-button-primary-focus-ring-size-key-focus) var(--spectrum-button-primary-focus-ring-color-key-focus);\n }\n }\n}\n\n.spectrum-ClearButton {\n background-color: var(--spectrum-clearbutton-medium-background-color);\n\n color: var(--spectrum-clearbutton-medium-icon-color);\n\n .spectrum-Icon {\n fill: var(--spectrum-clearbutton-medium-icon-color);\n }\n\n &:hover {\n background-color: var(--spectrum-clearbutton-medium-background-color-hover);\n\n color: var(--spectrum-clearbutton-medium-icon-color-hover);\n\n .spectrum-Icon {\n fill: var(--spectrum-clearbutton-medium-icon-color-hover);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-clearbutton-medium-background-color-down);\n\n color: var(--spectrum-clearbutton-medium-icon-color-down);\n\n .spectrum-Icon {\n fill: var(--spectrum-clearbutton-medium-icon-color-down);\n }\n }\n\n &:focus-ring {\n background-color: var(--spectrum-clearbutton-medium-background-color-key-focus);\n\n color: var(--spectrum-clearbutton-medium-icon-color-key-focus);\n\n .spectrum-Icon {\n fill: var(--spectrum-clearbutton-medium-icon-color-key-focus);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-clearbutton-medium-background-color-disabled);\n\n color: var(--spectrum-clearbutton-medium-icon-color-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-clearbutton-medium-icon-color-disabled);\n }\n }\n}\n\n.spectrum-Button--cta {\n background-color: var(--spectrum-button-cta-background-color);\n border-color: var(--spectrum-button-cta-border-color);\n color: var(--spectrum-button-cta-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-cta-background-color-hover);\n border-color: var(--spectrum-button-cta-border-color-hover);\n color: var(--spectrum-button-cta-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-cta-background-color-key-focus);\n border-color: var(--spectrum-button-cta-border-color-key-focus);\n color: var(--spectrum-button-cta-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-cta-background-color-down);\n border-color: var(--spectrum-button-cta-border-color-down);\n color: var(--spectrum-button-cta-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-cta-background-color-disabled);\n border-color: var(--spectrum-button-cta-border-color-disabled);\n color: var(--spectrum-button-cta-text-color-disabled);\n }\n}\n\n.spectrum-Button--primary {\n background-color: var(--spectrum-button-primary-background-color);\n border-color: var(--spectrum-button-primary-border-color);\n color: var(--spectrum-button-primary-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-primary-background-color-hover);\n border-color: var(--spectrum-button-primary-border-color-hover);\n color: var(--spectrum-button-primary-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-primary-background-color-key-focus);\n border-color: var(--spectrum-button-primary-border-color-key-focus);\n color: var(--spectrum-button-primary-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-primary-background-color-down);\n border-color: var(--spectrum-button-primary-border-color-down);\n color: var(--spectrum-button-primary-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-primary-background-color-disabled);\n border-color: var(--spectrum-button-primary-border-color-disabled);\n color: var(--spectrum-button-primary-text-color-disabled);\n }\n}\n\n.spectrum-Button--secondary {\n background-color: var(--spectrum-button-secondary-background-color);\n border-color: var(--spectrum-button-secondary-border-color);\n color: var(--spectrum-button-secondary-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-secondary-background-color-hover);\n border-color: var(--spectrum-button-secondary-border-color-hover);\n color: var(--spectrum-button-secondary-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-secondary-background-color-key-focus);\n border-color: var(--spectrum-button-secondary-border-color-key-focus);\n color: var(--spectrum-button-secondary-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-secondary-background-color-down);\n border-color: var(--spectrum-button-secondary-border-color-down);\n color: var(--spectrum-button-secondary-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-secondary-background-color-disabled);\n border-color: var(--spectrum-button-secondary-border-color-disabled);\n color: var(--spectrum-button-secondary-text-color-disabled);\n }\n}\n\n.spectrum-Button--warning {\n background-color: var(--spectrum-button-warning-background-color);\n border-color: var(--spectrum-button-warning-border-color);\n color: var(--spectrum-button-warning-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-warning-background-color-hover);\n border-color: var(--spectrum-button-warning-border-color-hover);\n color: var(--spectrum-button-warning-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-warning-background-color-key-focus);\n border-color: var(--spectrum-button-warning-border-color-key-focus);\n color: var(--spectrum-button-warning-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-warning-background-color-down);\n border-color: var(--spectrum-button-warning-border-color-down);\n color: var(--spectrum-button-warning-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-warning-background-color-disabled);\n border-color: var(--spectrum-button-warning-border-color-disabled);\n color: var(--spectrum-button-warning-text-color-disabled);\n }\n}\n\n.spectrum-Button--overBackground {\n background-color: var(--spectrum-button-over-background-background-color);\n border-color: var(--spectrum-button-over-background-border-color);\n color: var(--spectrum-button-over-background-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-over-background-background-color-hover);\n border-color: var(--spectrum-button-over-background-border-color-hover);\n color: inherit;\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-over-background-background-color-hover);\n border-color: var(--spectrum-button-over-background-border-color-hover);\n color: inherit;\n\n &:after {\n box-shadow: 0 0 0 var(--spectrum-alias-focus-ring-size) var(--spectrum-button-over-background-border-color-key-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-button-over-background-background-color-down);\n border-color: var(--spectrum-button-over-background-border-color-down);\n color: inherit;\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-over-background-background-color-disabled);\n border-color: var(--spectrum-button-over-background-border-color-disabled);\n color: var(--spectrum-button-over-background-text-color-disabled);\n }\n}\n\n.spectrum-Button--overBackground.spectrum-Button--quiet,\n.spectrum-ClearButton--overBackground {\n background-color: var(--spectrum-button-quiet-over-background-background-color);\n border-color: var(--spectrum-button-quiet-over-background-border-color);\n color: var(--spectrum-button-quiet-over-background-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-quiet-over-background-background-color-hover);\n border-color: var(--spectrum-button-quiet-over-background-border-color-hover);\n color: var(--spectrum-button-quiet-over-background-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-quiet-over-background-background-color-hover);\n border-color: var(--spectrum-button-quiet-over-background-border-color-hover);\n color: var(--spectrum-button-quiet-over-background-text-color-hover);\n box-shadow: none;\n\n &:after {\n box-shadow: 0 0 0 var(--spectrum-alias-focus-ring-size) var(--spectrum-button-over-background-border-color-key-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-button-quiet-over-background-background-color-down);\n border-color: var(--spectrum-button-quiet-over-background-border-color-down);\n color: var(--spectrum-button-quiet-over-background-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-quiet-over-background-background-color-disabled);\n border-color: var(--spectrum-button-quiet-over-background-border-color-disabled);\n color: var(--spectrum-button-quiet-over-background-text-color-disabled);\n }\n}\n\n.spectrum-Button--primary.spectrum-Button--quiet {\n background-color: var(--spectrum-button-quiet-primary-background-color);\n border-color: var(--spectrum-button-quiet-primary-border-color);\n color: var(--spectrum-button-quiet-primary-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-quiet-primary-background-color-hover);\n border-color: var(--spectrum-button-quiet-primary-border-color-hover);\n color: var(--spectrum-button-quiet-primary-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-quiet-primary-background-color-key-focus);\n border-color: var(--spectrum-button-quiet-primary-border-color-key-focus);\n color: var(--spectrum-button-quiet-primary-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-quiet-primary-background-color-down);\n border-color: var(--spectrum-button-quiet-primary-border-color-down);\n color: var(--spectrum-button-quiet-primary-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-quiet-primary-background-color-disabled);\n border-color: var(--spectrum-button-quiet-primary-border-color-disabled);\n color: var(--spectrum-button-quiet-primary-text-color-disabled);\n }\n}\n\n.spectrum-Button--secondary.spectrum-Button--quiet {\n background-color: var(--spectrum-button-quiet-secondary-background-color);\n border-color: var(--spectrum-button-quiet-secondary-border-color);\n color: var(--spectrum-button-quiet-secondary-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-quiet-secondary-background-color-hover);\n border-color: var(--spectrum-button-quiet-secondary-border-color-hover);\n color: var(--spectrum-button-quiet-secondary-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-quiet-secondary-background-color-key-focus);\n border-color: var(--spectrum-button-quiet-secondary-border-color-key-focus);\n color: var(--spectrum-button-quiet-secondary-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-quiet-secondary-background-color-down);\n border-color: var(--spectrum-button-quiet-secondary-border-color-down);\n color: var(--spectrum-button-quiet-secondary-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-quiet-secondary-background-color-disabled);\n border-color: var(--spectrum-button-quiet-secondary-border-color-disabled);\n color: var(--spectrum-button-quiet-secondary-text-color-disabled);\n }\n}\n\n.spectrum-ActionButton {\n background-color: var(--spectrum-actionbutton-background-color);\n border-color: var(--spectrum-actionbutton-border-color);\n color: var(--spectrum-actionbutton-text-color);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-hold-icon-color);\n }\n\n &:hover {\n background-color: var(--spectrum-actionbutton-background-color-hover);\n border-color: var(--spectrum-actionbutton-border-color-hover);\n color: var(--spectrum-actionbutton-text-color-hover);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-hover);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-hold-icon-color-hover);\n }\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-background-color-key-focus);\n border-color: var(--spectrum-actionbutton-border-color-key-focus);\n box-shadow: 0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus) var(--spectrum-actionbutton-border-color-key-focus);\n color: var(--spectrum-actionbutton-text-color-key-focus);\n\n &.is-active {\n border-color: var(--spectrum-actionbutton-border-color-key-focus);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-key-focus);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-hold-icon-color-key-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-background-color-down);\n border-color: var(--spectrum-actionbutton-border-color-down);\n color: var(--spectrum-actionbutton-text-color-down);\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-hold-icon-color-down);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-background-color-disabled);\n border-color: var(--spectrum-actionbutton-border-color-disabled);\n color: var(--spectrum-actionbutton-text-color-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-disabled);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-hold-icon-color-disabled);\n }\n }\n\n &.is-selected {\n background-color: var(--spectrum-actionbutton-background-color-selected);\n border-color: var(--spectrum-actionbutton-border-color-selected);\n color: var(--spectrum-actionbutton-text-color-selected);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-selected);\n }\n\n &:hover {\n background-color: var(--spectrum-actionbutton-background-color-selected-hover);\n border-color: var(--spectrum-actionbutton-border-color-selected-hover);\n color: var(--spectrum-actionbutton-text-color-selected-hover);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-selected-hover);\n }\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-background-color-selected-key-focus);\n border-color: var(--spectrum-actionbutton-border-color-selected-key-focus);\n color: var(--spectrum-actionbutton-text-color-selected-key-focus);\n\n &.is-active {\n border-color: var(--spectrum-actionbutton-border-color-key-focus);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-selected-key-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-background-color-selected-down);\n border-color: var(--spectrum-actionbutton-border-color-selected-down);\n color: var(--spectrum-actionbutton-text-color-selected-down);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-selected-down);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-background-color-selected-disabled);\n border-color: var(--spectrum-actionbutton-border-color-selected-disabled);\n color: var(--spectrum-actionbutton-text-color-selected-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-icon-color-selected-disabled);\n }\n }\n }\n}\n\n.spectrum-ActionButton--emphasized {\n background-color: var(--spectrum-actionbutton-emphasized-background-color);\n border-color: var(--spectrum-actionbutton-emphasized-border-color);\n color: var(--spectrum-actionbutton-emphasized-text-color);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color);\n }\n\n &.is-selected {\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color-selected);\n }\n\n &:hover {\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-text-color-selected-hover);\n }\n }\n }\n\n &:hover {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-hover);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-hover);\n box-shadow: none;\n color: var(--spectrum-actionbutton-emphasized-text-color-hover);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-hover);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color-hover);\n }\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-key-focus);\n border-color: var(--spectrum-actionbutton-emphasized-border-color);\n box-shadow: none;\n color: var(--spectrum-actionbutton-emphasized-text-color-key-focus);\n\n &.is-active {\n border-color: var(--spectrum-actionbutton-emphasized-border-color-down);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-key-focus);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color-key-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-down);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-down);\n color: var(--spectrum-actionbutton-emphasized-text-color-down);\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color-down);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-disabled);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-disabled);\n color: var(--spectrum-actionbutton-emphasized-text-color-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-disabled);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-emphasized-hold-icon-color-disabled);\n }\n }\n\n &.spectrum-ActionButton--quiet {\n &:focus-ring {\n border-color: var(--spectrum-actionbutton-quiet-border-color);\n box-shadow: none;\n }\n }\n\n &.spectrum-ActionButton--quiet.is-selected,\n &.is-selected {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-selected);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected);\n color: var(--spectrum-actionbutton-emphasized-text-color-selected);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-selected);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-selected-key-focus);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected);\n box-shadow: none;\n color: var(--spectrum-actionbutton-emphasized-text-color-selected-key-focus);\n\n &.is-active {\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected-down);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-selected-key-focus);\n }\n }\n\n &:hover {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-selected-hover);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected-hover);\n color: var(--spectrum-actionbutton-emphasized-text-color-selected-hover);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-selected-hover);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-selected-down);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected-down);\n color: var(--spectrum-actionbutton-emphasized-text-color-selected-down);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-selected-down);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-emphasized-background-color-selected-disabled);\n border-color: var(--spectrum-actionbutton-emphasized-border-color-selected-disabled);\n color: var(--spectrum-actionbutton-emphasized-text-color-selected-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-emphasized-icon-color-selected-disabled);\n }\n }\n }\n}\n\n.spectrum-ActionButton--quiet {\n background-color: var(--spectrum-actionbutton-quiet-background-color);\n border-color: var(--spectrum-actionbutton-quiet-border-color);\n color: var(--spectrum-actionbutton-quiet-text-color);\n\n &:hover {\n background-color: var(--spectrum-actionbutton-quiet-background-color-hover);\n border-color: var(--spectrum-actionbutton-quiet-border-color-hover);\n color: var(--spectrum-actionbutton-quiet-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-quiet-background-color-key-focus);\n box-shadow: 0 0 0 var(--spectrum-actionbutton-quiet-border-size-key-focus) var(--spectrum-actionbutton-quiet-border-color-key-focus);\n border-color: var(--spectrum-actionbutton-quiet-border-color-key-focus);\n color: var(--spectrum-actionbutton-quiet-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-quiet-background-color-down);\n border-color: var(--spectrum-actionbutton-quiet-border-color-down);\n color: var(--spectrum-actionbutton-quiet-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-quiet-background-color-disabled);\n border-color: var(--spectrum-actionbutton-quiet-border-color-disabled);\n color: var(--spectrum-actionbutton-quiet-text-color-disabled);\n }\n\n &.is-selected {\n background-color: var(--spectrum-actionbutton-quiet-background-color-selected);\n border-color: var(--spectrum-actionbutton-quiet-border-color-selected);\n color: var(--spectrum-actionbutton-quiet-text-color-selected);\n\n &:hover {\n background-color: var(--spectrum-actionbutton-quiet-background-color-selected-hover);\n border-color: var(--spectrum-actionbutton-quiet-border-color-selected-hover);\n color: var(--spectrum-actionbutton-quiet-text-color-selected-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-quiet-background-color-selected-key-focus);\n border-color: var(--spectrum-actionbutton-quiet-border-color-selected-key-focus);\n color: var(--spectrum-actionbutton-quiet-text-color-selected-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-quiet-background-color-selected-down);\n border-color: var(--spectrum-actionbutton-quiet-border-color-selected-down);\n color: var(--spectrum-actionbutton-quiet-text-color-selected-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-actionbutton-quiet-background-color-selected-disabled);\n border-color: var(--spectrum-actionbutton-quiet-border-color-selected-disabled);\n color: var(--spectrum-actionbutton-quiet-text-color-selected-disabled);\n }\n }\n}\n\n.spectrum-ActionButton--staticWhite {\n mix-blend-mode: screen;\n --spectrum-actionbutton-static-background-color-hover: rgba(255, 255, 255, 0.1);\n --spectrum-actionbutton-static-background-color-focus: rgba(255, 255, 255, 0.1);\n --spectrum-actionbutton-static-background-color-active: rgba(255, 255, 255, 0.2);\n --spectrum-actionbutton-static-border-color: rgba(255, 255, 255, 0.3);\n --spectrum-actionbutton-static-border-color-hover: white;\n --spectrum-actionbutton-static-border-color-active: white;\n --spectrum-actionbutton-static-border-color-focus: white;\n --spectrum-actionbutton-static-border-disabled: rgba(255, 255, 255, 0.15);\n --spectrum-actionbutton-static-color: white;\n --spectrum-actionbutton-static-color-selected: black; /* becomes the background of the parent element due to mix-blend-mode */\n --spectrum-actionbutton-static-color-disabled: rgba(255, 255, 255, 0.15);\n}\n\n.spectrum-ActionButton--staticWhite.spectrum-ActionButton--quiet {\n --spectrum-actionbutton-static-border-color: transparent;\n --spectrum-actionbutton-static-border-color-hover: transparent;\n --spectrum-actionbutton-static-border-color-active: transparent;\n}\n\n.spectrum-ActionButton--staticBlack {\n mix-blend-mode: multiply;\n --spectrum-actionbutton-static-background-color-hover: rgba(0, 0, 0, 0.1);\n --spectrum-actionbutton-static-background-color-focus: rgba(0, 0, 0, 0.1);\n --spectrum-actionbutton-static-background-color-active: rgba(0, 0, 0, 0.2);\n --spectrum-actionbutton-static-border-color: rgba(0, 0, 0, 0.3);\n --spectrum-actionbutton-static-border-color-hover: black;\n --spectrum-actionbutton-static-border-color-active: black;\n --spectrum-actionbutton-static-border-color-focus: black;\n --spectrum-actionbutton-static-border-disabled: rgba(0, 0, 0, 0.15);\n --spectrum-actionbutton-static-color: black;\n --spectrum-actionbutton-static-color-selected: white; /* becomes the background of the parent element due to mix-blend-mode */\n --spectrum-actionbutton-static-color-disabled: rgba(0, 0, 0, 0.15);\n}\n\n.spectrum-ActionButton--staticBlack.spectrum-ActionButton--quiet {\n --spectrum-actionbutton-static-border-color: transparent;\n --spectrum-actionbutton-static-border-color-hover: transparent;\n --spectrum-actionbutton-static-border-color-active: transparent;\n}\n\n.spectrum-ActionButton--staticColor {\n background-color: transparent;\n border-color: var(--spectrum-actionbutton-static-border-color);\n color: var(--spectrum-actionbutton-static-color);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color);\n }\n\n &:hover {\n background-color: var(--spectrum-actionbutton-static-background-color-hover);\n border-color: var(--spectrum-actionbutton-static-border-color-hover);\n color: var(--spectrum-actionbutton-static-color);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-static-color);\n }\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-static-background-color-focus);\n border-color: var(--spectrum-actionbutton-static-border-color-focus);\n box-shadow: none;\n color: var(--spectrum-actionbutton-static-color);\n\n &:hover {\n border-color: var(--spectrum-actionbutton-static-border-color-focus);\n }\n\n &.is-active {\n border-color: var(--spectrum-actionbutton-static-color-focus);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-static-color);\n }\n\n &:after {\n box-shadow: 0 0 0 var(--spectrum-button-primary-focus-ring-size-key-focus) var(--spectrum-actionbutton-static-border-color-focus);\n }\n }\n\n &.is-active {\n background-color: var(--spectrum-actionbutton-static-background-color-active);\n border-color: var(--spectrum-actionbutton-static-border-color-active);\n color: var(--spectrum-actionbutton-static-color);\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-static-color);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: transparent;\n border-color: var(--spectrum-actionbutton-static-border-disabled);\n color: var(--spectrum-actionbutton-static-color-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color-disabled);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-static-color-disabled);\n }\n }\n\n &.spectrum-ActionButton--quiet.is-selected,\n &.is-selected {\n background-color: var(--spectrum-actionbutton-static-color);\n border-color: var(--spectrum-actionbutton-static-color);\n color: var(--spectrum-actionbutton-static-color-selected);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color-selected);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-actionbutton-static-color);\n border-color: var(--spectrum-actionbutton-static-color);\n color: var(--spectrum-actionbutton-static-color-selected);\n box-shadow: none;\n\n &.is-active {\n /* change 1px of focus ring blue to match the rest of the active state */\n box-shadow: none;\n border-color: var(--spectrum-actionbutton-static-color);\n }\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color-selected);\n }\n }\n\n &:hover,\n &.is-active {\n background-color: var(--spectrum-actionbutton-static-color);\n border-color: var(--spectrum-actionbutton-static-color);\n color: var(--spectrum-actionbutton-static-color-selected);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color-selected);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: transparent;\n border-color: var(--spectrum-actionbutton-static-border-disabled);\n color: var(--spectrum-actionbutton-static-color-disabled);\n\n .spectrum-Icon {\n fill: var(--spectrum-actionbutton-static-color-disabled);\n }\n\n .spectrum-ActionButton-hold {\n fill: var(--spectrum-actionbutton-static-color-disabled);\n }\n }\n }\n}\n\n.spectrum-Button--warning.spectrum-Button--quiet {\n background-color: var(--spectrum-button-quiet-warning-background-color);\n border-color: var(--spectrum-button-quiet-warning-border-color);\n color: var(--spectrum-button-quiet-warning-text-color);\n\n &:hover {\n background-color: var(--spectrum-button-quiet-warning-background-color-hover);\n border-color: var(--spectrum-button-quiet-warning-border-color-hover);\n color: var(--spectrum-button-quiet-warning-text-color-hover);\n }\n\n &:focus-ring {\n background-color: var(--spectrum-button-quiet-warning-background-color-key-focus);\n border-color: var(--spectrum-button-quiet-warning-border-color-key-focus);\n color: var(--spectrum-button-quiet-warning-text-color-key-focus);\n }\n\n &.is-active {\n background-color: var(--spectrum-button-quiet-warning-background-color-down);\n border-color: var(--spectrum-button-quiet-warning-border-color-down);\n color: var(--spectrum-button-quiet-warning-text-color-down);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-quiet-warning-background-color-disabled);\n border-color: var(--spectrum-button-quiet-warning-border-color-disabled);\n color: var(--spectrum-button-quiet-warning-text-color-disabled);\n }\n}\n\n.spectrum-LogicButton--and {\n background-color: var(--spectrum-logicbutton-and-background-color);\n border-color: var(--spectrum-logicbutton-and-border-color);\n color: var(--spectrum-logicbutton-and-text-color);\n\n &:hover {\n background-color: var(--spectrum-logicbutton-and-background-color-hover);\n border-color: var(--spectrum-logicbutton-and-border-color-hover);\n color: var(--spectrum-logicbutton-and-text-color);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-logicbutton-and-background-color-disabled);\n border-color: var(--spectrum-logicbutton-and-border-color-disabled);\n color: var(--spectrum-logicbutton-and-text-color-disabled);\n }\n}\n\n.spectrum-LogicButton--or {\n background-color: var(--spectrum-logicbutton-or-background-color);\n border-color: var(--spectrum-logicbutton-or-border-color);\n color: var(--spectrum-logicbutton-or-text-color);\n\n &:hover {\n background-color: var(--spectrum-logicbutton-or-background-color-hover);\n border-color: var(--spectrum-logicbutton-or-border-color-hover);\n color: var(--spectrum-logicbutton-or-text-color);\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-button-secondary-background-color-disabled);\n border-color: var(--spectrum-button-secondary-border-color-disabled);\n color: var(--spectrum-logicbutton-and-text-color-disabled);\n }\n}\n\n.spectrum-FieldButton {\n color: var(--spectrum-fieldbutton-text-color);\n background-color: var(--spectrum-fieldbutton-background-color);\n border-color: var(--spectrum-fieldbutton-border-color);\n\n &:hover {\n color: var(--spectrum-fieldbutton-text-color-hover);\n background-color: var(--spectrum-fieldbutton-background-color-hover);\n border-color: var(--spectrum-fieldbutton-border-color-hover);\n }\n\n &.is-active,\n &.is-selected {\n background-color: var(--spectrum-fieldbutton-background-color-down);\n border-color: var(--spectrum-fieldbutton-border-color-down);\n }\n\n &:focus-ring,\n &.is-focused {\n background-color: var(--spectrum-fieldbutton-background-color-key-focus);\n border-color: var(--spectrum-fieldbutton-border-color-key-focus);\n box-shadow: 0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus) var(--spectrum-fieldbutton-border-color-key-focus);\n color: var(--spectrum-fieldbutton-text-color-key-focus);\n\n &.is-placeholder {\n color: var(--spectrum-fieldbutton-placeholder-text-color-key-focus);\n }\n }\n\n &.spectrum-FieldButton--invalid {\n border-color: var(--spectrum-fieldbutton-border-color-error);\n\n &:hover {\n border-color: var(--spectrum-fieldbutton-border-color-error-hover);\n }\n\n &.is-active,\n &.is-selected {\n border-color: var(--spectrum-fieldbutton-border-color-error-down);\n }\n\n &:focus-ring,\n &.is-focused {\n border-color: var(--spectrum-fieldbutton-border-color-error-key-focus);\n box-shadow: 0 0 0 var(--spectrum-button-primary-border-size-increase-key-focus) var(--spectrum-fieldbutton-border-color-error-key-focus);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-fieldbutton-background-color-disabled);\n color: var(--spectrum-fieldbutton-text-color-disabled);\n\n & .spectrum-Icon {\n fill: var(--spectrum-fieldbutton-icon-color-disabled);\n }\n }\n}\n\n.spectrum-FieldButton--quiet {\n color: var(--spectrum-fieldbutton-text-color);\n border-color: var(--spectrum-fieldbutton-quiet-border-color);\n background-color: var(--spectrum-fieldbutton-quiet-background-color);\n\n &:hover {\n background-color: var(--spectrum-fieldbutton-quiet-background-color-hover);\n color: var(--spectrum-fieldbutton-text-color-hover);\n }\n\n &:focus-ring,\n &.is-focused {\n background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus);\n box-shadow: 0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus);\n\n &.is-placeholder {\n color: var(--spectrum-fieldbutton-quiet-placeholder-text-color-key-focus);\n }\n }\n\n &.is-active,\n &.is-selected {\n background-color: var(--spectrum-fieldbutton-quiet-background-color-down);\n border-color: var(--spectrum-fieldbutton-quiet-border-color-down);\n\n &:focus-ring,\n &.is-focused {\n background-color: var(--spectrum-fieldbutton-quiet-background-color-key-focus);\n box-shadow: 0 2px 0 0 var(--spectrum-fieldbutton-border-color-key-focus);\n }\n }\n\n &.spectrum-FieldButton--invalid {\n &:focus-ring,\n &.is-focused {\n box-shadow: 0 2px 0 0 var(--spectrum-fieldbutton-border-color-error-key-focus);\n }\n }\n\n &:disabled,\n &.is-disabled {\n background-color: var(--spectrum-fieldbutton-quiet-background-color-disabled);\n color: var(--spectrum-fieldbutton-text-color-disabled);\n }\n}\n"],"names":[],"version":3,"file":"main.css.map"}
|