@contentful/f36-asset 4.14.0 → 4.16.0

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/CHANGELOG.md +30 -0
  2. package/dist/main.js +74 -74
  3. package/dist/main.js.map +1 -1
  4. package/dist/module.js +74 -74
  5. package/dist/module.js.map +1 -1
  6. package/dist/types.d.ts.map +1 -1
  7. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,35 @@
1
1
  # Change Log
2
2
 
3
+ ## 4.16.0
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies []:
8
+ - @contentful/f36-icon@4.16.0
9
+ - @contentful/f36-icons@4.16.0
10
+ - @contentful/f36-typography@4.16.0
11
+ - @contentful/f36-core@4.16.0
12
+
13
+ ## 4.15.1
14
+
15
+ ### Patch Changes
16
+
17
+ - Updated dependencies []:
18
+ - @contentful/f36-icon@4.15.1
19
+ - @contentful/f36-icons@4.15.1
20
+ - @contentful/f36-typography@4.15.1
21
+ - @contentful/f36-core@4.15.1
22
+
23
+ ## 4.15.0
24
+
25
+ ### Patch Changes
26
+
27
+ - Updated dependencies [[`647c849e`](https://github.com/contentful/forma-36/commit/647c849e30891f65be401e95d2ae45b5a715da36)]:
28
+ - @contentful/f36-icon@4.15.0
29
+ - @contentful/f36-icons@4.15.0
30
+ - @contentful/f36-typography@4.15.0
31
+ - @contentful/f36-core@4.15.0
32
+
3
33
  ## 4.14.0
4
34
 
5
35
  ### Patch Changes
package/dist/main.js CHANGED
@@ -1,7 +1,7 @@
1
1
  var $goRX5$emotion = require("emotion");
2
2
  var $goRX5$react = require("react");
3
- var $goRX5$contentfulf36typography = require("@contentful/f36-typography");
4
3
  var $goRX5$contentfulf36core = require("@contentful/f36-core");
4
+ var $goRX5$contentfulf36typography = require("@contentful/f36-typography");
5
5
  var $goRX5$contentfulf36icons = require("@contentful/f36-icons");
6
6
  var $goRX5$contentfulf36tokens = require("@contentful/f36-tokens");
7
7
 
@@ -26,88 +26,88 @@ $parcel$export(module.exports, "isAssetType", () => $ecfcb790f927d565$export$3cc
26
26
 
27
27
  function $a7f01243e6d07e2f$export$d4130e73e2e8f9dd() {
28
28
  return {
29
- root: /*#__PURE__*/ $goRX5$emotion.css({
30
- display: 'inline-block',
31
- width: '39px',
32
- height: '39px',
33
- 'g, path': {
34
- fill: ($parcel$interopDefault($goRX5$contentfulf36tokens)).gray600
29
+ root: /*#__PURE__*/ (0, $goRX5$emotion.css)({
30
+ display: "inline-block",
31
+ width: "39px",
32
+ height: "39px",
33
+ "g, path": {
34
+ fill: (0, ($parcel$interopDefault($goRX5$contentfulf36tokens))).gray600
35
35
  }
36
36
  })
37
37
  };
38
38
  }
39
39
 
40
40
 
41
- const $bdfac71418b2e6eb$export$de8d5274b07acfbd = ({ type: type = 'archive' , className: className , testId: testId = 'cf-ui-asset-icon' , ...otherProps })=>{
42
- const styles = $a7f01243e6d07e2f$export$d4130e73e2e8f9dd();
41
+ const $bdfac71418b2e6eb$export$de8d5274b07acfbd = ({ type: type = "archive" , className: className , testId: testId = "cf-ui-asset-icon" , ...otherProps })=>{
42
+ const styles = (0, $a7f01243e6d07e2f$export$d4130e73e2e8f9dd)();
43
43
  const props = {
44
44
  ...otherProps,
45
45
  testId: testId,
46
- className: $goRX5$emotion.cx(styles.root, className)
46
+ className: (0, $goRX5$emotion.cx)(styles.root, className)
47
47
  };
48
48
  switch(type){
49
- case 'audio':
50
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.AudioIcon, props);
51
- case 'code':
52
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.CodeIllustrationIcon, props);
53
- case 'image':
54
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.ImageIcon, props);
55
- case 'markup':
56
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.MarkupIcon, props);
57
- case 'pdf':
58
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.PdfIcon, props);
59
- case 'plaintext':
60
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.PlaintextIcon, props);
61
- case 'presentation':
62
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.PresentationIcon, props);
63
- case 'richtext':
64
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.RichtextIcon, props);
65
- case 'spreadsheet':
66
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.SpreadsheetIcon, props);
67
- case 'video':
68
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.VideoIcon, props);
69
- case 'archive':
49
+ case "audio":
50
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.AudioIcon), props);
51
+ case "code":
52
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.CodeIllustrationIcon), props);
53
+ case "image":
54
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.ImageIcon), props);
55
+ case "markup":
56
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.MarkupIcon), props);
57
+ case "pdf":
58
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.PdfIcon), props);
59
+ case "plaintext":
60
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.PlaintextIcon), props);
61
+ case "presentation":
62
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.PresentationIcon), props);
63
+ case "richtext":
64
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.RichtextIcon), props);
65
+ case "spreadsheet":
66
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.SpreadsheetIcon), props);
67
+ case "video":
68
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.VideoIcon), props);
69
+ case "archive":
70
70
  default:
