@fluentui/react-image 0.0.0-nightly6a6e258c4020220125.1 → 0.0.0-nightly6faffd280a20220221.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 +101 -23
- package/CHANGELOG.md +36 -10
- package/MIGRATION.md +3 -3
- package/dist/react-image.d.ts +3 -3
- package/lib/Image.js.map +1 -1
- package/lib/components/Image/Image.js.map +1 -1
- package/lib/components/Image/Image.types.d.ts +4 -3
- 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 +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.d.ts +4 -3
- 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 +3 -3
- package/lib-commonjs/components/Image/useImageStyles.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +5 -6
package/CHANGELOG.json
CHANGED
|
@@ -2,23 +2,101 @@
|
|
|
2
2
|
"name": "@fluentui/react-image",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"tag": "@fluentui/react-image_v0.0.0-
|
|
7
|
-
"version": "0.0.0-
|
|
5
|
+
"date": "Mon, 21 Feb 2022 04:15:28 GMT",
|
|
6
|
+
"tag": "@fluentui/react-image_v0.0.0-nightly6faffd280a20220221.1",
|
|
7
|
+
"version": "0.0.0-nightly6faffd280a20220221.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
|
11
11
|
"author": "email not defined",
|
|
12
12
|
"package": "@fluentui/react-image",
|
|
13
|
-
"commit": "
|
|
13
|
+
"commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd",
|
|
14
14
|
"comment": "Release nightly v9"
|
|
15
15
|
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui/react-image",
|
|
19
|
+
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly6faffd280a20220221.1",
|
|
20
|
+
"commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui/react-image",
|
|
25
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly6faffd280a20220221.1",
|
|
26
|
+
"commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "beachball",
|
|
30
|
+
"package": "@fluentui/react-image",
|
|
31
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly6faffd280a20220221.1",
|
|
32
|
+
"commit": "01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd"
|
|
33
|
+
}
|
|
34
|
+
]
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"date": "Fri, 18 Feb 2022 13:35:32 GMT",
|
|
39
|
+
"tag": "@fluentui/react-image_v9.0.0-rc.3",
|
|
40
|
+
"version": "9.0.0-rc.3",
|
|
41
|
+
"comments": {
|
|
42
|
+
"prerelease": [
|
|
43
|
+
{
|
|
44
|
+
"author": "lingfangao@hotmail.com",
|
|
45
|
+
"package": "@fluentui/react-image",
|
|
46
|
+
"commit": "d579bbbbb8bd1457e14b03eda2bc638d89f92d56",
|
|
47
|
+
"comment": "fix: Add react-theme as dependency to react-image"
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"author": "lingfangao@hotmail.com",
|
|
51
|
+
"package": "@fluentui/react-image",
|
|
52
|
+
"commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
|
|
53
|
+
"comment": "fix: Source maps contain original source code"
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"author": "beachball",
|
|
57
|
+
"package": "@fluentui/react-image",
|
|
58
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
|
|
59
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"author": "beachball",
|
|
63
|
+
"package": "@fluentui/react-image",
|
|
64
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.3",
|
|
65
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"author": "beachball",
|
|
69
|
+
"package": "@fluentui/react-image",
|
|
70
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3",
|
|
71
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
|
72
|
+
}
|
|
73
|
+
]
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"date": "Thu, 10 Feb 2022 08:51:14 GMT",
|
|
78
|
+
"tag": "@fluentui/react-image_v9.0.0-rc.1",
|
|
79
|
+
"version": "9.0.0-rc.1",
|
|
80
|
+
"comments": {
|
|
81
|
+
"prerelease": [
|
|
82
|
+
{
|
|
83
|
+
"author": "mgodbolt@microsoft.com",
|
|
84
|
+
"package": "@fluentui/react-image",
|
|
85
|
+
"commit": "839ec14849e112b85aa321d034739ec421199141",
|
|
86
|
+
"comment": "remove export of commons types"
|
|
87
|
+
},
|
|
16
88
|
{
|
|
17
89
|
"author": "Humberto.Morimoto@microsoft.com",
|
|
18
90
|
"package": "@fluentui/react-image",
|
|
19
91
|
"commit": "147ca590e83068153f0358da46b84e7e873b891f",
|
|
20
92
|
"comment": "react-image: Replacing use of functions in makeStyles with direct use of tokens."
|
|
21
93
|
},
|
|
94
|
+
{
|
|
95
|
+
"author": "olfedias@microsoft.com",
|
|
96
|
+
"package": "@fluentui/react-image",
|
|
97
|
+
"commit": "2ce465c8034747199be56ab5ebce3272b6d3a4f9",
|
|
98
|
+
"comment": "use Griffel packages"
|
|
99
|
+
},
|
|
22
100
|
{
|
|
23
101
|
"author": "behowell@microsoft.com",
|
|
24
102
|
"package": "@fluentui/react-image",
|
|
@@ -26,46 +104,46 @@
|
|
|
26
104
|
"comment": "Remove component's shorthandProps array"
|
|
27
105
|
},
|
|
28
106
|
{
|
|
29
|
-
"author": "
|
|
107
|
+
"author": "lingfangao@hotmail.com",
|
|
30
108
|
"package": "@fluentui/react-image",
|
|
31
|
-
"commit": "
|
|
32
|
-
"comment": "
|
|
109
|
+
"commit": "c00913d50e2dd15bbfbb0757cefe43b192ff1d7f",
|
|
110
|
+
"comment": "Bump Fluent UI packages to 9.0.0-rc"
|
|
33
111
|
},
|
|
34
112
|
{
|
|
35
|
-
"author": "
|
|
113
|
+
"author": "behowell@microsoft.com",
|
|
36
114
|
"package": "@fluentui/react-image",
|
|
37
|
-
"commit": "
|
|
38
|
-
"comment": "
|
|
115
|
+
"commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
|
|
116
|
+
"comment": "BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
|
|
39
117
|
},
|
|
40
118
|
{
|
|
41
|
-
"author": "
|
|
119
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
|
42
120
|
"package": "@fluentui/react-image",
|
|
43
|
-
"
|
|
44
|
-
"
|
|
121
|
+
"commit": "e0b8e1fa6980077e7b311fd1c72c28d3e4305db0",
|
|
122
|
+
"comment": "Updating based on changes to composition types."
|
|
45
123
|
},
|
|
46
124
|
{
|
|
47
|
-
"author": "
|
|
125
|
+
"author": "behowell@microsoft.com",
|
|
48
126
|
"package": "@fluentui/react-image",
|
|
49
|
-
"
|
|
50
|
-
"
|
|
127
|
+
"commit": "53b01d71e335715fda91b33e3d7bbd9d471d5ed3",
|
|
128
|
+
"comment": "Refactor component Slot typings"
|
|
51
129
|
},
|
|
52
130
|
{
|
|
53
|
-
"author": "
|
|
131
|
+
"author": "olfedias@microsoft.com",
|
|
54
132
|
"package": "@fluentui/react-image",
|
|
55
|
-
"
|
|
56
|
-
"
|
|
133
|
+
"commit": "ffe595b06f256f25e6224a0069972e1474893758",
|
|
134
|
+
"comment": "update styles to not use CSS shorthands"
|
|
57
135
|
},
|
|
58
136
|
{
|
|
59
137
|
"author": "beachball",
|
|
60
138
|
"package": "@fluentui/react-image",
|
|
61
|
-
"comment": "Bump @fluentui/
|
|
62
|
-
"commit": "
|
|
139
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.1",
|
|
140
|
+
"commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
|
|
63
141
|
},
|
|
64
142
|
{
|
|
65
143
|
"author": "beachball",
|
|
66
144
|
"package": "@fluentui/react-image",
|
|
67
|
-
"comment": "Bump @fluentui/react-conformance-
|
|
68
|
-
"commit": "
|
|
145
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1",
|
|
146
|
+
"commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
|
|
69
147
|
}
|
|
70
148
|
],
|
|
71
149
|
"none": [
|
package/CHANGELOG.md
CHANGED
|
@@ -1,26 +1,52 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-image
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Mon, 21 Feb 2022 04:15:28 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-
|
|
7
|
+
## [0.0.0-nightly6faffd280a20220221.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v0.0.0-nightly6faffd280a20220221.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.0-
|
|
9
|
+
Mon, 21 Feb 2022 04:15:28 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.0-rc.3..@fluentui/react-image_v0.0.0-nightly6faffd280a20220221.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
|
-
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/
|
|
14
|
+
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by email not defined)
|
|
15
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
|
|
16
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
|
|
17
|
+
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly6faffd280a20220221.1 ([commit](https://github.com/microsoft/fluentui/commit/01ee61722cce4da8e5deb9a2ab00f4e27fc01cfd) by beachball)
|
|
18
|
+
|
|
19
|
+
## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.0-rc.3)
|
|
20
|
+
|
|
21
|
+
Fri, 18 Feb 2022 13:35:32 GMT
|
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.0-rc.1..@fluentui/react-image_v9.0.0-rc.3)
|
|
23
|
+
|
|
24
|
+
### Changes
|
|
25
|
+
|
|
26
|
+
- fix: Add react-theme as dependency to react-image ([PR #21787](https://github.com/microsoft/fluentui/pull/21787) by lingfangao@hotmail.com)
|
|
27
|
+
- fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
|
|
28
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
|
29
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
|
30
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
|
31
|
+
|
|
32
|
+
## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.0-rc.1)
|
|
33
|
+
|
|
34
|
+
Thu, 10 Feb 2022 08:51:14 GMT
|
|
35
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-image_v9.0.0-beta.4..@fluentui/react-image_v9.0.0-rc.1)
|
|
36
|
+
|
|
37
|
+
### Changes
|
|
38
|
+
|
|
39
|
+
- remove export of commons types ([PR #21660](https://github.com/microsoft/fluentui/pull/21660) by mgodbolt@microsoft.com)
|
|
15
40
|
- react-image: Replacing use of functions in makeStyles with direct use of tokens. ([PR #21044](https://github.com/microsoft/fluentui/pull/21044) by Humberto.Morimoto@microsoft.com)
|
|
41
|
+
- use Griffel packages ([PR #21432](https://github.com/microsoft/fluentui/pull/21432) by olfedias@microsoft.com)
|
|
16
42
|
- Remove component's shorthandProps array ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
|
|
43
|
+
- Bump Fluent UI packages to 9.0.0-rc ([PR #21623](https://github.com/microsoft/fluentui/pull/21623) by lingfangao@hotmail.com)
|
|
17
44
|
- BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
|
|
45
|
+
- Updating based on changes to composition types. ([PR #20891](https://github.com/microsoft/fluentui/pull/20891) by Humberto.Morimoto@microsoft.com)
|
|
46
|
+
- Refactor component Slot typings ([PR #21518](https://github.com/microsoft/fluentui/pull/21518) by behowell@microsoft.com)
|
|
18
47
|
- update styles to not use CSS shorthands ([PR #20818](https://github.com/microsoft/fluentui/pull/20818) by olfedias@microsoft.com)
|
|
19
|
-
- Bump @fluentui/react-
|
|
20
|
-
- Bump @fluentui/react-
|
|
21
|
-
- Bump @fluentui/babel-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
|
|
22
|
-
- Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
|
|
23
|
-
- Bump @fluentui/react-conformance-make-styles to v0.0.0-nightly6a6e258c4020220125.1 ([commit](https://github.com/microsoft/fluentui/commit/1d41ec351a6d5902e871c87fcbaacf8db8ecb40d) by beachball)
|
|
48
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
|
|
49
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
|
|
24
50
|
|
|
25
51
|
## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-image_v9.0.0-beta.4)
|
|
26
52
|
|
package/MIGRATION.md
CHANGED
|
@@ -68,7 +68,7 @@ For v9, this feature is no longer supported. The alternative is to apply the ani
|
|
|
68
68
|
```jsx
|
|
69
69
|
import { useState } from 'react';
|
|
70
70
|
import { Image } from '@fluentui/react-image';
|
|
71
|
-
import { makeStyles } from '@
|
|
71
|
+
import { makeStyles } from '@griffel/react';
|
|
72
72
|
|
|
73
73
|
const useStyles = makeStyles(theme => ({
|
|
74
74
|
fadeIn400: {
|
|
@@ -99,7 +99,7 @@ For v9, this feature is no longer supported. The alternative would be to use the
|
|
|
99
99
|
|
|
100
100
|
```jsx
|
|
101
101
|
import { useState } from 'react';
|
|
102
|
-
import { makeStyles } from '@
|
|
102
|
+
import { makeStyles } from '@griffel/react';
|
|
103
103
|
import { Image } from '@fluentui/react-image';
|
|
104
104
|
|
|
105
105
|
const useStyles = makeStyles({
|
|
@@ -219,7 +219,7 @@ const MyComponent = () => {
|
|
|
219
219
|
|
|
220
220
|
```jsx
|
|
221
221
|
import { Image } from '@fluentui/react-image';
|
|
222
|
-
import { makeStyles } from '@
|
|
222
|
+
import { makeStyles } from '@griffel/react';
|
|
223
223
|
|
|
224
224
|
const useStyles = makeStyles(theme => ({
|
|
225
225
|
width100: {
|
package/dist/react-image.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import type { ComponentProps } from '@fluentui/react-utilities';
|
|
2
2
|
import type { ComponentState } from '@fluentui/react-utilities';
|
|
3
3
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
4
|
-
import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
|
|
5
4
|
import * as React_2 from 'react';
|
|
5
|
+
import type { Slot } from '@fluentui/react-utilities';
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* The Image component ensures the consistent styling of images.
|
|
@@ -12,7 +12,7 @@ export { Image_2 as Image }
|
|
|
12
12
|
|
|
13
13
|
export declare const imageClassName = "fui-Image";
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
declare type ImageCommons = {
|
|
16
16
|
/**
|
|
17
17
|
* An image can appear with rectangular border.
|
|
18
18
|
*/
|
|
@@ -39,7 +39,7 @@ export declare type ImageCommons = {
|
|
|
39
39
|
export declare type ImageProps = ComponentProps<ImageSlots> & Partial<ImageCommons>;
|
|
40
40
|
|
|
41
41
|
export declare type ImageSlots = {
|
|
42
|
-
root:
|
|
42
|
+
root: Slot<'img'>;
|
|
43
43
|
};
|
|
44
44
|
|
|
45
45
|
export declare type ImageState = ComponentState<ImageSlots> & ImageCommons;
|
package/lib/Image.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"Image.js","sourceRoot":"../src/","sources":["Image.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './components/Image/index';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;AACpF,QAAM,KAAK,GAAG,iBAAiB,CAAC,KAAD,EAAQ,GAAR,CAA/B;AACA,EAAA,uBAAuB,CAAC,KAAD,CAAvB;AAEA,SAAO,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":"../src/"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import type { ComponentState, ComponentProps,
|
|
1
|
+
import type { ComponentState, ComponentProps, Slot } from '@fluentui/react-utilities';
|
|
2
2
|
export declare type ImageSlots = {
|
|
3
|
-
root:
|
|
3
|
+
root: Slot<'img'>;
|
|
4
4
|
};
|
|
5
|
-
|
|
5
|
+
declare type ImageCommons = {
|
|
6
6
|
/**
|
|
7
7
|
* An image can appear with rectangular border.
|
|
8
8
|
*/
|
|
@@ -27,3 +27,4 @@ export declare type ImageCommons = {
|
|
|
27
27
|
};
|
|
28
28
|
export declare type ImageProps = ComponentProps<ImageSlots> & Partial<ImageCommons>;
|
|
29
29
|
export declare type ImageState = ComponentState<ImageSlots> & ImageCommons;
|
|
30
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Image.types.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"Image.types.js","sourceRoot":"../src/","sources":["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\ntype ImageCommons = {\n /**\n * An image can appear with rectangular border.\n */\n bordered?: boolean;\n\n /**\n * An image can set how it should be resized to fit its container.\n */\n fit?: 'none' | 'center' | 'contain' | 'cover';\n\n /**\n * An image can take up the width of its container.\n */\n block?: boolean;\n\n /**\n * An image can appear square, circular, or rounded.\n * @defaultvalue square\n */\n shape?: 'square' | 'circular' | 'rounded';\n\n /**\n * An image can appear elevated with shadow.\n */\n shadow?: boolean;\n};\n\nexport type ImageProps = ComponentProps<ImageSlots> & Partial<ImageCommons>;\n\nexport type ImageState = ComponentState<ImageSlots> & ImageCommons;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["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":["
|
|
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;AACxD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAa,KAAb,CAArC;AAEA,sBAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,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":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;AACnG,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,GAAZ;AAAiB,IAAA,KAAjB;AAAwB,IAAA,KAAK,GAAG,QAAhC;AAA0C,IAAA;AAA1C,MAAqD,KAA3D;AAEA,QAAM,KAAK,GAAe;AACxB,IAAA,QADwB;AAExB,IAAA,GAFwB;AAGxB,IAAA,KAHwB;AAIxB,IAAA,KAJwB;AAKxB,IAAA,MALwB;AAMxB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANY;AASxB,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AACjC,MAAA,GADiC;AAEjC,SAAG;AAF8B,KAAR;AATH,GAA1B;AAeA,SAAO,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, fit, block, shape = 'square', shadow } = 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":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/Image/useImageStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,EAAqB,YAArB,kBAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,cAAc,GAAG,WAAvB;;AAEP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;;AAkDA,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;AAC3D,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,cADiC,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,YAHQ,EAIjC,KAAK,CAAC,KAAN,KAAgB,UAAhB,IAA8B,MAAM,CAAC,YAJJ,EAKjC,KAAK,CAAC,KAAN,KAAgB,SAAhB,IAA6B,MAAM,CAAC,WALH,EAMjC,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,UANU,EAOjC,KAAK,CAAC,GAAN,KAAc,MAAd,IAAwB,MAAM,CAAC,WAPE,EAQjC,KAAK,CAAC,GAAN,KAAc,QAAd,IAA0B,MAAM,CAAC,aARA,EASjC,KAAK,CAAC,GAAN,KAAc,OAAd,IAAyB,MAAM,CAAC,YATC,EAUjC,KAAK,CAAC,GAAN,KAAc,SAAd,IAA2B,MAAM,CAAC,cAVD,EAWjC,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,SAXW,EAYjC,KAAK,CAAC,IAAN,CAAW,SAZsB,CAAnC;AAcD,CAhBM","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageState } from './Image.types';\n\nexport const imageClassName = 'fui-Image';\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n rootBordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n rootCircular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rootRounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n rootShadow: {\n boxShadow: tokens.shadow4,\n },\n rootFitNone: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n rootFitCenter: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootFitCover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootFitContain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootBlock: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassName,\n styles.root,\n state.bordered && styles.rootBordered,\n state.shape === 'circular' && styles.rootCircular,\n state.shape === 'rounded' && styles.rootRounded,\n state.shadow && styles.rootShadow,\n state.fit === 'none' && styles.rootFitNone,\n state.fit === 'center' && styles.rootFitCenter,\n state.fit === 'cover' && styles.rootFitCover,\n state.fit === 'contain' && styles.rootFitContain,\n state.block && styles.rootBlock,\n state.root.className,\n );\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC","sourcesContent":["export * from './Image';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;AACpF,QAAM,KAAK,GAAG,UAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAAd;AACA,EAAA,gBAAA,CAAA,uBAAA,CAAwB,KAAxB;AAEA,SAAO,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":"../src/"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import type { ComponentState, ComponentProps,
|
|
1
|
+
import type { ComponentState, ComponentProps, Slot } from '@fluentui/react-utilities';
|
|
2
2
|
export declare type ImageSlots = {
|
|
3
|
-
root:
|
|
3
|
+
root: Slot<'img'>;
|
|
4
4
|
};
|
|
5
|
-
|
|
5
|
+
declare type ImageCommons = {
|
|
6
6
|
/**
|
|
7
7
|
* An image can appear with rectangular border.
|
|
8
8
|
*/
|
|
@@ -27,3 +27,4 @@ export declare type ImageCommons = {
|
|
|
27
27
|
};
|
|
28
28
|
export declare type ImageProps = ComponentProps<ImageSlots> & Partial<ImageCommons>;
|
|
29
29
|
export declare type ImageState = ComponentState<ImageSlots> & ImageCommons;
|
|
30
|
+
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;AACxD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAqB,KAArB,CAA7B;AAEA,SAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,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":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;AACnG,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,GAAZ;AAAiB,IAAA,KAAjB;AAAwB,IAAA,KAAK,GAAG,QAAhC;AAA0C,IAAA;AAA1C,MAAqD,KAA3D;AAEA,QAAM,KAAK,GAAe;AACxB,IAAA,QADwB;AAExB,IAAA,GAFwB;AAGxB,IAAA,KAHwB;AAIxB,IAAA,KAJwB;AAKxB,IAAA,MALwB;AAMxB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANY;AASxB,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;AACjC,MAAA,GADiC;AAEjC,SAAG;AAF8B,KAA7B;AATkB,GAA1B;AAeA,SAAO,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, fit, block, shape = 'square', shadow } = 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":"../src/"}
|
|
@@ -5,13 +5,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.useImageStyles_unstable = exports.imageClassName = void 0;
|
|
7
7
|
|
|
8
|
-
const
|
|
8
|
+
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
9
9
|
|
|
10
10
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
|
11
11
|
|
|
12
12
|
exports.imageClassName = 'fui-Image';
|
|
13
13
|
|
|
14
|
-
const useStyles = /*#__PURE__*/
|
|
14
|
+
const useStyles = /*#__PURE__*/react_1.__styles({
|
|
15
15
|
"root": {
|
|
16
16
|
"g2u3we": "fj3muxo",
|
|
17
17
|
"h3c5rm": ["f1akhkt", "f1lxtadh"],
|
|
@@ -82,7 +82,7 @@ const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
|
|
|
82
82
|
|
|
83
83
|
const useImageStyles_unstable = state => {
|
|
84
84
|
const styles = useStyles();
|
|
85
|
-
state.root.className =
|
|
85
|
+
state.root.className = react_1.mergeClasses(exports.imageClassName, styles.root, state.bordered && styles.rootBordered, state.shape === 'circular' && styles.rootCircular, state.shape === 'rounded' && styles.rootRounded, state.shadow && styles.rootShadow, state.fit === 'none' && styles.rootFitNone, state.fit === 'center' && styles.rootFitCenter, state.fit === 'cover' && styles.rootFitCover, state.fit === 'contain' && styles.rootFitContain, state.block && styles.rootBlock, state.root.className);
|
|
86
86
|
};
|
|
87
87
|
|
|
88
88
|
exports.useImageStyles_unstable = useImageStyles_unstable;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
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;;AAGa,OAAA,CAAA,cAAA,GAAiB,WAAjB;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;;AAkDO,MAAM,uBAAuB,GAAI,KAAD,IAAsB;AAC3D,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,cADqB,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,QAAN,IAAkB,MAAM,CAAC,YAHJ,EAIrB,KAAK,CAAC,KAAN,KAAgB,UAAhB,IAA8B,MAAM,CAAC,YAJhB,EAKrB,KAAK,CAAC,KAAN,KAAgB,SAAhB,IAA6B,MAAM,CAAC,WALf,EAMrB,KAAK,CAAC,MAAN,IAAgB,MAAM,CAAC,UANF,EAOrB,KAAK,CAAC,GAAN,KAAc,MAAd,IAAwB,MAAM,CAAC,WAPV,EAQrB,KAAK,CAAC,GAAN,KAAc,QAAd,IAA0B,MAAM,CAAC,aARZ,EASrB,KAAK,CAAC,GAAN,KAAc,OAAd,IAAyB,MAAM,CAAC,YATX,EAUrB,KAAK,CAAC,GAAN,KAAc,SAAd,IAA2B,MAAM,CAAC,cAVb,EAWrB,KAAK,CAAC,KAAN,IAAe,MAAM,CAAC,SAXD,EAYrB,KAAK,CAAC,IAAN,CAAW,SAZU,CAAvB;AAcD,CAhBM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ImageState } from './Image.types';\n\nexport const imageClassName = 'fui-Image';\n\nconst useStyles = makeStyles({\n root: {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n\n boxSizing: 'border-box',\n display: 'inline-block',\n },\n rootBordered: {\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n },\n rootCircular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rootRounded: {\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n rootShadow: {\n boxShadow: tokens.shadow4,\n },\n rootFitNone: {\n objectFit: 'none',\n objectPosition: 'left top',\n height: '100%',\n width: '100%',\n },\n rootFitCenter: {\n objectFit: 'none',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootFitCover: {\n objectFit: 'cover',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootFitContain: {\n objectFit: 'contain',\n objectPosition: 'center',\n height: '100%',\n width: '100%',\n },\n rootBlock: {\n width: '100%',\n },\n});\n\nexport const useImageStyles_unstable = (state: ImageState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n imageClassName,\n styles.root,\n state.bordered && styles.rootBordered,\n state.shape === 'circular' && styles.rootCircular,\n state.shape === 'rounded' && styles.rootRounded,\n state.shadow && styles.rootShadow,\n state.fit === 'none' && styles.rootFitNone,\n state.fit === 'center' && styles.rootFitCenter,\n state.fit === 'cover' && styles.rootFitCover,\n state.fit === 'contain' && styles.rootFitContain,\n state.block && styles.rootBlock,\n state.root.className,\n );\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Image';\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-image",
|
|
3
|
-
"version": "0.0.0-
|
|
3
|
+
"version": "0.0.0-nightly6faffd280a20220221.1",
|
|
4
4
|
"description": "Fluent UI React Image component.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -26,11 +26,9 @@
|
|
|
26
26
|
"type-check": "tsc -b tsconfig.json"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@fluentui/babel-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
|
|
30
29
|
"@fluentui/eslint-plugin": "*",
|
|
31
|
-
"@fluentui/jest-serializer-make-styles": "0.0.0-nightly6a6e258c4020220125.1",
|
|
32
30
|
"@fluentui/react-conformance": "*",
|
|
33
|
-
"@fluentui/react-conformance-
|
|
31
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly6faffd280a20220221.1",
|
|
34
32
|
"@fluentui/scripts": "^1.0.0",
|
|
35
33
|
"@types/enzyme": "3.10.3",
|
|
36
34
|
"@types/enzyme-adapter-react-16": "1.0.3",
|
|
@@ -45,8 +43,9 @@
|
|
|
45
43
|
"react-test-renderer": "^16.3.0"
|
|
46
44
|
},
|
|
47
45
|
"dependencies": {
|
|
48
|
-
"@
|
|
49
|
-
"@fluentui/react-utilities": "0.0.0-
|
|
46
|
+
"@griffel/react": "1.0.0",
|
|
47
|
+
"@fluentui/react-utilities": "0.0.0-nightly6faffd280a20220221.1",
|
|
48
|
+
"@fluentui/react-theme": "0.0.0-nightly6faffd280a20220221.1",
|
|
50
49
|
"tslib": "^2.1.0"
|
|
51
50
|
},
|
|
52
51
|
"peerDependencies": {
|