@contentful/f36-asset 4.47.3 → 4.48.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/esm/index.js CHANGED
@@ -8,4 +8,5 @@ import g from '@contentful/f36-tokens';
8
8
  var N=Object.defineProperty,w=Object.defineProperties;var B=Object.getOwnPropertyDescriptors;var f=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var A=(t,e,s)=>e in t?N(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s,o=(t,e)=>{for(var s in e||(e={}))I.call(e,s)&&A(t,s,e[s]);if(f)for(var s of f(e))v.call(e,s)&&A(t,s,e[s]);return t},P=(t,e)=>w(t,B(e));var d=(t,e)=>{var s={};for(var r in t)I.call(t,r)&&e.indexOf(r)<0&&(s[r]=t[r]);if(t!=null&&f)for(var r of f(t))e.indexOf(r)<0&&v.call(t,r)&&(s[r]=t[r]);return s};function T(){return {root:css({display:"inline-block",width:"39px",height:"39px","g, path":{fill:g.gray600}})}}var u=c=>{var m=c,{type:t="archive",className:e,testId:s="cf-ui-asset-icon"}=m,r=d(m,["type","className","testId"]);let y=T(),i=P(o({},r),{testId:s,className:cx(y.root,e)});switch(t){case"audio":return n.createElement(AudioIcon,o({},i));case"code":return n.createElement(CodeIllustrationIcon,o({},i));case"image":return n.createElement(ImageIcon,o({},i));case"markup":return n.createElement(MarkupIcon,o({},i));case"pdf":return n.createElement(PdfIcon,o({},i));case"plaintext":return n.createElement(PlaintextIcon,o({},i));case"presentation":return n.createElement(PresentationIcon,o({},i));case"richtext":return n.createElement(RichtextIcon,o({},i));case"spreadsheet":return n.createElement(SpreadsheetIcon,o({},i));case"video":return n.createElement(VideoIcon,o({},i));case"archive":default:return n.createElement(ArchiveIcon,o({},i))}};u.displayName="AssetIcon";function S(){return {relative:css({position:"relative"}),height100:css({height:"100%"}),image:css({width:"auto",maxWidth:"100%",maxHeight:"100%"}),titleContainer:css({opacity:0,transition:`opacity ${g.transitionDurationDefault} ${g.transitionEasingDefault}`,position:"absolute",bottom:0,right:0,left:0,height:"100%",display:"flex",overflow:"hidden",alignItems:"flex-end",boxSizing:"border-box",background:`linear-gradient(0deg, ${g.gray900} 0%, transparent calc(1rem * (100 / ${g.fontBaseDefault})), transparent 100% )`,":hover":{opacity:1}}),title:css({bottom:0,left:0,right:0,position:"absolute"})}}function b(X,i){var h=X,{className:t,src:e,status:s,testId:r="cf-ui-asset",title:c,type:m="image"}=h,y=d(h,["className","src","status","testId","title","type"]);let p=S(),C=e&&e!==""&&m==="image"&&s!=="archived";return n.createElement(Box,o({className:cx(p.relative,t),testId:r,ref:i},y),C?n.createElement(n.Fragment,null,n.createElement(Flex,{alignItems:"center",justifyContent:"center",className:p.height100},n.createElement("img",{className:p.image,src:e,alt:c})),c&&n.createElement("div",{className:p.titleContainer},n.createElement(Text,{className:p.title,fontColor:"colorWhite",margin:"spacingS",isTruncated:!0},c))):n.createElement(Flex,{flexDirection:"column",alignItems:"center",justifyContent:"center",paddingLeft:"spacingS",paddingRight:"spacingS",className:p.height100},n.createElement(Flex,{marginBottom:"spacingM",marginTop:"spacingM",justifyContent:"center"},n.createElement(u,{type:m})),n.createElement(Text,{isTruncated:!0,marginBottom:"spacingM",fontColor:"gray600"},c)))}b.displayName="Asset";var J=n.forwardRef(b);var K={archive:"archive",audio:"audio",code:"code",image:"image",markup:"markup",pdf:"pdf",plaintext:"plaintext",presentation:"presentation",richtext:"richtext",spreadsheet:"spreadsheet",video:"video"};function Q(t){return Object.keys(K).includes(t)}
9
9
 
10
10
  export { J as Asset, u as AssetIcon, Q as isAssetType };
11
+ //# sourceMappingURL=out.js.map
11
12
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Asset.tsx","../../src/AssetIcon/AssetIcon.tsx","../../src/AssetIcon/AssetIcon.styles.ts","../../src/Asset.styles.ts","../../src/types.ts"],"names":["React","cx","Box","Flex","Text","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","tokens","css","getAssetIconStyles","AssetIcon","_a","_b","type","className","testId","otherProps","__objRest","styles","props","__spreadProps","__spreadValues","getAssetStyles","_Asset","ref","src","status","title","showPreview","Asset","types","isAssetType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n Flex,\n type EntityStatus,\n type PickUnion,\n type CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\n\nimport { AssetIcon } from './AssetIcon/AssetIcon';\nimport { getAssetStyles } from './Asset.styles';\nimport type { AssetType } from './types';\n\nexport type AssetStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'deleted' | 'draft' | 'published'\n>;\n\nexport interface AssetProps extends CommonProps {\n /**\n * A `src` attribute to use for image assets\n */\n src?: string;\n /**\n * The publish status of the asset\n */\n status?: AssetStatus;\n /**\n * The title of the asset\n */\n title?: string;\n /**\n * The type of asset being represented\n */\n type?: AssetType;\n}\n\nfunction _Asset(\n {\n className,\n src,\n status,\n testId = 'cf-ui-asset',\n title,\n type = 'image',\n ...otherProps\n }: AssetProps,\n ref: React.Ref<any>,\n) {\n const styles = getAssetStyles();\n const isImage = src && src !== '' && type === 'image';\n\n // Do not show image previews when publish status is archived\n const showPreview = isImage && status !== 'archived';\n\n return (\n <Box\n className={cx(styles.relative, className)}\n testId={testId}\n ref={ref}\n {...otherProps}\n >\n {showPreview ? (\n <>\n <Flex\n alignItems=\"center\"\n justifyContent=\"center\"\n className={styles.height100}\n >\n <img className={styles.image} src={src} alt={title} />\n </Flex>\n {title && (\n <div className={styles.titleContainer}>\n <Text\n className={styles.title}\n fontColor=\"colorWhite\"\n margin=\"spacingS\"\n isTruncated\n >\n {title}\n </Text>\n </div>\n )}\n </>\n ) : (\n <Flex\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n paddingLeft=\"spacingS\"\n paddingRight=\"spacingS\"\n className={styles.height100}\n >\n <Flex\n marginBottom=\"spacingM\"\n marginTop=\"spacingM\"\n justifyContent=\"center\"\n >\n <AssetIcon type={type} />\n </Flex>\n <Text isTruncated marginBottom=\"spacingM\" fontColor=\"gray600\">\n {title}\n </Text>\n </Flex>\n )}\n </Box>\n );\n}\n\n_Asset.displayName = 'Asset';\n\nexport const Asset = React.forwardRef(_Asset);\n","import React from 'react';\nimport {\n ArchiveIcon,\n AudioIcon,\n CodeIllustrationIcon,\n ImageIcon,\n MarkupIcon,\n PdfIcon,\n PlaintextIcon,\n RichtextIcon,\n PresentationIcon,\n SpreadsheetIcon,\n VideoIcon,\n} from '@contentful/f36-icons';\nimport type { GeneratedIconProps } from '@contentful/f36-icon';\nimport type { AssetType } from '../types';\n\nimport { cx } from 'emotion';\nimport { getAssetIconStyles } from './AssetIcon.styles';\n\nexport interface AssetIconProps\n extends Omit<GeneratedIconProps, 'illustration' | 'ref'> {\n type?: AssetType;\n}\n\n/**\n * Renders only the Illustration that would represent this asset's type\n */\nexport const AssetIcon = ({\n type = 'archive',\n className,\n testId = 'cf-ui-asset-icon',\n ...otherProps\n}: AssetIconProps) => {\n const styles = getAssetIconStyles();\n const props = {\n ...otherProps,\n testId,\n className: cx(styles.root, className),\n };\n\n switch (type) {\n case 'audio':\n return <AudioIcon {...props} />;\n case 'code':\n return <CodeIllustrationIcon {...props} />;\n case 'image':\n return <ImageIcon {...props} />;\n case 'markup':\n return <MarkupIcon {...props} />;\n case 'pdf':\n return <PdfIcon {...props} />;\n case 'plaintext':\n return <PlaintextIcon {...props} />;\n case 'presentation':\n return <PresentationIcon {...props} />;\n case 'richtext':\n return <RichtextIcon {...props} />;\n case 'spreadsheet':\n return <SpreadsheetIcon {...props} />;\n case 'video':\n return <VideoIcon {...props} />;\n case 'archive':\n default:\n return <ArchiveIcon {...props} />;\n }\n};\n\nAssetIcon.displayName = 'AssetIcon';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetIconStyles() {\n return {\n root: css({\n display: 'inline-block',\n width: '39px',\n height: '39px',\n 'g, path': {\n fill: tokens.gray600,\n },\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetStyles() {\n return {\n relative: css({\n position: 'relative',\n }),\n height100: css({\n height: '100%',\n }),\n image: css({\n width: 'auto',\n maxWidth: '100%',\n maxHeight: '100%',\n }),\n titleContainer: css({\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'absolute',\n bottom: 0,\n right: 0,\n left: 0,\n height: '100%',\n display: 'flex',\n overflow: 'hidden',\n alignItems: 'flex-end',\n boxSizing: 'border-box',\n background: `linear-gradient(0deg, ${tokens.gray900} 0%, transparent calc(1rem * (100 / ${tokens.fontBaseDefault})), transparent 100% )`,\n ':hover': { opacity: 1 },\n }),\n title: css({\n bottom: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n }),\n };\n}\n","export const types = {\n archive: 'archive',\n audio: 'audio',\n code: 'code',\n image: 'image',\n markup: 'markup',\n pdf: 'pdf',\n plaintext: 'plaintext',\n presentation: 'presentation',\n richtext: 'richtext',\n spreadsheet: 'spreadsheet',\n video: 'video',\n};\n\nexport function isAssetType(type: string): type is AssetType {\n return Object.keys(types).includes(type);\n}\n\nexport type AssetType = keyof typeof types;\n"]}
1
+ {"version":3,"sources":["../../src/Asset.tsx","../../src/AssetIcon/AssetIcon.tsx","../../src/AssetIcon/AssetIcon.styles.ts","../../src/Asset.styles.ts","../../src/types.ts"],"names":["React","cx","Box","Flex","Text","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","tokens","css","getAssetIconStyles","AssetIcon","_a","_b","type","className","testId","otherProps","__objRest","styles","props","__spreadProps","__spreadValues","getAssetStyles","_Asset","ref","src","status","title","showPreview","Asset","types","isAssetType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n Flex,\n type EntityStatus,\n type PickUnion,\n type CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\n\nimport { AssetIcon } from './AssetIcon/AssetIcon';\nimport { getAssetStyles } from './Asset.styles';\nimport type { AssetType } from './types';\n\nexport type AssetStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'deleted' | 'draft' | 'published'\n>;\n\nexport interface AssetProps extends CommonProps {\n /**\n * A `src` attribute to use for image assets\n */\n src?: string;\n /**\n * The publish status of the asset\n */\n status?: AssetStatus;\n /**\n * The title of the asset\n */\n title?: string;\n /**\n * The type of asset being represented\n */\n type?: AssetType;\n}\n\nfunction _Asset(\n {\n className,\n src,\n status,\n testId = 'cf-ui-asset',\n title,\n type = 'image',\n ...otherProps\n }: AssetProps,\n ref: React.Ref<any>,\n) {\n const styles = getAssetStyles();\n const isImage = src && src !== '' && type === 'image';\n\n // Do not show image previews when publish status is archived\n const showPreview = isImage && status !== 'archived';\n\n return (\n <Box\n className={cx(styles.relative, className)}\n testId={testId}\n ref={ref}\n {...otherProps}\n >\n {showPreview ? (\n <>\n <Flex\n alignItems=\"center\"\n justifyContent=\"center\"\n className={styles.height100}\n >\n <img className={styles.image} src={src} alt={title} />\n </Flex>\n {title && (\n <div className={styles.titleContainer}>\n <Text\n className={styles.title}\n fontColor=\"colorWhite\"\n margin=\"spacingS\"\n isTruncated\n >\n {title}\n </Text>\n </div>\n )}\n </>\n ) : (\n <Flex\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n paddingLeft=\"spacingS\"\n paddingRight=\"spacingS\"\n className={styles.height100}\n >\n <Flex\n marginBottom=\"spacingM\"\n marginTop=\"spacingM\"\n justifyContent=\"center\"\n >\n <AssetIcon type={type} />\n </Flex>\n <Text isTruncated marginBottom=\"spacingM\" fontColor=\"gray600\">\n {title}\n </Text>\n </Flex>\n )}\n </Box>\n );\n}\n\n_Asset.displayName = 'Asset';\n\nexport const Asset = React.forwardRef(_Asset);\n","import React from 'react';\nimport {\n ArchiveIcon,\n AudioIcon,\n CodeIllustrationIcon,\n ImageIcon,\n MarkupIcon,\n PdfIcon,\n PlaintextIcon,\n RichtextIcon,\n PresentationIcon,\n SpreadsheetIcon,\n VideoIcon,\n} from '@contentful/f36-icons';\nimport type { GeneratedIconProps } from '@contentful/f36-icon';\nimport type { AssetType } from '../types';\n\nimport { cx } from 'emotion';\nimport { getAssetIconStyles } from './AssetIcon.styles';\n\nexport interface AssetIconProps\n extends Omit<GeneratedIconProps, 'illustration' | 'ref'> {\n type?: AssetType;\n}\n\n/**\n * Renders only the Illustration that would represent this asset's type\n */\nexport const AssetIcon = ({\n type = 'archive',\n className,\n testId = 'cf-ui-asset-icon',\n ...otherProps\n}: AssetIconProps) => {\n const styles = getAssetIconStyles();\n const props = {\n ...otherProps,\n testId,\n className: cx(styles.root, className),\n };\n\n switch (type) {\n case 'audio':\n return <AudioIcon {...props} />;\n case 'code':\n return <CodeIllustrationIcon {...props} />;\n case 'image':\n return <ImageIcon {...props} />;\n case 'markup':\n return <MarkupIcon {...props} />;\n case 'pdf':\n return <PdfIcon {...props} />;\n case 'plaintext':\n return <PlaintextIcon {...props} />;\n case 'presentation':\n return <PresentationIcon {...props} />;\n case 'richtext':\n return <RichtextIcon {...props} />;\n case 'spreadsheet':\n return <SpreadsheetIcon {...props} />;\n case 'video':\n return <VideoIcon {...props} />;\n case 'archive':\n default:\n return <ArchiveIcon {...props} />;\n }\n};\n\nAssetIcon.displayName = 'AssetIcon';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetIconStyles() {\n return {\n root: css({\n display: 'inline-block',\n width: '39px',\n height: '39px',\n 'g, path': {\n fill: tokens.gray600,\n },\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetStyles() {\n return {\n relative: css({\n position: 'relative',\n }),\n height100: css({\n height: '100%',\n }),\n image: css({\n width: 'auto',\n maxWidth: '100%',\n maxHeight: '100%',\n }),\n titleContainer: css({\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'absolute',\n bottom: 0,\n right: 0,\n left: 0,\n height: '100%',\n display: 'flex',\n overflow: 'hidden',\n alignItems: 'flex-end',\n boxSizing: 'border-box',\n background: `linear-gradient(0deg, ${tokens.gray900} 0%, transparent calc(1rem * (100 / ${tokens.fontBaseDefault})), transparent 100% )`,\n ':hover': { opacity: 1 },\n }),\n title: css({\n bottom: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n }),\n };\n}\n","export const types = {\n archive: 'archive',\n audio: 'audio',\n code: 'code',\n image: 'image',\n markup: 'markup',\n pdf: 'pdf',\n plaintext: 'plaintext',\n presentation: 'presentation',\n richtext: 'richtext',\n spreadsheet: 'spreadsheet',\n video: 'video',\n};\n\nexport function isAssetType(type: string): type is AssetType {\n return Object.keys(types).includes(type);\n}\n\nexport type AssetType = keyof typeof types;\n"]}
@@ -0,0 +1,53 @@
1
+ import React from 'react';
2
+ import { PickUnion, EntityStatus, CommonProps } from '@contentful/f36-core';
3
+ import { GeneratedIconProps } from '@contentful/f36-icon';
4
+
5
+ declare const types: {
6
+ archive: string;
7
+ audio: string;
8
+ code: string;
9
+ image: string;
10
+ markup: string;
11
+ pdf: string;
12
+ plaintext: string;
13
+ presentation: string;
14
+ richtext: string;
15
+ spreadsheet: string;
16
+ video: string;
17
+ };
18
+ declare function isAssetType(type: string): type is AssetType;
19
+ declare type AssetType = keyof typeof types;
20
+
21
+ declare type AssetStatus = PickUnion<EntityStatus, 'archived' | 'changed' | 'deleted' | 'draft' | 'published'>;
22
+ interface AssetProps extends CommonProps {
23
+ /**
24
+ * A `src` attribute to use for image assets
25
+ */
26
+ src?: string;
27
+ /**
28
+ * The publish status of the asset
29
+ */
30
+ status?: AssetStatus;
31
+ /**
32
+ * The title of the asset
33
+ */
34
+ title?: string;
35
+ /**
36
+ * The type of asset being represented
37
+ */
38
+ type?: AssetType;
39
+ }
40
+ declare const Asset: React.ForwardRefExoticComponent<AssetProps & React.RefAttributes<any>>;
41
+
42
+ interface AssetIconProps extends Omit<GeneratedIconProps, 'illustration' | 'ref'> {
43
+ type?: AssetType;
44
+ }
45
+ /**
46
+ * Renders only the Illustration that would represent this asset's type
47
+ */
48
+ declare const AssetIcon: {
49
+ ({ type, className, testId, ...otherProps }: AssetIconProps): JSX.Element;
50
+ displayName: string;
51
+ };
52
+
53
+ export { Asset, AssetIcon, AssetIconProps, AssetProps, AssetStatus, AssetType, isAssetType };
package/dist/index.js CHANGED
@@ -1,7 +1,5 @@
1
1
  'use strict';
2
2
 
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
3
  var n = require('react');
6
4
  var emotion = require('emotion');
7
5
  var f36Core = require('@contentful/f36-core');
@@ -9,14 +7,15 @@ var f36Typography = require('@contentful/f36-typography');
9
7
  var f36Icons = require('@contentful/f36-icons');
10
8
  var g = require('@contentful/f36-tokens');
11
9
 
12
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
13
11
 
14
- var n__default = /*#__PURE__*/_interopDefaultLegacy(n);
15
- var g__default = /*#__PURE__*/_interopDefaultLegacy(g);
12
+ var n__default = /*#__PURE__*/_interopDefault(n);
13
+ var g__default = /*#__PURE__*/_interopDefault(g);
16
14
 
17
- var N=Object.defineProperty,w=Object.defineProperties;var B=Object.getOwnPropertyDescriptors;var f=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var A=(t,e,s)=>e in t?N(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s,o=(t,e)=>{for(var s in e||(e={}))I.call(e,s)&&A(t,s,e[s]);if(f)for(var s of f(e))v.call(e,s)&&A(t,s,e[s]);return t},P=(t,e)=>w(t,B(e));var d=(t,e)=>{var s={};for(var r in t)I.call(t,r)&&e.indexOf(r)<0&&(s[r]=t[r]);if(t!=null&&f)for(var r of f(t))e.indexOf(r)<0&&v.call(t,r)&&(s[r]=t[r]);return s};function T(){return {root:emotion.css({display:"inline-block",width:"39px",height:"39px","g, path":{fill:g__default["default"].gray600}})}}var u=c=>{var m=c,{type:t="archive",className:e,testId:s="cf-ui-asset-icon"}=m,r=d(m,["type","className","testId"]);let y=T(),i=P(o({},r),{testId:s,className:emotion.cx(y.root,e)});switch(t){case"audio":return n__default["default"].createElement(f36Icons.AudioIcon,o({},i));case"code":return n__default["default"].createElement(f36Icons.CodeIllustrationIcon,o({},i));case"image":return n__default["default"].createElement(f36Icons.ImageIcon,o({},i));case"markup":return n__default["default"].createElement(f36Icons.MarkupIcon,o({},i));case"pdf":return n__default["default"].createElement(f36Icons.PdfIcon,o({},i));case"plaintext":return n__default["default"].createElement(f36Icons.PlaintextIcon,o({},i));case"presentation":return n__default["default"].createElement(f36Icons.PresentationIcon,o({},i));case"richtext":return n__default["default"].createElement(f36Icons.RichtextIcon,o({},i));case"spreadsheet":return n__default["default"].createElement(f36Icons.SpreadsheetIcon,o({},i));case"video":return n__default["default"].createElement(f36Icons.VideoIcon,o({},i));case"archive":default:return n__default["default"].createElement(f36Icons.ArchiveIcon,o({},i))}};u.displayName="AssetIcon";function S(){return {relative:emotion.css({position:"relative"}),height100:emotion.css({height:"100%"}),image:emotion.css({width:"auto",maxWidth:"100%",maxHeight:"100%"}),titleContainer:emotion.css({opacity:0,transition:`opacity ${g__default["default"].transitionDurationDefault} ${g__default["default"].transitionEasingDefault}`,position:"absolute",bottom:0,right:0,left:0,height:"100%",display:"flex",overflow:"hidden",alignItems:"flex-end",boxSizing:"border-box",background:`linear-gradient(0deg, ${g__default["default"].gray900} 0%, transparent calc(1rem * (100 / ${g__default["default"].fontBaseDefault})), transparent 100% )`,":hover":{opacity:1}}),title:emotion.css({bottom:0,left:0,right:0,position:"absolute"})}}function b(X,i){var h=X,{className:t,src:e,status:s,testId:r="cf-ui-asset",title:c,type:m="image"}=h,y=d(h,["className","src","status","testId","title","type"]);let p=S(),C=e&&e!==""&&m==="image"&&s!=="archived";return n__default["default"].createElement(f36Core.Box,o({className:emotion.cx(p.relative,t),testId:r,ref:i},y),C?n__default["default"].createElement(n__default["default"].Fragment,null,n__default["default"].createElement(f36Core.Flex,{alignItems:"center",justifyContent:"center",className:p.height100},n__default["default"].createElement("img",{className:p.image,src:e,alt:c})),c&&n__default["default"].createElement("div",{className:p.titleContainer},n__default["default"].createElement(f36Typography.Text,{className:p.title,fontColor:"colorWhite",margin:"spacingS",isTruncated:!0},c))):n__default["default"].createElement(f36Core.Flex,{flexDirection:"column",alignItems:"center",justifyContent:"center",paddingLeft:"spacingS",paddingRight:"spacingS",className:p.height100},n__default["default"].createElement(f36Core.Flex,{marginBottom:"spacingM",marginTop:"spacingM",justifyContent:"center"},n__default["default"].createElement(u,{type:m})),n__default["default"].createElement(f36Typography.Text,{isTruncated:!0,marginBottom:"spacingM",fontColor:"gray600"},c)))}b.displayName="Asset";var J=n__default["default"].forwardRef(b);var K={archive:"archive",audio:"audio",code:"code",image:"image",markup:"markup",pdf:"pdf",plaintext:"plaintext",presentation:"presentation",richtext:"richtext",spreadsheet:"spreadsheet",video:"video"};function Q(t){return Object.keys(K).includes(t)}
15
+ var N=Object.defineProperty,w=Object.defineProperties;var B=Object.getOwnPropertyDescriptors;var f=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var A=(t,e,s)=>e in t?N(t,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):t[e]=s,o=(t,e)=>{for(var s in e||(e={}))I.call(e,s)&&A(t,s,e[s]);if(f)for(var s of f(e))v.call(e,s)&&A(t,s,e[s]);return t},P=(t,e)=>w(t,B(e));var d=(t,e)=>{var s={};for(var r in t)I.call(t,r)&&e.indexOf(r)<0&&(s[r]=t[r]);if(t!=null&&f)for(var r of f(t))e.indexOf(r)<0&&v.call(t,r)&&(s[r]=t[r]);return s};function T(){return {root:emotion.css({display:"inline-block",width:"39px",height:"39px","g, path":{fill:g__default.default.gray600}})}}var u=c=>{var m=c,{type:t="archive",className:e,testId:s="cf-ui-asset-icon"}=m,r=d(m,["type","className","testId"]);let y=T(),i=P(o({},r),{testId:s,className:emotion.cx(y.root,e)});switch(t){case"audio":return n__default.default.createElement(f36Icons.AudioIcon,o({},i));case"code":return n__default.default.createElement(f36Icons.CodeIllustrationIcon,o({},i));case"image":return n__default.default.createElement(f36Icons.ImageIcon,o({},i));case"markup":return n__default.default.createElement(f36Icons.MarkupIcon,o({},i));case"pdf":return n__default.default.createElement(f36Icons.PdfIcon,o({},i));case"plaintext":return n__default.default.createElement(f36Icons.PlaintextIcon,o({},i));case"presentation":return n__default.default.createElement(f36Icons.PresentationIcon,o({},i));case"richtext":return n__default.default.createElement(f36Icons.RichtextIcon,o({},i));case"spreadsheet":return n__default.default.createElement(f36Icons.SpreadsheetIcon,o({},i));case"video":return n__default.default.createElement(f36Icons.VideoIcon,o({},i));case"archive":default:return n__default.default.createElement(f36Icons.ArchiveIcon,o({},i))}};u.displayName="AssetIcon";function S(){return {relative:emotion.css({position:"relative"}),height100:emotion.css({height:"100%"}),image:emotion.css({width:"auto",maxWidth:"100%",maxHeight:"100%"}),titleContainer:emotion.css({opacity:0,transition:`opacity ${g__default.default.transitionDurationDefault} ${g__default.default.transitionEasingDefault}`,position:"absolute",bottom:0,right:0,left:0,height:"100%",display:"flex",overflow:"hidden",alignItems:"flex-end",boxSizing:"border-box",background:`linear-gradient(0deg, ${g__default.default.gray900} 0%, transparent calc(1rem * (100 / ${g__default.default.fontBaseDefault})), transparent 100% )`,":hover":{opacity:1}}),title:emotion.css({bottom:0,left:0,right:0,position:"absolute"})}}function b(X,i){var h=X,{className:t,src:e,status:s,testId:r="cf-ui-asset",title:c,type:m="image"}=h,y=d(h,["className","src","status","testId","title","type"]);let p=S(),C=e&&e!==""&&m==="image"&&s!=="archived";return n__default.default.createElement(f36Core.Box,o({className:emotion.cx(p.relative,t),testId:r,ref:i},y),C?n__default.default.createElement(n__default.default.Fragment,null,n__default.default.createElement(f36Core.Flex,{alignItems:"center",justifyContent:"center",className:p.height100},n__default.default.createElement("img",{className:p.image,src:e,alt:c})),c&&n__default.default.createElement("div",{className:p.titleContainer},n__default.default.createElement(f36Typography.Text,{className:p.title,fontColor:"colorWhite",margin:"spacingS",isTruncated:!0},c))):n__default.default.createElement(f36Core.Flex,{flexDirection:"column",alignItems:"center",justifyContent:"center",paddingLeft:"spacingS",paddingRight:"spacingS",className:p.height100},n__default.default.createElement(f36Core.Flex,{marginBottom:"spacingM",marginTop:"spacingM",justifyContent:"center"},n__default.default.createElement(u,{type:m})),n__default.default.createElement(f36Typography.Text,{isTruncated:!0,marginBottom:"spacingM",fontColor:"gray600"},c)))}b.displayName="Asset";var J=n__default.default.forwardRef(b);var K={archive:"archive",audio:"audio",code:"code",image:"image",markup:"markup",pdf:"pdf",plaintext:"plaintext",presentation:"presentation",richtext:"richtext",spreadsheet:"spreadsheet",video:"video"};function Q(t){return Object.keys(K).includes(t)}
18
16
 
19
17
  exports.Asset = J;
20
18
  exports.AssetIcon = u;
21
19
  exports.isAssetType = Q;
20
+ //# sourceMappingURL=out.js.map
22
21
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Asset.tsx","../src/AssetIcon/AssetIcon.tsx","../src/AssetIcon/AssetIcon.styles.ts","../src/Asset.styles.ts","../src/types.ts"],"names":["React","cx","Box","Flex","Text","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","tokens","css","getAssetIconStyles","AssetIcon","_a","_b","type","className","testId","otherProps","__objRest","styles","props","__spreadProps","__spreadValues","getAssetStyles","_Asset","ref","src","status","title","showPreview","Asset","types","isAssetType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n Flex,\n type EntityStatus,\n type PickUnion,\n type CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\n\nimport { AssetIcon } from './AssetIcon/AssetIcon';\nimport { getAssetStyles } from './Asset.styles';\nimport type { AssetType } from './types';\n\nexport type AssetStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'deleted' | 'draft' | 'published'\n>;\n\nexport interface AssetProps extends CommonProps {\n /**\n * A `src` attribute to use for image assets\n */\n src?: string;\n /**\n * The publish status of the asset\n */\n status?: AssetStatus;\n /**\n * The title of the asset\n */\n title?: string;\n /**\n * The type of asset being represented\n */\n type?: AssetType;\n}\n\nfunction _Asset(\n {\n className,\n src,\n status,\n testId = 'cf-ui-asset',\n title,\n type = 'image',\n ...otherProps\n }: AssetProps,\n ref: React.Ref<any>,\n) {\n const styles = getAssetStyles();\n const isImage = src && src !== '' && type === 'image';\n\n // Do not show image previews when publish status is archived\n const showPreview = isImage && status !== 'archived';\n\n return (\n <Box\n className={cx(styles.relative, className)}\n testId={testId}\n ref={ref}\n {...otherProps}\n >\n {showPreview ? (\n <>\n <Flex\n alignItems=\"center\"\n justifyContent=\"center\"\n className={styles.height100}\n >\n <img className={styles.image} src={src} alt={title} />\n </Flex>\n {title && (\n <div className={styles.titleContainer}>\n <Text\n className={styles.title}\n fontColor=\"colorWhite\"\n margin=\"spacingS\"\n isTruncated\n >\n {title}\n </Text>\n </div>\n )}\n </>\n ) : (\n <Flex\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n paddingLeft=\"spacingS\"\n paddingRight=\"spacingS\"\n className={styles.height100}\n >\n <Flex\n marginBottom=\"spacingM\"\n marginTop=\"spacingM\"\n justifyContent=\"center\"\n >\n <AssetIcon type={type} />\n </Flex>\n <Text isTruncated marginBottom=\"spacingM\" fontColor=\"gray600\">\n {title}\n </Text>\n </Flex>\n )}\n </Box>\n );\n}\n\n_Asset.displayName = 'Asset';\n\nexport const Asset = React.forwardRef(_Asset);\n","import React from 'react';\nimport {\n ArchiveIcon,\n AudioIcon,\n CodeIllustrationIcon,\n ImageIcon,\n MarkupIcon,\n PdfIcon,\n PlaintextIcon,\n RichtextIcon,\n PresentationIcon,\n SpreadsheetIcon,\n VideoIcon,\n} from '@contentful/f36-icons';\nimport type { GeneratedIconProps } from '@contentful/f36-icon';\nimport type { AssetType } from '../types';\n\nimport { cx } from 'emotion';\nimport { getAssetIconStyles } from './AssetIcon.styles';\n\nexport interface AssetIconProps\n extends Omit<GeneratedIconProps, 'illustration' | 'ref'> {\n type?: AssetType;\n}\n\n/**\n * Renders only the Illustration that would represent this asset's type\n */\nexport const AssetIcon = ({\n type = 'archive',\n className,\n testId = 'cf-ui-asset-icon',\n ...otherProps\n}: AssetIconProps) => {\n const styles = getAssetIconStyles();\n const props = {\n ...otherProps,\n testId,\n className: cx(styles.root, className),\n };\n\n switch (type) {\n case 'audio':\n return <AudioIcon {...props} />;\n case 'code':\n return <CodeIllustrationIcon {...props} />;\n case 'image':\n return <ImageIcon {...props} />;\n case 'markup':\n return <MarkupIcon {...props} />;\n case 'pdf':\n return <PdfIcon {...props} />;\n case 'plaintext':\n return <PlaintextIcon {...props} />;\n case 'presentation':\n return <PresentationIcon {...props} />;\n case 'richtext':\n return <RichtextIcon {...props} />;\n case 'spreadsheet':\n return <SpreadsheetIcon {...props} />;\n case 'video':\n return <VideoIcon {...props} />;\n case 'archive':\n default:\n return <ArchiveIcon {...props} />;\n }\n};\n\nAssetIcon.displayName = 'AssetIcon';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetIconStyles() {\n return {\n root: css({\n display: 'inline-block',\n width: '39px',\n height: '39px',\n 'g, path': {\n fill: tokens.gray600,\n },\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetStyles() {\n return {\n relative: css({\n position: 'relative',\n }),\n height100: css({\n height: '100%',\n }),\n image: css({\n width: 'auto',\n maxWidth: '100%',\n maxHeight: '100%',\n }),\n titleContainer: css({\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'absolute',\n bottom: 0,\n right: 0,\n left: 0,\n height: '100%',\n display: 'flex',\n overflow: 'hidden',\n alignItems: 'flex-end',\n boxSizing: 'border-box',\n background: `linear-gradient(0deg, ${tokens.gray900} 0%, transparent calc(1rem * (100 / ${tokens.fontBaseDefault})), transparent 100% )`,\n ':hover': { opacity: 1 },\n }),\n title: css({\n bottom: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n }),\n };\n}\n","export const types = {\n archive: 'archive',\n audio: 'audio',\n code: 'code',\n image: 'image',\n markup: 'markup',\n pdf: 'pdf',\n plaintext: 'plaintext',\n presentation: 'presentation',\n richtext: 'richtext',\n spreadsheet: 'spreadsheet',\n video: 'video',\n};\n\nexport function isAssetType(type: string): type is AssetType {\n return Object.keys(types).includes(type);\n}\n\nexport type AssetType = keyof typeof types;\n"]}
1
+ {"version":3,"sources":["../src/Asset.tsx","../src/AssetIcon/AssetIcon.tsx","../src/AssetIcon/AssetIcon.styles.ts","../src/Asset.styles.ts","../src/types.ts"],"names":["React","cx","Box","Flex","Text","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","tokens","css","getAssetIconStyles","AssetIcon","_a","_b","type","className","testId","otherProps","__objRest","styles","props","__spreadProps","__spreadValues","getAssetStyles","_Asset","ref","src","status","title","showPreview","Asset","types","isAssetType"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { cx } from 'emotion';\nimport {\n Box,\n Flex,\n type EntityStatus,\n type PickUnion,\n type CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\n\nimport { AssetIcon } from './AssetIcon/AssetIcon';\nimport { getAssetStyles } from './Asset.styles';\nimport type { AssetType } from './types';\n\nexport type AssetStatus = PickUnion<\n EntityStatus,\n 'archived' | 'changed' | 'deleted' | 'draft' | 'published'\n>;\n\nexport interface AssetProps extends CommonProps {\n /**\n * A `src` attribute to use for image assets\n */\n src?: string;\n /**\n * The publish status of the asset\n */\n status?: AssetStatus;\n /**\n * The title of the asset\n */\n title?: string;\n /**\n * The type of asset being represented\n */\n type?: AssetType;\n}\n\nfunction _Asset(\n {\n className,\n src,\n status,\n testId = 'cf-ui-asset',\n title,\n type = 'image',\n ...otherProps\n }: AssetProps,\n ref: React.Ref<any>,\n) {\n const styles = getAssetStyles();\n const isImage = src && src !== '' && type === 'image';\n\n // Do not show image previews when publish status is archived\n const showPreview = isImage && status !== 'archived';\n\n return (\n <Box\n className={cx(styles.relative, className)}\n testId={testId}\n ref={ref}\n {...otherProps}\n >\n {showPreview ? (\n <>\n <Flex\n alignItems=\"center\"\n justifyContent=\"center\"\n className={styles.height100}\n >\n <img className={styles.image} src={src} alt={title} />\n </Flex>\n {title && (\n <div className={styles.titleContainer}>\n <Text\n className={styles.title}\n fontColor=\"colorWhite\"\n margin=\"spacingS\"\n isTruncated\n >\n {title}\n </Text>\n </div>\n )}\n </>\n ) : (\n <Flex\n flexDirection=\"column\"\n alignItems=\"center\"\n justifyContent=\"center\"\n paddingLeft=\"spacingS\"\n paddingRight=\"spacingS\"\n className={styles.height100}\n >\n <Flex\n marginBottom=\"spacingM\"\n marginTop=\"spacingM\"\n justifyContent=\"center\"\n >\n <AssetIcon type={type} />\n </Flex>\n <Text isTruncated marginBottom=\"spacingM\" fontColor=\"gray600\">\n {title}\n </Text>\n </Flex>\n )}\n </Box>\n );\n}\n\n_Asset.displayName = 'Asset';\n\nexport const Asset = React.forwardRef(_Asset);\n","import React from 'react';\nimport {\n ArchiveIcon,\n AudioIcon,\n CodeIllustrationIcon,\n ImageIcon,\n MarkupIcon,\n PdfIcon,\n PlaintextIcon,\n RichtextIcon,\n PresentationIcon,\n SpreadsheetIcon,\n VideoIcon,\n} from '@contentful/f36-icons';\nimport type { GeneratedIconProps } from '@contentful/f36-icon';\nimport type { AssetType } from '../types';\n\nimport { cx } from 'emotion';\nimport { getAssetIconStyles } from './AssetIcon.styles';\n\nexport interface AssetIconProps\n extends Omit<GeneratedIconProps, 'illustration' | 'ref'> {\n type?: AssetType;\n}\n\n/**\n * Renders only the Illustration that would represent this asset's type\n */\nexport const AssetIcon = ({\n type = 'archive',\n className,\n testId = 'cf-ui-asset-icon',\n ...otherProps\n}: AssetIconProps) => {\n const styles = getAssetIconStyles();\n const props = {\n ...otherProps,\n testId,\n className: cx(styles.root, className),\n };\n\n switch (type) {\n case 'audio':\n return <AudioIcon {...props} />;\n case 'code':\n return <CodeIllustrationIcon {...props} />;\n case 'image':\n return <ImageIcon {...props} />;\n case 'markup':\n return <MarkupIcon {...props} />;\n case 'pdf':\n return <PdfIcon {...props} />;\n case 'plaintext':\n return <PlaintextIcon {...props} />;\n case 'presentation':\n return <PresentationIcon {...props} />;\n case 'richtext':\n return <RichtextIcon {...props} />;\n case 'spreadsheet':\n return <SpreadsheetIcon {...props} />;\n case 'video':\n return <VideoIcon {...props} />;\n case 'archive':\n default:\n return <ArchiveIcon {...props} />;\n }\n};\n\nAssetIcon.displayName = 'AssetIcon';\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetIconStyles() {\n return {\n root: css({\n display: 'inline-block',\n width: '39px',\n height: '39px',\n 'g, path': {\n fill: tokens.gray600,\n },\n }),\n };\n}\n","import tokens from '@contentful/f36-tokens';\nimport { css } from 'emotion';\n\nexport function getAssetStyles() {\n return {\n relative: css({\n position: 'relative',\n }),\n height100: css({\n height: '100%',\n }),\n image: css({\n width: 'auto',\n maxWidth: '100%',\n maxHeight: '100%',\n }),\n titleContainer: css({\n opacity: 0,\n transition: `opacity ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n position: 'absolute',\n bottom: 0,\n right: 0,\n left: 0,\n height: '100%',\n display: 'flex',\n overflow: 'hidden',\n alignItems: 'flex-end',\n boxSizing: 'border-box',\n background: `linear-gradient(0deg, ${tokens.gray900} 0%, transparent calc(1rem * (100 / ${tokens.fontBaseDefault})), transparent 100% )`,\n ':hover': { opacity: 1 },\n }),\n title: css({\n bottom: 0,\n left: 0,\n right: 0,\n position: 'absolute',\n }),\n };\n}\n","export const types = {\n archive: 'archive',\n audio: 'audio',\n code: 'code',\n image: 'image',\n markup: 'markup',\n pdf: 'pdf',\n plaintext: 'plaintext',\n presentation: 'presentation',\n richtext: 'richtext',\n spreadsheet: 'spreadsheet',\n video: 'video',\n};\n\nexport function isAssetType(type: string): type is AssetType {\n return Object.keys(types).includes(type);\n}\n\nexport type AssetType = keyof typeof types;\n"]}
package/package.json CHANGED
@@ -1,16 +1,16 @@
1
1
  {
2
2
  "name": "@contentful/f36-asset",
3
- "version": "4.47.3",
3
+ "version": "4.48.1",
4
4
  "description": "Forma 36: Asset component",
5
5
  "scripts": {
6
6
  "build": "tsup"
7
7
  },
8
8
  "dependencies": {
9
- "@contentful/f36-core": "^4.47.3",
10
- "@contentful/f36-icon": "^4.47.3",
11
- "@contentful/f36-icons": "^4.26.0",
9
+ "@contentful/f36-core": "^4.48.1",
10
+ "@contentful/f36-icon": "^4.48.1",
11
+ "@contentful/f36-icons": "^4.27.0",
12
12
  "@contentful/f36-tokens": "^4.0.2",
13
- "@contentful/f36-typography": "^4.47.3",
13
+ "@contentful/f36-typography": "^4.48.1",
14
14
  "emotion": "^10.0.17"
15
15
  },
16
16
  "peerDependencies": {