71
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36icons.ArchiveIcon, props);
71
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36icons.ArchiveIcon), props);
72
72
  }
73
73
  };
74
- $bdfac71418b2e6eb$export$de8d5274b07acfbd.displayName = 'AssetIcon';
74
+ $bdfac71418b2e6eb$export$de8d5274b07acfbd.displayName = "AssetIcon";
75
75
 
76
76
 
77
77
 
78
78
 
79
79
  function $757deda98165af5b$export$fa02bd03531e2fe() {
80
80
  return {
81
- relative: /*#__PURE__*/ $goRX5$emotion.css({
81
+ relative: /*#__PURE__*/ (0, $goRX5$emotion.css)({
82
82
  name: "79elbk",
83
83
  styles: "position:relative;"
84
84
  }),
85
- height100: /*#__PURE__*/ $goRX5$emotion.css({
85
+ height100: /*#__PURE__*/ (0, $goRX5$emotion.css)({
86
86
  name: "10klw3m",
87
87
  styles: "height:100%;"
88
88
  }),
89
- image: /*#__PURE__*/ $goRX5$emotion.css({
89
+ image: /*#__PURE__*/ (0, $goRX5$emotion.css)({
90
90
  name: "1ylrs5",
91
91
  styles: "width:auto;max-width:100%;max-height:100%;"
92
92
  }),
93
- titleContainer: /*#__PURE__*/ $goRX5$emotion.css({
93
+ titleContainer: /*#__PURE__*/ (0, $goRX5$emotion.css)({
94
94
  opacity: 0,
95
- transition: `opacity ${($parcel$interopDefault($goRX5$contentfulf36tokens)).transitionDurationDefault} ${($parcel$interopDefault($goRX5$contentfulf36tokens)).transitionEasingDefault}`,
96
- position: 'absolute',
95
+ transition: `opacity ${(0, ($parcel$interopDefault($goRX5$contentfulf36tokens))).transitionDurationDefault} ${(0, ($parcel$interopDefault($goRX5$contentfulf36tokens))).transitionEasingDefault}`,
96
+ position: "absolute",
97
97
  bottom: 0,
98
98
  right: 0,
99
99
  left: 0,
100
- height: '100%',
101
- display: 'flex',
102
- overflow: 'hidden',
103
- alignItems: 'flex-end',
104
- boxSizing: 'border-box',
105
- background: `linear-gradient(0deg, ${($parcel$interopDefault($goRX5$contentfulf36tokens)).gray900} 0%, transparent calc(1rem * (100 / ${($parcel$interopDefault($goRX5$contentfulf36tokens)).fontBaseDefault})), transparent 100% )`,
106
- ':hover': {
100
+ height: "100%",
101
+ display: "flex",
102
+ overflow: "hidden",
103
+ alignItems: "flex-end",
104
+ boxSizing: "border-box",
105
+ background: `linear-gradient(0deg, ${(0, ($parcel$interopDefault($goRX5$contentfulf36tokens))).gray900} 0%, transparent calc(1rem * (100 / ${(0, ($parcel$interopDefault($goRX5$contentfulf36tokens))).fontBaseDefault})), transparent 100% )`,
106
+ ":hover": {
107
107
  opacity: 1
108
108
  }
109
109
  }),
110
- title: /*#__PURE__*/ $goRX5$emotion.css({
110
+ title: /*#__PURE__*/ (0, $goRX5$emotion.css)({
111
111
  name: "4gk4ib",
112
112
  styles: "bottom:0;left:0;right:0;position:absolute;"
113
113
  })
@@ -115,66 +115,66 @@ function $757deda98165af5b$export$fa02bd03531e2fe() {
115
115
  }
116
116
 
117
117
 
118
- function $ee511d6a9591eb62$var$_Asset({ className: className , src: src , status: status , testId: testId = 'cf-ui-asset' , title: title , type: type = 'image' , ...otherProps }, ref) {
119
- const styles = $757deda98165af5b$export$fa02bd03531e2fe();
120
- const isImage = src && src !== '' && type === 'image'; // Do not show image previews when publish status is archived
121
- const showPreview = isImage && status !== 'archived';
122
- return /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36core.Box, {
123
- className: $goRX5$emotion.cx(styles.relative, className),
118
+ function $ee511d6a9591eb62$var$_Asset({ className: className , src: src , status: status , testId: testId = "cf-ui-asset" , title: title , type: type = "image" , ...otherProps }, ref) {
119
+ const styles = (0, $757deda98165af5b$export$fa02bd03531e2fe)();
120
+ const isImage = src && src !== "" && type === "image"; // Do not show image previews when publish status is archived
121
+ const showPreview = isImage && status !== "archived";
122
+ return /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36core.Box), {
123
+ className: (0, $goRX5$emotion.cx)(styles.relative, className),
124
124
  testId: testId,
125
125
  ref: ref,
126
126
  ...otherProps
127
- }, showPreview ? /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement(($parcel$interopDefault($goRX5$react)).Fragment, null, /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36core.Flex, {
127
+ }, showPreview ? /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, ($parcel$interopDefault($goRX5$react))).Fragment, null, /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36core.Flex), {
128
128
  alignItems: "center",
129
129
  justifyContent: "center",
130
130
  className: styles.height100
131
- }, /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement("img", {
131
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement("img", {
132
132
  className: styles.image,
133
133
  src: src,
134
134
  alt: title
135
- })), title && /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement("div", {
135
+ })), title && /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement("div", {
136
136
  className: styles.titleContainer
137
- }, /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36typography.Text, {
137
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36typography.Text), {
138
138
  className: styles.title,
139
139
  fontColor: "colorWhite",
140
140
  margin: "spacingS",
141
141
  isTruncated: true
142
- }, title))) : /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36core.Flex, {
142
+ }, title))) : /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36core.Flex), {
143
143
  flexDirection: "column",
144
144
  alignItems: "center",
145
145
  justifyContent: "center",
146
146
  paddingLeft: "spacingS",
147
147
  paddingRight: "spacingS",
148
148
  className: styles.height100
149
- }, /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36core.Flex, {
149
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36core.Flex), {
150
150
  marginBottom: "spacingM",
151
151
  marginTop: "spacingM",
152
152
  justifyContent: "center"
153
- }, /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($bdfac71418b2e6eb$export$de8d5274b07acfbd, {
153
+ }, /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $bdfac71418b2e6eb$export$de8d5274b07acfbd), {
154
154
  type: type
155
- })), /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).createElement($goRX5$contentfulf36typography.Text, {
155
+ })), /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).createElement((0, $goRX5$contentfulf36typography.Text), {
156
156
  isTruncated: true,
157
157
  marginBottom: "spacingM",
158
158
  fontColor: "gray600"
159
159
  }, title)));
160
160
  }
