@react-spectrum/s2
Version:
Spectrum 2 UI components in React
156 lines (148 loc) • 6.35 kB
JavaScript
import "./Icon.css";
import {mergeStyles as $feb886035e0d4633$export$e618dc39ac9ad607} from "./runtime.mjs";
import {SkeletonWrapper as $5ad421ec19460c48$export$6069cbe61f690103, useSkeletonIcon as $5ad421ec19460c48$export$4b7803c08fe9a32b} from "./Skeleton.mjs";
import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "./useSpectrumContextProps.mjs";
import {jsx as $3pu9S$jsx} from "react/jsx-runtime";
import {createContext as $3pu9S$createContext, useRef as $3pu9S$useRef} from "react";
/*
* 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.
*/
// Custom list of overrides, excluding width/height/flexGrow/flexShrink/flexBasis
const $ac8c32e6775ddd1f$var$allowedOverrides = [
'margin',
'marginStart',
'marginEnd',
'marginTop',
'marginBottom',
'marginX',
'marginY',
'justifySelf',
'alignSelf',
'order',
'gridArea',
'gridRowStart',
'gridRowEnd',
'gridColumnStart',
'gridColumnEnd',
'position',
'zIndex',
'top',
'bottom',
'inset',
'insetX',
'insetY',
'insetStart',
'insetEnd',
'rotate',
'--iconPrimary',
'size'
];
const $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed = /*#__PURE__*/ (0, $3pu9S$createContext)({});
const $ac8c32e6775ddd1f$export$207c7561471de4bd = /*#__PURE__*/ (0, $3pu9S$createContext)({});
const $ac8c32e6775ddd1f$var$iconStyles = function anonymous(props, overrides) {
let rules = " ";
let width = false;
let height = false;
let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_S|-_8sjo0b-|Z|F)[^\s]+/g);
for (let p of matches){
if (p[1] === "Z") width = true;
if (p[1] === "F") height = true;
rules += p[0];
}
if (!width) rules += ' Zm91';
if (!height) rules += ' Fn91';
rules += ' _va91';
return rules;
};
function $ac8c32e6775ddd1f$export$274edc73af1ae9c8(Component, context = $ac8c32e6775ddd1f$export$a49f528ae1a4d0ed) {
return (props)=>{
let ref = (0, $3pu9S$useRef)(null);
let ctx;
// TODO: remove this default once we release RAC and use DEFAULT_SLOT.
[ctx, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)({
slot: props.slot || 'icon'
}, ref, context);
let { render: render, styles: ctxStyles } = ctx;
let { UNSAFE_className: UNSAFE_className, UNSAFE_style: UNSAFE_style, slot: slot, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, styles: styles, ...otherProps } = props;
if (!ariaHidden) ariaHidden = undefined;
let svg = /*#__PURE__*/ (0, $3pu9S$jsx)((0, $5ad421ec19460c48$export$6069cbe61f690103), {
children: /*#__PURE__*/ (0, $3pu9S$jsx)(Component, {
...otherProps,
focusable: false,
"aria-label": ariaLabel,
"aria-hidden": ariaLabel ? ariaHidden || undefined : true,
role: "img",
"data-slot": slot,
className: (UNSAFE_className ?? '') + ' ' + (0, $5ad421ec19460c48$export$4b7803c08fe9a32b)((0, $feb886035e0d4633$export$e618dc39ac9ad607)($ac8c32e6775ddd1f$var$iconStyles(null, styles), ctxStyles)),
style: UNSAFE_style
})
});
if (render) return render(svg);
return svg;
};
}
const $ac8c32e6775ddd1f$var$illustrationStyles = function anonymous(props, overrides) {
let rules = " ";
let width = false;
let height = false;
let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_S|-_8sjo0b-|Z|F)[^\s]+/g);
for (let p of matches){
if (p[1] === "Z") width = true;
if (p[1] === "F") height = true;
rules += p[0];
}
if (props.size === "L") {
if (!width) rules += ' Zq91';
} else if (props.size === "M") {
if (!width) rules += ' ZH91';
} else if (props.size === "S") {
if (!width) rules += ' ZF91';
}
if (props.size === "L") {
if (!height) rules += ' Fr91';
} else if (props.size === "M") {
if (!height) rules += ' FB91';
} else if (props.size === "S") {
if (!height) rules += ' Fz91';
}
rules += ' _va91';
return rules;
};
function $ac8c32e6775ddd1f$export$4d00e7be716a0093(Component) {
return (props)=>{
let ref = (0, $3pu9S$useRef)(null);
let ctx;
[ctx, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)({
slot: props.slot || 'icon'
}, ref, $ac8c32e6775ddd1f$export$207c7561471de4bd);
let { render: render, styles: ctxStyles } = ctx;
let { UNSAFE_className: UNSAFE_className, UNSAFE_style: UNSAFE_style, slot: slot, 'aria-label': ariaLabel, 'aria-hidden': ariaHidden, size: size = ctx.size || 'M', styles: styles, ...otherProps } = props;
if (!ariaHidden) ariaHidden = undefined;
let svg = /*#__PURE__*/ (0, $3pu9S$jsx)(Component, {
...otherProps,
// @ts-ignore
size: size,
focusable: false,
"aria-label": ariaLabel,
"aria-hidden": ariaLabel ? ariaHidden || undefined : true,
role: "img",
"data-slot": slot,
className: (UNSAFE_className ?? '') + ' ' + $ac8c32e6775ddd1f$var$illustrationStyles({
size: size
}, styles) + (ctxStyles || ''),
style: UNSAFE_style
});
if (render) return render(svg);
return svg;
};
}
export {$ac8c32e6775ddd1f$export$a49f528ae1a4d0ed as IconContext, $ac8c32e6775ddd1f$export$207c7561471de4bd as IllustrationContext, $ac8c32e6775ddd1f$export$274edc73af1ae9c8 as createIcon, $ac8c32e6775ddd1f$export$4d00e7be716a0093 as createIllustration};
//# sourceMappingURL=Icon.mjs.map