sanity-plugin-asset-source-unsplash 0.2.0 → 3.0.0-studio-v3.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/README.md +74 -24
- package/lib/index.d.ts +5 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/index.js +452 -0
- package/lib/index.js.map +1 -0
- package/lib/index.modern.js +444 -0
- package/lib/index.modern.js.map +1 -0
- package/package.json +63 -85
- package/src/components/Icon.tsx +10 -0
- package/src/components/Photo.styled.tsx +51 -0
- package/src/components/Photo.tsx +90 -0
- package/src/components/UnsplashAssetSource.styled.tsx +13 -0
- package/src/components/UnsplashAssetSource.tsx +237 -0
- package/src/datastores/unsplash.ts +77 -0
- package/src/index.ts +22 -0
- package/src/types.ts +62 -0
- package/dist/lib/components/Icon.js +0 -13
- package/dist/lib/components/Icon.js.map +0 -1
- package/dist/lib/components/Photo.js +0 -73
- package/dist/lib/components/Photo.js.map +0 -1
- package/dist/lib/components/Photo.styled.js +0 -21
- package/dist/lib/components/Photo.styled.js.map +0 -1
- package/dist/lib/components/UnsplashAssetSource.js +0 -162
- package/dist/lib/components/UnsplashAssetSource.js.map +0 -1
- package/dist/lib/components/UnsplashAssetSource.styled.js +0 -16
- package/dist/lib/components/UnsplashAssetSource.styled.js.map +0 -1
- package/dist/lib/datastores/unsplash.js +0 -51
- package/dist/lib/datastores/unsplash.js.map +0 -1
- package/dist/lib/index.js +0 -14
- package/dist/lib/index.js.map +0 -1
- package/dist/lib/types.js +0 -3
- package/dist/lib/types.js.map +0 -1
- package/dist/sanity-plugin-asset-source-unsplash.es5.js +0 -12277
- package/dist/sanity-plugin-asset-source-unsplash.es5.js.map +0 -1
- package/dist/sanity-plugin-asset-source-unsplash.umd.js +0 -12282
- package/dist/sanity-plugin-asset-source-unsplash.umd.js.map +0 -1
- package/dist/types/components/Icon.d.ts +0 -2
- package/dist/types/components/Photo.d.ts +0 -21
- package/dist/types/components/Photo.styled.d.ts +0 -4
- package/dist/types/components/UnsplashAssetSource.d.ts +0 -44
- package/dist/types/components/UnsplashAssetSource.styled.d.ts +0 -3
- package/dist/types/datastores/unsplash.d.ts +0 -8
- package/dist/types/index.d.ts +0 -9
- package/dist/types/types.d.ts +0 -59
- package/sanity.json +0 -13
package/README.md
CHANGED
|
@@ -1,44 +1,67 @@
|
|
|
1
1
|
# Sanity Asset Source Plugin: Unsplash
|
|
2
|
+
|
|
3
|
+
> **NOTE**
|
|
4
|
+
>
|
|
5
|
+
> This is the **Sanity Studio v3 version** of sanity-plugin-asset-source-unsplash.
|
|
6
|
+
>
|
|
7
|
+
> For the v2 version, please refer to the [v2-branch](https://github.com/sanity-io/sanity-plugin-asset-source-unsplash).
|
|
8
|
+
|
|
9
|
+
## What is it?
|
|
2
10
|
Search for photos on Unsplash and add them to your project right inside Sanity Studio.
|
|
3
11
|
|
|
4
|
-
|
|
12
|
+

|
|
5
13
|
|
|
6
14
|
## Installation
|
|
7
15
|
|
|
8
|
-
`
|
|
9
|
-
|
|
10
|
-
## Part name
|
|
16
|
+
`npm install --save sanity-plugin-asset-source-unsplash@studio-v3`
|
|
11
17
|
|
|
12
|
-
|
|
18
|
+
or
|
|
13
19
|
|
|
14
|
-
`
|
|
20
|
+
`yarn add sanity-plugin-asset-source-unsplash@studio-v3`
|
|
15
21
|
|
|
16
|
-
##
|
|
22
|
+
## Usage
|
|
17
23
|
|
|
18
|
-
|
|
24
|
+
Add it as a plugin in sanity.config.ts (or .js):
|
|
19
25
|
|
|
20
|
-
|
|
21
|
-
|
|
26
|
+
```js
|
|
27
|
+
import { unsplashImageAsset } from "sanity-plugin-asset-source-unsplash";
|
|
22
28
|
|
|
23
|
-
|
|
29
|
+
export default createConfig({
|
|
30
|
+
// ...
|
|
31
|
+
plugins: [
|
|
32
|
+
unsplashImageAsset(),
|
|
33
|
+
]
|
|
34
|
+
})
|
|
35
|
+
```
|
|
24
36
|
|
|
25
|
-
|
|
37
|
+
This will add [unsplashAssetSource](src/index.ts) to all image-fields in Sanity Studio
|
|
26
38
|
|
|
27
|
-
|
|
28
|
-
* Add `sanity-plugin-asset-source-unsplash` with the current version number to `package.json` in the `test-studio` root folder (but don't run `npm install` afterwards)
|
|
29
|
-
* Run `npm link sanity-plugin-asset-source-unsplash` inside the mono-repo's root.
|
|
30
|
-
* Add `asset-source-unsplash` to the list of the studios plugins in `sanity.json`.
|
|
31
|
-
* Restart the `test-studio`
|
|
39
|
+
### Manually configure asset sources
|
|
32
40
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
* Add `sanity-plugin-asset-source-unsplash` with the current version number to `package.json`.
|
|
36
|
-
* Run `npm link sanity-plugin-asset-source-unsplash`
|
|
37
|
-
* Add `asset-source-unsplash` to the list of the studios plugins in `sanity.json`.
|
|
38
|
-
* Start the studio
|
|
41
|
+
If you need to configure when Unsplash should be available as an asset source, filter it out as needed in
|
|
42
|
+
`formbuilder.image.assetSources`:
|
|
39
43
|
|
|
40
|
-
|
|
44
|
+
```js
|
|
45
|
+
import { unsplashImageAsset, unsplashAssetSource } from "sanity-plugin-asset-source-unsplash";
|
|
41
46
|
|
|
47
|
+
export default createConfig({
|
|
48
|
+
// ...
|
|
49
|
+
plugins: [
|
|
50
|
+
unsplashImageAsset(),
|
|
51
|
+
],
|
|
52
|
+
formBuilder: {
|
|
53
|
+
image: {
|
|
54
|
+
assetSources: (previousAssetSources, {schema}) => {
|
|
55
|
+
if (schema.name === 'movie-image') {
|
|
56
|
+
// remove unsplash from movie-image types
|
|
57
|
+
return previousAssetSources.filter(assetSource => assetSource !== unsplashAssetSource)
|
|
58
|
+
}
|
|
59
|
+
return previousAssetSources
|
|
60
|
+
},
|
|
61
|
+
},
|
|
62
|
+
},
|
|
63
|
+
})
|
|
64
|
+
```
|
|
42
65
|
|
|
43
66
|
## Example Unsplash API Photo result
|
|
44
67
|
|
|
@@ -206,5 +229,32 @@ When you are done and have published your new version, you can run `npm unlink`
|
|
|
206
229
|
* https://unsplash.com/documentation
|
|
207
230
|
* https://www.sanity.io/docs/custom-asset-sources
|
|
208
231
|
|
|
232
|
+
## License
|
|
233
|
+
|
|
234
|
+
MIT-licensed. See LICENSE.
|
|
235
|
+
|
|
236
|
+
## Develop & test
|
|
237
|
+
|
|
238
|
+
Make sure to run `npm run build` once, then run
|
|
239
|
+
|
|
240
|
+
```bash
|
|
241
|
+
npm run link-watch
|
|
242
|
+
```
|
|
243
|
+
|
|
244
|
+
In another shell, `cd` to your test studio and run:
|
|
245
|
+
|
|
246
|
+
```bash
|
|
247
|
+
npx yalc add sanity-plugin-asset-source-unsplash --link && yarn install
|
|
248
|
+
```
|
|
249
|
+
|
|
250
|
+
Now, changes in this repo will be automatically built and pushed to the studio,
|
|
251
|
+
triggering hotreload. Yalc avoids issues with react-hooks that are typical when using yarn/npm link.
|
|
252
|
+
|
|
253
|
+
### About build & watch
|
|
254
|
+
|
|
255
|
+
This plugin uses [@sanity/plugin-sdk](https://github.com/sanity-io/plugin-sdk)
|
|
256
|
+
with default configuration for build & watch scripts.
|
|
257
|
+
|
|
258
|
+
|
|
209
259
|
|
|
210
260
|
|
package/lib/index.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"mappings":";AOIA,OAAO,MAAM,qBAAqB,WAKjC,CAAA;AAED,OAAO,MAAM,iDAUX,CAAA","sources":["src/src/types.ts","src/src/components/Photo.styled.tsx","src/src/components/Photo.tsx","src/src/datastores/unsplash.ts","src/src/components/UnsplashAssetSource.styled.tsx","src/src/components/UnsplashAssetSource.tsx","src/src/components/Icon.tsx","src/src/index.ts","src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,"import Unsplash from './components/UnsplashAssetSource'\nimport Icon from './components/Icon'\nimport { createPlugin, AssetSource } from 'sanity'\n\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\nexport const unsplashImageAsset = createPlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n"],"names":[],"version":3,"file":"index.d.ts.map","sourceRoot":"../"}
|
package/lib/index.js
ADDED
|
@@ -0,0 +1,452 @@
|
|
|
1
|
+
var $3KLdq$sanity = require("sanity");
|
|
2
|
+
var $3KLdq$reactjsxruntime = require("react/jsx-runtime");
|
|
3
|
+
var $3KLdq$react = require("react");
|
|
4
|
+
var $3KLdq$reactphotoalbum = require("react-photo-album");
|
|
5
|
+
var $3KLdq$lodashflatten = require("lodash/flatten");
|
|
6
|
+
var $3KLdq$rxjs = require("rxjs");
|
|
7
|
+
var $3KLdq$sanityui = require("@sanity/ui");
|
|
8
|
+
var $3KLdq$reactinfinitescrollcomponent = require("react-infinite-scroll-component");
|
|
9
|
+
var $3KLdq$styledcomponents = require("styled-components");
|
|
10
|
+
var $3KLdq$rxjsoperators = require("rxjs/operators");
|
|
11
|
+
|
|
12
|
+
function $parcel$export(e, n, v, s) {
|
|
13
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
14
|
+
}
|
|
15
|
+
function $parcel$interopDefault(a) {
|
|
16
|
+
return a && a.__esModule ? a.default : a;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
$parcel$export(module.exports, "unsplashAssetSource", () => $244e63ca53592e4d$export$26a922d0c5d23b67);
|
|
20
|
+
$parcel$export(module.exports, "unsplashImageAsset", () => $244e63ca53592e4d$export$38ee668edea18a81);
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
const $42215c8fc0c6b3da$export$be92b6f5f03c0fe9 = (0, ($parcel$interopDefault($3KLdq$styledcomponents))).div`
|
|
32
|
+
overflow: hidden;
|
|
33
|
+
background-origin: content-box;
|
|
34
|
+
background-repeat: no-repeat;
|
|
35
|
+
background-clip: border-box;
|
|
36
|
+
background-size: cover;
|
|
37
|
+
position: relative;
|
|
38
|
+
outline: none !important;
|
|
39
|
+
border: ${({ studioTheme: studioTheme })=>`1px solid ${studioTheme.color.card.enabled.border}`};
|
|
40
|
+
box-sizing: content-box;
|
|
41
|
+
user-drag: none;
|
|
42
|
+
|
|
43
|
+
&:hover {
|
|
44
|
+
opacity: 0.85;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
&:focus,
|
|
48
|
+
&:active {
|
|
49
|
+
border: 1px solid var(--input-border-color-focus);
|
|
50
|
+
box-shadow: inset 0 0 0 3px var(--input-border-color-focus);
|
|
51
|
+
}
|
|
52
|
+
`;
|
|
53
|
+
const $42215c8fc0c6b3da$export$efa8bdf03adcbcab = (0, ($parcel$interopDefault($3KLdq$styledcomponents))).a`
|
|
54
|
+
text-decoration: none;
|
|
55
|
+
cursor: pointer;
|
|
56
|
+
`;
|
|
57
|
+
const $42215c8fc0c6b3da$export$ac05e79a4174af5c = (0, ($parcel$interopDefault($3KLdq$styledcomponents)))((0, $3KLdq$sanityui.Card))`
|
|
58
|
+
${({ theme: theme })=>`
|
|
59
|
+
--creditline-fg: ${theme.sanity.color.card.enabled.fg};
|
|
60
|
+
--creditline-bg: ${theme.sanity.color.card.enabled.bg};
|
|
61
|
+
`};
|
|
62
|
+
user-drag: none;
|
|
63
|
+
position: absolute;
|
|
64
|
+
background-color: var(--creditline-bg);
|
|
65
|
+
bottom: 0;
|
|
66
|
+
|
|
67
|
+
[data-ui='Text'] {
|
|
68
|
+
color: var(--creditline-fg);
|
|
69
|
+
}
|
|
70
|
+
`;
|
|
71
|
+
|
|
72
|
+
|
|
73
|
+
const $22da14fdbfdcc1c3$var$UTM_SOURCE = "sanity-plugin-asset-source-unsplash";
|
|
74
|
+
function $22da14fdbfdcc1c3$export$2e2bcd8739ae039(props) {
|
|
75
|
+
const { onClick: onClick , data: data , onKeyDown: onKeyDown , onFocus: onFocus , active: active , width: width , height: height } = props;
|
|
76
|
+
const rootElm = (0, $3KLdq$react.useRef)(null);
|
|
77
|
+
const prevActive = (0, $3KLdq$react.useRef)(false);
|
|
78
|
+
const handleClick = (0, $3KLdq$react.useCallback)(()=>{
|
|
79
|
+
onClick(data);
|
|
80
|
+
}, [
|
|
81
|
+
onClick,
|
|
82
|
+
data
|
|
83
|
+
]);
|
|
84
|
+
const handleCreditLineClicked = (0, $3KLdq$react.useCallback)((event)=>{
|
|
85
|
+
event.stopPropagation();
|
|
86
|
+
const url = `${data.links.html}?utm_source=${encodeURIComponent($22da14fdbfdcc1c3$var$UTM_SOURCE)}&utm_medium=referral`;
|
|
87
|
+
window.open(url, data.id, "noreferrer,noopener");
|
|
88
|
+
}, [
|
|
89
|
+
data
|
|
90
|
+
]);
|
|
91
|
+
const handleKeyDown = (0, $3KLdq$react.useCallback)((event)=>{
|
|
92
|
+
onKeyDown(event);
|
|
93
|
+
if (event.keyCode === 13) onClick(data);
|
|
94
|
+
}, [
|
|
95
|
+
onKeyDown,
|
|
96
|
+
data,
|
|
97
|
+
onClick
|
|
98
|
+
]);
|
|
99
|
+
const handleMouseDown = (0, $3KLdq$react.useCallback)(()=>{
|
|
100
|
+
onFocus(data);
|
|
101
|
+
}, [
|
|
102
|
+
onFocus,
|
|
103
|
+
data
|
|
104
|
+
]);
|
|
105
|
+
(0, $3KLdq$react.useEffect)(()=>{
|
|
106
|
+
if (!prevActive.current && active && rootElm.current) {
|
|
107
|
+
rootElm.current.focus();
|
|
108
|
+
onFocus(data);
|
|
109
|
+
}
|
|
110
|
+
prevActive.current = active;
|
|
111
|
+
// data changing alone should not re-trigger effect
|
|
112
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
113
|
+
}, [
|
|
114
|
+
active
|
|
115
|
+
]);
|
|
116
|
+
const src = data.urls.small;
|
|
117
|
+
const userName = data.user.name;
|
|
118
|
+
const theme = (0, $3KLdq$sanityui.useTheme)().sanity;
|
|
119
|
+
return /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $42215c8fc0c6b3da$export$be92b6f5f03c0fe9), {
|
|
120
|
+
ref: rootElm,
|
|
121
|
+
studioTheme: theme,
|
|
122
|
+
title: `Select image by ${userName} from Unsplash`,
|
|
123
|
+
tabIndex: 0,
|
|
124
|
+
onKeyDown: handleKeyDown,
|
|
125
|
+
onMouseDown: handleMouseDown,
|
|
126
|
+
style: {
|
|
127
|
+
width: `${width}px`,
|
|
128
|
+
height: `${height}px`,
|
|
129
|
+
backgroundImage: `url("${src}")`
|
|
130
|
+
},
|
|
131
|
+
onClick: handleClick,
|
|
132
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $42215c8fc0c6b3da$export$efa8bdf03adcbcab), {
|
|
133
|
+
onClick: handleCreditLineClicked,
|
|
134
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $42215c8fc0c6b3da$export$ac05e79a4174af5c), {
|
|
135
|
+
padding: 2,
|
|
136
|
+
radius: 2,
|
|
137
|
+
margin: 2,
|
|
138
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsxs)((0, $3KLdq$sanityui.Text), {
|
|
139
|
+
size: 1,
|
|
140
|
+
title: `Open image by ${userName} on Unsplash in new window`,
|
|
141
|
+
children: [
|
|
142
|
+
"By @",
|
|
143
|
+
data.user.username
|
|
144
|
+
]
|
|
145
|
+
})
|
|
146
|
+
})
|
|
147
|
+
})
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
|
|
152
|
+
|
|
153
|
+
|
|
154
|
+
const $eb4a94c5705fcb6f$var$fetchSearch = (client, query, page, perPage)=>(0, $3KLdq$rxjs.defer)(()=>client.observable.request({
|
|
155
|
+
url: `/addons/unsplash/search/photos?query=${encodeURIComponent(query)}&page=${page}&per_page=${perPage}`,
|
|
156
|
+
withCredentials: true,
|
|
157
|
+
method: "GET"
|
|
158
|
+
}));
|
|
159
|
+
const $eb4a94c5705fcb6f$var$fetchList = (client, type, page, perPage)=>(0, $3KLdq$rxjs.defer)(()=>client.observable.request({
|
|
160
|
+
url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,
|
|
161
|
+
withCredentials: true,
|
|
162
|
+
method: "GET"
|
|
163
|
+
}));
|
|
164
|
+
function $eb4a94c5705fcb6f$export$83e179a74b22ff18(client, photo) {
|
|
165
|
+
const downloadUrl = photo.links.download_location.replace("https://api.unsplash.com", "/addons/unsplash");
|
|
166
|
+
return client.request({
|
|
167
|
+
url: downloadUrl,
|
|
168
|
+
withCredentials: true,
|
|
169
|
+
method: "GET"
|
|
170
|
+
}).then((result)=>{
|
|
171
|
+
return result.url;
|
|
172
|
+
});
|
|
173
|
+
}
|
|
174
|
+
const $eb4a94c5705fcb6f$export$d76128d007d19019 = (client, query, page, resultsPerPage)=>{
|
|
175
|
+
return (0, $3KLdq$rxjs.concat)(query.pipe((0, $3KLdq$rxjsoperators.withLatestFrom)(page), (0, $3KLdq$rxjsoperators.debounceTime)(500), (0, $3KLdq$rxjsoperators.distinctUntilChanged)(), (0, $3KLdq$rxjsoperators.switchMap)(([q, p])=>{
|
|
176
|
+
if (q) return $eb4a94c5705fcb6f$var$fetchSearch(client, q, p, resultsPerPage).pipe((0, $3KLdq$rxjsoperators.distinctUntilChanged)(), (0, $3KLdq$rxjsoperators.map)((result)=>result.results));
|
|
177
|
+
return $eb4a94c5705fcb6f$var$fetchList(client, "popular", p, resultsPerPage);
|
|
178
|
+
})));
|
|
179
|
+
};
|
|
180
|
+
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
const $6f49db9510930d2c$export$4b85d3515bd863a5 = (0, ($parcel$interopDefault($3KLdq$styledcomponents)))((0, $3KLdq$sanityui.Stack))`
|
|
186
|
+
position: sticky;
|
|
187
|
+
top: 0;
|
|
188
|
+
z-index: 1;
|
|
189
|
+
`;
|
|
190
|
+
const $6f49db9510930d2c$export$76d6749d1cf8513c = (0, ($parcel$interopDefault($3KLdq$styledcomponents))).div`
|
|
191
|
+
overflow-y: auto;
|
|
192
|
+
max-height: 80vh;
|
|
193
|
+
`;
|
|
194
|
+
|
|
195
|
+
|
|
196
|
+
|
|
197
|
+
|
|
198
|
+
const $2afbc63e3551869f$var$RESULTS_PER_PAGE = 42;
|
|
199
|
+
const $2afbc63e3551869f$var$PHOTO_SPACING = 2;
|
|
200
|
+
const $2afbc63e3551869f$var$PHOTO_PADDING = 1 // offset the 1px border width
|
|
201
|
+
;
|
|
202
|
+
function $2afbc63e3551869f$export$2e2bcd8739ae039(props) {
|
|
203
|
+
const client = (0, $3KLdq$sanity.useClient)();
|
|
204
|
+
return /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)($2afbc63e3551869f$var$UnsplashAssetSourceInternal, {
|
|
205
|
+
...props,
|
|
206
|
+
client: client
|
|
207
|
+
});
|
|
208
|
+
}
|
|
209
|
+
class $2afbc63e3551869f$var$UnsplashAssetSourceInternal extends (0, ($parcel$interopDefault($3KLdq$react))).Component {
|
|
210
|
+
static defaultProps = {
|
|
211
|
+
selectedAssets: undefined
|
|
212
|
+
};
|
|
213
|
+
state = {
|
|
214
|
+
cursor: 0,
|
|
215
|
+
query: "",
|
|
216
|
+
page: 1,
|
|
217
|
+
searchResults: [
|
|
218
|
+
[]
|
|
219
|
+
],
|
|
220
|
+
isLoading: true
|
|
221
|
+
};
|
|
222
|
+
searchSubscription = null;
|
|
223
|
+
searchSubject$ = new (0, $3KLdq$rxjs.BehaviorSubject)("");
|
|
224
|
+
pageSubject$ = new (0, $3KLdq$rxjs.BehaviorSubject)(1);
|
|
225
|
+
componentDidMount() {
|
|
226
|
+
this.searchSubscription = (0, $eb4a94c5705fcb6f$export$d76128d007d19019)(this.props.client, this.searchSubject$, this.pageSubject$, $2afbc63e3551869f$var$RESULTS_PER_PAGE).subscribe({
|
|
227
|
+
next: (results)=>{
|
|
228
|
+
this.setState((prev)=>({
|
|
229
|
+
searchResults: [
|
|
230
|
+
...prev.searchResults,
|
|
231
|
+
results
|
|
232
|
+
],
|
|
233
|
+
isLoading: false
|
|
234
|
+
}));
|
|
235
|
+
}
|
|
236
|
+
});
|
|
237
|
+
}
|
|
238
|
+
componentWillUnmount() {
|
|
239
|
+
if (this.searchSubscription) this.searchSubscription.unsubscribe();
|
|
240
|
+
}
|
|
241
|
+
handleSelect = (photo)=>{
|
|
242
|
+
this.setState({
|
|
243
|
+
isLoading: true
|
|
244
|
+
});
|
|
245
|
+
return (0, $eb4a94c5705fcb6f$export$83e179a74b22ff18)(this.props.client, photo).then((downloadUrl)=>{
|
|
246
|
+
const description = photo.description || undefined;
|
|
247
|
+
const asset = {
|
|
248
|
+
kind: "url",
|
|
249
|
+
value: downloadUrl,
|
|
250
|
+
assetDocumentProps: {
|
|
251
|
+
_type: "sanity.imageAsset",
|
|
252
|
+
source: {
|
|
253
|
+
name: "unsplash",
|
|
254
|
+
id: photo.id,
|
|
255
|
+
url: photo.links.html
|
|
256
|
+
},
|
|
257
|
+
description: description,
|
|
258
|
+
creditLine: `${photo.user.name} by Unsplash`
|
|
259
|
+
}
|
|
260
|
+
};
|
|
261
|
+
this.props.onSelect([
|
|
262
|
+
asset
|
|
263
|
+
]);
|
|
264
|
+
});
|
|
265
|
+
};
|
|
266
|
+
handleClose = ()=>{
|
|
267
|
+
this.props.onClose();
|
|
268
|
+
};
|
|
269
|
+
handleSearchTermChanged = (event)=>{
|
|
270
|
+
const query = event.currentTarget.value;
|
|
271
|
+
this.setState({
|
|
272
|
+
query: query,
|
|
273
|
+
page: 1,
|
|
274
|
+
searchResults: [
|
|
275
|
+
[]
|
|
276
|
+
],
|
|
277
|
+
isLoading: true,
|
|
278
|
+
cursor: 0
|
|
279
|
+
});
|
|
280
|
+
this.pageSubject$.next(1);
|
|
281
|
+
this.searchSubject$.next(query);
|
|
282
|
+
};
|
|
283
|
+
handleScollerLoadMore = ()=>{
|
|
284
|
+
// eslint-disable-next-line react/no-access-state-in-setstate
|
|
285
|
+
const nextPage = this.state.page + 1;
|
|
286
|
+
this.setState({
|
|
287
|
+
page: nextPage,
|
|
288
|
+
isLoading: true
|
|
289
|
+
});
|
|
290
|
+
this.pageSubject$.next(nextPage);
|
|
291
|
+
this.searchSubject$.next(this.state.query);
|
|
292
|
+
};
|
|
293
|
+
handleKeyDown = (event)=>{
|
|
294
|
+
const { cursor: cursor } = this.state;
|
|
295
|
+
if ((event.keyCode === 38 || event.keyCode === 37) && cursor > 0) this.setState((prevState)=>({
|
|
296
|
+
cursor: prevState.cursor - 1
|
|
297
|
+
}));
|
|
298
|
+
else if ((event.keyCode === 40 || event.keyCode === 39) && cursor < this.getPhotos().length - 1) this.setState((prevState)=>({
|
|
299
|
+
cursor: prevState.cursor + 1
|
|
300
|
+
}));
|
|
301
|
+
};
|
|
302
|
+
getPhotos() {
|
|
303
|
+
return (0, ($parcel$interopDefault($3KLdq$lodashflatten)))(this.state.searchResults);
|
|
304
|
+
}
|
|
305
|
+
updateCursor = (photo)=>{
|
|
306
|
+
const index = this.getPhotos().findIndex((result)=>result.id === photo.id);
|
|
307
|
+
this.setState({
|
|
308
|
+
cursor: index
|
|
309
|
+
});
|
|
310
|
+
};
|
|
311
|
+
renderImage = (props)=>{
|
|
312
|
+
const { photo: photo , layout: layout } = props;
|
|
313
|
+
const active = this.getPhotos().findIndex((result)=>result.id === photo.data.id) === this.state.cursor || false;
|
|
314
|
+
return /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $22da14fdbfdcc1c3$export$2e2bcd8739ae039), {
|
|
315
|
+
onClick: this.handleSelect.bind(photo.data),
|
|
316
|
+
onKeyDown: this.handleKeyDown,
|
|
317
|
+
data: photo.data,
|
|
318
|
+
width: layout.width,
|
|
319
|
+
height: layout.height,
|
|
320
|
+
active: active,
|
|
321
|
+
onFocus: this.updateCursor
|
|
322
|
+
});
|
|
323
|
+
};
|
|
324
|
+
render() {
|
|
325
|
+
const { query: query , searchResults: searchResults , isLoading: isLoading } = this.state;
|
|
326
|
+
return /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Dialog), {
|
|
327
|
+
id: "unsplash-asset-source",
|
|
328
|
+
header: "Select image from Unsplash",
|
|
329
|
+
onClose: this.handleClose,
|
|
330
|
+
open: true,
|
|
331
|
+
width: 4,
|
|
332
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsxs)((0, $3KLdq$sanityui.Stack), {
|
|
333
|
+
space: 3,
|
|
334
|
+
padding: 4,
|
|
335
|
+
children: [
|
|
336
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Card), {
|
|
337
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsxs)((0, $6f49db9510930d2c$export$4b85d3515bd863a5), {
|
|
338
|
+
space: 3,
|
|
339
|
+
children: [
|
|
340
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Text), {
|
|
341
|
+
size: 1,
|
|
342
|
+
weight: "semibold",
|
|
343
|
+
children: "Search Unsplash"
|
|
344
|
+
}),
|
|
345
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.TextInput), {
|
|
346
|
+
label: "Search Unsplash.com",
|
|
347
|
+
placeholder: "Topics or colors",
|
|
348
|
+
value: query,
|
|
349
|
+
onChange: this.handleSearchTermChanged
|
|
350
|
+
})
|
|
351
|
+
]
|
|
352
|
+
})
|
|
353
|
+
}),
|
|
354
|
+
!isLoading && this.getPhotos().length === 0 && /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Text), {
|
|
355
|
+
size: 1,
|
|
356
|
+
muted: true,
|
|
357
|
+
children: "No results found"
|
|
358
|
+
}),
|
|
359
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, ($parcel$interopDefault($3KLdq$reactinfinitescrollcomponent))), {
|
|
360
|
+
dataLength: this.getPhotos().length,
|
|
361
|
+
next: this.handleScollerLoadMore,
|
|
362
|
+
// scrollableTarget="unsplash-scroller"
|
|
363
|
+
hasMore: true,
|
|
364
|
+
scrollThreshold: 0.99,
|
|
365
|
+
height: "60vh",
|
|
366
|
+
loader: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Flex), {
|
|
367
|
+
align: "center",
|
|
368
|
+
justify: "center",
|
|
369
|
+
padding: 3,
|
|
370
|
+
children: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Spinner), {
|
|
371
|
+
muted: true
|
|
372
|
+
})
|
|
373
|
+
}),
|
|
374
|
+
endMessage: /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, $3KLdq$sanityui.Text), {
|
|
375
|
+
size: 1,
|
|
376
|
+
muted: true,
|
|
377
|
+
children: "No more results"
|
|
378
|
+
}),
|
|
379
|
+
children: searchResults.filter((photos)=>photos.length > 0).map((photos, index)=>/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)((0, ($parcel$interopDefault($3KLdq$reactphotoalbum))), {
|
|
380
|
+
layout: "rows",
|
|
381
|
+
spacing: $2afbc63e3551869f$var$PHOTO_SPACING,
|
|
382
|
+
padding: $2afbc63e3551869f$var$PHOTO_PADDING,
|
|
383
|
+
targetRowHeight: (width)=>{
|
|
384
|
+
if (width < 300) return 150;
|
|
385
|
+
else if (width < 600) return 200;
|
|
386
|
+
return 300;
|
|
387
|
+
},
|
|
388
|
+
photos: photos.map((photo)=>({
|
|
389
|
+
src: photo.urls.small,
|
|
390
|
+
width: photo.width,
|
|
391
|
+
height: photo.height,
|
|
392
|
+
key: photo.id,
|
|
393
|
+
data: photo
|
|
394
|
+
})),
|
|
395
|
+
renderPhoto: this.renderImage,
|
|
396
|
+
componentsProps: {
|
|
397
|
+
containerProps: {
|
|
398
|
+
style: {
|
|
399
|
+
marginBottom: `${$2afbc63e3551869f$var$PHOTO_SPACING}px`
|
|
400
|
+
}
|
|
401
|
+
}
|
|
402
|
+
}
|
|
403
|
+
}, `gallery-${query || "popular"}-${index}`))
|
|
404
|
+
})
|
|
405
|
+
]
|
|
406
|
+
})
|
|
407
|
+
});
|
|
408
|
+
}
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
|
|
412
|
+
|
|
413
|
+
|
|
414
|
+
function $d3faec00d1fdf0df$export$2e2bcd8739ae039() {
|
|
415
|
+
return /*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsxs)("svg", {
|
|
416
|
+
role: "img",
|
|
417
|
+
viewBox: "0 0 24 24",
|
|
418
|
+
width: "1em",
|
|
419
|
+
height: "1em",
|
|
420
|
+
children: [
|
|
421
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)("title", {}),
|
|
422
|
+
/*#__PURE__*/ (0, $3KLdq$reactjsxruntime.jsx)("path", {
|
|
423
|
+
d: "M7.5 6.75V0h9v6.75h-9zm9 3.75H24V24H0V10.5h7.5v6.75h9V10.5z"
|
|
424
|
+
})
|
|
425
|
+
]
|
|
426
|
+
});
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
|
|
430
|
+
|
|
431
|
+
const $244e63ca53592e4d$export$26a922d0c5d23b67 = {
|
|
432
|
+
name: "unsplash",
|
|
433
|
+
title: "Unsplash",
|
|
434
|
+
component: (0, $2afbc63e3551869f$export$2e2bcd8739ae039),
|
|
435
|
+
icon: (0, $d3faec00d1fdf0df$export$2e2bcd8739ae039)
|
|
436
|
+
};
|
|
437
|
+
const $244e63ca53592e4d$export$38ee668edea18a81 = (0, $3KLdq$sanity.createPlugin)({
|
|
438
|
+
name: "asset-source-unsplash-plugin",
|
|
439
|
+
form: {
|
|
440
|
+
image: {
|
|
441
|
+
assetSources: (prev)=>{
|
|
442
|
+
return [
|
|
443
|
+
...prev,
|
|
444
|
+
$244e63ca53592e4d$export$26a922d0c5d23b67
|
|
445
|
+
];
|
|
446
|
+
}
|
|
447
|
+
}
|
|
448
|
+
}
|
|
449
|
+
});
|
|
450
|
+
|
|
451
|
+
|
|
452
|
+
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;;;;;;ACAA;;;;;ACAA;;;ACAA;;AASO,MAAM,yCAAI,GAAG,CAAA,GAAA,iDAAM,CAAA,CAAC,GAAG,CAAC;;;;;;;;UAQrB,EAAE,CAAC,eAAE,WAAW,CAAA,EAAS,GAAK,CAAC,UAAU,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;;;;;;;;;;;;;AAa7F,CAAC;AAEM,MAAM,yCAAc,GAAG,CAAA,GAAA,iDAAM,CAAA,CAAC,CAAC,CAAC;;;AAGvC,CAAC;AAEM,MAAM,yCAAU,GAAG,CAAA,GAAA,iDAAM,CAAA,CAAC,CAAA,GAAA,oBAAI,CAAA,CAAC,CAAC;EACrC,EAAE,CAAC,SAAE,KAAK,CAAA,EAAE,GAAK,CAAC;sBACE,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;sBACrC,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;GACxD,CAAC,CAAC;;;;;;;;;AASL,CAAC;;;ADnCD,MAAM,gCAAU,GAAG,qCAAqC;AAEzC,kDAAe,KAAY,EAAE;IAC1C,MAAM,WAAE,OAAO,CAAA,QAAE,IAAI,CAAA,aAAE,SAAS,CAAA,WAAE,OAAO,CAAA,UAAE,MAAM,CAAA,SAAE,KAAK,CAAA,UAAE,MAAM,CAAA,EAAE,GAAG,KAAK;IAC1E,MAAM,OAAO,GAAG,CAAA,GAAA,mBAAM,CAAA,CAAiB,IAAI,CAAC;IAC5C,MAAM,UAAU,GAAG,CAAA,GAAA,mBAAM,CAAA,CAAU,KAAK,CAAC;IAEzC,MAAM,WAAW,GAAG,CAAA,GAAA,wBAAW,CAAA,CAAC,IAAM;QACpC,OAAO,CAAC,IAAI,CAAC;KACd,EAAE;QAAC,OAAO;QAAE,IAAI;KAAC,CAAC;IAEnB,MAAM,uBAAuB,GAAG,CAAA,GAAA,wBAAW,CAAA,CACzC,CAAC,KAAU,GAAK;QACd,KAAK,CAAC,eAAe,EAAE;QACvB,MAAM,GAAG,GAAG,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,kBAAkB,CAC7D,gCAAU,CACX,CAAC,oBAAoB,CAAC;QACvB,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,qBAAqB,CAAC;KACjD,EACD;QAAC,IAAI;KAAC,CACP;IAED,MAAM,aAAa,GAAG,CAAA,GAAA,wBAAW,CAAA,CAC/B,CAAC,KAAU,GAAK;QACd,SAAS,CAAC,KAAK,CAAC;QAChB,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE,EACtB,OAAO,CAAC,IAAI,CAAC;KAEhB,EACD;QAAC,SAAS;QAAE,IAAI;QAAE,OAAO;KAAC,CAC3B;IAED,MAAM,eAAe,GAAG,CAAA,GAAA,wBAAW,CAAA,CAAC,IAAM;QACxC,OAAO,CAAC,IAAI,CAAC;KACd,EAAE;QAAC,OAAO;QAAE,IAAI;KAAC,CAAC;IAEnB,CAAA,GAAA,sBAAS,CAAA,CAAC,IAAM;QACd,IAAI,CAAC,UAAU,CAAC,OAAO,IAAI,MAAM,IAAI,OAAO,CAAC,OAAO,EAAE;YACpD,OAAO,CAAC,OAAO,CAAC,KAAK,EAAE;YACvB,OAAO,CAAC,IAAI,CAAC;SACd;QACD,UAAU,CAAC,OAAO,GAAG,MAAM;IAC3B,mDAAmD;IACnD,uDAAuD;KACxD,EAAE;QAAC,MAAM;KAAC,CAAC;IAEZ,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK;IAC3B,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI;IAE/B,MAAM,KAAK,GAAG,CAAA,GAAA,wBAAQ,CAAA,EAAE,CAAC,MAAM;IAC/B,qBACE,gCAAC,CAAA,GAAA,yCAAI,CAAA;QACH,GAAG,EAAE,OAAO;QACZ,WAAW,EAAE,KAAK;QAClB,KAAK,EAAE,CAAC,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC;QAClD,QAAQ,EAAE,CAAC;QACX,SAAS,EAAE,aAAa;QACxB,WAAW,EAAE,eAAe;QAC5B,KAAK,EAAE;YACL,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC;YACnB,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,EAAE,CAAC;YACrB,eAAe,EAAE,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,CAAC;SACjC;QACD,OAAO,EAAE,WAAW;kBAEpB,cAAA,gCAAC,CAAA,GAAA,yCAAc,CAAA;YAAC,OAAO,EAAE,uBAAuB;sBAC9C,cAAA,gCAAC,CAAA,GAAA,yCAAU,CAAA;gBAAC,OAAO,EAAE,CAAC;gBAAE,MAAM,EAAE,CAAC;gBAAE,MAAM,EAAE,CAAC;0BAC1C,cAAA,iCAAC,CAAA,GAAA,oBAAI,CAAA;oBAAC,IAAI,EAAE,CAAC;oBAAE,KAAK,EAAE,CAAC,cAAc,EAAE,QAAQ,CAAC,0BAA0B,CAAC;;wBAAE,MACvE;wBAAC,IAAI,CAAC,IAAI,CAAC,QAAQ;;kBAClB;cACI;UACE;MACZ,CACR;CACF;;;AEzFD;;AAQA,MAAM,iCAAW,GAAG,CAClB,MAAoB,EACpB,KAAa,EACb,IAAY,EACZ,OAAe,GAEf,CAAA,GAAA,iBAAK,CAAA,CAAC,IACJ,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC;YACxB,GAAG,EAAE,CAAC,qCAAqC,EAAE,kBAAkB,CAC7D,KAAK,CACN,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;YACpC,eAAe,EAAE,IAAI;YACrB,MAAM,EAAE,KAAK;SACd,CAAC,CACH;AAEH,MAAM,+BAAS,GAAG,CAChB,MAAoB,EACpB,IAAY,EACZ,IAAY,EACZ,OAAe,GAEf,CAAA,GAAA,iBAAK,CAAA,CAAC,IACJ,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC;YACxB,GAAG,EAAE,CAAC,iCAAiC,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;YAChF,eAAe,EAAE,IAAI;YACrB,MAAM,EAAE,KAAK;SACd,CAAC,CACH;AAEI,SAAS,yCAAgB,CAAC,MAAoB,EAAE,KAAoB,EAAmB;IAC5F,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,iBAAiB,CAAC,OAAO,CACvD,0BAA0B,EAC1B,kBAAkB,CACnB;IACD,OAAO,MAAM,CACV,OAAO,CAAC;QACP,GAAG,EAAE,WAAW;QAChB,eAAe,EAAE,IAAI;QACrB,MAAM,EAAE,KAAK;KACd,CAAC,CACD,IAAI,CAAC,CAAC,MAAuB,GAAK;QACjC,OAAO,MAAM,CAAC,GAAG,CAAA;KAClB,CAAC,CAAA;CACL;AAEM,MAAM,yCAAM,GAAG,CACpB,MAAoB,EACpB,KAAoB,EACpB,IAAiB,EACjB,cAAsB,GACF;IACpB,OAAO,CAAA,GAAA,kBAAM,CAAA,CACX,KAAK,CAAC,IAAI,CACR,CAAA,GAAA,mCAAc,CAAA,CAAC,IAAI,CAAC,EACpB,CAAA,GAAA,iCAAY,CAAA,CAAC,GAAG,CAAC,EACjB,CAAA,GAAA,yCAAoB,CAAA,EAAE,EACtB,CAAA,GAAA,8BAAS,CAAA,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAK;QACpB,IAAI,CAAC,EACH,OAAO,iCAAW,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,cAAc,CAAC,CAAC,IAAI,CACnD,CAAA,GAAA,yCAAoB,CAAA,EAAE,EACtB,CAAA,GAAA,wBAAG,CAAA,CAAC,CAAC,MAAM,GAAK,MAAM,CAAC,OAAO,CAAC,CAChC,CAAA;QAEH,OAAO,+BAAS,CAAC,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,cAAc,CAAC,CAAA;KACvD,CAAC,CACH,CACF,CAAA;CACF;;;;AC5ED;;AAGO,MAAM,yCAAM,GAAG,CAAA,GAAA,iDAAM,CAAA,CAAC,CAAA,GAAA,qBAAK,CAAA,CAAC,CAAC;;;;AAIpC,CAAC;AAEM,MAAM,yCAAQ,GAAG,CAAA,GAAA,iDAAM,CAAA,CAAC,GAAG,CAAC;;;AAGnC,CAAC;;;;;AJSD,MAAM,sCAAgB,GAAG,EAAE;AAC3B,MAAM,mCAAa,GAAG,CAAC;AACvB,MAAM,mCAAa,GAAG,CAAC,CAAC,8BAA8B;AAA/B;AAER,kDAA6B,KAAgC,EAAE;IAC5E,MAAM,MAAM,GAAG,CAAA,GAAA,uBAAS,CAAA,EAAE;IAC1B,qBAAO,gCAAC,iDAA2B;QAAE,GAAG,KAAK;QAAE,MAAM,EAAE,MAAM;MAAI,CAAA;CAClE;AAED,MAAM,iDAA2B,SAAS,CAAA,GAAA,sCAAK,CAAA,CAAC,SAAS;IAIvD,OAAO,YAAY,GAAG;QACpB,cAAc,EAAE,SAAS;KAC1B,CAAA;IAED,KAAK,GAAG;QACN,MAAM,EAAE,CAAC;QACT,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,CAAC;QACP,aAAa,EAAE;YAAC,EAAE;SAAC;QACnB,SAAS,EAAE,IAAI;KAChB,CAAA;IAED,kBAAkB,GAAwB,IAAI,CAAA;IAE9C,cAAc,GAAG,IAAI,CAAA,GAAA,2BAAe,CAAA,CAAC,EAAE,CAAC,CAAA;IACxC,YAAY,GAAG,IAAI,CAAA,GAAA,2BAAe,CAAA,CAAC,CAAC,CAAC,CAAA;IAErC,iBAAiB,GAAG;QAClB,IAAI,CAAC,kBAAkB,GAAG,CAAA,GAAA,yCAAM,CAAA,CAC9B,IAAI,CAAC,KAAK,CAAC,MAAM,EACjB,IAAI,CAAC,cAAc,EACnB,IAAI,CAAC,YAAY,EACjB,sCAAgB,CACjB,CAAC,SAAS,CAAC;YACV,IAAI,EAAE,CAAC,OAAwB,GAAK;gBAClC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,GAAM,CAAA;wBACvB,aAAa,EAAE;+BAAI,IAAI,CAAC,aAAa;4BAAE,OAAO;yBAAC;wBAC/C,SAAS,EAAE,KAAK;qBACjB,CAAA,AAAC,CAAC;aACJ;SACF,CAAC;KACH;IAED,oBAAoB,GAAG;QACrB,IAAI,IAAI,CAAC,kBAAkB,EACzB,IAAI,CAAC,kBAAkB,CAAC,WAAW,EAAE;KAExC;IAED,YAAY,GAAG,CAAC,KAAoB,GAAK;QACvC,IAAI,CAAC,QAAQ,CAAC;YAAE,SAAS,EAAE,IAAI;SAAE,CAAC;QAClC,OAAO,CAAA,GAAA,yCAAgB,CAAA,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,GAAK;YACtE,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IAAI,SAAS;YAClD,MAAM,KAAK,GAAoB;gBAC7B,IAAI,EAAE,KAAK;gBACX,KAAK,EAAE,WAAW;gBAClB,kBAAkB,EAAE;oBAClB,KAAK,EAAE,mBAAmB;oBAC1B,MAAM,EAAE;wBACN,IAAI,EAAE,UAAU;wBAChB,EAAE,EAAE,KAAK,CAAC,EAAE;wBACZ,GAAG,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI;qBACtB;iCACD,WAAW;oBACX,UAAU,EAAE,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC;iBAC7C;aACF;YACD,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;gBAAC,KAAK;aAAC,CAAC;SAC7B,CAAC,CAAA;KACH,CAAA;IAED,WAAW,GAAG,IAAM;QAClB,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;KACrB,CAAA;IAED,uBAAuB,GAAG,CAAC,KAA0C,GAAK;QACxE,MAAM,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK;QACvC,IAAI,CAAC,QAAQ,CAAC;mBAAE,KAAK;YAAE,IAAI,EAAE,CAAC;YAAE,aAAa,EAAE;gBAAC,EAAE;aAAC;YAAE,SAAS,EAAE,IAAI;YAAE,MAAM,EAAE,CAAC;SAAE,CAAC;QAClF,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;QACzB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;KAChC,CAAA;IAED,qBAAqB,GAAG,IAAM;QAC5B,6DAA6D;QAC7D,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC;QACpC,IAAI,CAAC,QAAQ,CAAC;YAAE,IAAI,EAAE,QAAQ;YAAE,SAAS,EAAE,IAAI;SAAE,CAAC;QAClD,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC;QAChC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;KAC3C,CAAA;IAED,aAAa,GAAG,CAAC,KAAU,GAAK;QAC9B,MAAM,UAAE,MAAM,CAAA,EAAE,GAAG,IAAI,CAAC,KAAK;QAC7B,IAAI,AAAC,CAAA,KAAK,CAAC,OAAO,KAAK,EAAE,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE,CAAA,IAAK,MAAM,GAAG,CAAC,EAC9D,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,GAAM,CAAA;gBAC5B,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC;aAC7B,CAAA,AAAC,CAAC;aACE,IACL,AAAC,CAAA,KAAK,CAAC,OAAO,KAAK,EAAE,IAAI,KAAK,CAAC,OAAO,KAAK,EAAE,CAAA,IAC7C,MAAM,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC,MAAM,GAAG,CAAC,EAEpC,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,GAAM,CAAA;gBAC5B,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC;aAC7B,CAAA,AAAC,CAAC;KAEN,CAAA;IAED,SAAS,GAAG;QACV,OAAO,CAAA,GAAA,8CAAO,CAAA,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAA;KACzC;IAED,YAAY,GAAG,CAAC,KAAoB,GAAK;QACvC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC,SAAS,CAAC,CAAC,MAAqB,GAAK,MAAM,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,CAAC;QAC3F,IAAI,CAAC,QAAQ,CAAC;YAAE,MAAM,EAAE,KAAK;SAAE,CAAC;KACjC,CAAA;IAED,WAAW,GAAG,CAAC,KAAU,GAAK;QAC5B,MAAM,SAAE,KAAK,CAAA,UAAE,MAAM,CAAA,EAAE,GAAG,KAAK;QAC/B,MAAM,MAAM,GACV,IAAI,CAAC,SAAS,EAAE,CAAC,SAAS,CAAC,CAAC,MAAqB,GAAK,MAAM,CAAC,EAAE,KAAK,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAChF,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK;QAC9B,qBACE,gCAAC,CAAA,GAAA,wCAAK,CAAA;YACJ,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;YAC3C,SAAS,EAAE,IAAI,CAAC,aAAa;YAC7B,IAAI,EAAE,KAAK,CAAC,IAAI;YAChB,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,IAAI,CAAC,YAAY;UAC1B,CACH;KACF,CAAA;IAED,MAAM,GAAG;QACP,MAAM,SAAE,KAAK,CAAA,iBAAE,aAAa,CAAA,aAAE,SAAS,CAAA,EAAE,GAAG,IAAI,CAAC,KAAK;QAEtD,qBACE,gCAAC,CAAA,GAAA,sBAAM,CAAA;YACL,EAAE,EAAC,uBAAuB;YAC1B,MAAM,EAAC,4BAA4B;YACnC,OAAO,EAAE,IAAI,CAAC,WAAW;YACzB,IAAI;YACJ,KAAK,EAAE,CAAC;sBAER,cAAA,iCAAC,CAAA,GAAA,qBAAK,CAAA;gBAAC,KAAK,EAAE,CAAC;gBAAE,OAAO,EAAE,CAAC;;kCACzB,gCAAC,CAAA,GAAA,oBAAI,CAAA;kCACH,cAAA,iCAAC,CAAA,GAAA,yCAAM,CAAA;4BAAC,KAAK,EAAE,CAAC;;8CACd,gCAAC,CAAA,GAAA,oBAAI,CAAA;oCAAC,IAAI,EAAE,CAAC;oCAAE,MAAM,EAAC,UAAU;8CAAC,iBAEjC;kCAAO;8CACP,gCAAC,CAAA,GAAA,yBAAS,CAAA;oCACR,KAAK,EAAC,qBAAqB;oCAC3B,WAAW,EAAC,kBAAkB;oCAC9B,KAAK,EAAE,KAAK;oCACZ,QAAQ,EAAE,IAAI,CAAC,uBAAuB;kCACtC;;0BACK;sBACJ;oBACN,CAAC,SAAS,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC,MAAM,KAAK,CAAC,kBAC1C,gCAAC,CAAA,GAAA,oBAAI,CAAA;wBAAC,IAAI,EAAE,CAAC;wBAAE,KAAK;kCAAC,kBAErB;sBAAO,AACR;kCACD,gCAAC,CAAA,GAAA,6DAAc,CAAA;wBACb,UAAU,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,MAAM;wBACnC,IAAI,EAAE,IAAI,CAAC,qBAAqB;wBAChC,uCAAuC;wBACvC,OAAO;wBACP,eAAe,EAAE,IAAI;wBACrB,MAAM,EAAC,MAAM;wBACb,MAAM,gBACJ,gCAAC,CAAA,GAAA,oBAAI,CAAA;4BAAC,KAAK,EAAC,QAAQ;4BAAC,OAAO,EAAC,QAAQ;4BAAC,OAAO,EAAE,CAAC;sCAC9C,cAAA,gCAAC,CAAA,GAAA,uBAAO,CAAA;gCAAC,KAAK;8BAAG;0BACZ;wBAET,UAAU,gBACR,gCAAC,CAAA,GAAA,oBAAI,CAAA;4BAAC,IAAI,EAAE,CAAC;4BAAE,KAAK;sCAAC,iBAErB;0BAAO;kCAGR,aAAa,CACX,MAAM,CAAC,CAAC,MAAM,GAAK,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CACrC,GAAG,CAAC,CAAC,MAAuB,EAAE,KAAK,iBAClC,gCAAC,CAAA,GAAA,gDAAU,CAAA;gCAET,MAAM,EAAC,MAAM;gCACb,OAAO,EAAE,mCAAa;gCACtB,OAAO,EAAE,mCAAa;gCACtB,eAAe,EAAE,CAAC,KAAK,GAAK;oCAC1B,IAAI,KAAK,GAAG,GAAG,EAAE,OAAO,GAAG,CAAA;yCACtB,IAAI,KAAK,GAAG,GAAG,EAAE,OAAO,GAAG,CAAA;oCAChC,OAAO,GAAG,CAAA;iCACX;gCACD,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,KAAoB,GAAM,CAAA;wCAC5C,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK;wCACrB,KAAK,EAAE,KAAK,CAAC,KAAK;wCAClB,MAAM,EAAE,KAAK,CAAC,MAAM;wCACpB,GAAG,EAAE,KAAK,CAAC,EAAE;wCACb,IAAI,EAAE,KAAK;qCACZ,CAAA,AAAC,CAAC;gCACH,WAAW,EAAE,IAAI,CAAC,WAAW;gCAC7B,eAAe,EAAE;oCACf,cAAc,EAAE;wCAAE,KAAK,EAAE;4CAAE,YAAY,EAAE,CAAC,EAAE,mCAAa,CAAC,EAAE,CAAC;yCAAE;qCAAE;iCAClE;+BAnBI,CAAC,QAAQ,EAAE,KAAK,IAAI,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAoB7C,AACH,CAAC;sBACW;;cACX;UACD,CACV;KACF;CACF;;AD5OD;AMAA;;AAEe,oDAAwB;IACrC,qBACE,iCAAC,KAAG;QAAC,IAAI,EAAC,KAAK;QAAC,OAAO,EAAC,WAAW;QAAC,KAAK,EAAC,KAAK;QAAC,MAAM,EAAC,KAAK;;0BAC1D,gCAAC,OAAK,KAAG;0BACT,gCAAC,MAAI;gBAAC,CAAC,EAAC,6DAA6D;cAAG;;MACpE,CACP;CACF;;;;ANLM,MAAM,yCAAmB,GAAgB;IAC9C,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,CAAA,GAAA,wCAAQ,CAAA;IACnB,IAAI,EAAE,CAAA,GAAA,wCAAI,CAAA;CACX;AAEM,MAAM,yCAAkB,GAAG,CAAA,GAAA,0BAAY,CAAA,CAAC;IAC7C,IAAI,EAAE,8BAA8B;IAEpC,IAAI,EAAE;QACJ,KAAK,EAAE;YACL,YAAY,EAAE,CAAC,IAAI,GAAK;gBACtB,OAAO;uBAAI,IAAI;oBAAE,yCAAmB;iBAAC,CAAA;aACtC;SACF;KACF;CACF,CAAC","sources":["src/index.ts","src/components/UnsplashAssetSource.tsx","src/components/Photo.tsx","src/components/Photo.styled.tsx","src/datastores/unsplash.ts","src/components/UnsplashAssetSource.styled.tsx","src/components/Icon.tsx"],"sourcesContent":["import Unsplash from './components/UnsplashAssetSource'\nimport Icon from './components/Icon'\nimport { createPlugin, AssetSource } from 'sanity'\n\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\nexport const unsplashImageAsset = createPlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n","import React from 'react'\nimport PhotoAlbum from 'react-photo-album'\nimport flatten from 'lodash/flatten'\nimport { BehaviorSubject, Subscription } from 'rxjs'\nimport { UnsplashPhoto } from '../types'\nimport Photo from './Photo'\nimport { fetchDownloadUrl, search } from '../datastores/unsplash'\nimport { Card, Dialog, Flex, Spinner, Stack, Text, TextInput } from '@sanity/ui'\nimport { Search } from './UnsplashAssetSource.styled'\nimport InfiniteScroll from 'react-infinite-scroll-component'\nimport { useClient, AssetSourceComponentProps, AssetFromSource } from 'sanity'\nimport { SanityClient } from '@sanity/client'\n\ntype State = {\n query: string\n searchResults: UnsplashPhoto[][]\n page: number\n isLoading: boolean\n cursor: number\n}\n\nconst RESULTS_PER_PAGE = 42\nconst PHOTO_SPACING = 2\nconst PHOTO_PADDING = 1 // offset the 1px border width\n\nexport default function UnsplashAssetSource(props: AssetSourceComponentProps) {\n const client = useClient()\n return <UnsplashAssetSourceInternal {...props} client={client} />\n}\n\nclass UnsplashAssetSourceInternal extends React.Component<\n AssetSourceComponentProps & { client: SanityClient },\n State\n> {\n static defaultProps = {\n selectedAssets: undefined,\n }\n\n state = {\n cursor: 0,\n query: '',\n page: 1,\n searchResults: [[]],\n isLoading: true,\n }\n\n searchSubscription: Subscription | null = null\n\n searchSubject$ = new BehaviorSubject('')\n pageSubject$ = new BehaviorSubject(1)\n\n componentDidMount() {\n this.searchSubscription = search(\n this.props.client,\n this.searchSubject$,\n this.pageSubject$,\n RESULTS_PER_PAGE\n ).subscribe({\n next: (results: UnsplashPhoto[]) => {\n this.setState((prev) => ({\n searchResults: [...prev.searchResults, results],\n isLoading: false,\n }))\n },\n })\n }\n\n componentWillUnmount() {\n if (this.searchSubscription) {\n this.searchSubscription.unsubscribe()\n }\n }\n\n handleSelect = (photo: UnsplashPhoto) => {\n this.setState({ isLoading: true })\n return fetchDownloadUrl(this.props.client, photo).then((downloadUrl) => {\n const description = photo.description || undefined\n const asset: AssetFromSource = {\n kind: 'url',\n value: downloadUrl,\n assetDocumentProps: {\n _type: 'sanity.imageAsset',\n source: {\n name: 'unsplash',\n id: photo.id,\n url: photo.links.html,\n },\n description,\n creditLine: `${photo.user.name} by Unsplash`,\n } as any,\n }\n this.props.onSelect([asset])\n })\n }\n\n handleClose = () => {\n this.props.onClose()\n }\n\n handleSearchTermChanged = (event: React.ChangeEvent<HTMLInputElement>) => {\n const query = event.currentTarget.value\n this.setState({ query, page: 1, searchResults: [[]], isLoading: true, cursor: 0 })\n this.pageSubject$.next(1)\n this.searchSubject$.next(query)\n }\n\n handleScollerLoadMore = () => {\n // eslint-disable-next-line react/no-access-state-in-setstate\n const nextPage = this.state.page + 1\n this.setState({ page: nextPage, isLoading: true })\n this.pageSubject$.next(nextPage)\n this.searchSubject$.next(this.state.query)\n }\n\n handleKeyDown = (event: any) => {\n const { cursor } = this.state\n if ((event.keyCode === 38 || event.keyCode === 37) && cursor > 0) {\n this.setState((prevState) => ({\n cursor: prevState.cursor - 1,\n }))\n } else if (\n (event.keyCode === 40 || event.keyCode === 39) &&\n cursor < this.getPhotos().length - 1\n ) {\n this.setState((prevState) => ({\n cursor: prevState.cursor + 1,\n }))\n }\n }\n\n getPhotos() {\n return flatten(this.state.searchResults)\n }\n\n updateCursor = (photo: UnsplashPhoto) => {\n const index = this.getPhotos().findIndex((result: UnsplashPhoto) => result.id === photo.id)\n this.setState({ cursor: index })\n }\n\n renderImage = (props: any) => {\n const { photo, layout } = props\n const active =\n this.getPhotos().findIndex((result: UnsplashPhoto) => result.id === photo.data.id) ===\n this.state.cursor || false\n return (\n <Photo\n onClick={this.handleSelect.bind(photo.data)}\n onKeyDown={this.handleKeyDown}\n data={photo.data}\n width={layout.width}\n height={layout.height}\n active={active}\n onFocus={this.updateCursor}\n />\n )\n }\n\n render() {\n const { query, searchResults, isLoading } = this.state\n\n return (\n <Dialog\n id=\"unsplash-asset-source\"\n header=\"Select image from Unsplash\"\n onClose={this.handleClose}\n open\n width={4}\n >\n <Stack space={3} padding={4}>\n <Card>\n <Search space={3}>\n <Text size={1} weight=\"semibold\">\n Search Unsplash\n </Text>\n <TextInput\n label=\"Search Unsplash.com\"\n placeholder=\"Topics or colors\"\n value={query}\n onChange={this.handleSearchTermChanged}\n />\n </Search>\n </Card>\n {!isLoading && this.getPhotos().length === 0 && (\n <Text size={1} muted>\n No results found\n </Text>\n )}\n <InfiniteScroll\n dataLength={this.getPhotos().length} // This is important field to render the next data\n next={this.handleScollerLoadMore}\n // scrollableTarget=\"unsplash-scroller\"\n hasMore\n scrollThreshold={0.99}\n height=\"60vh\"\n loader={\n <Flex align=\"center\" justify=\"center\" padding={3}>\n <Spinner muted />\n </Flex>\n }\n endMessage={\n <Text size={1} muted>\n No more results\n </Text>\n }\n >\n {searchResults\n .filter((photos) => photos.length > 0)\n .map((photos: UnsplashPhoto[], index) => (\n <PhotoAlbum\n key={`gallery-${query || 'popular'}-${index}`}\n layout=\"rows\"\n spacing={PHOTO_SPACING}\n padding={PHOTO_PADDING}\n targetRowHeight={(width) => {\n if (width < 300) return 150\n else if (width < 600) return 200\n return 300\n }}\n photos={photos.map((photo: UnsplashPhoto) => ({\n src: photo.urls.small,\n width: photo.width,\n height: photo.height,\n key: photo.id,\n data: photo,\n }))}\n renderPhoto={this.renderImage}\n componentsProps={{\n containerProps: { style: { marginBottom: `${PHOTO_SPACING}px` } },\n }}\n />\n ))}\n </InfiniteScroll>\n </Stack>\n </Dialog>\n )\n }\n}\n","import { Text, useTheme } from '@sanity/ui'\nimport React, { useCallback, useEffect, useRef } from 'react'\nimport { UnsplashPhoto } from 'src/types'\nimport { CreditLine, CreditLineLink, Root } from './Photo.styled'\n\ntype Props = {\n data: UnsplashPhoto\n width: number\n height: number\n onClick: (photo: UnsplashPhoto) => void\n onKeyDown: (event: any) => void\n active: boolean\n onFocus: (photo: UnsplashPhoto) => void\n}\n\nconst UTM_SOURCE = 'sanity-plugin-asset-source-unsplash'\n\nexport default function Photo(props: Props) {\n const { onClick, data, onKeyDown, onFocus, active, width, height } = props\n const rootElm = useRef<HTMLDivElement>(null)\n const prevActive = useRef<boolean>(false)\n\n const handleClick = useCallback(() => {\n onClick(data)\n }, [onClick, data])\n\n const handleCreditLineClicked = useCallback(\n (event: any) => {\n event.stopPropagation()\n const url = `${data.links.html}?utm_source=${encodeURIComponent(\n UTM_SOURCE\n )}&utm_medium=referral`\n window.open(url, data.id, 'noreferrer,noopener')\n },\n [data]\n )\n\n const handleKeyDown = useCallback(\n (event: any) => {\n onKeyDown(event)\n if (event.keyCode === 13) {\n onClick(data)\n }\n },\n [onKeyDown, data, onClick]\n )\n\n const handleMouseDown = useCallback(() => {\n onFocus(data)\n }, [onFocus, data])\n\n useEffect(() => {\n if (!prevActive.current && active && rootElm.current) {\n rootElm.current.focus()\n onFocus(data)\n }\n prevActive.current = active\n // data changing alone should not re-trigger effect\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [active])\n\n const src = data.urls.small\n const userName = data.user.name\n\n const theme = useTheme().sanity\n return (\n <Root\n ref={rootElm}\n studioTheme={theme}\n title={`Select image by ${userName} from Unsplash`}\n tabIndex={0}\n onKeyDown={handleKeyDown}\n onMouseDown={handleMouseDown}\n style={{\n width: `${width}px`,\n height: `${height}px`,\n backgroundImage: `url(\"${src}\")`,\n }}\n onClick={handleClick}\n >\n <CreditLineLink onClick={handleCreditLineClicked}>\n <CreditLine padding={2} radius={2} margin={2}>\n <Text size={1} title={`Open image by ${userName} on Unsplash in new window`}>\n By @{data.user.username}\n </Text>\n </CreditLine>\n </CreditLineLink>\n </Root>\n )\n}\n","import { Card, Theme } from '@sanity/ui'\nimport styled from 'styled-components'\n\ntype SanityTheme = Theme['sanity']\n\ninterface Style {\n studioTheme: SanityTheme\n}\n\nexport const Root = styled.div`\n overflow: hidden;\n background-origin: content-box;\n background-repeat: no-repeat;\n background-clip: border-box;\n background-size: cover;\n position: relative;\n outline: none !important;\n border: ${({ studioTheme }: Style) => `1px solid ${studioTheme.color.card.enabled.border}`};\n box-sizing: content-box;\n user-drag: none;\n\n &:hover {\n opacity: 0.85;\n }\n\n &:focus,\n &:active {\n border: 1px solid var(--input-border-color-focus);\n box-shadow: inset 0 0 0 3px var(--input-border-color-focus);\n }\n`\n\nexport const CreditLineLink = styled.a`\n text-decoration: none;\n cursor: pointer;\n`\n\nexport const CreditLine = styled(Card)`\n ${({ theme }) => `\n --creditline-fg: ${theme.sanity.color.card.enabled.fg};\n --creditline-bg: ${theme.sanity.color.card.enabled.bg};\n `};\n user-drag: none;\n position: absolute;\n background-color: var(--creditline-bg);\n bottom: 0;\n\n [data-ui='Text'] {\n color: var(--creditline-fg);\n }\n`\n","import { defer, concat, BehaviorSubject, Observable } from 'rxjs'\nimport { debounceTime, switchMap, map, distinctUntilChanged, withLatestFrom } from 'rxjs/operators'\nimport { UnsplashPhoto } from 'src/types'\nimport { SanityClient } from '@sanity/client'\n\ntype SearchSubject = BehaviorSubject<string>\ntype PageSubject = BehaviorSubject<number>\n\nconst fetchSearch = (\n client: SanityClient,\n query: string,\n page: number,\n perPage: number\n): Observable<any> =>\n defer(() =>\n client.observable.request({\n url: `/addons/unsplash/search/photos?query=${encodeURIComponent(\n query\n )}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n })\n )\n\nconst fetchList = (\n client: SanityClient,\n type: string,\n page: number,\n perPage: number\n): Observable<any> =>\n defer(() =>\n client.observable.request({\n url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n })\n )\n\nexport function fetchDownloadUrl(client: SanityClient, photo: UnsplashPhoto): Promise<string> {\n const downloadUrl = photo.links.download_location.replace(\n 'https://api.unsplash.com',\n '/addons/unsplash'\n )\n return client\n .request({\n url: downloadUrl,\n withCredentials: true,\n method: 'GET',\n })\n .then((result: { url: string }) => {\n return result.url\n })\n}\n\nexport const search = (\n client: SanityClient,\n query: SearchSubject,\n page: PageSubject,\n resultsPerPage: number\n): Observable<any> => {\n return concat(\n query.pipe(\n withLatestFrom(page),\n debounceTime(500),\n distinctUntilChanged(),\n switchMap(([q, p]) => {\n if (q) {\n return fetchSearch(client, q, p, resultsPerPage).pipe(\n distinctUntilChanged(),\n map((result) => result.results)\n )\n }\n return fetchList(client, 'popular', p, resultsPerPage)\n })\n )\n )\n}\n","import { Stack } from '@sanity/ui'\nimport styled from 'styled-components'\n\nexport const Search = styled(Stack)`\n position: sticky;\n top: 0;\n z-index: 1;\n`\n\nexport const Scroller = styled.div`\n overflow-y: auto;\n max-height: 80vh;\n`\n","import React from 'react'\n\nexport default function UnsplashIcon() {\n return (\n <svg role=\"img\" viewBox=\"0 0 24 24\" width=\"1em\" height=\"1em\">\n <title />\n <path d=\"M7.5 6.75V0h9v6.75h-9zm9 3.75H24V24H0V10.5h7.5v6.75h9V10.5z\" />\n </svg>\n )\n}\n"],"names":[],"version":3,"file":"index.js.map","sourceRoot":"../"}
|