161
- $ee511d6a9591eb62$var$_Asset.displayName = 'Asset';
162
- const $ee511d6a9591eb62$export$c413dd039085b182 = /*#__PURE__*/ ($parcel$interopDefault($goRX5$react)).forwardRef($ee511d6a9591eb62$var$_Asset);
161
+ $ee511d6a9591eb62$var$_Asset.displayName = "Asset";
162
+ const $ee511d6a9591eb62$export$c413dd039085b182 = /*#__PURE__*/ (0, ($parcel$interopDefault($goRX5$react))).forwardRef($ee511d6a9591eb62$var$_Asset);
163
163
 
164
164
 
165
165
 
166
166
  const $ecfcb790f927d565$export$b14ad400b1d09e0f = {
167
- archive: 'archive',
168
- audio: 'audio',
169
- code: 'code',
170
- image: 'image',
171
- markup: 'markup',
172
- pdf: 'pdf',
173
- plaintext: 'plaintext',
174
- presentation: 'presentation',
175
- richtext: 'richtext',
176
- spreadsheet: 'spreadsheet',
177
- video: 'video'
167
+ archive: "archive",
168
+ audio: "audio",
169
+ code: "code",
170
+ image: "image",
171
+ markup: "markup",
172
+ pdf: "pdf",
173
+ plaintext: "plaintext",
174
+ presentation: "presentation",
175
+ richtext: "richtext",
176
+ spreadsheet: "spreadsheet",
177
+ video: "video"
178
178
  };
