@react-spectrum/s2
Version:
Spectrum 2 UI components in React
153 lines (138 loc) • 6.07 kB
JavaScript
require("./CloseButton.css");
var $89dd175101ffc43a$exports = require("./Cross.cjs");
var $4526404114e78c80$exports = require("./intlStrings.cjs");
var $2061c83559b50a66$exports = require("./pressScale.cjs");
var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
var $bMS5K$reactjsxruntime = require("react/jsx-runtime");
var $bMS5K$reactariacomponents = require("react-aria-components");
var $bMS5K$react = require("react");
var $bMS5K$reactspectrumutils = require("@react-spectrum/utils");
var $bMS5K$reactariai18n = require("@react-aria/i18n");
function $parcel$interopDefault(a) {
return a && a.__esModule ? a.default : a;
}
function $parcel$export(e, n, v, s) {
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
}
$parcel$export(module.exports, "CloseButton", () => $2f907cb84c6e9e75$export$de65de8213222d10);
/*
* Copyright 2024 Adobe. All rights reserved.
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License. You may obtain a copy
* of the License at http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
* OF ANY KIND, either express or implied. See the License for the specific language
* governing permissions and limitations under the License.
*/
const $2f907cb84c6e9e75$var$hoverBackground = {
default: 'gray-200',
isStaticColor: 'transparent-overlay-200'
};
const $2f907cb84c6e9e75$var$styles = function anonymous(props, overrides) {
let rules = " ";
let width = false;
let flexShrink = false;
let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|Z|N|L)[^\s]+/g);
for (let p of matches){
if (p[1] === "Z") width = true;
if (p[1] === "_v") flexShrink = true;
rules += p[0];
}
if (props.isFocusVisible) rules += ' _Lf91';
else rules += ' _Le91';
if (props.isStaticColor) rules += ' Oe91';
else rules += ' Oh91';
rules += ' Olc91';
rules += ' _Mc91';
rules += ' _Kd91';
if (props.staticColor === "white") rules += ' -Ovbhqd-gcwrnr91';
else if (props.staticColor === "black") rules += ' -Ovbhqd-g4hn3s91';
rules += ' sd91';
rules += ' eb91';
rules += ' _Ca91';
if (props.size === "XL") {
if (!width) rules += ' ZF91';
} else if (props.size === "L") {
if (!width) rules += ' Zw91';
} else if (props.size === "S") {
if (!width) rules += ' Zo91';
} else if (props.size === "XS") {
if (!width) rules += ' Zm91';
} else if (!width) rules += ' ZC91';
if (props.size === "XL") rules += ' Fz91';
else if (props.size === "L") rules += ' Fv91';
else if (props.size === "S") rules += ' Fp91';
else if (props.size === "XS") rules += ' Fn91';
else rules += ' Fx91';
if (!flexShrink) rules += ' _va91';
rules += ' og91';
rules += ' ng91';
rules += ' kg91';
rules += ' jg91';
rules += ' Td91';
rules += ' Qd91';
rules += ' Sd91';
rules += ' Rd91';
rules += ' _je91';
rules += ' Yd91';
rules += ' Xb91';
rules += ' _2b91';
if (props.isPressed) {
if (props.isStaticColor) rules += ' gg91';
else rules += ' gF91';
} else if (props.isFocusVisible) {
if (props.isStaticColor) rules += ' gg91';
else rules += ' gF91';
} else if (props.isHovered) {
if (props.isStaticColor) rules += ' gg91';
else rules += ' gF91';
} else rules += ' g991';
if (props.isStaticColor) {
if (props.isDisabled) rules += ' -_8sjo0b-pi91';
else {
if (props.isPressed) rules += ' -_8sjo0b-pk91';
else if (props.isFocusVisible) rules += ' -_8sjo0b-pk91';
else if (props.isHovered) rules += ' -_8sjo0b-pk91';
else rules += ' -_8sjo0b-pj91';
}
} else if (props.isDisabled) rules += ' -_8sjo0b-pp91';
else {
if (props.isPressed) rules += ' -_8sjo0b-po91';
else if (props.isFocusVisible) rules += ' -_8sjo0b-po91';
else if (props.isHovered) rules += ' -_8sjo0b-po91';
else rules += ' -_8sjo0b-pt91';
}
if (props.isDisabled) rules += ' -_8sjo0b-lpc91';
else rules += ' -_8sjo0b-lpb91';
return rules;
};
const $2f907cb84c6e9e75$export$c796eec99a15b55d = /*#__PURE__*/ (0, $bMS5K$react.createContext)(null);
const $2f907cb84c6e9e75$export$de65de8213222d10 = /*#__PURE__*/ (0, $bMS5K$react.forwardRef)(function CloseButton(props, ref) {
[props, ref] = (0, $ac757a4c2bd72aee$exports.useSpectrumContextProps)(props, ref, $2f907cb84c6e9e75$export$c796eec99a15b55d);
let { UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className = '' } = props;
let domRef = (0, $bMS5K$reactspectrumutils.useFocusableRef)(ref);
let stringFormatter = (0, $bMS5K$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
return /*#__PURE__*/ (0, $bMS5K$reactjsxruntime.jsx)((0, $bMS5K$reactariacomponents.Button), {
...props,
ref: domRef,
slot: "close",
"aria-label": props['aria-label'] || stringFormatter.format('dialog.dismiss'),
style: (0, $2061c83559b50a66$exports.pressScale)(domRef, UNSAFE_style),
className: (renderProps)=>UNSAFE_className + $2f907cb84c6e9e75$var$styles({
...renderProps,
staticColor: props.staticColor,
isStaticColor: !!props.staticColor
}, props.styles),
children: /*#__PURE__*/ (0, $bMS5K$reactjsxruntime.jsx)((0, $89dd175101ffc43a$exports.default), {
size: {
S: 'L',
M: 'XL',
L: 'XXL',
XL: 'XXXL'
}[props.size || 'M']
})
});
});
//# sourceMappingURL=CloseButton.cjs.map