@fluentui/react-image 0.0.0-nightly-20220715-0418.1 → 0.0.0-nightly-20221007-1528.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/CHANGELOG.json +95 -10
- package/CHANGELOG.md +39 -8
- package/lib/Image.js.map +1 -1
- package/lib/components/Image/Image.js.map +1 -1
- package/lib/components/Image/Image.types.js.map +1 -1
- package/lib/components/Image/index.js.map +1 -1
- package/lib/components/Image/renderImage.js.map +1 -1
- package/lib/components/Image/useImage.js.map +1 -1
- package/lib/components/Image/useImageStyles.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Image.js.map +1 -1
- package/lib-commonjs/components/Image/Image.js.map +1 -1
- package/lib-commonjs/components/Image/Image.types.js.map +1 -1
- package/lib-commonjs/components/Image/index.js.map +1 -1
- package/lib-commonjs/components/Image/renderImage.js.map +1 -1
- package/lib-commonjs/components/Image/useImage.js.map +1 -1
- package/lib-commonjs/components/Image/useImageStyles.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +8 -12
- package/dist/tsdoc-metadata.json +0 -11
package/CHANGELOG.json
CHANGED
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
"name": "@fluentui/react-image",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "Fri,
|
|
6
|
-
"tag": "@fluentui/react-image_v0.0.0-nightly-
|
|
7
|
-
"version": "0.0.0-nightly-
|
|
5
|
+
"date": "Fri, 07 Oct 2022 15:34:53 GMT",
|
|
6
|
+
"tag": "@fluentui/react-image_v0.0.0-nightly-20221007-1528.1",
|
|
7
|
+
"version": "0.0.0-nightly-20221007-1528.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
|
11
|
-
"author": "
|
|
11
|
+
"author": "fluentui-internal@service.microsoft.com",
|
|
12
12
|
"package": "@fluentui/react-image",
|
|
13
13
|
"commit": "not available",
|
|
14
14
|
"comment": "Release nightly v9"
|
|
@@ -16,20 +16,105 @@
|
|
|
16
16
|
{
|
|
17
17
|
"author": "beachball",
|
|
18
18
|
"package": "@fluentui/react-image",
|
|
19
|
-
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
20
|
-
"commit": "
|
|
19
|
+
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20221007-1528.1",
|
|
20
|
+
"commit": "827197046ec2b195a8997fadbb514a5693234e6b"
|
|
21
21
|
},
|
|
22
22
|
{
|
|
23
23
|
"author": "beachball",
|
|
24
24
|
"package": "@fluentui/react-image",
|
|
25
|
-
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
26
|
-
"commit": "
|
|
25
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20221007-1528.1",
|
|
26
|
+
"commit": "827197046ec2b195a8997fadbb514a5693234e6b"
|
|
27
27
|
},
|
|
28
28
|
{
|
|
29
29
|
"author": "beachball",
|
|
30
30
|
"package": "@fluentui/react-image",
|
|
31
|
-
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
32
|
-
"commit": "
|
|
31
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221007-1528.1",
|
|
32
|
+
"commit": "827197046ec2b195a8997fadbb514a5693234e6b"
|
|
33
|
+
}
|
|
34
|
+
]
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"date": "Tue, 20 Sep 2022 20:55:45 GMT",
|
|
39
|
+
"tag": "@fluentui/react-image_v9.0.6",
|
|
40
|
+
"version": "9.0.6",
|
|
41
|
+
"comments": {
|
|
42
|
+
"patch": [
|
|
43
|
+
{
|
|
44
|
+
"author": "beachball",
|
|
45
|
+
"package": "@fluentui/react-image",
|
|
46
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.14",
|
|
47
|
+
"commit": "4ceba844c804a2f49b0465389100e7a3dabf116e"
|
|
48
|
+
}
|
|
49
|
+
]
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
"date": "Thu, 15 Sep 2022 09:49:04 GMT",
|
|
54
|
+
"tag": "@fluentui/react-image_v9.0.5",
|
|
55
|
+
"version": "9.0.5",
|
|
56
|
+
"comments": {
|
|
57
|
+
"patch": [
|
|
58
|
+
{
|
|
59
|
+
"author": "olfedias@microsoft.com",
|
|
60
|
+
"package": "@fluentui/react-image",
|
|
61
|
+
"commit": "e610024474cfe5d45f61501a8b6a21daf4c794a2",
|
|
62
|
+
"comment": "chore: Update Griffel to latest version"
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
"author": "beachball",
|
|
66
|
+
"package": "@fluentui/react-image",
|
|
67
|
+
"comment": "Bump @fluentui/react-utilities to v9.1.0",
|
|
68
|
+
"commit": "a33448fe4a0f4117686c378f80b893d1406d95a8"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"author": "beachball",
|
|
72
|
+
"package": "@fluentui/react-image",
|
|
73
|
+
"comment": "Bump @fluentui/react-theme to v9.1.0",
|
|
74
|
+
"commit": "a33448fe4a0f4117686c378f80b893d1406d95a8"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"author": "beachball",
|
|
78
|
+
"package": "@fluentui/react-image",
|
|
79
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.13",
|
|
80
|
+
"commit": "a33448fe4a0f4117686c378f80b893d1406d95a8"
|
|
81
|
+
}
|
|
82
|
+
],
|
|
83
|
+
"none": [
|
|
84
|
+
{
|
|
85
|
+
"author": "martinhochel@microsoft.com",
|
|
86
|
+
"package": "@fluentui/react-image",
|
|
87
|
+
"commit": "e6cf183695d6d67a24e038c49a876224e5ed35e5",
|
|
88
|
+
"comment": "chore: update package scaffold"
|
|
89
|
+
}
|
|
90
|
+
]
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
"date": "Wed, 03 Aug 2022 16:03:49 GMT",
|
|
95
|
+
"tag": "@fluentui/react-image_v9.0.4",
|
|
96
|
+
"version": "9.0.4",
|
|
97
|
+
"comments": {
|
|
98
|
+
"none": [
|
|
99
|
+
{
|
|
100
|
+
"author": "lingfangao@hotmail.com",
|
|
101
|
+
"package": "@fluentui/react-image",
|
|
102
|
+
"commit": "99cc385631d04a76ee10ebc143cb9fecd99640b6",
|
|
103
|
+
"comment": "chore: Add `prerelease` as disallowed changetype for 9.0.0 packages"
|
|
104
|
+
}
|
|
105
|
+
],
|
|
106
|
+
"patch": [
|
|
107
|
+
{
|
|
108
|
+
"author": "miroslav.stastny@microsoft.com",
|
|
109
|
+
"package": "@fluentui/react-image",
|
|
110
|
+
"commit": "08563664778fd80284561d3c9d254307a0a32362",
|
|
111
|
+
"comment": "chore: Bump Griffel dependencies"
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
"author": "beachball",
|
|
115
|
+
"package": "@fluentui/react-image",
|
|
116
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.12",
|
|
117
|
+
"commit": "ee4a8be0d0831a6615f878f98db6a97cc61a802d"
|
|
33
118
|
}
|
|
34
119
|
]
|
|
35
120
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,20 +1,51 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-image
|
|
2
2
|
|
|
3
|
-
This log was last generated on Fri,
|
|
3
|
+
This log was last generated on Fri, 07 Oct 2022 15:34:53 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20221007-1528.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v0.0.0-nightly-20221007-1528.1)
|
|
8
8
|
|
|
9
|
-
Fri,
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.
|
|
9
|
+
Fri, 07 Oct 2022 15:34:53 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.6..@fluentui/react-image_v0.0.0-nightly-20221007-1528.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
|
-
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by
|
|
15
|
-
- Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
16
|
-
- Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
17
|
-
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
14
|
+
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly-20221007-1528.1 ([commit](https://github.com/microsoft/fluentui/commit/827197046ec2b195a8997fadbb514a5693234e6b) by beachball)
|
|
16
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly-20221007-1528.1 ([commit](https://github.com/microsoft/fluentui/commit/827197046ec2b195a8997fadbb514a5693234e6b) by beachball)
|
|
17
|
+
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20221007-1528.1 ([commit](https://github.com/microsoft/fluentui/commit/827197046ec2b195a8997fadbb514a5693234e6b) by beachball)
|
|
18
|
+
|
|
19
|
+
## [9.0.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.6)
|
|
20
|
+
|
|
21
|
+
Tue, 20 Sep 2022 20:55:45 GMT
|
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.5..@fluentui/react-image_v9.0.6)
|
|
23
|
+
|
|
24
|
+
### Patches
|
|
25
|
+
|
|
26
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.14 ([PR #24869](https://github.com/microsoft/fluentui/pull/24869) by beachball)
|
|
27
|
+
|
|
28
|
+
## [9.0.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.5)
|
|
29
|
+
|
|
30
|
+
Thu, 15 Sep 2022 09:49:04 GMT
|
|
31
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.4..@fluentui/react-image_v9.0.5)
|
|
32
|
+
|
|
33
|
+
### Patches
|
|
34
|
+
|
|
35
|
+
- chore: Update Griffel to latest version ([PR #24221](https://github.com/microsoft/fluentui/pull/24221) by olfedias@microsoft.com)
|
|
36
|
+
- Bump @fluentui/react-utilities to v9.1.0 ([PR #24808](https://github.com/microsoft/fluentui/pull/24808) by beachball)
|
|
37
|
+
- Bump @fluentui/react-theme to v9.1.0 ([PR #24808](https://github.com/microsoft/fluentui/pull/24808) by beachball)
|
|
38
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.13 ([PR #24808](https://github.com/microsoft/fluentui/pull/24808) by beachball)
|
|
39
|
+
|
|
40
|
+
## [9.0.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.4)
|
|
41
|
+
|
|
42
|
+
Wed, 03 Aug 2022 16:03:49 GMT
|
|
43
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.3..@fluentui/react-image_v9.0.4)
|
|
44
|
+
|
|
45
|
+
### Patches
|
|
46
|
+
|
|
47
|
+
- chore: Bump Griffel dependencies ([PR #24114](https://github.com/microsoft/fluentui/pull/24114) by miroslav.stastny@microsoft.com)
|
|
48
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.12 ([PR #24131](https://github.com/microsoft/fluentui/pull/24131) by beachball)
|
|
18
49
|
|
|
19
50
|
## [9.0.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.3)
|
|
20
51
|
|
package/lib/Image.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.js","sourceRoot":"
|
|
1
|
+
{"version":3,"file":"Image.js","sourceRoot":"","sources":["../src/Image.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './components/Image/index';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,eAArC;AACA,SAAS,iBAAT,QAAkC,YAAlC;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AAIA;;AAEG;;AACH,OAAO,MAAM,KAAK,gBAAoC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpF,MAAM,KAAK,GAAG,iBAAiB,CAAC,KAAD,EAAQ,GAAR,CAA/B;EACA,uBAAuB,CAAC,KAAD,CAAvB;EAEA,OAAO,oBAAoB,CAAC,KAAD,CAA3B;AACD,CALqD,CAA/C;AAOP,KAAK,CAAC,WAAN,GAAoB,OAApB","sourcesContent":["import * as React from 'react';\nimport { renderImage_unstable } from './renderImage';\nimport { useImage_unstable } from './useImage';\nimport { useImageStyles_unstable } from './useImageStyles';\nimport type { ImageProps } from './Image.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Image component ensures the consistent styling of images.\n */\nexport const Image: ForwardRefComponent<ImageProps> = React.forwardRef((props, ref) => {\n const state = useImage_unstable(props, ref);\n useImageStyles_unstable(state);\n\n return renderImage_unstable(state);\n});\n\nImage.displayName = 'Image';\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/Image.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,eAArC;AACA,SAAS,iBAAT,QAAkC,YAAlC;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AAIA;;AAEG;;AACH,OAAO,MAAM,KAAK,gBAAoC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpF,MAAM,KAAK,GAAG,iBAAiB,CAAC,KAAD,EAAQ,GAAR,CAA/B;EACA,uBAAuB,CAAC,KAAD,CAAvB;EAEA,OAAO,oBAAoB,CAAC,KAAD,CAA3B;AACD,CALqD,CAA/C;AAOP,KAAK,CAAC,WAAN,GAAoB,OAApB","sourcesContent":["import * as React from 'react';\nimport { renderImage_unstable } from './renderImage';\nimport { useImage_unstable } from './useImage';\nimport { useImageStyles_unstable } from './useImageStyles';\nimport type { ImageProps } from './Image.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Image component ensures the consistent styling of images.\n */\nexport const Image: ForwardRefComponent<ImageProps> = React.forwardRef((props, ref) => {\n const state = useImage_unstable(props, ref);\n useImageStyles_unstable(state);\n\n return renderImage_unstable(state);\n});\n\nImage.displayName = 'Image';\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.types.js","sourceRoot":"
|
|
1
|
+
{"version":3,"file":"Image.types.js","sourceRoot":"","sources":["../../../src/components/Image/Image.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentState, ComponentProps, Slot } from '@fluentui/react-utilities';\n\nexport type ImageSlots = {\n root: Slot<'img'>;\n};\n\nexport type ImageProps = ComponentProps<ImageSlots> & {\n /**\n * An image can take up the width of its container.\n *\n * @default false\n */\n block?: boolean;\n\n /**\n * An image can appear with a rectangular border.\n *\n * @default false\n */\n bordered?: boolean;\n\n /**\n * An image can set how it should be resized to fit its container.\n *\n * @default 'default'\n */\n fit?: 'none' | 'center' | 'contain' | 'cover' | 'default';\n\n /**\n * An image can appear elevated with shadow.\n *\n * @default false\n */\n shadow?: boolean;\n\n /**\n * An image can appear square, circular, or rounded.\n *\n * @default 'square'\n */\n shape?: 'square' | 'circular' | 'rounded';\n};\n\nexport type ImageState = ComponentState<ImageSlots> &\n Required<Pick<ImageProps, 'block' | 'bordered' | 'fit' | 'shadow' | 'shape'>>;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Image/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC","sourcesContent":["export * from './Image.types';\nexport * from './Image';\nexport * from './renderImage';\nexport * from './useImage';\nexport * from './useImageStyles';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/renderImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;;AAGG;;AACH,OAAO,MAAM,oBAAoB,GAAI,KAAD,IAAsB;EACxD,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAa,KAAb,CAArC;EAEA,oBAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CAJM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageState } from './Image.types';\n\n/**\n * Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageState) => {\n const { slots, slotProps } = getSlots<ImageSlots>(state);\n\n return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/renderImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;;AAGG;;AACH,OAAO,MAAM,oBAAoB,GAAI,KAAD,IAAsB;EACxD,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAa,KAAb,CAArC;EAEA,oBAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CAJM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageState } from './Image.types';\n\n/**\n * Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageState) => {\n const { slots, slotProps } = getSlots<ImageSlots>(state);\n\n return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/useImage.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAGA;;AAEG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;EACnG,MAAM;IAAE,QAAQ,GAAG,KAAb;IAAoB,GAAG,GAAG,SAA1B;IAAqC,KAAK,GAAG,KAA7C;IAAoD,KAAK,GAAG,QAA5D;IAAsE,MAAM,GAAG;EAA/E,IAAyF,KAA/F;EAEA,MAAM,KAAK,GAAe;IACxB,QADwB;IAExB,GAFwB;IAGxB,KAHwB;IAIxB,KAJwB;IAKxB,MALwB;IAMxB,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CANY;IASxB,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;MACjC,GADiC;MAEjC,GAAG;IAF8B,CAAR;EATH,CAA1B;EAeA,OAAO,KAAP;AACD,CAnBM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ImageProps, ImageState } from './Image.types';\n\n/**\n * Given user props, returns state and render function for an Image.\n */\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, fit = 'default', block = false, shape = 'square', shadow = false } = props;\n\n const state: ImageState = {\n bordered,\n fit,\n block,\n shape,\n shadow,\n components: {\n root: 'img',\n },\n root: getNativeElementProps('img', {\n ref,\n ...props,\n }),\n };\n\n return state;\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/useImage.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAGA;;AAEG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;EACnG,MAAM;IAAE,QAAQ,GAAG,KAAb;IAAoB,GAAG,GAAG,SAA1B;IAAqC,KAAK,GAAG,KAA7C;IAAoD,KAAK,GAAG,QAA5D;IAAsE,MAAM,GAAG;EAA/E,IAAyF,KAA/F;EAEA,MAAM,KAAK,GAAe;IACxB,QADwB;IAExB,GAFwB;IAGxB,KAHwB;IAIxB,KAJwB;IAKxB,MALwB;IAMxB,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CANY;IASxB,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;MACjC,GADiC;MAEjC,GAAG;IAF8B,CAAR;EATH,CAA1B;EAeA,OAAO,KAAP;AACD,CAnBM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ImageProps, ImageState } from './Image.types';\n\n/**\n * Given user props, returns state and render function for an Image.\n */\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, fit = 'default', block = false, shape = 'square', shadow = false } = props;\n\n const state: ImageState = {\n bordered,\n fit,\n block,\n shape,\n shadow,\n components: {\n root: 'img',\n },\n root: getNativeElementProps('img', {\n ref,\n ...props,\n }),\n };\n\n return state;\n};\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/useImageStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA,OAAO,MAAM,eAAe,GAA+B;EACzD,IAAI,EAAE;AADmD,CAApD;;AAIP,MAAM,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;;AAmEA,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;EAC3D,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,eAAe,CAAC,IADiB,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,KAHW,EAIjC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAJQ,EAKjC,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,MALU,EAMjC,MAAM,CAAC,KAAK,CAAC,GAAP,CAN2B,EAOjC,MAAM,CAAC,KAAK,CAAC,KAAP,CAP2B,EAQjC,KAAK,CAAC,IAAN,CAAW,SARsB,CAAnC;AAUD,CAZM","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n square: {\n /* The square styles are exactly the same as the base styles. */\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n default: {\n /* The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n styles[state.shape],\n state.root.className,\n );\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/useImageStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA,OAAO,MAAM,eAAe,GAA+B;EACzD,IAAI,EAAE;AADmD,CAApD;;AAIP,MAAM,SAAS,gBAAG;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;;AAmEA,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;EAC3D,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,eAAe,CAAC,IADiB,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,KAHW,EAIjC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAJQ,EAKjC,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,MALU,EAMjC,MAAM,CAAC,KAAK,CAAC,GAAP,CAN2B,EAOjC,MAAM,CAAC,KAAK,CAAC,KAAP,CAP2B,EAQjC,KAAK,CAAC,IAAN,CAAW,SARsB,CAAnC;AAUD,CAZM","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n square: {\n /* The square styles are exactly the same as the base styles. */\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n default: {\n /* The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n styles[state.shape],\n state.root.className,\n );\n};\n"],"sourceRoot":""}
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { Image, imageClassNames, renderImage_unstable, useImageStyles_unstable, useImage_unstable } from './Image';\nexport type { ImageProps, ImageSlots, ImageState } from './Image';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Image.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,0BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Image/index';\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../src/Image.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,0BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Image/index';\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/Image.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,KAAA,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpF,MAAM,KAAK,GAAG,UAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAAd;EACA,gBAAA,CAAA,uBAAA,CAAwB,KAAxB;EAEA,OAAO,aAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CALqD,CAAzC;AAOb,OAAA,CAAA,KAAA,CAAM,WAAN,GAAoB,OAApB","sourcesContent":["import * as React from 'react';\nimport { renderImage_unstable } from './renderImage';\nimport { useImage_unstable } from './useImage';\nimport { useImageStyles_unstable } from './useImageStyles';\nimport type { ImageProps } from './Image.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Image component ensures the consistent styling of images.\n */\nexport const Image: ForwardRefComponent<ImageProps> = React.forwardRef((props, ref) => {\n const state = useImage_unstable(props, ref);\n useImageStyles_unstable(state);\n\n return renderImage_unstable(state);\n});\n\nImage.displayName = 'Image';\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/Image.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,KAAA,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACpF,MAAM,KAAK,GAAG,UAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAAd;EACA,gBAAA,CAAA,uBAAA,CAAwB,KAAxB;EAEA,OAAO,aAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CALqD,CAAzC;AAOb,OAAA,CAAA,KAAA,CAAM,WAAN,GAAoB,OAApB","sourcesContent":["import * as React from 'react';\nimport { renderImage_unstable } from './renderImage';\nimport { useImage_unstable } from './useImage';\nimport { useImageStyles_unstable } from './useImageStyles';\nimport type { ImageProps } from './Image.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The Image component ensures the consistent styling of images.\n */\nexport const Image: ForwardRefComponent<ImageProps> = React.forwardRef((props, ref) => {\n const state = useImage_unstable(props, ref);\n useImageStyles_unstable(state);\n\n return renderImage_unstable(state);\n});\n\nImage.displayName = 'Image';\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Image.types';\nexport * from './Image';\nexport * from './renderImage';\nexport * from './useImage';\nexport * from './useImageStyles';\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Image.types';\nexport * from './Image';\nexport * from './renderImage';\nexport * from './useImage';\nexport * from './useImageStyles';\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/renderImage.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;AAGG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAAsB;EACxD,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAqB,KAArB,CAA7B;EAEA,OAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageState } from './Image.types';\n\n/**\n * Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageState) => {\n const { slots, slotProps } = getSlots<ImageSlots>(state);\n\n return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/renderImage.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;AAGG;;;AACI,MAAM,oBAAoB,GAAI,KAAD,IAAsB;EACxD,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAqB,KAArB,CAA7B;EAEA,OAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { ImageSlots, ImageState } from './Image.types';\n\n/**\n * Define the render function.\n * Given the state of an image, renders it.\n */\nexport const renderImage_unstable = (state: ImageState) => {\n const { slots, slotProps } = getSlots<ImageSlots>(state);\n\n return <slots.root {...slotProps.root} />;\n};\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/useImage.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;EACnG,MAAM;IAAE,QAAQ,GAAG,KAAb;IAAoB,GAAG,GAAG,SAA1B;IAAqC,KAAK,GAAG,KAA7C;IAAoD,KAAK,GAAG,QAA5D;IAAsE,MAAM,GAAG;EAA/E,IAAyF,KAA/F;EAEA,MAAM,KAAK,GAAe;IACxB,QADwB;IAExB,GAFwB;IAGxB,KAHwB;IAIxB,KAJwB;IAKxB,MALwB;IAMxB,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CANY;IASxB,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;MACjC,GADiC;MAEjC,GAAG;IAF8B,CAA7B;EATkB,CAA1B;EAeA,OAAO,KAAP;AACD,CAnBM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ImageProps, ImageState } from './Image.types';\n\n/**\n * Given user props, returns state and render function for an Image.\n */\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, fit = 'default', block = false, shape = 'square', shadow = false } = props;\n\n const state: ImageState = {\n bordered,\n fit,\n block,\n shape,\n shadow,\n components: {\n root: 'img',\n },\n root: getNativeElementProps('img', {\n ref,\n ...props,\n }),\n };\n\n return state;\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/useImage.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;EACnG,MAAM;IAAE,QAAQ,GAAG,KAAb;IAAoB,GAAG,GAAG,SAA1B;IAAqC,KAAK,GAAG,KAA7C;IAAoD,KAAK,GAAG,QAA5D;IAAsE,MAAM,GAAG;EAA/E,IAAyF,KAA/F;EAEA,MAAM,KAAK,GAAe;IACxB,QADwB;IAExB,GAFwB;IAGxB,KAHwB;IAIxB,KAJwB;IAKxB,MALwB;IAMxB,UAAU,EAAE;MACV,IAAI,EAAE;IADI,CANY;IASxB,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;MACjC,GADiC;MAEjC,GAAG;IAF8B,CAA7B;EATkB,CAA1B;EAeA,OAAO,KAAP;AACD,CAnBM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { ImageProps, ImageState } from './Image.types';\n\n/**\n * Given user props, returns state and render function for an Image.\n */\nexport const useImage_unstable = (props: ImageProps, ref: React.Ref<HTMLImageElement>): ImageState => {\n const { bordered = false, fit = 'default', block = false, shape = 'square', shadow = false } = props;\n\n const state: ImageState = {\n bordered,\n fit,\n block,\n shape,\n shadow,\n components: {\n root: 'img',\n },\n root: getNativeElementProps('img', {\n ref,\n ...props,\n }),\n };\n\n return state;\n};\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Image/useImageStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,eAAA,GAA8C;EACzD,IAAI,EAAE;AADmD,CAA9C;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;;AAmEO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;EAC3D,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,eAAA,CAAgB,IADK,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,KAHD,EAIrB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAJJ,EAKrB,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,MALF,EAMrB,MAAM,CAAC,KAAK,CAAC,GAAP,CANe,EAOrB,MAAM,CAAC,KAAK,CAAC,KAAP,CAPe,EAQrB,KAAK,CAAC,IAAN,CAAW,SARU,CAAvB;AAUD,CAZM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n square: {\n /* The square styles are exactly the same as the base styles. */\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n default: {\n /* The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n styles[state.shape],\n state.root.className,\n );\n};\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Image/useImageStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,eAAA,GAA8C;EACzD,IAAI,EAAE;AADmD,CAA9C;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;;AAmEO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;EAC3D,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,eAAA,CAAgB,IADK,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,KAHD,EAIrB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,QAJJ,EAKrB,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,MALF,EAMrB,MAAM,CAAC,KAAK,CAAC,GAAP,CANe,EAOrB,MAAM,CAAC,KAAK,CAAC,KAAP,CAPe,EAQrB,KAAK,CAAC,IAAN,CAAW,SARU,CAAvB;AAUD,CAZM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageSlots, ImageState } from './Image.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const imageClassNames: SlotClassNames<ImageSlots> = {\n root: 'fui-Image',\n};\n\nconst useStyles = makeStyles({\n // Base styles\n base: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n\n // Bordered styles\n bordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n\n // Shape variations\n circular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n square: {\n /* The square styles are exactly the same as the base styles. */\n },\n\n // Shadow styles\n shadow: {\n boxShadow: tokens.shadow4,\n },\n\n // Fit variations\n center: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n contain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n default: {\n /* The default styles are exactly the same as the base styles. */\n },\n cover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n none: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n\n // Block styles\n block: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassNames.root,\n styles.base,\n state.block && styles.block,\n state.bordered && styles.bordered,\n state.shadow && styles.shadow,\n styles[state.fit],\n styles[state.shape],\n state.root.className,\n );\n};\n"],"sourceRoot":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,OAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,KAAA;EAAK;AAAL,CAAA;AAAO,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AAAiB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AAAyB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA","sourcesContent":["export { Image, imageClassNames, renderImage_unstable, useImageStyles_unstable, useImage_unstable } from './Image';\nexport type { ImageProps, ImageSlots, ImageState } from './Image';\n"],"sourceRoot":"
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,OAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,KAAA;EAAK;AAAL,CAAA;AAAO,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,eAAA;EAAe;AAAf,CAAA;AAAiB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,oBAAA;EAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,uBAAA;EAAuB;AAAvB,CAAA;AAAyB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,OAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA","sourcesContent":["export { Image, imageClassNames, renderImage_unstable, useImageStyles_unstable, useImage_unstable } from './Image';\nexport type { ImageProps, ImageSlots, ImageState } from './Image';\n"],"sourceRoot":""}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-image",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20221007-1528.1",
|
|
4
4
|
"description": "Fluent UI React Image component.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -21,20 +21,20 @@
|
|
|
21
21
|
"start": "yarn storybook",
|
|
22
22
|
"test": "jest --passWithNoTests",
|
|
23
23
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
|
24
|
-
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/packages/react-components/react-image/src && yarn docs",
|
|
25
|
-
"storybook": "
|
|
24
|
+
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/types/packages/react-components/react-image/src && yarn docs",
|
|
25
|
+
"storybook": "start-storybook",
|
|
26
26
|
"type-check": "tsc -b tsconfig.json"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
|
30
30
|
"@fluentui/react-conformance": "*",
|
|
31
|
-
"@fluentui/react-conformance-griffel": "0.0.0-nightly-
|
|
31
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20221007-1528.1",
|
|
32
32
|
"@fluentui/scripts": "^1.0.0"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@griffel/react": "^1.
|
|
36
|
-
"@fluentui/react-utilities": "^0.0.0-nightly-
|
|
37
|
-
"@fluentui/react-theme": "^0.0.0-nightly-
|
|
35
|
+
"@griffel/react": "^1.3.0",
|
|
36
|
+
"@fluentui/react-utilities": "^0.0.0-nightly-20221007-1528.1",
|
|
37
|
+
"@fluentui/react-theme": "^0.0.0-nightly-20221007-1528.1",
|
|
38
38
|
"tslib": "^2.1.0"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
@@ -43,11 +43,7 @@
|
|
|
43
43
|
"react": ">=16.8.0 <18.0.0",
|
|
44
44
|
"react-dom": ">=16.8.0 <18.0.0"
|
|
45
45
|
},
|
|
46
|
-
"beachball": {
|
|
47
|
-
"disallowedChangeTypes": [
|
|
48
|
-
"major"
|
|
49
|
-
]
|
|
50
|
-
},
|
|
46
|
+
"beachball": {},
|
|
51
47
|
"exports": {
|
|
52
48
|
".": {
|
|
53
49
|
"types": "./lib/index.d.ts",
|
package/dist/tsdoc-metadata.json
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
// This file is read by tools that parse documentation comments conforming to the TSDoc standard.
|
|
2
|
-
// It should be published with your NPM package. It should not be tracked by Git.
|
|
3
|
-
{
|
|
4
|
-
"tsdocVersion": "0.12",
|
|
5
|
-
"toolPackages": [
|
|
6
|
-
{
|
|
7
|
-
"packageName": "@microsoft/api-extractor",
|
|
8
|
-
"packageVersion": "7.18.1"
|
|
9
|
-
}
|
|
10
|
-
]
|
|
11
|
-
}
|