179
179
  function $ecfcb790f927d565$export$3ccaa71e0816392d(type) {
180
180
  return Object.keys($ecfcb790f927d565$export$b14ad400b1d09e0f).includes(type);
package/dist/main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/asset/src/index.ts","packages/components/asset/src/Asset.tsx","packages/components/asset/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/Asset.styles.ts","packages/components/asset/src/types.ts"],"sourcesContent":["export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type {\n EntityStatus,\n PickUnion,\n CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\nimport { Box, Flex } from '@contentful/f36-core';\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"],"names":["Asset","AssetProps","AssetStatus","AssetIcon","AssetIconProps","AssetType","isAssetType","React","EntityStatus","PickUnion","CommonProps","Text","Box","Flex","getAssetStyles","src","status","title","type","_Asset","className","testId","otherProps","ref","Ref","styles","isImage","showPreview","relative","height100","image","titleContainer","displayName","forwardRef","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","GeneratedIconProps","getAssetIconStyles","Omit","props","root","tokens","display","width","height","fill","gray600","opacity","transition","transitionDurationDefault","transitionEasingDefault","position","bottom","right","left","overflow","alignItems","boxSizing","background","gray900","fontBaseDefault","types","archive","audio","code","markup","pdf","plaintext","presentation","richtext","spreadsheet","video","Object","keys","includes"],"version":3,"file":"main.js.map"}
1
+ {"mappings":"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","sources":["packages/components/asset/src/index.ts","packages/components/asset/src/Asset.tsx","packages/components/asset/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/Asset.styles.ts","packages/components/asset/src/types.ts"],"sourcesContent":["export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n","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"],"names":["Asset","AssetProps","AssetStatus","AssetIcon","AssetIconProps","AssetType","isAssetType","React","Box","Flex","EntityStatus","PickUnion","CommonProps","Text","getAssetStyles","src","status","title","type","_Asset","className","testId","otherProps","ref","Ref","styles","isImage","showPreview","relative","height100","image","titleContainer","displayName","forwardRef","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","GeneratedIconProps","getAssetIconStyles","Omit","props","root","tokens","display","width","height","fill","gray600","opacity","transition","transitionDurationDefault","transitionEasingDefault","position","bottom","right","left","overflow","alignItems","boxSizing","background","gray900","fontBaseDefault","types","archive","audio","code","markup","pdf","plaintext","presentation","richtext","spreadsheet","video","Object","keys","includes"],"version":3,"file":"main.js.map"}
package/dist/module.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import {cx as $dtSHR$cx, css as $dtSHR$css} from "emotion";
2
2
  import $dtSHR$react from "react";
3
- import {Text as $dtSHR$Text} from "@contentful/f36-typography";
4
3
  import {Box as $dtSHR$Box, Flex as $dtSHR$Flex} from "@contentful/f36-core";
4
+ import {Text as $dtSHR$Text} from "@contentful/f36-typography";
5
5
  import {AudioIcon as $dtSHR$AudioIcon, CodeIllustrationIcon as $dtSHR$CodeIllustrationIcon, ImageIcon as $dtSHR$ImageIcon, MarkupIcon as $dtSHR$MarkupIcon, PdfIcon as $dtSHR$PdfIcon, PlaintextIcon as $dtSHR$PlaintextIcon, PresentationIcon as $dtSHR$PresentationIcon, RichtextIcon as $dtSHR$RichtextIcon, SpreadsheetIcon as $dtSHR$SpreadsheetIcon, VideoIcon as $dtSHR$VideoIcon, ArchiveIcon as $dtSHR$ArchiveIcon} from "@contentful/f36-icons";
6
6
  import $dtSHR$contentfulf36tokens from "@contentful/f36-tokens";
7
7
 
@@ -16,88 +16,88 @@ import $dtSHR$contentfulf36tokens from "@contentful/f36-tokens";
16
16
 
17
17
  function $6f9c5a7cc9575f3b$export$d4130e73e2e8f9dd() {
18
18
  return {
19
- root: /*#__PURE__*/ $dtSHR$css({
20
- display: 'inline-block',
21
- width: '39px',
22
- height: '39px',
23
- 'g, path': {
24
- fill: $dtSHR$contentfulf36tokens.gray600
19
+ root: /*#__PURE__*/ (0, $dtSHR$css)({
20
+ display: "inline-block",
21
+ width: "39px",
22
+ height: "39px",
23
+ "g, path": {
24
+ fill: (0, $dtSHR$contentfulf36tokens).gray600
25
25
  }
26
26
  })
27
27
  };
28
28
  }
29
29
 
30
30
 
31
- const $294bba6cf7661148$export$de8d5274b07acfbd = ({ type: type = 'archive' , className: className , testId: testId = 'cf-ui-asset-icon' , ...otherProps })=>{
32
- const styles = $6f9c5a7cc9575f3b$export$d4130e73e2e8f9dd();
31
+ const $294bba6cf7661148$export$de8d5274b07acfbd = ({ type: type = "archive" , className: className , testId: testId = "cf-ui-asset-icon" , ...otherProps })=>{
32
+ const styles = (0, $6f9c5a7cc9575f3b$export$d4130e73e2e8f9dd)();
33
33
  const props = {
34
34
  ...otherProps,
35
35
  testId: testId,
36
- className: $dtSHR$cx(styles.root, className)
36
+ className: (0, $dtSHR$cx)(styles.root, className)
37
37
  };
38
38
  switch(type){
39
- case 'audio':
40
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$AudioIcon, props);
41
- case 'code':
42
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$CodeIllustrationIcon, props);
43
- case 'image':
44
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$ImageIcon, props);
45
- case 'markup':
46
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$MarkupIcon, props);
47
- case 'pdf':
48
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$PdfIcon, props);
49
- case 'plaintext':
50
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$PlaintextIcon, props);
51
- case 'presentation':
52
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$PresentationIcon, props);
53
- case 'richtext':
54
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$RichtextIcon, props);
55
- case 'spreadsheet':
56
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$SpreadsheetIcon, props);
57
- case 'video':
58
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$VideoIcon, props);
59
- case 'archive':
39
+ case "audio":
40
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$AudioIcon), props);
41
+ case "code":
42
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$CodeIllustrationIcon), props);
43
+ case "image":
44
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$ImageIcon), props);
45
+ case "markup":
46
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$MarkupIcon), props);
47
+ case "pdf":
48
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$PdfIcon), props);
49
+ case "plaintext":
50
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$PlaintextIcon), props);
51
+ case "presentation":
52
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$PresentationIcon), props);
53
+ case "richtext":
54
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$RichtextIcon), props);
55
+ case "spreadsheet":
56
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$SpreadsheetIcon), props);
57
+ case "video":
58
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$VideoIcon), props);
59
+ case "archive":
60
60
  default:
