@contentful/f36-entity-list 4.0.1-beta.2694 → 4.0.1-beta.2696

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 +68 -118
  2. package/dist/main.js.map +1 -1
  3. package/dist/module.js +68 -118
  4. package/dist/module.js.map +1 -1
  5. package/dist/types.d.ts +0 -0
  6. package/dist/types.d.ts.map +0 -0
  7. package/package.json +12 -12
package/dist/main.js CHANGED
@@ -1,4 +1,3 @@
1
- var $hadoL$reactjsxruntime = require("react/jsx-runtime");
2
1
  var $hadoL$emotion = require("emotion");
3
2
  var $hadoL$react = require("react");
4
3
  var $hadoL$contentfulf36tokens = require("@contentful/f36-tokens");
@@ -25,7 +24,6 @@ $parcel$export(module.exports, "EntityListItem", () => $3f4d63406b2f6561$export$
25
24
 
26
25
 
27
26
 
28
-
29
27
  const $e3aba86fc342822d$export$2b0a239870ba448d = ()=>({
30
28
  root: /*#__PURE__*/ $hadoL$emotion.css({
31
29
  display: 'block',
@@ -43,13 +41,12 @@ const $e3aba86fc342822d$export$2b0a239870ba448d = ()=>({
43
41
 
44
42
  function $42fa390001ac865a$var$_EntityList(props, ref) {
45
43
  const styles = $e3aba86fc342822d$export$2b0a239870ba448d();
46
- return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsx("ul", {
44
+ return(/*#__PURE__*/ ($parcel$interopDefault($hadoL$react)).createElement("ul", {
47
45
  "data-test-id": props.testId || 'cf-ui-entity-list',
48
46
  ref: ref,
49
47
  className: $hadoL$emotion.cx(styles.root, props.className),
50
- style: props.style,
51
- children: props.children
52
- }));
48
+ style: props.style
49
+ }, props.children));
53
50
  }
54
51
  const $42fa390001ac865a$export$8bb466c13870163e = /*#__PURE__*/ ($parcel$interopDefault($hadoL$react)).forwardRef($42fa390001ac865a$var$_EntityList);
55
52
 
@@ -65,7 +62,6 @@ const $42fa390001ac865a$export$8bb466c13870163e = /*#__PURE__*/ ($parcel$interop
65
62
 
66
63
 
67
64
 
68
-
69
65
  const $07bceb135ccb0944$export$3bb342229d68a121 = ()=>({
70
66
  root: (props)=>/*#__PURE__*/ $hadoL$emotion.css({
71
67
  display: 'flex',
@@ -146,7 +142,7 @@ function $3f4d63406b2f6561$export$65b9c70c5f42a158({ className: className , test
146
142
  const styles = $07bceb135ccb0944$export$3bb342229d68a121();
147
143
  const renderCardDragHandle = ()=>{
148
144
  if (cardDragHandleComponent) return cardDragHandleComponent;
149
- else if (withDragHandle) return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsx($hadoL$contentfulf36draghandle.DragHandle, {
145
+ else if (withDragHandle) return(/*#__PURE__*/ ($parcel$interopDefault($hadoL$react)).createElement($hadoL$contentfulf36draghandle.DragHandle, {
150
146
  className: styles.dragHandle,
151
147
  isActive: isDragActive,
152
148
  label: "Reorder entry",
@@ -158,120 +154,74 @@ function $3f4d63406b2f6561$export$65b9c70c5f42a158({ className: className , test
158
154
  // archived assets will not be available on the CDN, resulting in a broken image src
159
155
  const isArchived = status === 'archived';
160
156
  const asIcon = isArchived || !thumbnailUrl;
161
- return(/*#__PURE__*/ $hadoL$reactjsxruntime.jsxs("li", {
157
+ return(/*#__PURE__*/ ($parcel$interopDefault($hadoL$react)).createElement("li", {
162
158
  ...otherProps,
163
159
  className: $hadoL$emotion.cx(styles.root({
164
160
  isDragActive: isDragActive
165
161
  }), className),
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
- }));
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: "h3",
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))))));
275
225
  }
276
226
 
277
227
 
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, 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"}
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,4 +1,3 @@
1
- import {jsx as $qeOF0$jsx, jsxs as $qeOF0$jsxs} from "react/jsx-runtime";
2
1
  import {cx as $qeOF0$cx, css as $qeOF0$css} from "emotion";
3
2
  import $qeOF0$react from "react";
4
3
  import $qeOF0$contentfulf36tokens from "@contentful/f36-tokens";
@@ -16,7 +15,6 @@ import {Flex as $qeOF0$Flex, Box as $qeOF0$Box} from "@contentful/f36-core";
16
15
 
17
16
 
18
17
 
19
-
20
18
  const $32a4ed8cc58cbd41$export$2b0a239870ba448d = ()=>({
21
19
  root: /*#__PURE__*/ $qeOF0$css({
22
20
  display: 'block',
@@ -34,13 +32,12 @@ const $32a4ed8cc58cbd41$export$2b0a239870ba448d = ()=>({
34
32
 
35
33
  function $3382b9e83b849fa7$var$_EntityList(props, ref) {
36
34
  const styles = $32a4ed8cc58cbd41$export$2b0a239870ba448d();
37
- return(/*#__PURE__*/ $qeOF0$jsx("ul", {
35
+ return(/*#__PURE__*/ $qeOF0$react.createElement("ul", {
38
36
  "data-test-id": props.testId || 'cf-ui-entity-list',
39
37
  ref: ref,
40
38
  className: $qeOF0$cx(styles.root, props.className),
41
- style: props.style,
42
- children: props.children
43
- }));
39
+ style: props.style
40
+ }, props.children));
44
41
  }
45
42
  const $3382b9e83b849fa7$export$8bb466c13870163e = /*#__PURE__*/ $qeOF0$react.forwardRef($3382b9e83b849fa7$var$_EntityList);
46
43
 
@@ -56,7 +53,6 @@ const $3382b9e83b849fa7$export$8bb466c13870163e = /*#__PURE__*/ $qeOF0$react.for
56
53
 
57
54
 
58
55
 
59
-
60
56
  const $7cd3138fd5d2efdd$export$3bb342229d68a121 = ()=>({
61
57
  root: (props)=>/*#__PURE__*/ $qeOF0$css({
62
58
  display: 'flex',
@@ -137,7 +133,7 @@ function $b8d6b7ec5fedd0fe$export$65b9c70c5f42a158({ className: className , test
137
133
  const styles = $7cd3138fd5d2efdd$export$3bb342229d68a121();
138
134
  const renderCardDragHandle = ()=>{
139
135
  if (cardDragHandleComponent) return cardDragHandleComponent;
140
- else if (withDragHandle) return(/*#__PURE__*/ $qeOF0$jsx($qeOF0$DragHandle, {
136
+ else if (withDragHandle) return(/*#__PURE__*/ $qeOF0$react.createElement($qeOF0$DragHandle, {
141
137
  className: styles.dragHandle,
142
138
  isActive: isDragActive,
143
139
  label: "Reorder entry",
@@ -149,120 +145,74 @@ function $b8d6b7ec5fedd0fe$export$65b9c70c5f42a158({ className: className , test
149
145
  // archived assets will not be available on the CDN, resulting in a broken image src
150
146
  const isArchived = status === 'archived';
151
147
  const asIcon = isArchived || !thumbnailUrl;
152
- return(/*#__PURE__*/ $qeOF0$jsxs("li", {
148
+ return(/*#__PURE__*/ $qeOF0$react.createElement("li", {
153
149
  ...otherProps,
154
150
  className: $qeOF0$cx(styles.root({
155
151
  isDragActive: isDragActive
156
152
  }), className),
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
- }));
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: "h3",
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))))));
266
216
  }
267
217
 
268
218
 
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, 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"}
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
File without changes
package/dist/types.d.ts.map CHANGED
File without changes
package/package.json CHANGED
@@ -1,22 +1,22 @@
1
1
  {
2
2
  "name": "@contentful/f36-entity-list",
3
- "version": "4.0.1-beta.2694+5eee5f80",
3
+ "version": "4.0.1-beta.2696+d160443b",
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.2694+5eee5f80",
11
- "@contentful/f36-button": "4.0.1-beta.2694+5eee5f80",
12
- "@contentful/f36-core": "4.0.1-beta.2694+5eee5f80",
13
- "@contentful/f36-drag-handle": "4.0.1-beta.2694+5eee5f80",
14
- "@contentful/f36-icon": "4.0.1-beta.2694+5eee5f80",
15
- "@contentful/f36-icons": "4.0.1-beta.2694+5eee5f80",
16
- "@contentful/f36-menu": "4.0.1-beta.2694+5eee5f80",
17
- "@contentful/f36-skeleton": "4.0.1-beta.2694+5eee5f80",
18
- "@contentful/f36-tokens": "4.0.1-beta.2694+5eee5f80",
19
- "@contentful/f36-typography": "4.0.1-beta.2694+5eee5f80",
10
+ "@contentful/f36-badge": "4.0.1-beta.2696+d160443b",
11
+ "@contentful/f36-button": "4.0.1-beta.2696+d160443b",
12
+ "@contentful/f36-core": "4.0.1-beta.2696+d160443b",
13
+ "@contentful/f36-drag-handle": "4.0.1-beta.2696+d160443b",
14
+ "@contentful/f36-icon": "4.0.1-beta.2696+d160443b",
15
+ "@contentful/f36-icons": "4.0.1-beta.2696+d160443b",
16
+ "@contentful/f36-menu": "4.0.1-beta.2696+d160443b",
17
+ "@contentful/f36-skeleton": "4.0.1-beta.2696+d160443b",
18
+ "@contentful/f36-tokens": "4.0.1-beta.2696+d160443b",
19
+ "@contentful/f36-typography": "4.0.1-beta.2696+d160443b",
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": "5eee5f8092c3d92b9ba054c00baa1bc484511c69"
42
+ "gitHead": "d160443b21d033f6567ce0cf6a7760c42d89a772"
43
43
  }