@contentful/f36-card 4.17.0 → 4.19.1

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.js DELETED
@@ -1,647 +0,0 @@
1
- var $ej4sI$emotion = require("emotion");
2
- var $ej4sI$react = require("react");
3
- var $ej4sI$contentfulf36core = require("@contentful/f36-core");
4
- var $ej4sI$contentfulf36badge = require("@contentful/f36-badge");
5
- var $ej4sI$contentfulf36asset = require("@contentful/f36-asset");
6
- var $ej4sI$contentfulf36skeleton = require("@contentful/f36-skeleton");
7
- var $ej4sI$contentfulf36draghandle = require("@contentful/f36-drag-handle");
8
- var $ej4sI$contentfulf36tokens = require("@contentful/f36-tokens");
9
- var $ej4sI$contentfulf36typography = require("@contentful/f36-typography");
10
- var $ej4sI$contentfulf36button = require("@contentful/f36-button");
11
- var $ej4sI$contentfulf36icons = require("@contentful/f36-icons");
12
- var $ej4sI$contentfulf36menu = require("@contentful/f36-menu");
13
- var $ej4sI$truncate = require("truncate");
14
- var $ej4sI$contentfulf36tooltip = require("@contentful/f36-tooltip");
15
-
16
- function $parcel$export(e, n, v, s) {
17
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
18
- }
19
- function $parcel$interopDefault(a) {
20
- return a && a.__esModule ? a.default : a;
21
- }
22
-
23
- $parcel$export(module.exports, "AssetCard", () => $a1789fe336016cbc$export$eff93e4e59ccc3b8);
24
- $parcel$export(module.exports, "Card", () => $f9cc9ae35ca0e97b$export$60332b2344f7fe41);
25
- $parcel$export(module.exports, "EntryCard", () => $53f5ebde1e43cd99$export$326973e3eb2dbf);
26
- $parcel$export(module.exports, "InlineEntryCard", () => $ce99b3784504d625$export$94c16395f9ec3265);
27
-
28
-
29
-
30
-
31
-
32
-
33
-
34
-
35
-
36
-
37
-
38
-
39
-
40
- const $ac580b2c4ac6c617$export$e5c3362273de1eca = ()=>{
41
- return {
42
- contentBody: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
43
- name: "161cbg",
44
- styles: "grid-column:content;grid-row:content;white-space:initial;"
45
- }),
46
- wrapper: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
47
- name: "1cjnmwb",
48
- styles: "flex:1 1 0;display:grid;grid-template-rows:[header] auto [content] minmax(0, 1fr);grid-template-columns:auto [content] minmax(0, 1fr);"
49
- }),
50
- dragHandle: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
51
- borderBottomLeftRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
52
- borderTopLeftRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
53
- cursor: "grab"
54
- }),
55
- root: ({ hasHeader: hasHeader , isHovered: isHovered , isSelected: isSelected })=>{
56
- const styles = {
57
- backgroundColor: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorWhite,
58
- borderColor: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray300,
59
- borderRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
60
- borderStyle: "solid",
61
- borderWidth: 1,
62
- color: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray900,
63
- display: "flex",
64
- textAlign: "left",
65
- width: "100%",
66
- fontSize: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontSizeM,
67
- fontWeight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontWeightNormal,
68
- position: "relative",
69
- textDecoration: "none",
70
- transition: `border-color ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).transitionDurationDefault} ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).transitionEasingDefault},
71
- box-shadow ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).transitionDurationShort} ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).transitionEasingDefault}`,
72
- "&:focus": /*#__PURE__*/ (0, $ej4sI$emotion.css)({
73
- borderColor: isSelected ? (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).blue100 : (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorPrimary,
74
- boxShadow: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).glowPrimary,
75
- outline: "none"
76
- }),
77
- "&:focus:not(:focus-visible)": /*#__PURE__*/ (0, $ej4sI$emotion.css)({
78
- borderColor: isSelected ? (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorPrimary : (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray300,
79
- boxShadow: "unset"
80
- }),
81
- "&:focus-visible": /*#__PURE__*/ (0, $ej4sI$emotion.css)({
82
- borderColor: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorPrimary,
83
- boxShadow: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).glowPrimary
84
- })
85
- };
86
- if (!hasHeader) styles.paddingTop = (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM;
87
- if (isHovered) {
88
- styles.borderColor = (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorPrimary;
89
- styles.cursor = "pointer";
90
- }
91
- if (isSelected) {
92
- styles.backgroundColor = (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).blue100;
93
- styles.borderColor = (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).colorPrimary;
94
- }
95
- return /*#__PURE__*/ (0, $ej4sI$emotion.css)(styles);
96
- },
97
- skeleton: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
98
- border: `1px solid ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray300}`,
99
- borderRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
100
- padding: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM
101
- })
102
- };
103
- };
104
-
105
-
106
-
107
-
108
-
109
-
110
-
111
-
112
-
113
-
114
-
115
-
116
-
117
-
118
- const $6d621ff952663052$export$6468e6b9c1bc1de = ()=>{
119
- return {
120
- root: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
121
- minHeight: "auto",
122
- padding: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacing2Xs,
123
- marginLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs
124
- })
125
- };
126
- };
127
-
128
-
129
- const $5b97eda51fdfde91$export$9b6a647253f61c5f = ({ buttonProps: buttonProps , children: children })=>{
130
- const styles = (0, $6d621ff952663052$export$6468e6b9c1bc1de)();
131
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36menu.Menu), null, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36menu.Menu).Trigger, null, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36button.IconButton), {
132
- "aria-label": "Actions",
133
- icon: /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36icons.MoreHorizontalIcon), null),
134
- ...buttonProps,
135
- className: (0, $ej4sI$emotion.cx)(styles.root, buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.className),
136
- size: "small",
137
- variant: "transparent",
138
- testId: "cf-ui-card-actions"
139
- })), /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36menu.Menu).List, null, children));
140
- };
141
-
142
-
143
-
144
- const $4f678cc54123ba6b$var$getHeaderStyles = ()=>{
145
- return {
146
- header: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
147
- alignItems: "center",
148
- borderBottomColor: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray200,
149
- borderBottomStyle: "solid",
150
- borderBottomWidth: 1,
151
- borderTopLeftRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
152
- borderTopRightRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
153
- boxSizing: "border-box",
154
- color: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray600,
155
- fontSize: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontSizeM,
156
- fontWeight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontWeightNormal,
157
- gridColumn: "content",
158
- gridRow: "header",
159
- lineHeight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).lineHeightM,
160
- paddingBottom: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
161
- paddingLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM,
162
- paddingRight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
163
- paddingTop: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
164
- minHeight: "37px"
165
- }),
166
- headerWithActions: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
167
- paddingBottom: 0,
168
- paddingRight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
169
- paddingTop: 0
170
- })
171
- };
172
- };
173
- const $4f678cc54123ba6b$export$783e10c0b439f264 = (e)=>{
174
- e.preventDefault();
175
- e.stopPropagation();
176
- };
177
- const $4f678cc54123ba6b$export$606643aa598b5a97 = (props)=>{
178
- const { icon: icon , type: type , actions: actions , actionsButtonProps: actionsButtonProps , badge: badge } = props;
179
- const styles = $4f678cc54123ba6b$var$getHeaderStyles();
180
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
181
- className: (0, $ej4sI$emotion.cx)(styles.header, actions && styles.headerWithActions)
182
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
183
- flexGrow: 1
184
- }, type && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36typography.Text), {
185
- fontColor: "gray600",
186
- isWordBreak: true
187
- }, type)), icon && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
188
- alignItems: "center",
189
- marginLeft: "spacingXs"
190
- }, icon), badge && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
191
- alignItems: "center",
192
- marginLeft: "spacingXs"
193
- }, badge), actions && actions.length > 0 && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex // don't propagate click event, so onClick handler on the card is not triggered
194
- ), {
195
- onClick: $4f678cc54123ba6b$export$783e10c0b439f264,
196
- alignItems: "center"
197
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $5b97eda51fdfde91$export$9b6a647253f61c5f), {
198
- buttonProps: actionsButtonProps
199
- }, actions)));
200
- };
201
- $4f678cc54123ba6b$export$606643aa598b5a97.displayName = "DefaultCardHeader";
202
-
203
-
204
- const $7fa2d152b3057b6a$export$eed7d00d62e881b8 = "article";
205
- function $7fa2d152b3057b6a$var$_BaseCard({ actions: actions , actionsButtonProps: actionsButtonProps , ariaLabel: ariaLabel , badge: badge , children: children , className: className , contentBodyProps: contentBodyProps , header: header , href: href , icon: icon , isDragging: isDragging = false , isHovered: isHoveredProp , isSelected: isSelected = false , onBlur: onBlur , onClick: onClick , onFocus: onFocus , onKeyDown: onKeyDown , onMouseEnter: onMouseEnter , onMouseLeave: onMouseLeave , target: target , rel: rel , testId: testId = "cf-ui-base-card" , title: title , type: type , withDragHandle: withDragHandle , dragHandleRender: dragHandleRender , isLoading: isLoading , ...otherProps }, forwardedRef) {
206
- const styles = (0, $ac580b2c4ac6c617$export$e5c3362273de1eca)();
207
- const [isHovered, setIsHovered] = (0, $ej4sI$react.useState)(isHoveredProp !== null && isHoveredProp !== void 0 ? isHoveredProp : false);
208
- const isInteractive = Boolean(onClick || href || withDragHandle);
209
- const hasHeader = Boolean(header);
210
- const defaultHeader = type || icon || badge || actions ? /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $4f678cc54123ba6b$export$606643aa598b5a97), {
211
- type: type,
212
- icon: icon,
213
- badge: badge,
214
- actions: actions,
215
- actionsButtonProps: actionsButtonProps
216
- }) : null;
217
- const handleFocus = (0, $ej4sI$react.useCallback)((event)=>{
218
- if (onFocus) onFocus(event);
219
- }, [
220
- onFocus
221
- ]);
222
- const handleBlur = (0, $ej4sI$react.useCallback)((event)=>{
223
- if (onBlur) onBlur(event);
224
- }, [
225
- onBlur
226
- ]);
227
- const handleMouseEnter = (0, $ej4sI$react.useCallback)((event)=>{
228
- setIsHovered(true);
229
- if (onMouseEnter) onMouseEnter(event);
230
- }, [
231
- onMouseEnter
232
- ]);
233
- const handleMouseLeave = (0, $ej4sI$react.useCallback)((event)=>{
234
- setIsHovered(false);
235
- if (onMouseLeave) onMouseLeave(event);
236
- }, [
237
- onMouseLeave
238
- ]);
239
- const handleClick = onClick ? (event)=>{
240
- onClick(event);
241
- } : undefined;
242
- const handleKeyDown = (0, $ej4sI$react.useCallback)((event)=>{
243
- if (onKeyDown) onKeyDown(event);
244
- }, [
245
- onKeyDown
246
- ]);
247
- if (isLoading) return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).Container, {
248
- className: styles.skeleton,
249
- svgHeight: "5.6rem"
250
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).DisplayText, {
251
- numberOfLines: 1
252
- }), /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).BodyText, {
253
- numberOfLines: 1,
254
- offsetTop: 35
255
- }));
256
- const drag = /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36draghandle.DragHandle), {
257
- className: styles.dragHandle,
258
- isActive: isDragging,
259
- label: "Reorder entry",
260
- onClick: (0, $4f678cc54123ba6b$export$783e10c0b439f264)
261
- });
262
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Box), {
263
- "aria-label": title || ariaLabel,
264
- "aria-pressed": otherProps.as === "button" ? isSelected ? "true" : "false" : undefined,
265
- as: $7fa2d152b3057b6a$export$eed7d00d62e881b8,
266
- className: (0, $ej4sI$emotion.cx)(styles.root({
267
- hasHeader: hasHeader,
268
- isHovered: isHovered,
269
- isSelected: isSelected
270
- }), className),
271
- href: href,
272
- onBlur: handleBlur,
273
- onClick: handleClick,
274
- onFocus: handleFocus,
275
- onMouseEnter: typeof isHoveredProp === "undefined" && isInteractive ? handleMouseEnter : undefined,
276
- onMouseLeave: typeof isHoveredProp === "undefined" && isInteractive ? handleMouseLeave : undefined,
277
- onKeyDown: handleKeyDown,
278
- rel: href && (rel || "noreferrer"),
279
- role: onClick && !href ? "button" : undefined,
280
- tabIndex: onClick ? 0 : undefined,
281
- target: target,
282
- ...otherProps,
283
- ref: forwardedRef,
284
- testId: testId,
285
- title: title
286
- }, withDragHandle ? dragHandleRender ? dragHandleRender({
287
- drag: drag,
288
- isDragging: isDragging
289
- }) : drag : null, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement("div", {
290
- className: styles.wrapper,
291
- "data-card-part": "wrapper"
292
- }, header !== null && header !== void 0 ? header : defaultHeader, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement("div", {
293
- className: styles.contentBody,
294
- "data-card-part": "content"
295
- }, children)));
296
- }
297
- $7fa2d152b3057b6a$var$_BaseCard.displayName = "BaseCard";
298
- const $7fa2d152b3057b6a$export$ffd8d1a491a618f2 = /*#__PURE__*/ (0, $ej4sI$react.forwardRef)($7fa2d152b3057b6a$var$_BaseCard);
299
-
300
-
301
-
302
-
303
- const $8737d8f2d81a08a9$export$37a6ca57378bcb83 = ()=>{
304
- return {
305
- root: ({ size: size })=>/*#__PURE__*/ (0, $ej4sI$emotion.css)({
306
- display: "inline-flex",
307
- width: "auto",
308
- borderRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
309
- minWidth: `calc(1rem * (120 / ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontBaseDefault}))`,
310
- height: size === "small" ? `calc(1rem * (188 / ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontBaseDefault}))` : `calc(1rem * (300 / ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).fontBaseDefault}))`,
311
- padding: 0,
312
- textAlign: "center"
313
- }),
314
- asset: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
315
- name: "10klw3m",
316
- styles: "height:100%;"
317
- }),
318
- skeleton: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
319
- border: `1px solid ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray300}`,
320
- borderRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
321
- padding: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM
322
- })
323
- };
324
- };
325
-
326
-
327
-
328
- const $a1789fe336016cbc$export$eff93e4e59ccc3b8 = ({ actions: actions , className: className , icon: icon = null , isSelected: isSelected , size: size = "default" , src: src , status: status , title: title , type: type , withDragHandle: withDragHandle = false , isLoading: isLoading , testId: testId = "cf-ui-asset-card" , ...otherProps })=>{
329
- const styles = (0, $8737d8f2d81a08a9$export$37a6ca57378bcb83)();
330
- const badge = status ? /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36badge.EntityStatusBadge), {
331
- entityStatus: status
332
- }) : null;
333
- const header = icon || badge || actions ? /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $4f678cc54123ba6b$export$606643aa598b5a97), {
334
- icon: icon,
335
- badge: badge,
336
- actions: actions
337
- }) : null;
338
- if (isLoading) return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).Container, {
339
- className: styles.skeleton,
340
- svgWidth: size === "default" ? "18rem" : "11rem",
341
- svgHeight: size === "default" ? "18.75rem" : "12rem"
342
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).Image, {
343
- width: "100%",
344
- height: "18.75rem"
345
- }));
346
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $7fa2d152b3057b6a$export$ffd8d1a491a618f2), {
347
- ...otherProps,
348
- badge: badge,
349
- className: (0, $ej4sI$emotion.cx)(styles.root({
350
- size: size
351
- }), className),
352
- header: header,
353
- isSelected: isSelected,
354
- title: title,
355
- withDragHandle: withDragHandle,
356
- testId: testId
357
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
358
- alignItems: "center",
359
- fullHeight: true,
360
- justifyContent: "center"
361
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36asset.Asset), {
362
- className: styles.asset,
363
- src: src,
364
- status: status,
365
- title: title,
366
- type: type
367
- })));
368
- };
369
-
370
-
371
-
372
-
373
-
374
-
375
-
376
-
377
-
378
-
379
-
380
- const $0f06030e2ddcf42b$var$getCardPaddingValue = (padding)=>{
381
- switch(padding){
382
- case "large":
383
- return (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingL;
384
- case "none":
385
- return 0;
386
- default:
387
- return (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM;
388
- }
389
- };
390
- const $0f06030e2ddcf42b$export$164c3dc7db460fb7 = ({ padding: padding })=>({
391
- header: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
392
- gridColumn: "content",
393
- gridRow: "header",
394
- marginBottom: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM
395
- }),
396
- root: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
397
- padding: $0f06030e2ddcf42b$var$getCardPaddingValue(padding)
398
- })
399
- });
400
-
401
-
402
- function $f9cc9ae35ca0e97b$var$_Card({ actions: actions , badge: badge , icon: icon , padding: padding = "default" , title: title , className: className , testId: testId = "cf-ui-card" , ...otherProps }, forwardedRef) {
403
- const styles = (0, $0f06030e2ddcf42b$export$164c3dc7db460fb7)({
404
- padding: padding
405
- });
406
- const hasHeader = Boolean(title || icon || badge || actions);
407
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $7fa2d152b3057b6a$export$ffd8d1a491a618f2), {
408
- className: (0, $ej4sI$emotion.cx)(styles.root, className),
409
- ...otherProps,
410
- testId: testId,
411
- header: hasHeader && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
412
- alignItems: "center",
413
- className: (0, $ej4sI$emotion.cx)(styles.header)
414
- }, title && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
415
- as: "header",
416
- flexGrow: 1
417
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36typography.Heading), {
418
- marginBottom: "none"
419
- }, title)), icon && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
420
- alignItems: "center",
421
- marginLeft: "spacingXs"
422
- }, icon), badge && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
423
- alignItems: "center",
424
- marginLeft: "spacingXs"
425
- }, badge), actions && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $5b97eda51fdfde91$export$9b6a647253f61c5f), null, actions)),
426
- ref: forwardedRef
427
- });
428
- }
429
- $f9cc9ae35ca0e97b$var$_Card.displayName = "Card";
430
- const $f9cc9ae35ca0e97b$export$60332b2344f7fe41 = /*#__PURE__*/ (0, $ej4sI$react.forwardRef)($f9cc9ae35ca0e97b$var$_Card);
431
-
432
-
433
-
434
-
435
-
436
-
437
-
438
-
439
-
440
-
441
-
442
-
443
- const $6ca911295fb9c155$export$25b6e8fb8b7b795b = ()=>{
444
- return {
445
- actionsButton: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
446
- borderBottomLeftRadius: 0,
447
- borderBottomRightRadius: 0,
448
- borderTopLeftRadius: 0,
449
- borderTopRightRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium
450
- }),
451
- content: (size)=>/*#__PURE__*/ (0, $ej4sI$emotion.css)({
452
- gridColumn: "content",
453
- marginTop: size === "small" ? (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs : (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingS,
454
- marginBottom: size === "small" ? `calc(-1 * ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs})` : 0
455
- }),
456
- root: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
457
- padding: 0,
458
- '[data-card-part="content"]': {
459
- paddingBottom: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM,
460
- paddingLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM,
461
- paddingRight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM
462
- }
463
- }),
464
- header: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
465
- borderBottomWidth: 1,
466
- borderBottomColor: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray200,
467
- borderBottomStyle: "solid",
468
- minHeight: "auto",
469
- paddingBottom: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
470
- paddingLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingM,
471
- paddingRight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs
472
- }),
473
- thumbnail: (size)=>/*#__PURE__*/ (0, $ej4sI$emotion.css)({
474
- margin: `0 0 0 ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingS}`,
475
- padding: 0,
476
- overflow: "hidden",
477
- position: "relative",
478
- img: {
479
- width: "100%",
480
- height: "100%",
481
- objectFit: "cover",
482
- position: "absolute",
483
- zIndex: 1
484
- },
485
- ...size === "small" ? {
486
- height: "40px",
487
- width: "40px"
488
- } : {
489
- height: "70px",
490
- width: "70px"
491
- }
492
- })
493
- };
494
- };
495
-
496
-
497
- const $53f5ebde1e43cd99$var$ENTRY_CARD_DEFAULT_TAG = "article";
498
- function $53f5ebde1e43cd99$var$EntryCardTitle({ title: title , titleTag: titleTag }) {
499
- if (!title) return null;
500
- const truncatedTitle = (0, ($parcel$interopDefault($ej4sI$truncate)))(title, 255, {});
501
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36typography.Subheading), {
502
- title: title.length > 255 ? title : "",
503
- testId: "title",
504
- as: titleTag,
505
- marginBottom: "none",
506
- isWordBreak: true
507
- }, truncatedTitle);
508
- }
509
- $53f5ebde1e43cd99$var$EntryCardTitle.displayName = "EntryCardTitle";
510
- function $53f5ebde1e43cd99$var$EntryCardDescription({ description: description , size: size }) {
511
- if (!description || size === "small") return null;
512
- const truncatedDescription = (0, ($parcel$interopDefault($ej4sI$truncate)))(description, 95, {});
513
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36typography.Paragraph), {
514
- marginBottom: "none",
515
- isWordBreak: true
516
- }, truncatedDescription);
517
- }
518
- $53f5ebde1e43cd99$var$EntryCardDescription.displayName = "EntryCardDescription";
519
- function $53f5ebde1e43cd99$var$_EntryCard({ actions: actions , children: children , className: className , src: src , status: status , thumbnailElement: thumbnailElement , description: description , withDragHandle: withDragHandle = false , title: title , titleTag: titleTag = "h2" , size: size , testId: testId = "cf-ui-entry-card" , contentType: contentType , ...otherProps }, forwardedRef) {
520
- const styles = (0, $6ca911295fb9c155$export$25b6e8fb8b7b795b)();
521
- const badge = status ? /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36badge.EntityStatusBadge), {
522
- entityStatus: status
523
- }) : null;
524
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $7fa2d152b3057b6a$export$ffd8d1a491a618f2), {
525
- as: $53f5ebde1e43cd99$var$ENTRY_CARD_DEFAULT_TAG,
526
- ...otherProps,
527
- actions: actions,
528
- badge: badge,
529
- className: (0, $ej4sI$emotion.cx)(styles.root, className),
530
- withDragHandle: withDragHandle,
531
- ref: forwardedRef,
532
- type: contentType,
533
- testId: testId
534
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
535
- alignItems: "center",
536
- className: styles.content(size),
537
- flexDirection: "row"
538
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36core.Flex), {
539
- flexDirection: "column",
540
- flexGrow: 1,
541
- gap: "spacingS"
542
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement($53f5ebde1e43cd99$var$EntryCardTitle, {
543
- title: title,
544
- titleTag: titleTag
545
- }), /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement($53f5ebde1e43cd99$var$EntryCardDescription, {
546
- size: size,
547
- description: description
548
- }), children), thumbnailElement && size !== "small" && /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement("figure", {
549
- className: styles.thumbnail(size)
550
- }, thumbnailElement)));
551
- }
552
- $53f5ebde1e43cd99$var$_EntryCard.displayName = "EntryCard";
553
- const $53f5ebde1e43cd99$export$326973e3eb2dbf = /*#__PURE__*/ (0, $ej4sI$react.forwardRef)($53f5ebde1e43cd99$var$_EntryCard);
554
-
555
-
556
-
557
-
558
-
559
-
560
-
561
-
562
-
563
-
564
-
565
-
566
- const $1c0682cd2721a9f0$export$ccfc6dbdba6183be = ()=>{
567
- return {
568
- actions: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
569
- display: "flex",
570
- padding: 0,
571
- marginLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs,
572
- minHeight: "auto"
573
- }),
574
- root: ({ status: status })=>{
575
- const statusColors = (0, $ej4sI$contentfulf36core.getEntityStatusStyles)({
576
- status: status
577
- });
578
- return /*#__PURE__*/ (0, $ej4sI$emotion.css)({
579
- borderBottomLeftRadius: 0,
580
- borderTopLeftRadius: 0,
581
- display: "inline-flex",
582
- width: "auto",
583
- verticalAlign: "middle",
584
- paddingBottom: 0,
585
- paddingTop: 0,
586
- paddingLeft: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingS,
587
- paddingRight: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacing2Xs,
588
- '[data-card-part="wrapper"]': {
589
- display: "inline-flex",
590
- flexDirection: "row-reverse"
591
- },
592
- "&::before": {
593
- backgroundColor: statusColors.color,
594
- bottom: 0,
595
- content: '""',
596
- display: "block",
597
- left: 0,
598
- position: "absolute",
599
- top: 0,
600
- width: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacing2Xs
601
- }
602
- });
603
- },
604
- skeleton: /*#__PURE__*/ (0, $ej4sI$emotion.css)({
605
- display: "inline-flex",
606
- border: `1px solid ${(0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).gray300}`,
607
- borderTopRightRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
608
- borderBottomRightRadius: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).borderRadiusMedium,
609
- padding: (0, ($parcel$interopDefault($ej4sI$contentfulf36tokens))).spacingXs
610
- })
611
- };
612
- };
613
-
614
-
615
-
616
- const $ce99b3784504d625$export$94c16395f9ec3265 = ({ actions: actions , className: className , children: children , status: status , title: title , isLoading: isLoading , testId: testId = "cf-ui-inline-entry-card" , ...otherProps })=>{
617
- const styles = (0, $1c0682cd2721a9f0$export$ccfc6dbdba6183be)();
618
- const header = /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $5b97eda51fdfde91$export$9b6a647253f61c5f), {
619
- buttonProps: {
620
- className: styles.actions
621
- }
622
- }, actions);
623
- if (isLoading) return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).Container, {
624
- className: styles.skeleton,
625
- svgHeight: "1.25rem",
626
- svgWidth: "6rem"
627
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36skeleton.Skeleton).BodyText, {
628
- numberOfLines: 1
629
- }));
630
- return /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36tooltip.Tooltip), {
631
- placement: "bottom",
632
- content: title
633
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $7fa2d152b3057b6a$export$ffd8d1a491a618f2), {
634
- ...otherProps,
635
- className: (0, $ej4sI$emotion.cx)(styles.root({
636
- status: status
637
- }), className),
638
- header: header,
639
- testId: testId
640
- }, children || /*#__PURE__*/ (0, ($parcel$interopDefault($ej4sI$react))).createElement((0, $ej4sI$contentfulf36typography.Text), null, title)));
641
- };
642
-
643
-
644
-
645
-
646
-
647
- //# sourceMappingURL=main.js.map