61
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$ArchiveIcon, props);
61
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$ArchiveIcon), props);
62
62
  }
63
63
  };
64
- $294bba6cf7661148$export$de8d5274b07acfbd.displayName = 'AssetIcon';
64
+ $294bba6cf7661148$export$de8d5274b07acfbd.displayName = "AssetIcon";
65
65
 
66
66
 
67
67
 
68
68
 
69
69
  function $dc8375c31ef26a6b$export$fa02bd03531e2fe() {
70
70
  return {
71
- relative: /*#__PURE__*/ $dtSHR$css({
71
+ relative: /*#__PURE__*/ (0, $dtSHR$css)({
72
72
  name: "79elbk",
73
73
  styles: "position:relative;"
74
74
  }),
75
- height100: /*#__PURE__*/ $dtSHR$css({
75
+ height100: /*#__PURE__*/ (0, $dtSHR$css)({
76
76
  name: "10klw3m",
77
77
  styles: "height:100%;"
78
78
  }),
79
- image: /*#__PURE__*/ $dtSHR$css({
79
+ image: /*#__PURE__*/ (0, $dtSHR$css)({
80
80
  name: "1ylrs5",
81
81
  styles: "width:auto;max-width:100%;max-height:100%;"
82
82
  }),
83
- titleContainer: /*#__PURE__*/ $dtSHR$css({
83
+ titleContainer: /*#__PURE__*/ (0, $dtSHR$css)({
84
84
  opacity: 0,
85
- transition: `opacity ${$dtSHR$contentfulf36tokens.transitionDurationDefault} ${$dtSHR$contentfulf36tokens.transitionEasingDefault}`,
86
- position: 'absolute',
85
+ transition: `opacity ${(0, $dtSHR$contentfulf36tokens).transitionDurationDefault} ${(0, $dtSHR$contentfulf36tokens).transitionEasingDefault}`,
86
+ position: "absolute",
87
87
  bottom: 0,
88
88
  right: 0,
89
89
  left: 0,
90
- height: '100%',
91
- display: 'flex',
92
- overflow: 'hidden',
93
- alignItems: 'flex-end',
94
- boxSizing: 'border-box',
95
- background: `linear-gradient(0deg, ${$dtSHR$contentfulf36tokens.gray900} 0%, transparent calc(1rem * (100 / ${$dtSHR$contentfulf36tokens.fontBaseDefault})), transparent 100% )`,
96
- ':hover': {
90
+ height: "100%",
91
+ display: "flex",
92
+ overflow: "hidden",
93
+ alignItems: "flex-end",
94
+ boxSizing: "border-box",
95
+ background: `linear-gradient(0deg, ${(0, $dtSHR$contentfulf36tokens).gray900} 0%, transparent calc(1rem * (100 / ${(0, $dtSHR$contentfulf36tokens).fontBaseDefault})), transparent 100% )`,
96
+ ":hover": {
97
97
  opacity: 1
98
98
  }
99
99
  }),
100
- title: /*#__PURE__*/ $dtSHR$css({
100
+ title: /*#__PURE__*/ (0, $dtSHR$css)({
101
101
  name: "4gk4ib",
102
102
  styles: "bottom:0;left:0;right:0;position:absolute;"
103
103
  })
@@ -105,66 +105,66 @@ function $dc8375c31ef26a6b$export$fa02bd03531e2fe() {
105
105
  }
106
106
 
107
107
 
108
- function $4a170a6eb7674988$var$_Asset({ className: className , src: src , status: status , testId: testId = 'cf-ui-asset' , title: title , type: type = 'image' , ...otherProps }, ref) {
109
- const styles = $dc8375c31ef26a6b$export$fa02bd03531e2fe();
110
- const isImage = src && src !== '' && type === 'image'; // Do not show image previews when publish status is archived
111
- const showPreview = isImage && status !== 'archived';
112
- return /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Box, {
113
- className: $dtSHR$cx(styles.relative, className),
108
+ function $4a170a6eb7674988$var$_Asset({ className: className , src: src , status: status , testId: testId = "cf-ui-asset" , title: title , type: type = "image" , ...otherProps }, ref) {
109
+ const styles = (0, $dc8375c31ef26a6b$export$fa02bd03531e2fe)();
110
+ const isImage = src && src !== "" && type === "image"; // Do not show image previews when publish status is archived
111
+ const showPreview = isImage && status !== "archived";
112
+ return /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Box), {
113
+ className: (0, $dtSHR$cx)(styles.relative, className),
114
114
  testId: testId,
115
115
  ref: ref,
116
116
  ...otherProps
117
- }, showPreview ? /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$react.Fragment, null, /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Flex, {
117
+ }, showPreview ? /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$react).Fragment, null, /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Flex), {
118
118
  alignItems: "center",
119
119
  justifyContent: "center",
120
120
  className: styles.height100
121
- }, /*#__PURE__*/ $dtSHR$react.createElement("img", {
121
+ }, /*#__PURE__*/ (0, $dtSHR$react).createElement("img", {
122
122
  className: styles.image,
123
123
  src: src,
124
124
  alt: title
125
- })), title && /*#__PURE__*/ $dtSHR$react.createElement("div", {
125
+ })), title && /*#__PURE__*/ (0, $dtSHR$react).createElement("div", {
126
126
  className: styles.titleContainer
127
- }, /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Text, {
127
+ }, /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Text), {
128
128
  className: styles.title,
129
129
  fontColor: "colorWhite",
130
130
  margin: "spacingS",
131
131
  isTruncated: true
132
- }, title))) : /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Flex, {
132
+ }, title))) : /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Flex), {
133
133
  flexDirection: "column",
134
134
  alignItems: "center",
135
135
  justifyContent: "center",
136
136
  paddingLeft: "spacingS",
137
137
  paddingRight: "spacingS",
138
138
  className: styles.height100
139
- }, /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Flex, {
139
+ }, /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Flex), {
140
140
  marginBottom: "spacingM",
141
141
  marginTop: "spacingM",
142
142
  justifyContent: "center"
143
- }, /*#__PURE__*/ $dtSHR$react.createElement($294bba6cf7661148$export$de8d5274b07acfbd, {
143
+ }, /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $294bba6cf7661148$export$de8d5274b07acfbd), {
144
144
  type: type
145
- })), /*#__PURE__*/ $dtSHR$react.createElement($dtSHR$Text, {
145
+ })), /*#__PURE__*/ (0, $dtSHR$react).createElement((0, $dtSHR$Text), {
146
146
  isTruncated: true,
147
147
  marginBottom: "spacingM",
148
148
  fontColor: "gray600"
149
149
  }, title)));
