@react-spectrum/s2
Version:
Spectrum 2 UI components in React
770 lines (749 loc) • 31.8 kB
JavaScript
import "./Card.css";
import {ActionMenuContext as $8bf3cd2442eb485e$export$7f4b66acaca28bd5} from "./ActionMenu.mjs";
import {AvatarContext as $3ffa2cd930156220$export$a20dad690e1279e2} from "./Avatar.mjs";
import {ButtonContext as $067ea9f64ccd4e8e$export$24d547caef80ccd1, LinkButtonContext as $067ea9f64ccd4e8e$export$1c1a176f3b9e48d3} from "./Button.mjs";
import {Checkbox as $9b405e0f8095dce0$export$48513f6b9f8ce62d} from "./Checkbox.mjs";
import {ContentContext as $8e847109a6ab556d$export$1cbdd774077931b4, FooterContext as $8e847109a6ab556d$export$5630640b68817ed6, TextContext as $8e847109a6ab556d$export$9afb8bc826b033ea} from "./Content.mjs";
import {DividerContext as $bdf52657dac0f070$export$30fbfd376abdf190} from "./Divider.mjs";
import {IllustrationContext as $ac8c32e6775ddd1f$export$207c7561471de4bd} from "../icons/Icon.mjs";
import {ImageContext as $dbd6f0b2503b938c$export$8151eb379fcf2442} from "./Image.mjs";
import {ImageCoordinator as $4b5e069e9e001e8b$export$1b926c015f09611d} from "./ImageCoordinator.mjs";
import {mergeStyles as $feb886035e0d4633$export$e618dc39ac9ad607} from "../icons/runtime.mjs";
import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
import {SkeletonContext as $5ad421ec19460c48$export$74e166679b1f49ee, SkeletonWrapper as $5ad421ec19460c48$export$6069cbe61f690103, useIsSkeleton as $5ad421ec19460c48$export$4f8dc7555740235c} from "../icons/Skeleton.mjs";
import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
import {jsx as $jzFZE$jsx, jsxs as $jzFZE$jsxs} from "react/jsx-runtime";
import {Provider as $jzFZE$Provider, DEFAULT_SLOT as $jzFZE$DEFAULT_SLOT, composeRenderProps as $jzFZE$composeRenderProps} from "react-aria-components";
import {createContext as $jzFZE$createContext, forwardRef as $jzFZE$forwardRef, useContext as $jzFZE$useContext} from "react";
import {filterDOMProps as $jzFZE$filterDOMProps, inertValue as $jzFZE$inertValue} from "@react-aria/utils";
import {useDOMRef as $jzFZE$useDOMRef} from "@react-spectrum/utils";
/*
* 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 $68e4e6fe083e22fd$var$borderRadius = {
default: 'lg',
size: {
XS: 'default',
S: 'default'
}
};
let $68e4e6fe083e22fd$var$card = function anonymous(props, overrides) {
let rules = " ";
let position = false;
let width = 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] === "_P") position = true;
if (p[1] === "Z") width = true;
rules += p[0];
}
rules += ' sd91';
rules += ' _ta91';
if (!position) rules += ' _Pc91';
if (props.size === "S") rules += ' ob91';
else if (props.size === "XS") rules += ' ob91';
else rules += ' oc91';
if (props.size === "S") rules += ' nb91';
else if (props.size === "XS") rules += ' nb91';
else rules += ' nc91';
if (props.size === "S") rules += ' kb91';
else if (props.size === "XS") rules += ' kb91';
else rules += ' kc91';
if (props.size === "S") rules += ' jb91';
else if (props.size === "XS") rules += ' jb91';
else rules += ' jc91';
if (props.variant === "secondary") rules += ' -Ovbhqd-gqlRAZb91';
else if (props.variant === "primary") rules += ' -Ovbhqd-g_g91';
rules += ' -Ovbhqd-lgb91';
if (props.variant === "quiet") rules += ' g991';
else if (props.variant === "tertiary") rules += ' g991';
else rules += ' gEzkoQe91';
if (props.variant === "quiet") rules += ' _nd91';
else if (props.variant === "tertiary") {
if (props.isSelected) rules += ' _nd91';
else if (props.isFocusVisible) rules += ' _nIvHxVd91';
else if (props.isHovered) rules += ' _nIvHxVd91';
else rules += ' _nEoUQN91';
rules += ' _nlAvWjK91';
} else {
if (props.isSelected) rules += ' _nb91';
else if (props.isFocusVisible) rules += ' _nb91';
else if (props.isHovered) rules += ' _nb91';
else rules += ' _na91';
rules += ' _nlAvWjK91';
}
rules += ' _yb91';
rules += ' Yd91';
rules += ' Xb91';
rules += ' _2b91';
rules += ' ug91';
rules += ' uch91';
rules += ' udi91';
rules += ' uea91';
rules += ' ugb91';
rules += ' uhd91';
rules += ' uje91';
rules += ' uic91';
if (props.variant === "quiet") rules += ' _Ne91';
else rules += ' _Nb91';
if (props.variant === "quiet") rules += ' Pe91';
else rules += ' Pb91';
rules += ' _qc91';
rules += ' __ca91';
if (props.isCardView) rules += ' _4c91';
if (props.isLink) rules += ' ry91';
if (props.isCardView) {
if (!width) rules += ' Za91';
} else if (props.size === "XL") {
if (!width) rules += ' ZA91';
} else if (props.size === "L") {
if (!width) rules += ' Zy91';
} else if (props.size === "M") {
if (!width) rules += ' Zt91';
} else if (props.size === "S") {
if (!width) rules += ' Zr91';
} else if (props.size === "XS") {
if (!width) rules += ' ZI91';
}
rules += ' Fb91';
if (props.density === "spacious") {
if (props.size === "XL") rules += ' -dAV6Jb-Ti91';
else if (props.size === "L") rules += ' -dAV6Jb-Th91';
else if (props.size === "M") rules += ' -dAV6Jb-Tg91';
else if (props.size === "S") rules += ' -dAV6Jb-Tf91';
else if (props.size === "XS") rules += ' -dAV6Jb-Te91';
} else if (props.density === "regular") {
if (props.size === "XL") rules += ' -dAV6Jb-Th91';
else if (props.size === "L") rules += ' -dAV6Jb-Tg91';
else if (props.size === "M") rules += ' -dAV6Jb-Tf91';
else if (props.size === "S") rules += ' -dAV6Jb-Te91';
else if (props.size === "XS") rules += ' -dAV6Jb-Tt91';
} else if (props.density === "compact") {
if (props.size === "XL") rules += ' -dAV6Jb-Tg91';
else if (props.size === "L") rules += ' -dAV6Jb-Tf91';
else if (props.size === "M") rules += ' -dAV6Jb-Te91';
else if (props.size === "S") rules += ' -dAV6Jb-Tt91';
else if (props.size === "XS") rules += ' -dAV6Jb-T1DOfn91';
}
if (props.variant === "quiet") rules += ' -jXLvjd-Td91';
else rules += ' -jXLvjd-T5gMYHd91';
if (props.variant === "quiet") rules += ' -iXLvjd-Sd91';
else rules += ' -iXLvjd-S5gMYHd91';
rules += ' TxTaQHd91';
rules += ' QxTaQHd91';
rules += ' S0SaQHd91';
rules += ' R0SaQHd91';
rules += ' _oa91';
if (props.variant === "quiet") rules += ' _Le91';
else if (props.isFocusVisible) rules += ' _Lf91';
else rules += ' _Le91';
rules += ' Oh91';
rules += ' _Mc91';
rules += ' _Kd91';
return rules;
};
let $68e4e6fe083e22fd$var$selectionIndicator = function anonymous(props) {
let rules = " ";
rules += ' _Pa91';
rules += ' Wr91';
rules += ' _lr91';
rules += ' _Ar91';
rules += ' _zr91';
rules += ' _9d91';
if (props.size === "S") rules += ' ob91';
else if (props.size === "XS") rules += ' ob91';
else rules += ' oc91';
if (props.size === "S") rules += ' nb91';
else if (props.size === "XS") rules += ' nb91';
else rules += ' nc91';
if (props.size === "S") rules += ' kb91';
else if (props.size === "XS") rules += ' kb91';
else rules += ' kc91';
if (props.size === "S") rules += ' jb91';
else if (props.size === "XS") rules += ' jb91';
else rules += ' jc91';
rules += ' _Ob91';
rules += ' _kc91';
rules += ' hc91';
rules += ' mc91';
rules += ' lc91';
rules += ' _jf91';
rules += ' ik91';
rules += ' Yd91';
rules += ' Xb91';
rules += ' _2b91';
if (props.isSelected) rules += ' _Ib91';
else rules += ' _Ia91';
rules += ' OGcUfH91';
rules += ' _Kc91';
if (props.isStrokeInner) rules += ' _Lf91';
else rules += ' _Le91';
rules += ' _Mc91';
return rules;
};
let $68e4e6fe083e22fd$var$preview = function anonymous(props) {
let rules = " ";
rules += ' _Pc91';
rules += ' Yd91';
rules += ' Xb91';
rules += ' _2b91';
rules += ' _Nb91';
rules += ' Pb91';
rules += ' I8cyuNb91';
rules += ' H8cyuNb91';
rules += ' J39J4qb91';
rules += ' Gk39J4qb91';
if (props.isQuiet) {
if (props.size === "S") rules += ' ob91';
else if (props.size === "XS") rules += ' ob91';
else rules += ' oc91';
}
if (props.isQuiet) {
if (props.size === "S") rules += ' nb91';
else if (props.size === "XS") rules += ' nb91';
else rules += ' nc91';
}
if (props.isQuiet) {
if (props.size === "S") rules += ' kb91';
else if (props.size === "XS") rules += ' kb91';
else rules += ' kc91';
}
if (props.isQuiet) {
if (props.size === "S") rules += ' jb91';
else if (props.size === "XS") rules += ' jb91';
else rules += ' jc91';
}
if (props.isQuiet) {
if (props.isSelected) rules += ' _nb91';
else if (props.isFocusVisible) rules += ' _nb91';
else if (props.isHovered) rules += ' _nb91';
}
if (props.isQuiet) {
if (props.isFocusVisible) rules += ' _Lf91';
} else rules += ' _Le91';
rules += ' Oh91';
rules += ' _Mc91';
rules += ' _Kd91';
return rules;
};
const $68e4e6fe083e22fd$var$image = " Za91 fc91 _Hb91 _4c91 _Ob91";
let $68e4e6fe083e22fd$var$title = function anonymous(props) {
let rules = " ";
rules += ' ug91';
rules += ' uch91';
rules += ' udi91';
rules += ' uea91';
rules += ' ugb91';
rules += ' uhd91';
rules += ' uje91';
rules += ' uic91';
if (props.size === "XL") {
rules += ' vg91';
rules += ' vsj91';
} else if (props.size === "L") {
rules += ' vp91';
rules += ' vsh91';
} else if (props.size === "M") {
rules += ' vd91';
rules += ' vsf91';
} else if (props.size === "S") {
rules += ' vb91';
rules += ' vse91';
} else if (props.size === "XS") {
rules += ' vb91';
rules += ' vse91';
}
rules += ' wd91';
rules += ' xd91';
rules += ' _xa91';
rules += ' wfd91';
rules += ' xfd91';
rules += ' _xfa91';
rules += ' _Fa91';
rules += ' _Ffb91';
rules += ' po91';
rules += ' __Ea91';
rules += ' sa91';
rules += ' __aa91';
rules += ' __ba91';
rules += ' zn9DOs91';
rules += ' yn9DOs91';
rules += ' Bn9DOs91';
rules += ' An9DOs91';
return rules;
};
let $68e4e6fe083e22fd$var$description = function anonymous(props) {
let rules = " ";
rules += ' ug91';
rules += ' uch91';
rules += ' udi91';
rules += ' uea91';
rules += ' ugb91';
rules += ' uhd91';
rules += ' uje91';
rules += ' uic91';
if (props.size === "XL") {
rules += ' vp91';
rules += ' vsh91';
} else if (props.size === "L") {
rules += ' vd91';
rules += ' vsf91';
} else if (props.size === "M") {
rules += ' vb91';
rules += ' vse91';
} else if (props.size === "S") {
rules += ' va91';
rules += ' vsc91';
} else if (props.size === "XS") {
rules += ' va91';
rules += ' vsc91';
}
rules += ' wb91';
rules += ' xb91';
rules += ' _xa91';
rules += ' _Fb91';
rules += ' _Ffc91';
rules += ' pt91';
rules += ' __Ea91';
rules += ' sa91';
rules += ' __aa91';
rules += ' __ba91';
rules += ' z9u7zPc91';
rules += ' y9u7zPc91';
rules += ' B9u7zPc91';
rules += ' A9u7zPc91';
return rules;
};
let $68e4e6fe083e22fd$var$content = function anonymous(props) {
let rules = " ";
rules += ' se91';
rules += ' DM8Mfn91';
rules += ' DlsIuJI4ff491';
rules += ' CfLapxc91';
rules += ' ClsIuJg9IhLd91';
rules += ' qb91';
rules += ' _ub91';
rules += ' ea91';
rules += ' _cf91';
if (props.size === "XL") rules += ' Ue91';
else if (props.size === "L") rules += ' UWJpoB91';
else if (props.size === "M") rules += ' UWJpoB91';
else if (props.size === "S") rules += ' Ub91';
else if (props.size === "XS") rules += ' Ub91';
rules += ' T5gMYHd91';
rules += ' Tbd91';
rules += ' Q69YG2b91';
rules += ' Qkd91';
return rules;
};
let $68e4e6fe083e22fd$var$actionMenu = " zgSHDrc91 ygSHDrc91 BgSHDrc91 AgSHDrc91 JTnYEIe91 GTnYEIe91";
let $68e4e6fe083e22fd$var$footer = " sd91 _tc91 ec91 _Ce91 Ue91 qe91 T69YG2b91";
const $68e4e6fe083e22fd$export$cb658fed5fefe1d = /*#__PURE__*/ (0, $jzFZE$createContext)('div');
const $68e4e6fe083e22fd$export$d0b2ee33ebf7d64 = /*#__PURE__*/ (0, $jzFZE$createContext)(null);
const $68e4e6fe083e22fd$var$InternalCardContext = /*#__PURE__*/ (0, $jzFZE$createContext)({
isQuiet: false,
size: 'M',
isSelected: false,
isHovered: false,
isFocusVisible: false,
isPressed: false,
isCheckboxSelection: true
});
const $68e4e6fe083e22fd$var$actionButtonSize = {
XS: 'XS',
S: 'XS',
M: 'S',
L: 'M',
XL: 'L'
};
const $68e4e6fe083e22fd$export$60332b2344f7fe41 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function Card(props, ref) {
[props] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $68e4e6fe083e22fd$export$d0b2ee33ebf7d64);
let domRef = (0, $jzFZE$useDOMRef)(ref);
let { density: density = 'regular', size: size = 'M', variant: variant = 'primary', UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style, styles: styles, id: id, ...otherProps } = props;
let isQuiet = variant === 'quiet';
let isSkeleton = (0, $5ad421ec19460c48$export$4f8dc7555740235c)();
let children = /*#__PURE__*/ (0, $jzFZE$jsx)((0, $jzFZE$Provider), {
values: [
[
(0, $dbd6f0b2503b938c$export$8151eb379fcf2442),
{
alt: '',
styles: $68e4e6fe083e22fd$var$image
}
],
[
(0, $8e847109a6ab556d$export$9afb8bc826b033ea),
{
slots: {
[(0, $jzFZE$DEFAULT_SLOT)]: {},
title: {
styles: $68e4e6fe083e22fd$var$title({
size: size
})
},
description: {
styles: $68e4e6fe083e22fd$var$description({
size: size
})
}
}
}
],
[
(0, $8e847109a6ab556d$export$1cbdd774077931b4),
{
styles: $68e4e6fe083e22fd$var$content({
size: size
})
}
],
[
(0, $bdf52657dac0f070$export$30fbfd376abdf190),
{
size: 'S'
}
],
[
(0, $8e847109a6ab556d$export$5630640b68817ed6),
{
styles: $68e4e6fe083e22fd$var$footer
}
],
[
(0, $8bf3cd2442eb485e$export$7f4b66acaca28bd5),
{
isQuiet: true,
size: $68e4e6fe083e22fd$var$actionButtonSize[size],
isDisabled: isSkeleton,
// @ts-ignore
'data-slot': 'menu',
styles: $68e4e6fe083e22fd$var$actionMenu
}
],
[
(0, $5ad421ec19460c48$export$74e166679b1f49ee),
isSkeleton
]
],
children: /*#__PURE__*/ (0, $jzFZE$jsx)((0, $4b5e069e9e001e8b$export$1b926c015f09611d), {
children: typeof props.children === 'function' ? props.children({
size: size
}) : props.children
})
});
let ElementType = (0, $jzFZE$useContext)($68e4e6fe083e22fd$export$cb658fed5fefe1d);
if (ElementType === 'div' || isSkeleton) return /*#__PURE__*/ (0, $jzFZE$jsx)("div", {
...(0, $jzFZE$filterDOMProps)(otherProps),
id: id != null ? String(id) : undefined,
// @ts-ignore - React < 19 compat
inert: (0, $jzFZE$inertValue)(isSkeleton),
ref: domRef,
className: UNSAFE_className + $68e4e6fe083e22fd$var$card({
size: size,
density: density,
variant: variant,
isCardView: ElementType !== 'div'
}, styles),
style: UNSAFE_style,
children: /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$var$InternalCardContext.Provider, {
value: {
size: size,
isQuiet: isQuiet,
isCheckboxSelection: false,
isHovered: false,
isFocusVisible: false,
isSelected: false,
isPressed: false
},
children: children
})
});
let press = (0, $10ea7662e51a285b$export$56e8cba416805d8d)(domRef, UNSAFE_style);
return /*#__PURE__*/ (0, $jzFZE$jsx)(ElementType, {
...props,
ref: domRef,
className: (renderProps)=>UNSAFE_className + $68e4e6fe083e22fd$var$card({
...renderProps,
isCardView: true,
isLink: !!props.href,
size: size,
density: density,
variant: variant
}, styles),
style: (renderProps)=>// Only the preview in quiet cards scales down on press
variant === 'quiet' ? UNSAFE_style : press(renderProps),
children: ({ selectionMode: selectionMode, selectionBehavior: selectionBehavior, isHovered: isHovered, isFocusVisible: isFocusVisible, isSelected: isSelected, isPressed: isPressed })=>/*#__PURE__*/ (0, $jzFZE$jsxs)($68e4e6fe083e22fd$var$InternalCardContext.Provider, {
value: {
size: size,
isQuiet: isQuiet,
isCheckboxSelection: selectionMode !== 'none' && selectionBehavior === 'toggle',
isHovered: isHovered,
isFocusVisible: isFocusVisible,
isSelected: isSelected,
isPressed: isPressed
},
children: [
!isQuiet && /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$var$SelectionIndicator, {}),
!isQuiet && selectionMode !== 'none' && selectionBehavior === 'toggle' && /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$var$CardCheckbox, {}),
/*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: " sc91",
children: children
})
]
})
});
});
function $68e4e6fe083e22fd$var$SelectionIndicator() {
let { size: size, isSelected: isSelected, isQuiet: isQuiet, isCheckboxSelection: isCheckboxSelection } = (0, $jzFZE$useContext)($68e4e6fe083e22fd$var$InternalCardContext);
return /*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: $68e4e6fe083e22fd$var$selectionIndicator({
size: size,
isSelected: isSelected,
// Add an inner stroke only for quiet cards with no checkbox to
// help distinguish the selected state from the preview.
isStrokeInner: isQuiet && !isCheckboxSelection
})
});
}
function $68e4e6fe083e22fd$var$CardCheckbox() {
let { size: size } = (0, $jzFZE$useContext)($68e4e6fe083e22fd$var$InternalCardContext);
return /*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: " _Pa91 W5gMYHd91 _A5gMYHd91 _9d91 Tp91 Qp91 Sp91 Rp91 gGcUfH91 ob91 nb91 kb91 jb91 _na91",
children: /*#__PURE__*/ (0, $jzFZE$jsx)((0, $9b405e0f8095dce0$export$48513f6b9f8ce62d), {
slot: "selection",
excludeFromTabOrder: true,
size: size === 'XS' ? 'S' : size
})
});
}
const $68e4e6fe083e22fd$export$115f017852a4bb7c = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function CardPreview(props, ref) {
let { size: size, isQuiet: isQuiet, isHovered: isHovered, isFocusVisible: isFocusVisible, isSelected: isSelected, isPressed: isPressed, isCheckboxSelection: isCheckboxSelection } = (0, $jzFZE$useContext)($68e4e6fe083e22fd$var$InternalCardContext);
let { UNSAFE_className: UNSAFE_className = '', UNSAFE_style: UNSAFE_style } = props;
let domRef = (0, $jzFZE$useDOMRef)(ref);
return /*#__PURE__*/ (0, $jzFZE$jsxs)("div", {
...(0, $jzFZE$filterDOMProps)(props),
slot: "preview",
ref: domRef,
className: UNSAFE_className + $68e4e6fe083e22fd$var$preview({
size: size,
isQuiet: isQuiet,
isHovered: isHovered,
isFocusVisible: isFocusVisible,
isSelected: isSelected
}),
style: isQuiet ? (0, $10ea7662e51a285b$export$56e8cba416805d8d)(domRef)({
isPressed: isPressed
}) : UNSAFE_style,
children: [
isQuiet && /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$var$SelectionIndicator, {}),
isQuiet && isCheckboxSelection && /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$var$CardCheckbox, {}),
/*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: " oi91 ni91 ki91 ji91 _Nb91 Pb91",
children: props.children
})
]
});
});
const $68e4e6fe083e22fd$var$collection = function anonymous(props) {
let rules = " ";
rules += ' se91';
rules += ' DvhgoHd91';
if (props.size === "S") rules += ' Ua91';
else if (props.size === "XS") rules += ' Ua91';
else rules += ' Ub91';
if (props.size === "S") rules += ' qa91';
else if (props.size === "XS") rules += ' qa91';
else rules += ' qb91';
return rules;
};
const $68e4e6fe083e22fd$var$collectionImage = " Za91 fa91 f5DbKFc91 y5DbKFwoofG91 _Hb91 _Ob91 _4c91";
const $68e4e6fe083e22fd$export$c368ea3e577b1b86 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function CollectionCardPreview(props, ref) {
let { size: size } = (0, $jzFZE$useContext)($68e4e6fe083e22fd$var$InternalCardContext);
return /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$export$115f017852a4bb7c, {
...props,
ref: ref,
children: /*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: $68e4e6fe083e22fd$var$collection({
size: size
}),
children: /*#__PURE__*/ (0, $jzFZE$jsx)((0, $dbd6f0b2503b938c$export$8151eb379fcf2442).Provider, {
value: {
styles: $68e4e6fe083e22fd$var$collectionImage
},
children: props.children
})
})
});
});
const $68e4e6fe083e22fd$export$eff93e4e59ccc3b8 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function AssetCard(props, ref) {
return /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$export$60332b2344f7fe41, {
...props,
ref: ref,
density: "regular",
children: (0, $jzFZE$composeRenderProps)(props.children, (children)=>/*#__PURE__*/ (0, $jzFZE$jsx)((0, $jzFZE$Provider), {
values: [
[
(0, $dbd6f0b2503b938c$export$8151eb379fcf2442),
{
alt: '',
styles: " Za91 fa91 _Ha91 _Ob91 _4c91"
}
],
[
(0, $ac8c32e6775ddd1f$export$207c7561471de4bd),
{
render (icon) {
return /*#__PURE__*/ (0, $jzFZE$jsx)((0, $5ad421ec19460c48$export$6069cbe61f690103), {
children: /*#__PURE__*/ (0, $jzFZE$jsx)("div", {
className: " sd91 eb91 _Ca91 gH91 fa91",
children: icon
})
});
},
styles: " Fd91 Le91 Ke91 Zc91"
}
]
],
children: children
}))
});
});
const $68e4e6fe083e22fd$var$avatarSize = {
XS: 24,
S: 48,
M: 64,
L: 64,
XL: 80
};
const $68e4e6fe083e22fd$export$78e8870b5d8ae469 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function UserCard(props, ref) {
let { size: size = 'M' } = props;
return /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$export$60332b2344f7fe41, {
...props,
ref: ref,
density: "spacious",
children: (0, $jzFZE$composeRenderProps)(props.children, (children)=>/*#__PURE__*/ (0, $jzFZE$jsx)((0, $jzFZE$Provider), {
values: [
[
(0, $dbd6f0b2503b938c$export$8151eb379fcf2442),
{
alt: '',
styles: " Za91 fb91 _Hb91 _Ob91 _4c91"
}
],
[
(0, $3ffa2cd930156220$export$a20dad690e1279e2),
{
size: $68e4e6fe083e22fd$var$avatarSize[size],
UNSAFE_style: {
'--size': $68e4e6fe083e22fd$var$avatarSize[size] / 16 + 'rem'
},
styles: " _Pc91 Jy91 Jkymupd0fnV8d91",
isOverBackground: true
}
]
],
children: children
}))
});
});
const $68e4e6fe083e22fd$var$buttonSize = {
XS: 'S',
S: 'S',
M: 'M',
L: 'L',
XL: 'XL'
};
const $68e4e6fe083e22fd$export$e6cbe35324ccf844 = /*#__PURE__*/ (0, $jzFZE$forwardRef)(function ProductCard(props1, ref) {
let { size: size = 'M' } = props1;
return /*#__PURE__*/ (0, $jzFZE$jsx)($68e4e6fe083e22fd$export$60332b2344f7fe41, {
...props1,
ref: ref,
density: "spacious",
children: (0, $jzFZE$composeRenderProps)(props1.children, (children)=>/*#__PURE__*/ (0, $jzFZE$jsx)((0, $jzFZE$Provider), {
values: [
[
(0, $dbd6f0b2503b938c$export$8151eb379fcf2442),
{
slots: {
preview: {
alt: '',
styles: " Za91 fd91 _Hb91 _Ob91 _4c91"
},
thumbnail: {
alt: '',
styles: function anonymous(props) {
let rules = " ";
rules += ' _Pc91';
rules += ' _Ob91';
rules += ' _4c91';
if (props.size === "XL") rules += ' ZD91';
else if (props.size === "L") rules += ' Zx91';
else if (props.size === "M") rules += ' Zw91';
else if (props.size === "S") rules += ' Zv91';
else if (props.size === "XS") rules += ' Zo91';
rules += ' FRuFGYc91';
if (props.size === "S") rules += ' oa91';
else if (props.size === "XS") rules += ' oa91';
else rules += ' ob91';
if (props.size === "S") rules += ' na91';
else if (props.size === "XS") rules += ' na91';
else rules += ' nb91';
if (props.size === "S") rules += ' ka91';
else if (props.size === "XS") rules += ' ka91';
else rules += ' kb91';
if (props.size === "S") rules += ' ja91';
else if (props.size === "XS") rules += ' ja91';
else rules += ' jb91';
rules += ' _Hb91';
rules += ' Jy91';
rules += ' JkymupdLu7Bcc91';
rules += ' _Lf91';
if (props.size === "XS") rules += ' _Mb91';
else rules += ' _Mc91';
rules += ' OEzkoQe91';
if (props.size === "XL") rules += ' -F_-Fy91';
else if (props.size === "L") rules += ' -F_-Fw91';
else if (props.size === "M") rules += ' -F_-Fv91';
else if (props.size === "S") rules += ' -F_-Fu91';
else if (props.size === "XS") rules += ' -F_-Fp91';
return rules;
}({
size: size
})
}
}
}
],
[
(0, $8e847109a6ab556d$export$5630640b68817ed6),
{
styles: (0, $feb886035e0d4633$export$e618dc39ac9ad607)($68e4e6fe083e22fd$var$footer, " _Cb91")
}
],
[
(0, $067ea9f64ccd4e8e$export$24d547caef80ccd1),
{
size: $68e4e6fe083e22fd$var$buttonSize[size]
}
],
[
(0, $067ea9f64ccd4e8e$export$1c1a176f3b9e48d3),
{
size: $68e4e6fe083e22fd$var$buttonSize[size]
}
]
],
children: children
}))
});
});
export {$68e4e6fe083e22fd$export$cb658fed5fefe1d as InternalCardViewContext, $68e4e6fe083e22fd$export$d0b2ee33ebf7d64 as CardContext, $68e4e6fe083e22fd$export$60332b2344f7fe41 as Card, $68e4e6fe083e22fd$export$115f017852a4bb7c as CardPreview, $68e4e6fe083e22fd$export$c368ea3e577b1b86 as CollectionCardPreview, $68e4e6fe083e22fd$export$eff93e4e59ccc3b8 as AssetCard, $68e4e6fe083e22fd$export$78e8870b5d8ae469 as UserCard, $68e4e6fe083e22fd$export$e6cbe35324ccf844 as ProductCard};
//# sourceMappingURL=Card.mjs.map