@contentful/f36-entity-list 4.0.1-beta.2550 → 4.0.1-beta.2595

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.
Files changed (7) hide show
  1. package/dist/main.js +135 -85
  2. package/dist/main.js.map +1 -1
  3. package/dist/module.js +118 -68
  4. package/dist/module.js.map +1 -1
  5. package/dist/types.d.ts +6 -1
  6. package/dist/types.d.ts.map +1 -1
  7. package/package.json +12 -12
package/dist/main.js CHANGED
@@ -1,3 +1,4 @@
1
+ var $hadoL$reactjsxruntime = require("react/jsx-runtime");
1
2
  var $hadoL$emotion = require("emotion");
2
3
  var $hadoL$react = require("react");
3
4
  var $hadoL$contentfulf36tokens = require("@contentful/f36-tokens");
@@ -24,15 +25,16 @@ $parcel$export(module.exports, "EntityListItem", () => $3f4d63406b2f6561$export$
24
25
 
25
26
 
26
27
 
28
+
27
29
  const $e3aba86fc342822d$export$2b0a239870ba448d = ()=>({
28
30
  root: /*#__PURE__*/ $hadoL$emotion.css({
29
31
  display: 'block',
30
32
  listStyle: 'none',
31
33
  margin: 0,
32
34
  padding: 0,
33
- border: `1px solid ${$parcel$interopDefault($hadoL$contentfulf36tokens).gray200}`,
35
+ border: `1px solid ${($parcel$interopDefault($hadoL$contentfulf36tokens)).gray200}`,
34
36
  borderBottom: 'none',
35
- borderRadius: $parcel$interopDefault($hadoL$contentfulf36tokens).borderRadiusMedium,
37
+ borderRadius: ($parcel$interopDefault($hadoL$contentfulf36tokens)).borderRadiusMedium,
36
38
  overflow: 'hidden'
37
39
  })
38
40
  })
@@ -41,14 +43,16 @@ const $e3aba86fc342822d$export$2b0a239870ba448d = ()=>({
41
43
 
42
44
  function $42fa390001ac865a$var$_EntityList(props, ref) {
43
45
  const styles = $e3aba86fc342822d$export$2b0a239870ba448d();
44
- return(/*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("ul", {
46
+ return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsx("ul", {
45
47
  "data-test-id": props.testId || 'cf-ui-entity-list',
46
48
  ref: ref,
47
49
  className: $hadoL$emotion.cx(styles.root, props.className),
48
- style: props.style
49
- }, props.children));
50
+ style: props.style,
51
+ children: props.children
52
+ }));
50
53
  }
51
- const $42fa390001ac865a$export$8bb466c13870163e = /*#__PURE__*/ $parcel$interopDefault($hadoL$react).forwardRef($42fa390001ac865a$var$_EntityList);
54
+ const $42fa390001ac865a$export$8bb466c13870163e = /*#__PURE__*/ ($parcel$interopDefault($hadoL$react)).forwardRef($42fa390001ac865a$var$_EntityList);
55
+
52
56
 
53
57
 
54
58
 
@@ -65,17 +69,17 @@ const $42fa390001ac865a$export$8bb466c13870163e = /*#__PURE__*/ $parcel$interopD
65
69
  const $07bceb135ccb0944$export$3bb342229d68a121 = ()=>({
66
70
  root: (props)=>/*#__PURE__*/ $hadoL$emotion.css({
67
71
  display: 'flex',
68
- boxShadow: `inset 0 -1px 0 ${$parcel$interopDefault($hadoL$contentfulf36tokens).gray200}`,
72
+ boxShadow: `inset 0 -1px 0 ${($parcel$interopDefault($hadoL$contentfulf36tokens)).gray200}`,
69
73
  position: 'relative',
70
- transition: `${$parcel$interopDefault($hadoL$contentfulf36tokens).transitionDurationShort} ${$parcel$interopDefault($hadoL$contentfulf36tokens).transitionEasingDefault}`,
74
+ transition: `${($parcel$interopDefault($hadoL$contentfulf36tokens)).transitionDurationShort} ${($parcel$interopDefault($hadoL$contentfulf36tokens)).transitionEasingDefault}`,
71
75
  transitionProperty: 'box-shadow, background-color',
72
- backgroundColor: $parcel$interopDefault($hadoL$contentfulf36tokens).colorWhite,
76
+ backgroundColor: ($parcel$interopDefault($hadoL$contentfulf36tokens)).colorWhite,
73
77
  ...props.isDragActive ? {
74
- boxShadow: $parcel$interopDefault($hadoL$contentfulf36tokens).boxShadowHeavy
78
+ boxShadow: ($parcel$interopDefault($hadoL$contentfulf36tokens)).boxShadowHeavy
75
79
  } : {
76
80
  },
77
81
  '&:hover': {
78
- backgroundColor: $parcel$interopDefault($hadoL$contentfulf36tokens).gray100
82
+ backgroundColor: ($parcel$interopDefault($hadoL$contentfulf36tokens)).gray100
79
83
  }
80
84
  })
81
85
  ,
@@ -83,8 +87,8 @@ const $07bceb135ccb0944$export$3bb342229d68a121 = ()=>({
83
87
  display: 'flex',
84
88
  textDecoration: 'none',
85
89
  width: '100%',
86
- minHeight: $parcel$interopDefault($hadoL$contentfulf36tokens).spacing3Xl,
87
- padding: $parcel$interopDefault($hadoL$contentfulf36tokens).spacingXs,
90
+ minHeight: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacing3Xl,
91
+ padding: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacingXs,
88
92
  border: 'none',
89
93
  background: 'none',
90
94
  textAlign: 'left'
@@ -98,21 +102,21 @@ const $07bceb135ccb0944$export$3bb342229d68a121 = ()=>({
98
102
  flexShrink: 0,
99
103
  alignItems: 'center',
100
104
  justifyContent: 'center',
101
- backgroundColor: $parcel$interopDefault($hadoL$contentfulf36tokens).gray200,
102
- width: $parcel$interopDefault($hadoL$contentfulf36tokens).spacing2Xl,
103
- height: $parcel$interopDefault($hadoL$contentfulf36tokens).spacing2Xl,
105
+ backgroundColor: ($parcel$interopDefault($hadoL$contentfulf36tokens)).gray200,
106
+ width: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacing2Xl,
107
+ height: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacing2Xl,
104
108
  margin: '0',
105
- marginRight: $parcel$interopDefault($hadoL$contentfulf36tokens).spacingXs
109
+ marginRight: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacingXs
106
110
  }),
107
111
  thumbnail: /*#__PURE__*/ $hadoL$emotion.css({
108
112
  name: "12qah06",
109
113
  styles: "display:block;width:100%;height:100%;object-fit:cover;"
110
114
  }),
111
115
  contentType: /*#__PURE__*/ $hadoL$emotion.css({
112
- marginLeft: $parcel$interopDefault($hadoL$contentfulf36tokens).spacingXs
116
+ marginLeft: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacingXs
113
117
  }),
114
118
  description: /*#__PURE__*/ $hadoL$emotion.css({
115
- marginTop: $parcel$interopDefault($hadoL$contentfulf36tokens).spacing2Xs
119
+ marginTop: ($parcel$interopDefault($hadoL$contentfulf36tokens)).spacing2Xs
116
120
  }),
117
121
  meta: /*#__PURE__*/ $hadoL$emotion.css({
118
122
  name: "1n0gfod",
@@ -121,7 +125,7 @@ const $07bceb135ccb0944$export$3bb342229d68a121 = ()=>({
121
125
  dragHandle: /*#__PURE__*/ $hadoL$emotion.css({
122
126
  borderBottomLeftRadius: '0',
123
127
  borderTopLeftRadius: '0',
124
- boxShadow: `inset 0 -1px 0 ${$parcel$interopDefault($hadoL$contentfulf36tokens).gray200}`
128
+ boxShadow: `inset 0 -1px 0 ${($parcel$interopDefault($hadoL$contentfulf36tokens)).gray200}`
125
129
  }),
126
130
  menuTrigger: /*#__PURE__*/ $hadoL$emotion.css({
127
131
  name: "c1v07n",
@@ -142,7 +146,7 @@ function $3f4d63406b2f6561$export$65b9c70c5f42a158({ className: className , test
142
146
  const styles = $07bceb135ccb0944$export$3bb342229d68a121();
143
147
  const renderCardDragHandle = ()=>{
144
148
  if (cardDragHandleComponent) return cardDragHandleComponent;
145
- else if (withDragHandle) return(/*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36draghandle.DragHandle, {
149
+ else if (withDragHandle) return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36draghandle.DragHandle, {
146
150
  className: styles.dragHandle,
147
151
  isActive: isDragActive,
148
152
  label: "Reorder entry",
@@ -154,74 +158,120 @@ function $3f4d63406b2f6561$export$65b9c70c5f42a158({ className: className , test
154
158
  // archived assets will not be available on the CDN, resulting in a broken image src
155
159
  const isArchived = status === 'archived';
156
160
  const asIcon = isArchived || !thumbnailUrl;
157
- return(/*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("li", {
161
+ return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsxs("li", {
158
162
  ...otherProps,
159
163
  className: $hadoL$emotion.cx(styles.root({
160
164
  isDragActive: isDragActive
161
165
  }), className),
162
- "data-test-id": testId
163
- }, renderCardDragHandle(), isLoading ? /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("article", {
164
- className: styles.card
165
- }, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36skeleton.SkeletonContainer, {
166
- clipId: "f36-entity-list-item-skeleton"
167
- }, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36skeleton.SkeletonImage, {
168
- height: 46,
169
- width: 46
170
- }), /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36skeleton.SkeletonBodyText, {
171
- numberOfLines: 2,
172
- lineHeight: 18,
173
- offsetLeft: 54
174
- }))) : /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement(Element, {
175
- className: styles.card,
176
- onClick: onClick,
177
- href: href,
178
- type: Element === 'button' ? 'button' : undefined,
179
- target: href ? '_blank' : undefined
180
- }, withThumbnail && /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("figure", {
181
- className: styles.media
182
- }, asIcon ? /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36icon.Icon, {
183
- as: $3f4d63406b2f6561$var$ICON_MAP[entityType.toLowerCase()],
184
- variant: "muted"
185
- }) : /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("img", {
186
- src: thumbnailUrl,
187
- className: styles.thumbnail,
188
- alt: thumbnailAltText
189
- })), /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement("div", {
190
- className: styles.content
191
- }, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36core.Flex, null, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36typography.Text, {
192
- as: "h1",
193
- lineHeight: "lineHeightM",
194
- fontColor: "gray900",
195
- fontWeight: "fontWeightDemiBold",
196
- isTruncated: true
197
- }, title), contentType && /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36typography.Text, {
198
- as: "span",
199
- lineHeight: "lineHeightM",
200
- fontColor: "gray600",
201
- className: styles.contentType,
202
- isTruncated: true
203
- }, "(", contentType, ")")), description && /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36typography.Text, {
204
- as: "p",
205
- lineHeight: "lineHeightM",
206
- fontColor: "gray900",
207
- isTruncated: true,
208
- className: styles.description
209
- }, description)), /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36core.Flex, {
210
- className: styles.meta,
211
- alignItems: "flex-start",
212
- paddingLeft: "spacingXs"
213
- }, status && /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36core.Box, {
214
- marginRight: actions ? 'spacingXs' : 'none'
215
- }, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36badge.EntityStatusBadge, {
216
- entityStatus: status
217
- })), actions && /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36menu.Menu, null, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36menu.Menu.Trigger, null, /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36button.Button, {
218
- isDisabled: isActionsDisabled,
219
- startIcon: /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36icons.MoreHorizontalIcon, null),
220
- variant: "transparent",
221
- "aria-label": "Actions",
222
- size: "small",
223
- className: styles.menuTrigger
224
- })), /*#__PURE__*/ $parcel$interopDefault($hadoL$react).createElement($hadoL$contentfulf36menu.Menu.List, null, actions))))));
166
+ "data-test-id": testId,
167
+ children: [
168
+ renderCardDragHandle(),
169
+ isLoading ? /*#__PURE__*/ $hadoL$reactjsxruntime.jsx("article", {
170
+ className: styles.card,
171
+ children: /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs($hadoL$contentfulf36skeleton.SkeletonContainer, {
172
+ clipId: "f36-entity-list-item-skeleton",
173
+ children: [
174
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36skeleton.SkeletonImage, {
175
+ height: 46,
176
+ width: 46
177
+ }),
178
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36skeleton.SkeletonBodyText, {
179
+ numberOfLines: 2,
180
+ lineHeight: 18,
181
+ offsetLeft: 54
182
+ })
183
+ ]
184
+ })
185
+ }) : /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs(Element, {
186
+ className: styles.card,
187
+ onClick: onClick,
188
+ href: href,
189
+ type: Element === 'button' ? 'button' : undefined,
190
+ target: href ? '_blank' : undefined,
191
+ children: [
192
+ withThumbnail && /*#__PURE__*/ $hadoL$reactjsxruntime.jsx("figure", {
193
+ className: styles.media,
194
+ children: asIcon ? /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36icon.Icon, {
195
+ as: $3f4d63406b2f6561$var$ICON_MAP[entityType.toLowerCase()],
196
+ variant: "muted"
197
+ }) : /*#__PURE__*/ $hadoL$reactjsxruntime.jsx("img", {
198
+ src: thumbnailUrl,
199
+ className: styles.thumbnail,
200
+ alt: thumbnailAltText
201
+ })
202
+ }),
203
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs("div", {
204
+ className: styles.content,
205
+ children: [
206
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs($hadoL$contentfulf36core.Flex, {
207
+ children: [
208
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36typography.Text, {
209
+ as: "h3",
210
+ lineHeight: "lineHeightM",
211
+ fontColor: "gray900",
212
+ fontWeight: "fontWeightDemiBold",
213
+ isTruncated: true,
214
+ children: title
215
+ }),
216
+ contentType && /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs($hadoL$contentfulf36typography.Text, {
217
+ as: "span",
218
+ lineHeight: "lineHeightM",
219
+ fontColor: "gray600",
220
+ className: styles.contentType,
221
+ isTruncated: true,
222
+ children: [
223
+ "(",
224
+ contentType,
225
+ ")"
226
+ ]
227
+ })
228
+ ]
229
+ }),
230
+ description && /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36typography.Text, {
231
+ as: "p",
232
+ lineHeight: "lineHeightM",
233
+ fontColor: "gray900",
234
+ isTruncated: true,
235
+ className: styles.description,
236
+ children: description
237
+ })
238
+ ]
239
+ }),
240
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs($hadoL$contentfulf36core.Flex, {
241
+ className: styles.meta,
242
+ alignItems: "flex-start",
243
+ paddingLeft: "spacingXs",
244
+ children: [
245
+ status && /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36core.Box, {
246
+ marginRight: actions ? 'spacingXs' : 'none',
247
+ children: /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36badge.EntityStatusBadge, {
248
+ entityStatus: status
249
+ })
250
+ }),
251
+ actions && /*#__PURE__*/ $hadoL$reactjsxruntime.jsxs($hadoL$contentfulf36menu.Menu, {
252
+ children: [
253
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36menu.Menu.Trigger, {
254
+ children: /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36button.Button, {
255
+ isDisabled: isActionsDisabled,
256
+ startIcon: /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36icons.MoreHorizontalIcon, {
257
+ }),
258
+ variant: "transparent",
259
+ "aria-label": "Actions",
260
+ size: "small",
261
+ className: styles.menuTrigger
262
+ })
263
+ }),
264
+ /*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36menu.Menu.List, {
265
+ children: actions
266
+ })
267
+ ]
268
+ })
269
+ ]
270
+ })
271
+ ]
272
+ })
273
+ ]
274
+ }));
225
275
  }
226
276
 
227
277
 
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/entity-list/src/index.ts","packages/components/entity-list/src/CompoundEntityList.tsx","packages/components/entity-list/src/EntityList.tsx","packages/components/entity-list/src/EntityList.styles.ts","packages/components/entity-list/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/EntityListItem/EntityListItem.styles.ts"],"sourcesContent":["export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n","import { EntityList as OriginalEntityList } from './EntityList';\nimport { EntityListItem } from './EntityListItem/EntityListItem';\n\ntype CompoundEntityList = typeof OriginalEntityList & {\n Item: typeof EntityListItem;\n};\n\nexport const EntityList = OriginalEntityList as CompoundEntityList;\nEntityList.Item = EntityListItem;\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CommonProps } from '@contentful/f36-core';\n\nimport { getEntityListStyles } from './EntityList.styles';\n\nexport interface EntityListProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nfunction _EntityList(props: EntityListProps, ref: React.Ref<HTMLUListElement>) {\n const styles = getEntityListStyles();\n\n return (\n <ul\n data-test-id={props.testId || 'cf-ui-entity-list'}\n ref={ref}\n className={cx(styles.root, props.className)}\n style={props.style}\n >\n {props.children}\n </ul>\n );\n}\n\nexport const EntityList = React.forwardRef(_EntityList);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getEntityListStyles = () => ({\n root: css({\n display: 'block',\n listStyle: 'none',\n margin: 0,\n padding: 0,\n border: `1px solid ${tokens.gray200}`,\n borderBottom: 'none',\n borderRadius: tokens.borderRadiusMedium,\n overflow: 'hidden',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { MouseEventHandler } from 'react';\n\nimport { EntityStatusBadge } from '@contentful/f36-badge';\nimport type {\n CommonProps,\n EntityStatus,\n PickUnion,\n} from '@contentful/f36-core';\nimport {\n AssetIcon,\n EntryIcon,\n ReleaseIcon,\n MoreHorizontalIcon,\n} from '@contentful/f36-icons';\nimport { Icon } from '@contentful/f36-icon';\nimport { Text } from '@contentful/f36-typography';\nimport { DragHandle } from '@contentful/f36-drag-handle';\nimport type { DragHandleProps } from '@contentful/f36-drag-handle';\nimport { Button } from '@contentful/f36-button';\nimport { Menu } from '@contentful/f36-menu';\n\nimport { getEntityListItemStyles } from './EntityListItem.styles';\n\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex, Box } from '@contentful/f36-core';\n\ntype EntityListItemStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'draft' | 'published'\n>;\n\nconst ICON_MAP = {\n asset: AssetIcon,\n entry: EntryIcon,\n release: ReleaseIcon,\n};\n\nexport interface EntityListItemProps extends CommonProps {\n /**\n * The title of the entity\n */\n title: string;\n /**\n * The description of the entity\n */\n description?: string;\n /**\n * The content type of the entity\n */\n contentType?: string;\n /**\n * The publish status of the entry\n */\n status?: EntityListItemStatus;\n /**\n * A boolean used to render the Thumbnail or not\n */\n withThumbnail?: boolean;\n /**\n * The URL of the entity's preview thumbnail. Use 46px x 46px images for best results\n */\n thumbnailUrl?: string;\n /**\n * The alt text for the thumbnail\n */\n thumbnailAltText?: string;\n /**\n * Menu elements rendered as actions in Menu\n */\n actions?: React.ReactNodeArray;\n /**\n * Renders a drag handle for the component for use in drag and drop contexts\n */\n withDragHandle?: boolean;\n /**\n * Applies styling for when the component is actively being dragged by the user\n */\n isDragActive?: boolean;\n /**\n * Prop to pass a custom CardDragHandle component to for use in drag and drop contexts\n */\n cardDragHandleComponent?: React.ReactNode;\n /**\n * Props to pass down to the default CardDragHandle component (does not work with cardDragHandleComponent prop)\n */\n cardDragHandleProps?: Partial<DragHandleProps>;\n /**\n * An entity can either be an Entry, an Asset or a Release. This prop will apply styling based on if the entity is an asset, a release or an entry\n *\n * Note: 'entry' and 'asset' are @deprecated but supported in v1.x for backwards compatibility\n */\n entityType?: 'Entry' | 'Asset' | 'entry' | 'asset' | 'Release';\n /**\n * Loading state for the component - when true will display loading feedback to the user\n */\n isLoading?: boolean;\n /**\n * The action to be performed on click of the EntryCard\n */\n onClick?: MouseEventHandler;\n /**\n * The href for the component. Will render the card as an `a` element for native browser link handling\n */\n href?: string;\n /**\n * A boolean used to disable the CardActions\n */\n isActionsDisabled?: boolean;\n}\n\nexport function EntityListItem({\n className,\n testId = 'cf-ui-entity-list-item',\n title,\n description,\n contentType,\n entityType = 'entry',\n withThumbnail = true,\n thumbnailUrl,\n thumbnailAltText,\n status,\n actions,\n withDragHandle,\n isDragActive,\n isLoading,\n onClick,\n href,\n cardDragHandleProps,\n cardDragHandleComponent,\n isActionsDisabled = false,\n ...otherProps\n}: EntityListItemProps): React.ReactElement {\n const styles = getEntityListItemStyles();\n\n const renderCardDragHandle = () => {\n if (cardDragHandleComponent) {\n return cardDragHandleComponent;\n } else if (withDragHandle) {\n return (\n <DragHandle\n className={styles.dragHandle}\n isActive={isDragActive}\n label=\"Reorder entry\"\n {...cardDragHandleProps}\n />\n );\n }\n };\n\n let Element: React.ElementType = 'article';\n if (href || onClick) {\n Element = href ? 'a' : 'button';\n }\n\n // archived assets will not be available on the CDN, resulting in a broken image src\n const isArchived = status === 'archived';\n const asIcon = isArchived || !thumbnailUrl;\n\n return (\n <li\n {...otherProps}\n className={cx(styles.root({ isDragActive }), className)}\n data-test-id={testId}\n >\n {renderCardDragHandle()}\n {isLoading ? (\n <article className={styles.card}>\n <SkeletonContainer clipId=\"f36-entity-list-item-skeleton\">\n <SkeletonImage height={46} width={46} />\n <SkeletonBodyText\n numberOfLines={2}\n lineHeight={18}\n offsetLeft={54}\n />\n </SkeletonContainer>\n </article>\n ) : (\n <Element\n className={styles.card}\n onClick={onClick}\n href={href}\n type={Element === 'button' ? 'button' : undefined}\n target={href ? '_blank' : undefined}\n >\n {withThumbnail && (\n <figure className={styles.media}>\n {asIcon ? (\n <Icon as={ICON_MAP[entityType.toLowerCase()]} variant=\"muted\" />\n ) : (\n <img\n src={thumbnailUrl}\n className={styles.thumbnail}\n alt={thumbnailAltText}\n />\n )}\n </figure>\n )}\n\n <div className={styles.content}>\n <Flex>\n <Text\n as=\"h1\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n fontWeight=\"fontWeightDemiBold\"\n isTruncated\n >\n {title}\n </Text>\n\n {contentType && (\n <Text\n as=\"span\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray600\"\n className={styles.contentType}\n isTruncated\n >\n ({contentType})\n </Text>\n )}\n </Flex>\n {description && (\n <Text\n as=\"p\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n isTruncated\n className={styles.description}\n >\n {description}\n </Text>\n )}\n </div>\n\n <Flex\n className={styles.meta}\n alignItems=\"flex-start\"\n paddingLeft=\"spacingXs\"\n >\n {status && (\n <Box marginRight={actions ? 'spacingXs' : 'none'}>\n <EntityStatusBadge entityStatus={status} />\n </Box>\n )}\n\n {actions && (\n <Menu>\n <Menu.Trigger>\n <Button\n isDisabled={isActionsDisabled}\n startIcon={<MoreHorizontalIcon />}\n variant=\"transparent\"\n aria-label=\"Actions\"\n size=\"small\"\n className={styles.menuTrigger}\n />\n </Menu.Trigger>\n <Menu.List>{actions}</Menu.List>\n </Menu>\n )}\n </Flex>\n </Element>\n )}\n </li>\n );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { EntityListItemProps } from './EntityListItem';\n\nexport const getEntityListItemStyles = () => ({\n root: (props: Pick<EntityListItemProps, 'isDragActive'>) =>\n css({\n display: 'flex',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n position: 'relative',\n transition: `${tokens.transitionDurationShort} ${tokens.transitionEasingDefault}`,\n transitionProperty: 'box-shadow, background-color',\n backgroundColor: tokens.colorWhite,\n ...(props.isDragActive\n ? {\n boxShadow: tokens.boxShadowHeavy,\n }\n : {}),\n\n '&:hover': {\n backgroundColor: tokens.gray100,\n },\n }),\n card: css({\n display: 'flex',\n textDecoration: 'none',\n width: '100%',\n minHeight: tokens.spacing3Xl,\n padding: tokens.spacingXs,\n border: 'none',\n background: 'none',\n textAlign: 'left',\n }),\n content: css({\n flexGrow: 1,\n minWidth: 0,\n }),\n media: css({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: tokens.gray200,\n width: tokens.spacing2Xl,\n height: tokens.spacing2Xl,\n margin: '0',\n marginRight: tokens.spacingXs,\n }),\n thumbnail: css({\n display: 'block',\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n }),\n contentType: css({\n marginLeft: tokens.spacingXs,\n }),\n description: css({\n marginTop: tokens.spacing2Xs,\n }),\n meta: css({\n marginLeft: 'auto',\n flexShrink: 0,\n }),\n dragHandle: css({\n borderBottomLeftRadius: '0',\n borderTopLeftRadius: '0',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n }),\n menuTrigger: css({\n padding: '0 0.125rem',\n minHeight: '1.5rem',\n }),\n});\n"],"names":["EntityList","EntityListProps","EntityListItem","EntityListItemProps","OriginalEntityList","CompoundEntityList","Item","React","CommonProps","getEntityListStyles","children","ReactNode","_EntityList","props","ref","Ref","HTMLUListElement","styles","testId","root","className","style","forwardRef","tokens","display","listStyle","margin","padding","border","gray200","borderBottom","borderRadius","borderRadiusMedium","overflow","MouseEventHandler","EntityStatusBadge","EntityStatus","PickUnion","AssetIcon","EntryIcon","ReleaseIcon","MoreHorizontalIcon","Icon","Text","DragHandle","DragHandleProps","Button","Menu","getEntityListItemStyles","SkeletonBodyText","SkeletonContainer","SkeletonImage","Flex","Box","EntityListItemStatus","ICON_MAP","asset","entry","release","title","description","contentType","status","withThumbnail","thumbnailUrl","thumbnailAltText","actions","ReactNodeArray","withDragHandle","isDragActive","cardDragHandleComponent","cardDragHandleProps","Partial","entityType","isLoading","onClick","href","isActionsDisabled","otherProps","ReactElement","renderCardDragHandle","dragHandle","Element","ElementType","isArchived","asIcon","card","undefined","media","toLowerCase","thumbnail","content","meta","menuTrigger","Pick","boxShadow","position","transition","transitionDurationShort","transitionEasingDefault","transitionProperty","backgroundColor","colorWhite","boxShadowHeavy","gray100","textDecoration","width","minHeight","spacing3Xl","spacingXs","background","textAlign","flexShrink","alignItems","justifyContent","spacing2Xl","height","marginRight","marginLeft","marginTop","spacing2Xs","borderBottomLeftRadius","borderTopLeftRadius"],"version":3,"file":"main.js.map"}
1
+ {"mappings":"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","sources":["packages/components/entity-list/src/index.ts","packages/components/entity-list/src/CompoundEntityList.tsx","packages/components/entity-list/src/EntityList.tsx","packages/components/entity-list/src/EntityList.styles.ts","packages/components/entity-list/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/EntityListItem/EntityListItem.styles.ts"],"sourcesContent":["export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n","import { EntityList as OriginalEntityList } from './EntityList';\nimport { EntityListItem } from './EntityListItem/EntityListItem';\n\ntype CompoundEntityList = typeof OriginalEntityList & {\n Item: typeof EntityListItem;\n};\n\nexport const EntityList = OriginalEntityList as CompoundEntityList;\nEntityList.Item = EntityListItem;\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CommonProps, ExpandProps } from '@contentful/f36-core';\n\nimport { getEntityListStyles } from './EntityList.styles';\n\nexport interface EntityListProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nfunction _EntityList(\n props: ExpandProps<EntityListProps>,\n ref: React.Ref<HTMLUListElement>,\n) {\n const styles = getEntityListStyles();\n\n return (\n <ul\n data-test-id={props.testId || 'cf-ui-entity-list'}\n ref={ref}\n className={cx(styles.root, props.className)}\n style={props.style}\n >\n {props.children}\n </ul>\n );\n}\n\nexport const EntityList = React.forwardRef(_EntityList);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getEntityListStyles = () => ({\n root: css({\n display: 'block',\n listStyle: 'none',\n margin: 0,\n padding: 0,\n border: `1px solid ${tokens.gray200}`,\n borderBottom: 'none',\n borderRadius: tokens.borderRadiusMedium,\n overflow: 'hidden',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { MouseEventHandler } from 'react';\n\nimport { EntityStatusBadge } from '@contentful/f36-badge';\nimport type {\n CommonProps,\n EntityStatus,\n PickUnion,\n} from '@contentful/f36-core';\nimport {\n AssetIcon,\n EntryIcon,\n ReleaseIcon,\n MoreHorizontalIcon,\n} from '@contentful/f36-icons';\nimport { Icon } from '@contentful/f36-icon';\nimport { Text } from '@contentful/f36-typography';\nimport { DragHandle } from '@contentful/f36-drag-handle';\nimport type { DragHandleProps } from '@contentful/f36-drag-handle';\nimport { Button } from '@contentful/f36-button';\nimport { Menu } from '@contentful/f36-menu';\n\nimport { getEntityListItemStyles } from './EntityListItem.styles';\n\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex, Box } from '@contentful/f36-core';\n\ntype EntityListItemStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'draft' | 'published'\n>;\n\nconst ICON_MAP = {\n asset: AssetIcon,\n entry: EntryIcon,\n release: ReleaseIcon,\n};\n\nexport interface EntityListItemProps extends CommonProps {\n /**\n * The title of the entity\n */\n title: string;\n /**\n * The description of the entity\n */\n description?: string;\n /**\n * The content type of the entity\n */\n contentType?: string;\n /**\n * The publish status of the entry\n */\n status?: EntityListItemStatus;\n /**\n * A boolean used to render the Thumbnail or not\n */\n withThumbnail?: boolean;\n /**\n * The URL of the entity's preview thumbnail. Use 46px x 46px images for best results\n */\n thumbnailUrl?: string;\n /**\n * The alt text for the thumbnail\n */\n thumbnailAltText?: string;\n /**\n * Menu elements rendered as actions in Menu\n */\n actions?: React.ReactNodeArray;\n /**\n * Renders a drag handle for the component for use in drag and drop contexts\n */\n withDragHandle?: boolean;\n /**\n * Applies styling for when the component is actively being dragged by the user\n */\n isDragActive?: boolean;\n /**\n * Prop to pass a custom CardDragHandle component to for use in drag and drop contexts\n */\n cardDragHandleComponent?: React.ReactNode;\n /**\n * Props to pass down to the default CardDragHandle component (does not work with cardDragHandleComponent prop)\n */\n cardDragHandleProps?: Partial<DragHandleProps>;\n /**\n * An entity can either be an Entry, an Asset or a Release. This prop will apply styling based on if the entity is an asset, a release or an entry\n *\n * Note: 'entry' and 'asset' are @deprecated but supported in v1.x for backwards compatibility\n */\n entityType?: 'Entry' | 'Asset' | 'entry' | 'asset' | 'Release';\n /**\n * Loading state for the component - when true will display loading feedback to the user\n */\n isLoading?: boolean;\n /**\n * The action to be performed on click of the EntryCard\n */\n onClick?: MouseEventHandler;\n /**\n * The href for the component. Will render the card as an `a` element for native browser link handling\n */\n href?: string;\n /**\n * A boolean used to disable the CardActions\n */\n isActionsDisabled?: boolean;\n}\n\nexport function EntityListItem({\n className,\n testId = 'cf-ui-entity-list-item',\n title,\n description,\n contentType,\n entityType = 'entry',\n withThumbnail = true,\n thumbnailUrl,\n thumbnailAltText,\n status,\n actions,\n withDragHandle,\n isDragActive,\n isLoading,\n onClick,\n href,\n cardDragHandleProps,\n cardDragHandleComponent,\n isActionsDisabled = false,\n ...otherProps\n}: EntityListItemProps): React.ReactElement {\n const styles = getEntityListItemStyles();\n\n const renderCardDragHandle = () => {\n if (cardDragHandleComponent) {\n return cardDragHandleComponent;\n } else if (withDragHandle) {\n return (\n <DragHandle\n className={styles.dragHandle}\n isActive={isDragActive}\n label=\"Reorder entry\"\n {...cardDragHandleProps}\n />\n );\n }\n };\n\n let Element: React.ElementType = 'article';\n if (href || onClick) {\n Element = href ? 'a' : 'button';\n }\n\n // archived assets will not be available on the CDN, resulting in a broken image src\n const isArchived = status === 'archived';\n const asIcon = isArchived || !thumbnailUrl;\n\n return (\n <li\n {...otherProps}\n className={cx(styles.root({ isDragActive }), className)}\n data-test-id={testId}\n >\n {renderCardDragHandle()}\n {isLoading ? (\n <article className={styles.card}>\n <SkeletonContainer clipId=\"f36-entity-list-item-skeleton\">\n <SkeletonImage height={46} width={46} />\n <SkeletonBodyText\n numberOfLines={2}\n lineHeight={18}\n offsetLeft={54}\n />\n </SkeletonContainer>\n </article>\n ) : (\n <Element\n className={styles.card}\n onClick={onClick}\n href={href}\n type={Element === 'button' ? 'button' : undefined}\n target={href ? '_blank' : undefined}\n >\n {withThumbnail && (\n <figure className={styles.media}>\n {asIcon ? (\n <Icon as={ICON_MAP[entityType.toLowerCase()]} variant=\"muted\" />\n ) : (\n <img\n src={thumbnailUrl}\n className={styles.thumbnail}\n alt={thumbnailAltText}\n />\n )}\n </figure>\n )}\n\n <div className={styles.content}>\n <Flex>\n <Text\n as=\"h3\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n fontWeight=\"fontWeightDemiBold\"\n isTruncated\n >\n {title}\n </Text>\n\n {contentType && (\n <Text\n as=\"span\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray600\"\n className={styles.contentType}\n isTruncated\n >\n ({contentType})\n </Text>\n )}\n </Flex>\n {description && (\n <Text\n as=\"p\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n isTruncated\n className={styles.description}\n >\n {description}\n </Text>\n )}\n </div>\n\n <Flex\n className={styles.meta}\n alignItems=\"flex-start\"\n paddingLeft=\"spacingXs\"\n >\n {status && (\n <Box marginRight={actions ? 'spacingXs' : 'none'}>\n <EntityStatusBadge entityStatus={status} />\n </Box>\n )}\n\n {actions && (\n <Menu>\n <Menu.Trigger>\n <Button\n isDisabled={isActionsDisabled}\n startIcon={<MoreHorizontalIcon />}\n variant=\"transparent\"\n aria-label=\"Actions\"\n size=\"small\"\n className={styles.menuTrigger}\n />\n </Menu.Trigger>\n <Menu.List>{actions}</Menu.List>\n </Menu>\n )}\n </Flex>\n </Element>\n )}\n </li>\n );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { EntityListItemProps } from './EntityListItem';\n\nexport const getEntityListItemStyles = () => ({\n root: (props: Pick<EntityListItemProps, 'isDragActive'>) =>\n css({\n display: 'flex',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n position: 'relative',\n transition: `${tokens.transitionDurationShort} ${tokens.transitionEasingDefault}`,\n transitionProperty: 'box-shadow, background-color',\n backgroundColor: tokens.colorWhite,\n ...(props.isDragActive\n ? {\n boxShadow: tokens.boxShadowHeavy,\n }\n : {}),\n\n '&:hover': {\n backgroundColor: tokens.gray100,\n },\n }),\n card: css({\n display: 'flex',\n textDecoration: 'none',\n width: '100%',\n minHeight: tokens.spacing3Xl,\n padding: tokens.spacingXs,\n border: 'none',\n background: 'none',\n textAlign: 'left',\n }),\n content: css({\n flexGrow: 1,\n minWidth: 0,\n }),\n media: css({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: tokens.gray200,\n width: tokens.spacing2Xl,\n height: tokens.spacing2Xl,\n margin: '0',\n marginRight: tokens.spacingXs,\n }),\n thumbnail: css({\n display: 'block',\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n }),\n contentType: css({\n marginLeft: tokens.spacingXs,\n }),\n description: css({\n marginTop: tokens.spacing2Xs,\n }),\n meta: css({\n marginLeft: 'auto',\n flexShrink: 0,\n }),\n dragHandle: css({\n borderBottomLeftRadius: '0',\n borderTopLeftRadius: '0',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n }),\n menuTrigger: css({\n padding: '0 0.125rem',\n minHeight: '1.5rem',\n }),\n});\n"],"names":["EntityList","EntityListProps","EntityListItem","EntityListItemProps","OriginalEntityList","CompoundEntityList","Item","React","CommonProps","ExpandProps","getEntityListStyles","children","ReactNode","_EntityList","props","ref","Ref","HTMLUListElement","styles","testId","root","className","style","forwardRef","tokens","display","listStyle","margin","padding","border","gray200","borderBottom","borderRadius","borderRadiusMedium","overflow","MouseEventHandler","EntityStatusBadge","EntityStatus","PickUnion","AssetIcon","EntryIcon","ReleaseIcon","MoreHorizontalIcon","Icon","Text","DragHandle","DragHandleProps","Button","Menu","getEntityListItemStyles","SkeletonBodyText","SkeletonContainer","SkeletonImage","Flex","Box","EntityListItemStatus","ICON_MAP","asset","entry","release","title","description","contentType","status","withThumbnail","thumbnailUrl","thumbnailAltText","actions","ReactNodeArray","withDragHandle","isDragActive","cardDragHandleComponent","cardDragHandleProps","Partial","entityType","isLoading","onClick","href","isActionsDisabled","otherProps","ReactElement","renderCardDragHandle","dragHandle","Element","ElementType","isArchived","asIcon","card","undefined","media","toLowerCase","thumbnail","content","meta","menuTrigger","Pick","boxShadow","position","transition","transitionDurationShort","transitionEasingDefault","transitionProperty","backgroundColor","colorWhite","boxShadowHeavy","gray100","textDecoration","width","minHeight","spacing3Xl","spacingXs","background","textAlign","flexShrink","alignItems","justifyContent","spacing2Xl","height","marginRight","marginLeft","marginTop","spacing2Xs","borderBottomLeftRadius","borderTopLeftRadius"],"version":3,"file":"main.js.map"}
package/dist/module.js CHANGED
@@ -1,3 +1,4 @@
1
+ import {jsx as $qeOF0$jsx, jsxs as $qeOF0$jsxs} from "react/jsx-runtime";
1
2
  import {cx as $qeOF0$cx, css as $qeOF0$css} from "emotion";
2
3
  import $qeOF0$react from "react";
3
4
  import $qeOF0$contentfulf36tokens from "@contentful/f36-tokens";
@@ -15,6 +16,7 @@ import {Flex as $qeOF0$Flex, Box as $qeOF0$Box} from "@contentful/f36-core";
15
16
 
16
17
 
17
18
 
19
+
18
20
  const $32a4ed8cc58cbd41$export$2b0a239870ba448d = ()=>({
19
21
  root: /*#__PURE__*/ $qeOF0$css({
20
22
  display: 'block',
@@ -32,12 +34,13 @@ const $32a4ed8cc58cbd41$export$2b0a239870ba448d = ()=>({
32
34
 
33
35
  function $3382b9e83b849fa7$var$_EntityList(props, ref) {
34
36
  const styles = $32a4ed8cc58cbd41$export$2b0a239870ba448d();
35
- return(/*#__PURE__*/ $qeOF0$react.createElement("ul", {
37
+ return(/*#__PURE__*/ $qeOF0$jsx("ul", {
36
38
  "data-test-id": props.testId || 'cf-ui-entity-list',
37
39
  ref: ref,
38
40
  className: $qeOF0$cx(styles.root, props.className),
39
- style: props.style
40
- }, props.children));
41
+ style: props.style,
42
+ children: props.children
43
+ }));
41
44
  }
42
45
  const $3382b9e83b849fa7$export$8bb466c13870163e = /*#__PURE__*/ $qeOF0$react.forwardRef($3382b9e83b849fa7$var$_EntityList);
43
46
 
@@ -53,6 +56,7 @@ const $3382b9e83b849fa7$export$8bb466c13870163e = /*#__PURE__*/ $qeOF0$react.for
53
56
 
54
57
 
55
58
 
59
+
56
60
  const $7cd3138fd5d2efdd$export$3bb342229d68a121 = ()=>({
57
61
  root: (props)=>/*#__PURE__*/ $qeOF0$css({
58
62
  display: 'flex',
@@ -133,7 +137,7 @@ function $b8d6b7ec5fedd0fe$export$65b9c70c5f42a158({ className: className , test
133
137
  const styles = $7cd3138fd5d2efdd$export$3bb342229d68a121();
134
138
  const renderCardDragHandle = ()=>{
135
139
  if (cardDragHandleComponent) return cardDragHandleComponent;
136
- else if (withDragHandle) return(/*#__PURE__*/ $qeOF0$react.createElement($qeOF0$DragHandle, {
140
+ else if (withDragHandle) return(/*#__PURE__*/ $qeOF0$jsx($qeOF0$DragHandle, {
137
141
  className: styles.dragHandle,
138
142
  isActive: isDragActive,
139
143
  label: "Reorder entry",
@@ -145,74 +149,120 @@ function $b8d6b7ec5fedd0fe$export$65b9c70c5f42a158({ className: className , test
145
149
  // archived assets will not be available on the CDN, resulting in a broken image src
146
150
  const isArchived = status === 'archived';
147
151
  const asIcon = isArchived || !thumbnailUrl;
148
- return(/*#__PURE__*/ $qeOF0$react.createElement("li", {
152
+ return(/*#__PURE__*/ $qeOF0$jsxs("li", {
149
153
  ...otherProps,
150
154
  className: $qeOF0$cx(styles.root({
151
155
  isDragActive: isDragActive
152
156
  }), className),
153
- "data-test-id": testId
154
- }, renderCardDragHandle(), isLoading ? /*#__PURE__*/ $qeOF0$react.createElement("article", {
155
- className: styles.card
156
- }, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$SkeletonContainer, {
157
- clipId: "f36-entity-list-item-skeleton"
158
- }, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$SkeletonImage, {
159
- height: 46,
160
- width: 46
161
- }), /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$SkeletonBodyText, {
162
- numberOfLines: 2,
163
- lineHeight: 18,
164
- offsetLeft: 54
165
- }))) : /*#__PURE__*/ $qeOF0$react.createElement(Element, {
166
- className: styles.card,
167
- onClick: onClick,
168
- href: href,
169
- type: Element === 'button' ? 'button' : undefined,
170
- target: href ? '_blank' : undefined
171
- }, withThumbnail && /*#__PURE__*/ $qeOF0$react.createElement("figure", {
172
- className: styles.media
173
- }, asIcon ? /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Icon, {
174
- as: $b8d6b7ec5fedd0fe$var$ICON_MAP[entityType.toLowerCase()],
175
- variant: "muted"
176
- }) : /*#__PURE__*/ $qeOF0$react.createElement("img", {
177
- src: thumbnailUrl,
178
- className: styles.thumbnail,
179
- alt: thumbnailAltText
180
- })), /*#__PURE__*/ $qeOF0$react.createElement("div", {
181
- className: styles.content
182
- }, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Flex, null, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Text, {
183
- as: "h1",
184
- lineHeight: "lineHeightM",
185
- fontColor: "gray900",
186
- fontWeight: "fontWeightDemiBold",
187
- isTruncated: true
188
- }, title), contentType && /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Text, {
189
- as: "span",
190
- lineHeight: "lineHeightM",
191
- fontColor: "gray600",
192
- className: styles.contentType,
193
- isTruncated: true
194
- }, "(", contentType, ")")), description && /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Text, {
195
- as: "p",
196
- lineHeight: "lineHeightM",
197
- fontColor: "gray900",
198
- isTruncated: true,
199
- className: styles.description
200
- }, description)), /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Flex, {
201
- className: styles.meta,
202
- alignItems: "flex-start",
203
- paddingLeft: "spacingXs"
204
- }, status && /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Box, {
205
- marginRight: actions ? 'spacingXs' : 'none'
206
- }, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$EntityStatusBadge, {
207
- entityStatus: status
208
- })), actions && /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Menu, null, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Menu.Trigger, null, /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Button, {
209
- isDisabled: isActionsDisabled,
210
- startIcon: /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$MoreHorizontalIcon, null),
211
- variant: "transparent",
212
- "aria-label": "Actions",
213
- size: "small",
214
- className: styles.menuTrigger
215
- })), /*#__PURE__*/ $qeOF0$react.createElement($qeOF0$Menu.List, null, actions))))));
157
+ "data-test-id": testId,
158
+ children: [
159
+ renderCardDragHandle(),
160
+ isLoading ? /*#__PURE__*/ $qeOF0$jsx("article", {
161
+ className: styles.card,
162
+ children: /*#__PURE__*/ $qeOF0$jsxs($qeOF0$SkeletonContainer, {
163
+ clipId: "f36-entity-list-item-skeleton",
164
+ children: [
165
+ /*#__PURE__*/ $qeOF0$jsx($qeOF0$SkeletonImage, {
166
+ height: 46,
167
+ width: 46
168
+ }),
169
+ /*#__PURE__*/ $qeOF0$jsx($qeOF0$SkeletonBodyText, {
170
+ numberOfLines: 2,
171
+ lineHeight: 18,
172
+ offsetLeft: 54
173
+ })
174
+ ]
175
+ })
176
+ }) : /*#__PURE__*/ $qeOF0$jsxs(Element, {
177
+ className: styles.card,
178
+ onClick: onClick,
179
+ href: href,
180
+ type: Element === 'button' ? 'button' : undefined,
181
+ target: href ? '_blank' : undefined,
182
+ children: [
183
+ withThumbnail && /*#__PURE__*/ $qeOF0$jsx("figure", {
184
+ className: styles.media,
185
+ children: asIcon ? /*#__PURE__*/ $qeOF0$jsx($qeOF0$Icon, {
186
+ as: $b8d6b7ec5fedd0fe$var$ICON_MAP[entityType.toLowerCase()],
187
+ variant: "muted"
188
+ }) : /*#__PURE__*/ $qeOF0$jsx("img", {
189
+ src: thumbnailUrl,
190
+ className: styles.thumbnail,
191
+ alt: thumbnailAltText
192
+ })
193
+ }),
194
+ /*#__PURE__*/ $qeOF0$jsxs("div", {
195
+ className: styles.content,
196
+ children: [
197
+ /*#__PURE__*/ $qeOF0$jsxs($qeOF0$Flex, {
198
+ children: [
199
+ /*#__PURE__*/ $qeOF0$jsx($qeOF0$Text, {
200
+ as: "h3",
201
+ lineHeight: "lineHeightM",
202
+ fontColor: "gray900",
203
+ fontWeight: "fontWeightDemiBold",
204
+ isTruncated: true,
205
+ children: title
206
+ }),
207
+ contentType && /*#__PURE__*/ $qeOF0$jsxs($qeOF0$Text, {
208
+ as: "span",
209
+ lineHeight: "lineHeightM",
210
+ fontColor: "gray600",
211
+ className: styles.contentType,
212
+ isTruncated: true,
213
+ children: [
214
+ "(",
215
+ contentType,
216
+ ")"
217
+ ]
218
+ })
219
+ ]
220
+ }),
221
+ description && /*#__PURE__*/ $qeOF0$jsx($qeOF0$Text, {
222
+ as: "p",
223
+ lineHeight: "lineHeightM",
224
+ fontColor: "gray900",
225
+ isTruncated: true,
226
+ className: styles.description,
227
+ children: description
228
+ })
229
+ ]
230
+ }),
231
+ /*#__PURE__*/ $qeOF0$jsxs($qeOF0$Flex, {
232
+ className: styles.meta,
233
+ alignItems: "flex-start",
234
+ paddingLeft: "spacingXs",
235
+ children: [
236
+ status && /*#__PURE__*/ $qeOF0$jsx($qeOF0$Box, {
237
+ marginRight: actions ? 'spacingXs' : 'none',
238
+ children: /*#__PURE__*/ $qeOF0$jsx($qeOF0$EntityStatusBadge, {
239
+ entityStatus: status
240
+ })
241
+ }),
242
+ actions && /*#__PURE__*/ $qeOF0$jsxs($qeOF0$Menu, {
243
+ children: [
244
+ /*#__PURE__*/ $qeOF0$jsx($qeOF0$Menu.Trigger, {
245
+ children: /*#__PURE__*/ $qeOF0$jsx($qeOF0$Button, {
246
+ isDisabled: isActionsDisabled,
247
+ startIcon: /*#__PURE__*/ $qeOF0$jsx($qeOF0$MoreHorizontalIcon, {
248
+ }),
249
+ variant: "transparent",
250
+ "aria-label": "Actions",
251
+ size: "small",
252
+ className: styles.menuTrigger
253
+ })
254
+ }),
255
+ /*#__PURE__*/ $qeOF0$jsx($qeOF0$Menu.List, {
256
+ children: actions
257
+ })
258
+ ]
259
+ })
260
+ ]
261
+ })
262
+ ]
263
+ })
264
+ ]
265
+ }));
216
266
  }
217
267
 
218
268
 
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/entity-list/src/index.ts","packages/components/entity-list/src/CompoundEntityList.tsx","packages/components/entity-list/src/EntityList.tsx","packages/components/entity-list/src/EntityList.styles.ts","packages/components/entity-list/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/EntityListItem/EntityListItem.styles.ts"],"sourcesContent":["export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n","import { EntityList as OriginalEntityList } from './EntityList';\nimport { EntityListItem } from './EntityListItem/EntityListItem';\n\ntype CompoundEntityList = typeof OriginalEntityList & {\n Item: typeof EntityListItem;\n};\n\nexport const EntityList = OriginalEntityList as CompoundEntityList;\nEntityList.Item = EntityListItem;\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CommonProps } from '@contentful/f36-core';\n\nimport { getEntityListStyles } from './EntityList.styles';\n\nexport interface EntityListProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nfunction _EntityList(props: EntityListProps, ref: React.Ref<HTMLUListElement>) {\n const styles = getEntityListStyles();\n\n return (\n <ul\n data-test-id={props.testId || 'cf-ui-entity-list'}\n ref={ref}\n className={cx(styles.root, props.className)}\n style={props.style}\n >\n {props.children}\n </ul>\n );\n}\n\nexport const EntityList = React.forwardRef(_EntityList);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getEntityListStyles = () => ({\n root: css({\n display: 'block',\n listStyle: 'none',\n margin: 0,\n padding: 0,\n border: `1px solid ${tokens.gray200}`,\n borderBottom: 'none',\n borderRadius: tokens.borderRadiusMedium,\n overflow: 'hidden',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { MouseEventHandler } from 'react';\n\nimport { EntityStatusBadge } from '@contentful/f36-badge';\nimport type {\n CommonProps,\n EntityStatus,\n PickUnion,\n} from '@contentful/f36-core';\nimport {\n AssetIcon,\n EntryIcon,\n ReleaseIcon,\n MoreHorizontalIcon,\n} from '@contentful/f36-icons';\nimport { Icon } from '@contentful/f36-icon';\nimport { Text } from '@contentful/f36-typography';\nimport { DragHandle } from '@contentful/f36-drag-handle';\nimport type { DragHandleProps } from '@contentful/f36-drag-handle';\nimport { Button } from '@contentful/f36-button';\nimport { Menu } from '@contentful/f36-menu';\n\nimport { getEntityListItemStyles } from './EntityListItem.styles';\n\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex, Box } from '@contentful/f36-core';\n\ntype EntityListItemStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'draft' | 'published'\n>;\n\nconst ICON_MAP = {\n asset: AssetIcon,\n entry: EntryIcon,\n release: ReleaseIcon,\n};\n\nexport interface EntityListItemProps extends CommonProps {\n /**\n * The title of the entity\n */\n title: string;\n /**\n * The description of the entity\n */\n description?: string;\n /**\n * The content type of the entity\n */\n contentType?: string;\n /**\n * The publish status of the entry\n */\n status?: EntityListItemStatus;\n /**\n * A boolean used to render the Thumbnail or not\n */\n withThumbnail?: boolean;\n /**\n * The URL of the entity's preview thumbnail. Use 46px x 46px images for best results\n */\n thumbnailUrl?: string;\n /**\n * The alt text for the thumbnail\n */\n thumbnailAltText?: string;\n /**\n * Menu elements rendered as actions in Menu\n */\n actions?: React.ReactNodeArray;\n /**\n * Renders a drag handle for the component for use in drag and drop contexts\n */\n withDragHandle?: boolean;\n /**\n * Applies styling for when the component is actively being dragged by the user\n */\n isDragActive?: boolean;\n /**\n * Prop to pass a custom CardDragHandle component to for use in drag and drop contexts\n */\n cardDragHandleComponent?: React.ReactNode;\n /**\n * Props to pass down to the default CardDragHandle component (does not work with cardDragHandleComponent prop)\n */\n cardDragHandleProps?: Partial<DragHandleProps>;\n /**\n * An entity can either be an Entry, an Asset or a Release. This prop will apply styling based on if the entity is an asset, a release or an entry\n *\n * Note: 'entry' and 'asset' are @deprecated but supported in v1.x for backwards compatibility\n */\n entityType?: 'Entry' | 'Asset' | 'entry' | 'asset' | 'Release';\n /**\n * Loading state for the component - when true will display loading feedback to the user\n */\n isLoading?: boolean;\n /**\n * The action to be performed on click of the EntryCard\n */\n onClick?: MouseEventHandler;\n /**\n * The href for the component. Will render the card as an `a` element for native browser link handling\n */\n href?: string;\n /**\n * A boolean used to disable the CardActions\n */\n isActionsDisabled?: boolean;\n}\n\nexport function EntityListItem({\n className,\n testId = 'cf-ui-entity-list-item',\n title,\n description,\n contentType,\n entityType = 'entry',\n withThumbnail = true,\n thumbnailUrl,\n thumbnailAltText,\n status,\n actions,\n withDragHandle,\n isDragActive,\n isLoading,\n onClick,\n href,\n cardDragHandleProps,\n cardDragHandleComponent,\n isActionsDisabled = false,\n ...otherProps\n}: EntityListItemProps): React.ReactElement {\n const styles = getEntityListItemStyles();\n\n const renderCardDragHandle = () => {\n if (cardDragHandleComponent) {\n return cardDragHandleComponent;\n } else if (withDragHandle) {\n return (\n <DragHandle\n className={styles.dragHandle}\n isActive={isDragActive}\n label=\"Reorder entry\"\n {...cardDragHandleProps}\n />\n );\n }\n };\n\n let Element: React.ElementType = 'article';\n if (href || onClick) {\n Element = href ? 'a' : 'button';\n }\n\n // archived assets will not be available on the CDN, resulting in a broken image src\n const isArchived = status === 'archived';\n const asIcon = isArchived || !thumbnailUrl;\n\n return (\n <li\n {...otherProps}\n className={cx(styles.root({ isDragActive }), className)}\n data-test-id={testId}\n >\n {renderCardDragHandle()}\n {isLoading ? (\n <article className={styles.card}>\n <SkeletonContainer clipId=\"f36-entity-list-item-skeleton\">\n <SkeletonImage height={46} width={46} />\n <SkeletonBodyText\n numberOfLines={2}\n lineHeight={18}\n offsetLeft={54}\n />\n </SkeletonContainer>\n </article>\n ) : (\n <Element\n className={styles.card}\n onClick={onClick}\n href={href}\n type={Element === 'button' ? 'button' : undefined}\n target={href ? '_blank' : undefined}\n >\n {withThumbnail && (\n <figure className={styles.media}>\n {asIcon ? (\n <Icon as={ICON_MAP[entityType.toLowerCase()]} variant=\"muted\" />\n ) : (\n <img\n src={thumbnailUrl}\n className={styles.thumbnail}\n alt={thumbnailAltText}\n />\n )}\n </figure>\n )}\n\n <div className={styles.content}>\n <Flex>\n <Text\n as=\"h1\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n fontWeight=\"fontWeightDemiBold\"\n isTruncated\n >\n {title}\n </Text>\n\n {contentType && (\n <Text\n as=\"span\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray600\"\n className={styles.contentType}\n isTruncated\n >\n ({contentType})\n </Text>\n )}\n </Flex>\n {description && (\n <Text\n as=\"p\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n isTruncated\n className={styles.description}\n >\n {description}\n </Text>\n )}\n </div>\n\n <Flex\n className={styles.meta}\n alignItems=\"flex-start\"\n paddingLeft=\"spacingXs\"\n >\n {status && (\n <Box marginRight={actions ? 'spacingXs' : 'none'}>\n <EntityStatusBadge entityStatus={status} />\n </Box>\n )}\n\n {actions && (\n <Menu>\n <Menu.Trigger>\n <Button\n isDisabled={isActionsDisabled}\n startIcon={<MoreHorizontalIcon />}\n variant=\"transparent\"\n aria-label=\"Actions\"\n size=\"small\"\n className={styles.menuTrigger}\n />\n </Menu.Trigger>\n <Menu.List>{actions}</Menu.List>\n </Menu>\n )}\n </Flex>\n </Element>\n )}\n </li>\n );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { EntityListItemProps } from './EntityListItem';\n\nexport const getEntityListItemStyles = () => ({\n root: (props: Pick<EntityListItemProps, 'isDragActive'>) =>\n css({\n display: 'flex',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n position: 'relative',\n transition: `${tokens.transitionDurationShort} ${tokens.transitionEasingDefault}`,\n transitionProperty: 'box-shadow, background-color',\n backgroundColor: tokens.colorWhite,\n ...(props.isDragActive\n ? {\n boxShadow: tokens.boxShadowHeavy,\n }\n : {}),\n\n '&:hover': {\n backgroundColor: tokens.gray100,\n },\n }),\n card: css({\n display: 'flex',\n textDecoration: 'none',\n width: '100%',\n minHeight: tokens.spacing3Xl,\n padding: tokens.spacingXs,\n border: 'none',\n background: 'none',\n textAlign: 'left',\n }),\n content: css({\n flexGrow: 1,\n minWidth: 0,\n }),\n media: css({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: tokens.gray200,\n width: tokens.spacing2Xl,\n height: tokens.spacing2Xl,\n margin: '0',\n marginRight: tokens.spacingXs,\n }),\n thumbnail: css({\n display: 'block',\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n }),\n contentType: css({\n marginLeft: tokens.spacingXs,\n }),\n description: css({\n marginTop: tokens.spacing2Xs,\n }),\n meta: css({\n marginLeft: 'auto',\n flexShrink: 0,\n }),\n dragHandle: css({\n borderBottomLeftRadius: '0',\n borderTopLeftRadius: '0',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n }),\n menuTrigger: css({\n padding: '0 0.125rem',\n minHeight: '1.5rem',\n }),\n});\n"],"names":["EntityList","EntityListProps","EntityListItem","EntityListItemProps","OriginalEntityList","CompoundEntityList","Item","React","CommonProps","getEntityListStyles","children","ReactNode","_EntityList","props","ref","Ref","HTMLUListElement","styles","testId","root","className","style","forwardRef","tokens","display","listStyle","margin","padding","border","gray200","borderBottom","borderRadius","borderRadiusMedium","overflow","MouseEventHandler","EntityStatusBadge","EntityStatus","PickUnion","AssetIcon","EntryIcon","ReleaseIcon","MoreHorizontalIcon","Icon","Text","DragHandle","DragHandleProps","Button","Menu","getEntityListItemStyles","SkeletonBodyText","SkeletonContainer","SkeletonImage","Flex","Box","EntityListItemStatus","ICON_MAP","asset","entry","release","title","description","contentType","status","withThumbnail","thumbnailUrl","thumbnailAltText","actions","ReactNodeArray","withDragHandle","isDragActive","cardDragHandleComponent","cardDragHandleProps","Partial","entityType","isLoading","onClick","href","isActionsDisabled","otherProps","ReactElement","renderCardDragHandle","dragHandle","Element","ElementType","isArchived","asIcon","card","undefined","media","toLowerCase","thumbnail","content","meta","menuTrigger","Pick","boxShadow","position","transition","transitionDurationShort","transitionEasingDefault","transitionProperty","backgroundColor","colorWhite","boxShadowHeavy","gray100","textDecoration","width","minHeight","spacing3Xl","spacingXs","background","textAlign","flexShrink","alignItems","justifyContent","spacing2Xl","height","marginRight","marginLeft","marginTop","spacing2Xs","borderBottomLeftRadius","borderTopLeftRadius"],"version":3,"file":"module.js.map"}
1
+ {"mappings":"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","sources":["packages/components/entity-list/src/index.ts","packages/components/entity-list/src/CompoundEntityList.tsx","packages/components/entity-list/src/EntityList.tsx","packages/components/entity-list/src/EntityList.styles.ts","packages/components/entity-list/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/EntityListItem/EntityListItem.styles.ts"],"sourcesContent":["export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n","import { EntityList as OriginalEntityList } from './EntityList';\nimport { EntityListItem } from './EntityListItem/EntityListItem';\n\ntype CompoundEntityList = typeof OriginalEntityList & {\n Item: typeof EntityListItem;\n};\n\nexport const EntityList = OriginalEntityList as CompoundEntityList;\nEntityList.Item = EntityListItem;\n","import React from 'react';\nimport { cx } from 'emotion';\nimport { CommonProps, ExpandProps } from '@contentful/f36-core';\n\nimport { getEntityListStyles } from './EntityList.styles';\n\nexport interface EntityListProps extends CommonProps {\n children?: React.ReactNode;\n}\n\nfunction _EntityList(\n props: ExpandProps<EntityListProps>,\n ref: React.Ref<HTMLUListElement>,\n) {\n const styles = getEntityListStyles();\n\n return (\n <ul\n data-test-id={props.testId || 'cf-ui-entity-list'}\n ref={ref}\n className={cx(styles.root, props.className)}\n style={props.style}\n >\n {props.children}\n </ul>\n );\n}\n\nexport const EntityList = React.forwardRef(_EntityList);\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getEntityListStyles = () => ({\n root: css({\n display: 'block',\n listStyle: 'none',\n margin: 0,\n padding: 0,\n border: `1px solid ${tokens.gray200}`,\n borderBottom: 'none',\n borderRadius: tokens.borderRadiusMedium,\n overflow: 'hidden',\n }),\n});\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type { MouseEventHandler } from 'react';\n\nimport { EntityStatusBadge } from '@contentful/f36-badge';\nimport type {\n CommonProps,\n EntityStatus,\n PickUnion,\n} from '@contentful/f36-core';\nimport {\n AssetIcon,\n EntryIcon,\n ReleaseIcon,\n MoreHorizontalIcon,\n} from '@contentful/f36-icons';\nimport { Icon } from '@contentful/f36-icon';\nimport { Text } from '@contentful/f36-typography';\nimport { DragHandle } from '@contentful/f36-drag-handle';\nimport type { DragHandleProps } from '@contentful/f36-drag-handle';\nimport { Button } from '@contentful/f36-button';\nimport { Menu } from '@contentful/f36-menu';\n\nimport { getEntityListItemStyles } from './EntityListItem.styles';\n\nimport {\n SkeletonBodyText,\n SkeletonContainer,\n SkeletonImage,\n} from '@contentful/f36-skeleton';\nimport { Flex, Box } from '@contentful/f36-core';\n\ntype EntityListItemStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'draft' | 'published'\n>;\n\nconst ICON_MAP = {\n asset: AssetIcon,\n entry: EntryIcon,\n release: ReleaseIcon,\n};\n\nexport interface EntityListItemProps extends CommonProps {\n /**\n * The title of the entity\n */\n title: string;\n /**\n * The description of the entity\n */\n description?: string;\n /**\n * The content type of the entity\n */\n contentType?: string;\n /**\n * The publish status of the entry\n */\n status?: EntityListItemStatus;\n /**\n * A boolean used to render the Thumbnail or not\n */\n withThumbnail?: boolean;\n /**\n * The URL of the entity's preview thumbnail. Use 46px x 46px images for best results\n */\n thumbnailUrl?: string;\n /**\n * The alt text for the thumbnail\n */\n thumbnailAltText?: string;\n /**\n * Menu elements rendered as actions in Menu\n */\n actions?: React.ReactNodeArray;\n /**\n * Renders a drag handle for the component for use in drag and drop contexts\n */\n withDragHandle?: boolean;\n /**\n * Applies styling for when the component is actively being dragged by the user\n */\n isDragActive?: boolean;\n /**\n * Prop to pass a custom CardDragHandle component to for use in drag and drop contexts\n */\n cardDragHandleComponent?: React.ReactNode;\n /**\n * Props to pass down to the default CardDragHandle component (does not work with cardDragHandleComponent prop)\n */\n cardDragHandleProps?: Partial<DragHandleProps>;\n /**\n * An entity can either be an Entry, an Asset or a Release. This prop will apply styling based on if the entity is an asset, a release or an entry\n *\n * Note: 'entry' and 'asset' are @deprecated but supported in v1.x for backwards compatibility\n */\n entityType?: 'Entry' | 'Asset' | 'entry' | 'asset' | 'Release';\n /**\n * Loading state for the component - when true will display loading feedback to the user\n */\n isLoading?: boolean;\n /**\n * The action to be performed on click of the EntryCard\n */\n onClick?: MouseEventHandler;\n /**\n * The href for the component. Will render the card as an `a` element for native browser link handling\n */\n href?: string;\n /**\n * A boolean used to disable the CardActions\n */\n isActionsDisabled?: boolean;\n}\n\nexport function EntityListItem({\n className,\n testId = 'cf-ui-entity-list-item',\n title,\n description,\n contentType,\n entityType = 'entry',\n withThumbnail = true,\n thumbnailUrl,\n thumbnailAltText,\n status,\n actions,\n withDragHandle,\n isDragActive,\n isLoading,\n onClick,\n href,\n cardDragHandleProps,\n cardDragHandleComponent,\n isActionsDisabled = false,\n ...otherProps\n}: EntityListItemProps): React.ReactElement {\n const styles = getEntityListItemStyles();\n\n const renderCardDragHandle = () => {\n if (cardDragHandleComponent) {\n return cardDragHandleComponent;\n } else if (withDragHandle) {\n return (\n <DragHandle\n className={styles.dragHandle}\n isActive={isDragActive}\n label=\"Reorder entry\"\n {...cardDragHandleProps}\n />\n );\n }\n };\n\n let Element: React.ElementType = 'article';\n if (href || onClick) {\n Element = href ? 'a' : 'button';\n }\n\n // archived assets will not be available on the CDN, resulting in a broken image src\n const isArchived = status === 'archived';\n const asIcon = isArchived || !thumbnailUrl;\n\n return (\n <li\n {...otherProps}\n className={cx(styles.root({ isDragActive }), className)}\n data-test-id={testId}\n >\n {renderCardDragHandle()}\n {isLoading ? (\n <article className={styles.card}>\n <SkeletonContainer clipId=\"f36-entity-list-item-skeleton\">\n <SkeletonImage height={46} width={46} />\n <SkeletonBodyText\n numberOfLines={2}\n lineHeight={18}\n offsetLeft={54}\n />\n </SkeletonContainer>\n </article>\n ) : (\n <Element\n className={styles.card}\n onClick={onClick}\n href={href}\n type={Element === 'button' ? 'button' : undefined}\n target={href ? '_blank' : undefined}\n >\n {withThumbnail && (\n <figure className={styles.media}>\n {asIcon ? (\n <Icon as={ICON_MAP[entityType.toLowerCase()]} variant=\"muted\" />\n ) : (\n <img\n src={thumbnailUrl}\n className={styles.thumbnail}\n alt={thumbnailAltText}\n />\n )}\n </figure>\n )}\n\n <div className={styles.content}>\n <Flex>\n <Text\n as=\"h3\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n fontWeight=\"fontWeightDemiBold\"\n isTruncated\n >\n {title}\n </Text>\n\n {contentType && (\n <Text\n as=\"span\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray600\"\n className={styles.contentType}\n isTruncated\n >\n ({contentType})\n </Text>\n )}\n </Flex>\n {description && (\n <Text\n as=\"p\"\n lineHeight=\"lineHeightM\"\n fontColor=\"gray900\"\n isTruncated\n className={styles.description}\n >\n {description}\n </Text>\n )}\n </div>\n\n <Flex\n className={styles.meta}\n alignItems=\"flex-start\"\n paddingLeft=\"spacingXs\"\n >\n {status && (\n <Box marginRight={actions ? 'spacingXs' : 'none'}>\n <EntityStatusBadge entityStatus={status} />\n </Box>\n )}\n\n {actions && (\n <Menu>\n <Menu.Trigger>\n <Button\n isDisabled={isActionsDisabled}\n startIcon={<MoreHorizontalIcon />}\n variant=\"transparent\"\n aria-label=\"Actions\"\n size=\"small\"\n className={styles.menuTrigger}\n />\n </Menu.Trigger>\n <Menu.List>{actions}</Menu.List>\n </Menu>\n )}\n </Flex>\n </Element>\n )}\n </li>\n );\n}\n","import { css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\nimport { EntityListItemProps } from './EntityListItem';\n\nexport const getEntityListItemStyles = () => ({\n root: (props: Pick<EntityListItemProps, 'isDragActive'>) =>\n css({\n display: 'flex',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n position: 'relative',\n transition: `${tokens.transitionDurationShort} ${tokens.transitionEasingDefault}`,\n transitionProperty: 'box-shadow, background-color',\n backgroundColor: tokens.colorWhite,\n ...(props.isDragActive\n ? {\n boxShadow: tokens.boxShadowHeavy,\n }\n : {}),\n\n '&:hover': {\n backgroundColor: tokens.gray100,\n },\n }),\n card: css({\n display: 'flex',\n textDecoration: 'none',\n width: '100%',\n minHeight: tokens.spacing3Xl,\n padding: tokens.spacingXs,\n border: 'none',\n background: 'none',\n textAlign: 'left',\n }),\n content: css({\n flexGrow: 1,\n minWidth: 0,\n }),\n media: css({\n display: 'flex',\n flexShrink: 0,\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: tokens.gray200,\n width: tokens.spacing2Xl,\n height: tokens.spacing2Xl,\n margin: '0',\n marginRight: tokens.spacingXs,\n }),\n thumbnail: css({\n display: 'block',\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n }),\n contentType: css({\n marginLeft: tokens.spacingXs,\n }),\n description: css({\n marginTop: tokens.spacing2Xs,\n }),\n meta: css({\n marginLeft: 'auto',\n flexShrink: 0,\n }),\n dragHandle: css({\n borderBottomLeftRadius: '0',\n borderTopLeftRadius: '0',\n boxShadow: `inset 0 -1px 0 ${tokens.gray200}`,\n }),\n menuTrigger: css({\n padding: '0 0.125rem',\n minHeight: '1.5rem',\n }),\n});\n"],"names":["EntityList","EntityListProps","EntityListItem","EntityListItemProps","OriginalEntityList","CompoundEntityList","Item","React","CommonProps","ExpandProps","getEntityListStyles","children","ReactNode","_EntityList","props","ref","Ref","HTMLUListElement","styles","testId","root","className","style","forwardRef","tokens","display","listStyle","margin","padding","border","gray200","borderBottom","borderRadius","borderRadiusMedium","overflow","MouseEventHandler","EntityStatusBadge","EntityStatus","PickUnion","AssetIcon","EntryIcon","ReleaseIcon","MoreHorizontalIcon","Icon","Text","DragHandle","DragHandleProps","Button","Menu","getEntityListItemStyles","SkeletonBodyText","SkeletonContainer","SkeletonImage","Flex","Box","EntityListItemStatus","ICON_MAP","asset","entry","release","title","description","contentType","status","withThumbnail","thumbnailUrl","thumbnailAltText","actions","ReactNodeArray","withDragHandle","isDragActive","cardDragHandleComponent","cardDragHandleProps","Partial","entityType","isLoading","onClick","href","isActionsDisabled","otherProps","ReactElement","renderCardDragHandle","dragHandle","Element","ElementType","isArchived","asIcon","card","undefined","media","toLowerCase","thumbnail","content","meta","menuTrigger","Pick","boxShadow","position","transition","transitionDurationShort","transitionEasingDefault","transitionProperty","backgroundColor","colorWhite","boxShadowHeavy","gray100","textDecoration","width","minHeight","spacing3Xl","spacingXs","background","textAlign","flexShrink","alignItems","justifyContent","spacing2Xl","height","marginRight","marginLeft","marginTop","spacing2Xs","borderBottomLeftRadius","borderTopLeftRadius"],"version":3,"file":"module.js.map"}
package/dist/types.d.ts CHANGED
@@ -4,7 +4,12 @@ import { DragHandleProps } from "@contentful/f36-drag-handle";
4
4
  export interface EntityListProps extends CommonProps {
5
5
  children?: React.ReactNode;
6
6
  }
7
- declare const _EntityList1: React.ForwardRefExoticComponent<EntityListProps & React.RefAttributes<HTMLUListElement>>;
7
+ declare const _EntityList1: React.ForwardRefExoticComponent<{
8
+ children?: React.ReactNode;
9
+ className?: string;
10
+ testId?: string;
11
+ style?: React.CSSProperties;
12
+ } & React.RefAttributes<HTMLUListElement>>;
8
13
  type EntityListItemStatus = PickUnion<EntityStatus, 'archived' | 'changed' | 'draft' | 'published'>;
9
14
  export interface EntityListItemProps extends CommonProps {
10
15
  /**
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;ACMA,gCAAiC,SAAQ,WAAW;IAClD,QAAQ,CAAC,EAAE,MAAM,SAAS,CAAC;CAC5B;AAiBD,QAAO,MAAM,sGAA0C,CAAC;AEOxD,4BAA4B,UAC1B,YAAY,EACZ,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAC/C,CAAC;AAQF,oCAAqC,SAAQ,WAAW;IACtD;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,cAAc,CAAC;IAC/B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,SAAS,CAAC;IAC1C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC/C;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IAC/D;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,+BAA+B,EAC7B,SAAS,EACT,MAAiC,EACjC,KAAK,EACL,WAAW,EACX,WAAW,EACX,UAAoB,EACpB,aAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,MAAM,EACN,OAAO,EACP,cAAc,EACd,YAAY,EACZ,SAAS,EACT,OAAO,EACP,IAAI,EACJ,mBAAmB,EACnB,uBAAuB,EACvB,iBAAyB,EACzB,GAAG,UAAU,EACd,EAAE,mBAAmB,GAAG,MAAM,YAAY,CAuI1C;AC7QD,0BAA0B,mBAAyB,GAAG;IACpD,IAAI,EAAE,qBAAqB,CAAC;CAC7B,CAAC;AAEF,OAAO,MAAM,8BAAqD,CAAC","sources":["packages/components/entity-list/src/src/EntityList.styles.ts","packages/components/entity-list/src/src/EntityList.tsx","packages/components/entity-list/src/src/EntityListItem/EntityListItem.styles.ts","packages/components/entity-list/src/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/src/CompoundEntityList.tsx","packages/components/entity-list/src/src/index.ts","packages/components/entity-list/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,"export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":";;;ACMA,gCAAiC,SAAQ,WAAW;IAClD,QAAQ,CAAC,EAAE,MAAM,SAAS,CAAC;CAC5B;AAoBD,QAAO,MAAM;eArBA,MAAM,SAAS;;;;0CAqB2B,CAAC;AEIxD,4BAA4B,UAC1B,YAAY,EACZ,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAC/C,CAAC;AAQF,oCAAqC,SAAQ,WAAW;IACtD;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,cAAc,CAAC;IAC/B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,SAAS,CAAC;IAC1C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;IAC/C;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IAC/D;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,+BAA+B,EAC7B,SAAS,EACT,MAAiC,EACjC,KAAK,EACL,WAAW,EACX,WAAW,EACX,UAAoB,EACpB,aAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,MAAM,EACN,OAAO,EACP,cAAc,EACd,YAAY,EACZ,SAAS,EACT,OAAO,EACP,IAAI,EACJ,mBAAmB,EACnB,uBAAuB,EACvB,iBAAyB,EACzB,GAAG,UAAU,EACd,EAAE,mBAAmB,GAAG,MAAM,YAAY,CAuI1C;AC7QD,0BAA0B,mBAAyB,GAAG;IACpD,IAAI,EAAE,qBAAqB,CAAC;CAC7B,CAAC;AAEF,OAAO,MAAM,8BAAqD,CAAC","sources":["packages/components/entity-list/src/src/EntityList.styles.ts","packages/components/entity-list/src/src/EntityList.tsx","packages/components/entity-list/src/src/EntityListItem/EntityListItem.styles.ts","packages/components/entity-list/src/src/EntityListItem/EntityListItem.tsx","packages/components/entity-list/src/src/CompoundEntityList.tsx","packages/components/entity-list/src/src/index.ts","packages/components/entity-list/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,"export { EntityList } from './CompoundEntityList';\nexport type { EntityListProps } from './EntityList';\nexport { EntityListItem } from './EntityListItem/EntityListItem';\nexport type { EntityListItemProps } from './EntityListItem/EntityListItem';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
package/package.json CHANGED
@@ -1,22 +1,22 @@
1
1
  {
2
2
  "name": "@contentful/f36-entity-list",
3
- "version": "4.0.1-beta.2550+0e77ffa0",
3
+ "version": "4.0.1-beta.2595+7499852fef",
4
4
  "description": "Forma 36: EntityList component",
5
5
  "scripts": {
6
6
  "build": "parcel build"
7
7
  },
8
8
  "dependencies": {
9
9
  "@babel/runtime": "^7.6.2",
10
- "@contentful/f36-badge": "4.0.1-beta.2550+0e77ffa0",
11
- "@contentful/f36-button": "4.0.1-beta.2550+0e77ffa0",
12
- "@contentful/f36-core": "4.0.1-beta.2550+0e77ffa0",
13
- "@contentful/f36-drag-handle": "4.0.1-beta.2550+0e77ffa0",
14
- "@contentful/f36-icon": "4.0.1-beta.2550+0e77ffa0",
15
- "@contentful/f36-icons": "4.0.1-beta.2550+0e77ffa0",
16
- "@contentful/f36-menu": "4.0.1-beta.2550+0e77ffa0",
17
- "@contentful/f36-skeleton": "4.0.1-beta.2550+0e77ffa0",
18
- "@contentful/f36-tokens": "4.0.1-beta.2550+0e77ffa0",
19
- "@contentful/f36-typography": "4.0.1-beta.2550+0e77ffa0",
10
+ "@contentful/f36-badge": "4.0.1-beta.2595+7499852fef",
11
+ "@contentful/f36-button": "4.0.1-beta.2595+7499852fef",
12
+ "@contentful/f36-core": "4.0.1-beta.2595+7499852fef",
13
+ "@contentful/f36-drag-handle": "4.0.1-beta.2595+7499852fef",
14
+ "@contentful/f36-icon": "4.0.1-beta.2595+7499852fef",
15
+ "@contentful/f36-icons": "4.0.1-beta.2595+7499852fef",
16
+ "@contentful/f36-menu": "4.0.1-beta.2595+7499852fef",
17
+ "@contentful/f36-skeleton": "4.0.1-beta.2595+7499852fef",
18
+ "@contentful/f36-tokens": "4.0.1-beta.2595+7499852fef",
19
+ "@contentful/f36-typography": "4.0.1-beta.2595+7499852fef",
20
20
  "emotion": "^10.0.17"
21
21
  },
22
22
  "peerDependencies": {
@@ -39,5 +39,5 @@
39
39
  "publishConfig": {
40
40
  "access": "public"
41
41
  },
42
- "gitHead": "0e77ffa0d99923466080494c6b87ccf0d0d48c56"
42
+ "gitHead": "7499852fef1921bc0636f4d544fde90ae91cb05c"
43
43
  }