150
150
  }
151
- $4a170a6eb7674988$var$_Asset.displayName = 'Asset';
152
- const $4a170a6eb7674988$export$c413dd039085b182 = /*#__PURE__*/ $dtSHR$react.forwardRef($4a170a6eb7674988$var$_Asset);
151
+ $4a170a6eb7674988$var$_Asset.displayName = "Asset";
152
+ const $4a170a6eb7674988$export$c413dd039085b182 = /*#__PURE__*/ (0, $dtSHR$react).forwardRef($4a170a6eb7674988$var$_Asset);
153
153
 
154
154
 
155
155
 
156
156
  const $c14cae86e9d474fd$export$b14ad400b1d09e0f = {
157
- archive: 'archive',
158
- audio: 'audio',
159
- code: 'code',
160
- image: 'image',
161
- markup: 'markup',
162
- pdf: 'pdf',
163
- plaintext: 'plaintext',
164
- presentation: 'presentation',
165
- richtext: 'richtext',
166
- spreadsheet: 'spreadsheet',
167
- video: 'video'
157
+ archive: "archive",
158
+ audio: "audio",
159
+ code: "code",
160
+ image: "image",
161
+ markup: "markup",
162
+ pdf: "pdf",
163
+ plaintext: "plaintext",
164
+ presentation: "presentation",
165
+ richtext: "richtext",
166
+ spreadsheet: "spreadsheet",
167
+ video: "video"
168
168
  };
169
169
  function $c14cae86e9d474fd$export$3ccaa71e0816392d(type) {
170
170
  return Object.keys($c14cae86e9d474fd$export$b14ad400b1d09e0f).includes(type);
package/dist/module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/components/asset/src/index.ts","packages/components/asset/src/Asset.tsx","packages/components/asset/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/Asset.styles.ts","packages/components/asset/src/types.ts"],"sourcesContent":["export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n","import React from 'react';\nimport { cx } from 'emotion';\nimport type {\n EntityStatus,\n PickUnion,\n CommonProps,\n} from '@contentful/f36-core';\nimport { Text } from '@contentful/f36-typography';\nimport { Box, Flex } from '@contentful/f36-core';\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"],"names":["Asset","AssetProps","AssetStatus","AssetIcon","AssetIconProps","AssetType","isAssetType","React","EntityStatus","PickUnion","CommonProps","Text","Box","Flex","getAssetStyles","src","status","title","type","_Asset","className","testId","otherProps","ref","Ref","styles","isImage","showPreview","relative","height100","image","titleContainer","displayName","forwardRef","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","GeneratedIconProps","getAssetIconStyles","Omit","props","root","tokens","display","width","height","fill","gray600","opacity","transition","transitionDurationDefault","transitionEasingDefault","position","bottom","right","left","overflow","alignItems","boxSizing","background","gray900","fontBaseDefault","types","archive","audio","code","markup","pdf","plaintext","presentation","richtext","spreadsheet","video","Object","keys","includes"],"version":3,"file":"module.js.map"}
1
+ {"mappings":"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","sources":["packages/components/asset/src/index.ts","packages/components/asset/src/Asset.tsx","packages/components/asset/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/Asset.styles.ts","packages/components/asset/src/types.ts"],"sourcesContent":["export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n","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"],"names":["Asset","AssetProps","AssetStatus","AssetIcon","AssetIconProps","AssetType","isAssetType","React","Box","Flex","EntityStatus","PickUnion","CommonProps","Text","getAssetStyles","src","status","title","type","_Asset","className","testId","otherProps","ref","Ref","styles","isImage","showPreview","relative","height100","image","titleContainer","displayName","forwardRef","ArchiveIcon","AudioIcon","CodeIllustrationIcon","ImageIcon","MarkupIcon","PdfIcon","PlaintextIcon","RichtextIcon","PresentationIcon","SpreadsheetIcon","VideoIcon","GeneratedIconProps","getAssetIconStyles","Omit","props","root","tokens","display","width","height","fill","gray600","opacity","transition","transitionDurationDefault","transitionEasingDefault","position","bottom","right","left","overflow","alignItems","boxSizing","background","gray900","fontBaseDefault","types","archive","audio","code","markup","pdf","plaintext","presentation","richtext","spreadsheet","video","Object","keys","includes"],"version":3,"file":"module.js.map"}
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;AAAA,QAAO,MAAM;;;;;;;;;;;;CAYZ,CAAC;AAEF,4BAA4B,IAAI,EAAE,MAAM,GAAG,IAAI,IAAI,SAAS,CAE3D;AAED,wBAAwB,MAAM,YAAY,CAAC;AEE3C,+BACE,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,KAAK,CAAC;IACxD,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;GAEG;AACH,OAAO,MAAM;iDAKV,cAAc;;CAiChB,CAAC;AEpDF,0BAA0B,UACxB,YAAY,EACZ,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAC3D,CAAC;AAEF,2BAA4B,SAAQ,WAAW;IAC7C;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AA4ED,OAAO,MAAM,6EAAgC,CAAC","sources":["packages/components/asset/src/src/types.ts","packages/components/asset/src/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/src/Asset.styles.ts","packages/components/asset/src/src/Asset.tsx","packages/components/asset/src/src/index.ts","packages/components/asset/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,"export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":";;;AAAA,QAAO,MAAM;;;;;;;;;;;;CAYZ,CAAC;AAEF,4BAA4B,IAAI,EAAE,MAAM,GAAG,IAAI,IAAI,SAAS,CAE3D;AAED,wBAAwB,MAAM,YAAY,CAAC;AEE3C,+BACE,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,KAAK,CAAC;IACxD,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;GAEG;AACH,OAAO,MAAM;iDAKV,cAAc;;CAiChB,CAAC;AEnDF,0BAA0B,UACxB,YAAY,EACZ,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,WAAW,CAC3D,CAAC;AAEF,2BAA4B,SAAQ,WAAW;IAC7C;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AA4ED,OAAO,MAAM,6EAAgC,CAAC","sources":["packages/components/asset/src/src/types.ts","packages/components/asset/src/src/AssetIcon/AssetIcon.styles.ts","packages/components/asset/src/src/AssetIcon/AssetIcon.tsx","packages/components/asset/src/src/Asset.styles.ts","packages/components/asset/src/src/Asset.tsx","packages/components/asset/src/src/index.ts","packages/components/asset/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,"export { Asset } from './Asset';\nexport type { AssetProps, AssetStatus } from './Asset';\nexport { AssetIcon } from './AssetIcon/AssetIcon';\nexport type { AssetIconProps } from './AssetIcon/AssetIcon';\nexport type { AssetType } from './types';\nexport { isAssetType } from './types';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
package/package.json CHANGED
@@ -1,17 +1,17 @@
1
1
  {
2
2
  "name": "@contentful/f36-asset",
3
- "version": "4.14.0",
3
+ "version": "4.16.0",
4
4
  "description": "Forma 36: Asset component",
5
5
  "scripts": {
6
6
  "build": "parcel build"
7
7
  },
8
8
  "dependencies": {
9
9
  "@babel/runtime": "^7.6.2",
10
- "@contentful/f36-core": "^4.14.0",
11
- "@contentful/f36-icon": "^4.14.0",
12
- "@contentful/f36-icons": "^4.14.0",
10
+ "@contentful/f36-core": "^4.16.0",
11
+ "@contentful/f36-icon": "^4.16.0",
12
+ "@contentful/f36-icons": "^4.16.0",
13
13
  "@contentful/f36-tokens": "^4.0.1",
14
- "@contentful/f36-typography": "^4.14.0",
14
+ "@contentful/f36-typography": "^4.16.0",
15
15
  "emotion": "^10.0.17"
16
16
  },
17
17
  "peerDependencies": {