sanity-plugin-asset-source-unsplash 3.0.1 → 3.0.3

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/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2024 Sanity.io
3
+ Copyright (c) 2025 Sanity.io
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
package/lib/index.cjs CHANGED
@@ -59,7 +59,7 @@ const search = (client, query, page, resultsPerPage) => rxjs.concat(
59
59
  outline: none !important;
60
60
  border: ${({ theme }) => `1px solid ${theme.sanity.color.card.enabled.border}`};
61
61
  box-sizing: content-box;
62
- user-drag: none;
62
+ -webkit-user-drag: none;
63
63
 
64
64
  &:hover {
65
65
  opacity: 0.85;
@@ -78,7 +78,7 @@ const search = (client, query, page, resultsPerPage) => rxjs.concat(
78
78
  --creditline-fg: ${theme.sanity.color.card.enabled.fg};
79
79
  --creditline-bg: ${theme.sanity.color.card.enabled.bg};
80
80
  `};
81
- user-drag: none;
81
+ -webkit-user-drag: none;
82
82
  position: absolute;
83
83
  background-color: var(--creditline-bg);
84
84
  bottom: 0;
@@ -142,73 +142,25 @@ styledComponents.styled.div`
142
142
  overflow-y: auto;
143
143
  max-height: 80vh;
144
144
  `;
145
- var __defProp = Object.defineProperty, __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __publicField = (obj, key, value) => (__defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value), value);
146
145
  const RESULTS_PER_PAGE = 42, PHOTO_SPACING = 2, PHOTO_PADDING = 1;
147
146
  function UnsplashAssetSource(props) {
148
147
  const client = sanity.useClient({ apiVersion: "2022-09-01" });
149
148
  return /* @__PURE__ */ jsxRuntime.jsx(UnsplashAssetSourceInternal, { ...props, client });
150
149
  }
151
150
  class UnsplashAssetSourceInternal extends React__default.default.Component {
152
- constructor() {
153
- super(...arguments), __publicField(this, "state", {
154
- cursor: 0,
155
- query: "",
156
- page: 1,
157
- searchResults: [[]],
158
- isLoading: !0
159
- }), __publicField(this, "searchSubscription", null), __publicField(this, "searchSubject$", new rxjs.BehaviorSubject("")), __publicField(this, "pageSubject$", new rxjs.BehaviorSubject(1)), __publicField(this, "handleSelect", (photo) => (this.setState({ isLoading: !0 }), fetchDownloadUrl(this.props.client, photo).then((downloadUrl) => {
160
- const description = photo.description || void 0, asset = {
161
- kind: "url",
162
- value: downloadUrl,
163
- assetDocumentProps: {
164
- _type: "sanity.imageAsset",
165
- source: {
166
- name: "unsplash",
167
- id: photo.id,
168
- url: photo.links.html
169
- },
170
- description,
171
- creditLine: `${photo.user.name} by Unsplash`
172
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
173
- }
174
- };
175
- this.props.onSelect([asset]);
176
- }))), __publicField(this, "handleClose", () => {
177
- this.props.onClose();
178
- }), __publicField(this, "handleSearchTermChanged", (event) => {
179
- const query = event.currentTarget.value;
180
- this.setState({ query, page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next(query);
181
- }), __publicField(this, "handleSearchTermCleared", () => {
182
- this.setState({ query: "", page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next("");
183
- }), __publicField(this, "handleScollerLoadMore", () => {
184
- const nextPage = this.state.page + 1;
185
- this.setState({ page: nextPage, isLoading: !0 }), this.pageSubject$.next(nextPage), this.searchSubject$.next(this.state.query);
186
- }), __publicField(this, "handleKeyDown", (event) => {
187
- const { cursor } = this.state;
188
- (event.keyCode === 38 || event.keyCode === 37) && cursor > 0 ? this.setState((prevState) => ({
189
- cursor: prevState.cursor - 1
190
- })) : (event.keyCode === 40 || event.keyCode === 39) && cursor < this.getPhotos().length - 1 && this.setState((prevState) => ({
191
- cursor: prevState.cursor + 1
192
- }));
193
- }), __publicField(this, "updateCursor", (photo) => {
194
- const index = this.getPhotos().findIndex((result) => result.id === photo.id);
195
- this.setState({ cursor: index });
196
- }), __publicField(this, "renderImage", (props) => {
197
- const { photo, layout } = props, active = this.getPhotos().findIndex((result) => result.id === photo.data.id) === this.state.cursor || !1;
198
- return /* @__PURE__ */ jsxRuntime.jsx(
199
- Photo,
200
- {
201
- onClick: this.handleSelect.bind(photo.data),
202
- onKeyDown: this.handleKeyDown,
203
- data: photo.data,
204
- width: layout.width,
205
- height: layout.height,
206
- active,
207
- onFocus: this.updateCursor
208
- }
209
- );
210
- });
211
- }
151
+ static defaultProps = {
152
+ selectedAssets: void 0
153
+ };
154
+ state = {
155
+ cursor: 0,
156
+ query: "",
157
+ page: 1,
158
+ searchResults: [[]],
159
+ isLoading: !0
160
+ };
161
+ searchSubscription = null;
162
+ searchSubject$ = new rxjs.BehaviorSubject("");
163
+ pageSubject$ = new rxjs.BehaviorSubject(1);
212
164
  componentDidMount() {
213
165
  this.searchSubscription = search(
214
166
  this.props.client,
@@ -227,9 +179,70 @@ class UnsplashAssetSourceInternal extends React__default.default.Component {
227
179
  componentWillUnmount() {
228
180
  this.searchSubscription && this.searchSubscription.unsubscribe();
229
181
  }
182
+ handleSelect = (photo) => (this.setState({ isLoading: !0 }), fetchDownloadUrl(this.props.client, photo).then((downloadUrl) => {
183
+ const description = photo.description || void 0, asset = {
184
+ kind: "url",
185
+ value: downloadUrl,
186
+ assetDocumentProps: {
187
+ _type: "sanity.imageAsset",
188
+ source: {
189
+ name: "unsplash",
190
+ id: photo.id,
191
+ url: photo.links.html
192
+ },
193
+ description,
194
+ creditLine: `${photo.user.name} by Unsplash`
195
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
196
+ }
197
+ };
198
+ this.props.onSelect([asset]);
199
+ }));
200
+ handleClose = () => {
201
+ this.props.onClose();
202
+ };
203
+ handleSearchTermChanged = (event) => {
204
+ const query = event.currentTarget.value;
205
+ this.setState({ query, page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next(query);
206
+ };
207
+ handleSearchTermCleared = () => {
208
+ this.setState({ query: "", page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next("");
209
+ };
210
+ handleScollerLoadMore = () => {
211
+ const nextPage = this.state.page + 1;
212
+ this.setState({ page: nextPage, isLoading: !0 }), this.pageSubject$.next(nextPage), this.searchSubject$.next(this.state.query);
213
+ };
214
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
215
+ handleKeyDown = (event) => {
216
+ const { cursor } = this.state;
217
+ (event.keyCode === 38 || event.keyCode === 37) && cursor > 0 ? this.setState((prevState) => ({
218
+ cursor: prevState.cursor - 1
219
+ })) : (event.keyCode === 40 || event.keyCode === 39) && cursor < this.getPhotos().length - 1 && this.setState((prevState) => ({
220
+ cursor: prevState.cursor + 1
221
+ }));
222
+ };
230
223
  getPhotos() {
231
224
  return this.state.searchResults.flat();
232
225
  }
226
+ updateCursor = (photo) => {
227
+ const index = this.getPhotos().findIndex((result) => result.id === photo.id);
228
+ this.setState({ cursor: index });
229
+ };
230
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
231
+ renderImage = (props) => {
232
+ const { photo, layout } = props, active = this.getPhotos().findIndex((result) => result.id === photo.data.id) === this.state.cursor || !1;
233
+ return /* @__PURE__ */ jsxRuntime.jsx(
234
+ Photo,
235
+ {
236
+ onClick: this.handleSelect.bind(photo.data),
237
+ onKeyDown: this.handleKeyDown,
238
+ data: photo.data,
239
+ width: layout.width,
240
+ height: layout.height,
241
+ active,
242
+ onFocus: this.updateCursor
243
+ }
244
+ );
245
+ };
233
246
  render() {
234
247
  const { query, searchResults, isLoading } = this.state;
235
248
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -292,9 +305,6 @@ class UnsplashAssetSourceInternal extends React__default.default.Component {
292
305
  );
293
306
  }
294
307
  }
295
- __publicField(UnsplashAssetSourceInternal, "defaultProps", {
296
- selectedAssets: void 0
297
- });
298
308
  const unsplashAssetSource = {
299
309
  name: "unsplash",
300
310
  title: "Unsplash",
package/lib/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../src/components/Icon.tsx","../src/datastores/unsplash.ts","../src/components/Photo.styled.tsx","../src/components/Photo.tsx","../src/components/UnsplashAssetSource.styled.tsx","../src/components/UnsplashAssetSource.tsx","../src/index.ts"],"sourcesContent":["export default function UnsplashIcon() {\n return (\n <svg role=\"img\" viewBox=\"0 0 25 25\" width=\"1em\" height=\"1em\" fill=\"currentColor\">\n <title />\n <path d=\"M9 9V4h7v5H9Zm7 3h5v9H4v-9h5v5h7v-5Z\" />\n </svg>\n )\n}\n","import { type BehaviorSubject, concat, defer, type Observable } from 'rxjs'\nimport { debounceTime, distinctUntilChanged, map, switchMap, withLatestFrom } from 'rxjs/operators'\nimport type { SanityClient } from 'sanity'\n\nimport type { UnsplashPhoto } from '../types'\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\n )\n\nconst fetchList = (\n client: SanityClient,\n type: string,\n page: number,\n perPage: number,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\n client.observable.request({\n url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 { Card } from '@sanity/ui'\nimport { styled } from 'styled-components'\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: ${({ theme }) => `1px solid ${theme.sanity.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 { Text } from '@sanity/ui'\nimport { useCallback, useEffect } from 'react'\n\nimport type { UnsplashPhoto } from '../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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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\n const handleClick = useCallback(() => {\n onClick(data)\n }, [onClick, data])\n\n const handleCreditLineClicked = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 (active) {\n onFocus(data)\n }\n }, [active, data, onFocus])\n\n const src = data.urls.small\n const userName = data.user.name\n\n return (\n <Root\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 { TextInput } from '@sanity/ui'\nimport { styled } from 'styled-components'\n\nexport const SearchInput = styled(TextInput)`\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 { SearchIcon } from '@sanity/icons'\nimport { Dialog, Flex, Spinner, Stack, Text } from '@sanity/ui'\nimport React from 'react'\nimport InfiniteScroll from 'react-infinite-scroll-component'\nimport PhotoAlbum from 'react-photo-album'\nimport { BehaviorSubject, type Subscription } from 'rxjs'\nimport {\n type AssetFromSource,\n type AssetSourceComponentProps,\n type SanityClient,\n useClient,\n} from 'sanity'\n\nimport { fetchDownloadUrl, search } from '../datastores/unsplash'\nimport type { UnsplashPhoto } from '../types'\nimport Photo from './Photo'\nimport { SearchInput } from './UnsplashAssetSource.styled'\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({ apiVersion: '2022-09-01' })\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 handleSearchTermCleared = () => {\n this.setState({ query: '', page: 1, searchResults: [[]], isLoading: true, cursor: 0 })\n this.pageSubject$.next(1)\n this.searchSubject$.next('')\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 this.state.searchResults.flat()\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 animate\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} paddingX={4} paddingBottom={4}>\n <SearchInput\n clearButton={query.length > 0}\n icon={SearchIcon}\n onChange={this.handleSearchTermChanged}\n onClear={this.handleSearchTermCleared}\n placeholder=\"Search by topics or colors\"\n value={query}\n />\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 // eslint-disable-next-line react/no-array-index-key\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 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 { AssetSource, definePlugin } from 'sanity'\n\nimport Icon from './components/Icon'\nimport Unsplash from './components/UnsplashAssetSource'\n\nexport type { Asset, AssetDocument, UnsplashPhoto } from './types'\n\n/**\n * @public\n */\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\n/**\n * @public\n */\nexport const unsplashImageAsset = definePlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n"],"names":["jsxs","jsx","defer","concat","withLatestFrom","debounceTime","distinctUntilChanged","switchMap","map","styled","Card","useCallback","useEffect","Text","TextInput","useClient","React","BehaviorSubject","Dialog","Stack","SearchIcon","InfiniteScroll","Flex","Spinner","PhotoAlbum","Unsplash","Icon","definePlugin"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs","sources":["../src/components/Icon.tsx","../src/datastores/unsplash.ts","../src/components/Photo.styled.tsx","../src/components/Photo.tsx","../src/components/UnsplashAssetSource.styled.tsx","../src/components/UnsplashAssetSource.tsx","../src/index.ts"],"sourcesContent":["export default function UnsplashIcon() {\n return (\n <svg role=\"img\" viewBox=\"0 0 25 25\" width=\"1em\" height=\"1em\" fill=\"currentColor\">\n <title />\n <path d=\"M9 9V4h7v5H9Zm7 3h5v9H4v-9h5v5h7v-5Z\" />\n </svg>\n )\n}\n","import { type BehaviorSubject, concat, defer, type Observable } from 'rxjs'\nimport { debounceTime, distinctUntilChanged, map, switchMap, withLatestFrom } from 'rxjs/operators'\nimport type { SanityClient } from 'sanity'\n\nimport type { UnsplashPhoto } from '../types'\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\n )\n\nconst fetchList = (\n client: SanityClient,\n type: string,\n page: number,\n perPage: number,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\n client.observable.request({\n url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 { Card } from '@sanity/ui'\nimport { styled } from 'styled-components'\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: ${({ theme }) => `1px solid ${theme.sanity.color.card.enabled.border}`};\n box-sizing: content-box;\n -webkit-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 -webkit-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 { Text } from '@sanity/ui'\nimport { useCallback, useEffect } from 'react'\n\nimport type { UnsplashPhoto } from '../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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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\n const handleClick = useCallback(() => {\n onClick(data)\n }, [onClick, data])\n\n const handleCreditLineClicked = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 (active) {\n onFocus(data)\n }\n }, [active, data, onFocus])\n\n const src = data.urls.small\n const userName = data.user.name\n\n return (\n <Root\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 { TextInput } from '@sanity/ui'\nimport { styled } from 'styled-components'\n\nexport const SearchInput = styled(TextInput)`\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 { SearchIcon } from '@sanity/icons'\nimport { Dialog, Flex, Spinner, Stack, Text } from '@sanity/ui'\nimport React from 'react'\nimport InfiniteScroll from 'react-infinite-scroll-component'\nimport PhotoAlbum from 'react-photo-album'\nimport { BehaviorSubject, type Subscription } from 'rxjs'\nimport {\n type AssetFromSource,\n type AssetSourceComponentProps,\n type SanityClient,\n useClient,\n} from 'sanity'\n\nimport { fetchDownloadUrl, search } from '../datastores/unsplash'\nimport type { UnsplashPhoto } from '../types'\nimport Photo from './Photo'\nimport { SearchInput } from './UnsplashAssetSource.styled'\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({ apiVersion: '2022-09-01' })\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 override 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 override 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 override 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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 handleSearchTermCleared = () => {\n this.setState({ query: '', page: 1, searchResults: [[]], isLoading: true, cursor: 0 })\n this.pageSubject$.next(1)\n this.searchSubject$.next('')\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 this.state.searchResults.flat()\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 override render() {\n const { query, searchResults, isLoading } = this.state\n\n return (\n <Dialog\n animate\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} paddingX={4} paddingBottom={4}>\n <SearchInput\n clearButton={query.length > 0}\n icon={SearchIcon}\n onChange={this.handleSearchTermChanged}\n onClear={this.handleSearchTermCleared}\n placeholder=\"Search by topics or colors\"\n value={query}\n />\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 // eslint-disable-next-line react/no-array-index-key\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 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 { type AssetSource, definePlugin } from 'sanity'\n\nimport Icon from './components/Icon'\nimport Unsplash from './components/UnsplashAssetSource'\n\nexport type { Asset, AssetDocument, UnsplashPhoto } from './types'\n\n/**\n * @public\n */\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\n/**\n * @public\n */\nexport const unsplashImageAsset = definePlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n"],"names":["jsxs","jsx","defer","concat","withLatestFrom","debounceTime","distinctUntilChanged","switchMap","map","styled","Card","useCallback","useEffect","Text","TextInput","useClient","React","BehaviorSubject","Dialog","Stack","SearchIcon","InfiniteScroll","Flex","Spinner","PhotoAlbum","Unsplash","Icon","definePlugin"],"mappings":"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"}
package/lib/index.js CHANGED
@@ -62,7 +62,7 @@ const search = (client, query, page, resultsPerPage) => concat(
62
62
  outline: none !important;
63
63
  border: ${({ theme }) => `1px solid ${theme.sanity.color.card.enabled.border}`};
64
64
  box-sizing: content-box;
65
- user-drag: none;
65
+ -webkit-user-drag: none;
66
66
 
67
67
  &:hover {
68
68
  opacity: 0.85;
@@ -81,7 +81,7 @@ const search = (client, query, page, resultsPerPage) => concat(
81
81
  --creditline-fg: ${theme.sanity.color.card.enabled.fg};
82
82
  --creditline-bg: ${theme.sanity.color.card.enabled.bg};
83
83
  `};
84
- user-drag: none;
84
+ -webkit-user-drag: none;
85
85
  position: absolute;
86
86
  background-color: var(--creditline-bg);
87
87
  bottom: 0;
@@ -145,73 +145,25 @@ styled.div`
145
145
  overflow-y: auto;
146
146
  max-height: 80vh;
147
147
  `;
148
- var __defProp = Object.defineProperty, __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __publicField = (obj, key, value) => (__defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value), value);
149
148
  const RESULTS_PER_PAGE = 42, PHOTO_SPACING = 2, PHOTO_PADDING = 1;
150
149
  function UnsplashAssetSource(props) {
151
150
  const client = useClient({ apiVersion: "2022-09-01" });
152
151
  return /* @__PURE__ */ jsx(UnsplashAssetSourceInternal, { ...props, client });
153
152
  }
154
153
  class UnsplashAssetSourceInternal extends React.Component {
155
- constructor() {
156
- super(...arguments), __publicField(this, "state", {
157
- cursor: 0,
158
- query: "",
159
- page: 1,
160
- searchResults: [[]],
161
- isLoading: !0
162
- }), __publicField(this, "searchSubscription", null), __publicField(this, "searchSubject$", new BehaviorSubject("")), __publicField(this, "pageSubject$", new BehaviorSubject(1)), __publicField(this, "handleSelect", (photo) => (this.setState({ isLoading: !0 }), fetchDownloadUrl(this.props.client, photo).then((downloadUrl) => {
163
- const description = photo.description || void 0, asset = {
164
- kind: "url",
165
- value: downloadUrl,
166
- assetDocumentProps: {
167
- _type: "sanity.imageAsset",
168
- source: {
169
- name: "unsplash",
170
- id: photo.id,
171
- url: photo.links.html
172
- },
173
- description,
174
- creditLine: `${photo.user.name} by Unsplash`
175
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
176
- }
177
- };
178
- this.props.onSelect([asset]);
179
- }))), __publicField(this, "handleClose", () => {
180
- this.props.onClose();
181
- }), __publicField(this, "handleSearchTermChanged", (event) => {
182
- const query = event.currentTarget.value;
183
- this.setState({ query, page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next(query);
184
- }), __publicField(this, "handleSearchTermCleared", () => {
185
- this.setState({ query: "", page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next("");
186
- }), __publicField(this, "handleScollerLoadMore", () => {
187
- const nextPage = this.state.page + 1;
188
- this.setState({ page: nextPage, isLoading: !0 }), this.pageSubject$.next(nextPage), this.searchSubject$.next(this.state.query);
189
- }), __publicField(this, "handleKeyDown", (event) => {
190
- const { cursor } = this.state;
191
- (event.keyCode === 38 || event.keyCode === 37) && cursor > 0 ? this.setState((prevState) => ({
192
- cursor: prevState.cursor - 1
193
- })) : (event.keyCode === 40 || event.keyCode === 39) && cursor < this.getPhotos().length - 1 && this.setState((prevState) => ({
194
- cursor: prevState.cursor + 1
195
- }));
196
- }), __publicField(this, "updateCursor", (photo) => {
197
- const index = this.getPhotos().findIndex((result) => result.id === photo.id);
198
- this.setState({ cursor: index });
199
- }), __publicField(this, "renderImage", (props) => {
200
- const { photo, layout } = props, active = this.getPhotos().findIndex((result) => result.id === photo.data.id) === this.state.cursor || !1;
201
- return /* @__PURE__ */ jsx(
202
- Photo,
203
- {
204
- onClick: this.handleSelect.bind(photo.data),
205
- onKeyDown: this.handleKeyDown,
206
- data: photo.data,
207
- width: layout.width,
208
- height: layout.height,
209
- active,
210
- onFocus: this.updateCursor
211
- }
212
- );
213
- });
214
- }
154
+ static defaultProps = {
155
+ selectedAssets: void 0
156
+ };
157
+ state = {
158
+ cursor: 0,
159
+ query: "",
160
+ page: 1,
161
+ searchResults: [[]],
162
+ isLoading: !0
163
+ };
164
+ searchSubscription = null;
165
+ searchSubject$ = new BehaviorSubject("");
166
+ pageSubject$ = new BehaviorSubject(1);
215
167
  componentDidMount() {
216
168
  this.searchSubscription = search(
217
169
  this.props.client,
@@ -230,9 +182,70 @@ class UnsplashAssetSourceInternal extends React.Component {
230
182
  componentWillUnmount() {
231
183
  this.searchSubscription && this.searchSubscription.unsubscribe();
232
184
  }
185
+ handleSelect = (photo) => (this.setState({ isLoading: !0 }), fetchDownloadUrl(this.props.client, photo).then((downloadUrl) => {
186
+ const description = photo.description || void 0, asset = {
187
+ kind: "url",
188
+ value: downloadUrl,
189
+ assetDocumentProps: {
190
+ _type: "sanity.imageAsset",
191
+ source: {
192
+ name: "unsplash",
193
+ id: photo.id,
194
+ url: photo.links.html
195
+ },
196
+ description,
197
+ creditLine: `${photo.user.name} by Unsplash`
198
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
199
+ }
200
+ };
201
+ this.props.onSelect([asset]);
202
+ }));
203
+ handleClose = () => {
204
+ this.props.onClose();
205
+ };
206
+ handleSearchTermChanged = (event) => {
207
+ const query = event.currentTarget.value;
208
+ this.setState({ query, page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next(query);
209
+ };
210
+ handleSearchTermCleared = () => {
211
+ this.setState({ query: "", page: 1, searchResults: [[]], isLoading: !0, cursor: 0 }), this.pageSubject$.next(1), this.searchSubject$.next("");
212
+ };
213
+ handleScollerLoadMore = () => {
214
+ const nextPage = this.state.page + 1;
215
+ this.setState({ page: nextPage, isLoading: !0 }), this.pageSubject$.next(nextPage), this.searchSubject$.next(this.state.query);
216
+ };
217
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
218
+ handleKeyDown = (event) => {
219
+ const { cursor } = this.state;
220
+ (event.keyCode === 38 || event.keyCode === 37) && cursor > 0 ? this.setState((prevState) => ({
221
+ cursor: prevState.cursor - 1
222
+ })) : (event.keyCode === 40 || event.keyCode === 39) && cursor < this.getPhotos().length - 1 && this.setState((prevState) => ({
223
+ cursor: prevState.cursor + 1
224
+ }));
225
+ };
233
226
  getPhotos() {
234
227
  return this.state.searchResults.flat();
235
228
  }
229
+ updateCursor = (photo) => {
230
+ const index = this.getPhotos().findIndex((result) => result.id === photo.id);
231
+ this.setState({ cursor: index });
232
+ };
233
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
234
+ renderImage = (props) => {
235
+ const { photo, layout } = props, active = this.getPhotos().findIndex((result) => result.id === photo.data.id) === this.state.cursor || !1;
236
+ return /* @__PURE__ */ jsx(
237
+ Photo,
238
+ {
239
+ onClick: this.handleSelect.bind(photo.data),
240
+ onKeyDown: this.handleKeyDown,
241
+ data: photo.data,
242
+ width: layout.width,
243
+ height: layout.height,
244
+ active,
245
+ onFocus: this.updateCursor
246
+ }
247
+ );
248
+ };
236
249
  render() {
237
250
  const { query, searchResults, isLoading } = this.state;
238
251
  return /* @__PURE__ */ jsx(
@@ -295,9 +308,6 @@ class UnsplashAssetSourceInternal extends React.Component {
295
308
  );
296
309
  }
297
310
  }
298
- __publicField(UnsplashAssetSourceInternal, "defaultProps", {
299
- selectedAssets: void 0
300
- });
301
311
  const unsplashAssetSource = {
302
312
  name: "unsplash",
303
313
  title: "Unsplash",
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/components/Icon.tsx","../src/datastores/unsplash.ts","../src/components/Photo.styled.tsx","../src/components/Photo.tsx","../src/components/UnsplashAssetSource.styled.tsx","../src/components/UnsplashAssetSource.tsx","../src/index.ts"],"sourcesContent":["export default function UnsplashIcon() {\n return (\n <svg role=\"img\" viewBox=\"0 0 25 25\" width=\"1em\" height=\"1em\" fill=\"currentColor\">\n <title />\n <path d=\"M9 9V4h7v5H9Zm7 3h5v9H4v-9h5v5h7v-5Z\" />\n </svg>\n )\n}\n","import { type BehaviorSubject, concat, defer, type Observable } from 'rxjs'\nimport { debounceTime, distinctUntilChanged, map, switchMap, withLatestFrom } from 'rxjs/operators'\nimport type { SanityClient } from 'sanity'\n\nimport type { UnsplashPhoto } from '../types'\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\n )\n\nconst fetchList = (\n client: SanityClient,\n type: string,\n page: number,\n perPage: number,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\n client.observable.request({\n url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 { Card } from '@sanity/ui'\nimport { styled } from 'styled-components'\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: ${({ theme }) => `1px solid ${theme.sanity.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 { Text } from '@sanity/ui'\nimport { useCallback, useEffect } from 'react'\n\nimport type { UnsplashPhoto } from '../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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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\n const handleClick = useCallback(() => {\n onClick(data)\n }, [onClick, data])\n\n const handleCreditLineClicked = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 (active) {\n onFocus(data)\n }\n }, [active, data, onFocus])\n\n const src = data.urls.small\n const userName = data.user.name\n\n return (\n <Root\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 { TextInput } from '@sanity/ui'\nimport { styled } from 'styled-components'\n\nexport const SearchInput = styled(TextInput)`\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 { SearchIcon } from '@sanity/icons'\nimport { Dialog, Flex, Spinner, Stack, Text } from '@sanity/ui'\nimport React from 'react'\nimport InfiniteScroll from 'react-infinite-scroll-component'\nimport PhotoAlbum from 'react-photo-album'\nimport { BehaviorSubject, type Subscription } from 'rxjs'\nimport {\n type AssetFromSource,\n type AssetSourceComponentProps,\n type SanityClient,\n useClient,\n} from 'sanity'\n\nimport { fetchDownloadUrl, search } from '../datastores/unsplash'\nimport type { UnsplashPhoto } from '../types'\nimport Photo from './Photo'\nimport { SearchInput } from './UnsplashAssetSource.styled'\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({ apiVersion: '2022-09-01' })\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 handleSearchTermCleared = () => {\n this.setState({ query: '', page: 1, searchResults: [[]], isLoading: true, cursor: 0 })\n this.pageSubject$.next(1)\n this.searchSubject$.next('')\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 this.state.searchResults.flat()\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 animate\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} paddingX={4} paddingBottom={4}>\n <SearchInput\n clearButton={query.length > 0}\n icon={SearchIcon}\n onChange={this.handleSearchTermChanged}\n onClear={this.handleSearchTermCleared}\n placeholder=\"Search by topics or colors\"\n value={query}\n />\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 // eslint-disable-next-line react/no-array-index-key\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 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 { AssetSource, definePlugin } from 'sanity'\n\nimport Icon from './components/Icon'\nimport Unsplash from './components/UnsplashAssetSource'\n\nexport type { Asset, AssetDocument, UnsplashPhoto } from './types'\n\n/**\n * @public\n */\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\n/**\n * @public\n */\nexport const unsplashImageAsset = definePlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n"],"names":["Unsplash","Icon"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../src/components/Icon.tsx","../src/datastores/unsplash.ts","../src/components/Photo.styled.tsx","../src/components/Photo.tsx","../src/components/UnsplashAssetSource.styled.tsx","../src/components/UnsplashAssetSource.tsx","../src/index.ts"],"sourcesContent":["export default function UnsplashIcon() {\n return (\n <svg role=\"img\" viewBox=\"0 0 25 25\" width=\"1em\" height=\"1em\" fill=\"currentColor\">\n <title />\n <path d=\"M9 9V4h7v5H9Zm7 3h5v9H4v-9h5v5h7v-5Z\" />\n </svg>\n )\n}\n","import { type BehaviorSubject, concat, defer, type Observable } from 'rxjs'\nimport { debounceTime, distinctUntilChanged, map, switchMap, withLatestFrom } from 'rxjs/operators'\nimport type { SanityClient } from 'sanity'\n\nimport type { UnsplashPhoto } from '../types'\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\n )\n\nconst fetchList = (\n client: SanityClient,\n type: string,\n page: number,\n perPage: number,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n): Observable<any> =>\n defer(\n () =>\n client.observable.request({\n url: `/addons/unsplash/photos?order_by=${type}&page=${page}&per_page=${perPage}`,\n withCredentials: true,\n method: 'GET',\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n }) as any,\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 { Card } from '@sanity/ui'\nimport { styled } from 'styled-components'\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: ${({ theme }) => `1px solid ${theme.sanity.color.card.enabled.border}`};\n box-sizing: content-box;\n -webkit-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 -webkit-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 { Text } from '@sanity/ui'\nimport { useCallback, useEffect } from 'react'\n\nimport type { UnsplashPhoto } from '../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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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\n const handleClick = useCallback(() => {\n onClick(data)\n }, [onClick, data])\n\n const handleCreditLineClicked = useCallback(\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 (active) {\n onFocus(data)\n }\n }, [active, data, onFocus])\n\n const src = data.urls.small\n const userName = data.user.name\n\n return (\n <Root\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 { TextInput } from '@sanity/ui'\nimport { styled } from 'styled-components'\n\nexport const SearchInput = styled(TextInput)`\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 { SearchIcon } from '@sanity/icons'\nimport { Dialog, Flex, Spinner, Stack, Text } from '@sanity/ui'\nimport React from 'react'\nimport InfiniteScroll from 'react-infinite-scroll-component'\nimport PhotoAlbum from 'react-photo-album'\nimport { BehaviorSubject, type Subscription } from 'rxjs'\nimport {\n type AssetFromSource,\n type AssetSourceComponentProps,\n type SanityClient,\n useClient,\n} from 'sanity'\n\nimport { fetchDownloadUrl, search } from '../datastores/unsplash'\nimport type { UnsplashPhoto } from '../types'\nimport Photo from './Photo'\nimport { SearchInput } from './UnsplashAssetSource.styled'\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({ apiVersion: '2022-09-01' })\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 override 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 override 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 override 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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 handleSearchTermCleared = () => {\n this.setState({ query: '', page: 1, searchResults: [[]], isLoading: true, cursor: 0 })\n this.pageSubject$.next(1)\n this.searchSubject$.next('')\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 this.state.searchResults.flat()\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any\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 override render() {\n const { query, searchResults, isLoading } = this.state\n\n return (\n <Dialog\n animate\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} paddingX={4} paddingBottom={4}>\n <SearchInput\n clearButton={query.length > 0}\n icon={SearchIcon}\n onChange={this.handleSearchTermChanged}\n onClear={this.handleSearchTermCleared}\n placeholder=\"Search by topics or colors\"\n value={query}\n />\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 // eslint-disable-next-line react/no-array-index-key\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 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 { type AssetSource, definePlugin } from 'sanity'\n\nimport Icon from './components/Icon'\nimport Unsplash from './components/UnsplashAssetSource'\n\nexport type { Asset, AssetDocument, UnsplashPhoto } from './types'\n\n/**\n * @public\n */\nexport const unsplashAssetSource: AssetSource = {\n name: 'unsplash',\n title: 'Unsplash',\n component: Unsplash,\n icon: Icon,\n}\n\n/**\n * @public\n */\nexport const unsplashImageAsset = definePlugin({\n name: 'asset-source-unsplash-plugin',\n\n form: {\n image: {\n assetSources: (prev) => {\n return [...prev, unsplashAssetSource]\n },\n },\n },\n})\n"],"names":["Unsplash","Icon"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sanity-plugin-asset-source-unsplash",
3
- "version": "3.0.1",
3
+ "version": "3.0.3",
4
4
  "description": "Use images from Unsplash.com in your Sanity Studio",
5
5
  "keywords": [
6
6
  "sanity",
@@ -53,45 +53,45 @@
53
53
  },
54
54
  "browserslist": "extends @sanity/browserslist-config",
55
55
  "dependencies": {
56
- "@sanity/icons": "^2.11.8",
57
- "@sanity/incompatible-plugin": "^1.0.4",
58
- "@sanity/ui": "^2.1.2",
56
+ "@sanity/icons": "^3.5.7",
57
+ "@sanity/incompatible-plugin": "^1.0.5",
58
+ "@sanity/ui": "^2.11.6",
59
59
  "react-infinite-scroll-component": "6.1.0",
60
- "react-photo-album": "2.3.1",
60
+ "react-photo-album": "2.4.1",
61
61
  "rxjs": "^7.8.1"
62
62
  },
63
63
  "devDependencies": {
64
- "@commitlint/cli": "^19.2.1",
65
- "@commitlint/config-conventional": "^19.1.0",
66
- "@sanity/pkg-utils": "^6.6.0",
67
- "@sanity/plugin-kit": "3.1.13-canary.0",
68
- "@sanity/semantic-release-preset": "^4.1.7",
64
+ "@commitlint/cli": "^19.6.1",
65
+ "@commitlint/config-conventional": "^19.6.0",
66
+ "@sanity/pkg-utils": "^7.0.3",
67
+ "@sanity/plugin-kit": "4.0.19",
68
+ "@sanity/semantic-release-preset": "^4.1.8",
69
69
  "@types/node": "^18.18.6",
70
- "@types/react": "^18.2.76",
71
- "@types/react-dom": "^18.2.25",
72
- "@typescript-eslint/eslint-plugin": "^7.6.0",
73
- "@typescript-eslint/parser": "^7.6.0",
74
- "eslint": "^8.57.0",
70
+ "@types/react": "^19.0.8",
71
+ "@types/react-dom": "^19.0.3",
72
+ "@typescript-eslint/eslint-plugin": "^7.18.0",
73
+ "@typescript-eslint/parser": "^7.18.0",
74
+ "eslint": "^8.57.1",
75
75
  "eslint-config-prettier": "^9.1.0",
76
- "eslint-config-sanity": "^7.1.2",
77
- "eslint-plugin-import": "^2.29.1",
78
- "eslint-plugin-prettier": "^5.1.3",
79
- "eslint-plugin-react": "^7.34.1",
80
- "eslint-plugin-react-hooks": "^4.6.0",
81
- "eslint-plugin-simple-import-sort": "^12.0.0",
76
+ "eslint-config-sanity": "^7.1.4",
77
+ "eslint-plugin-import": "^2.31.0",
78
+ "eslint-plugin-prettier": "^5.2.1",
79
+ "eslint-plugin-react": "^7.37.4",
80
+ "eslint-plugin-react-hooks": "^5.1.0",
81
+ "eslint-plugin-simple-import-sort": "^12.1.1",
82
82
  "husky": "^8.0.3",
83
83
  "lint-staged": "^15.0.2",
84
- "prettier": "^3.2.5",
85
- "prettier-plugin-packagejson": "^2.5.0",
86
- "react": "^18.2.0",
87
- "react-dom": "^18.2.0",
88
- "sanity": "^3.37.2",
89
- "semantic-release": "^23.0.8",
90
- "styled-components": "^6.1.8",
91
- "typescript": "5.4.5"
84
+ "prettier": "^3.4.2",
85
+ "prettier-plugin-packagejson": "^2.5.6",
86
+ "react": "^18.3.1",
87
+ "react-dom": "^18.3.1",
88
+ "sanity": "^3.71.2",
89
+ "semantic-release": "^23.1.1",
90
+ "styled-components": "^6.1.14",
91
+ "typescript": "5.7.3"
92
92
  },
93
93
  "peerDependencies": {
94
- "react": "^18",
94
+ "react": "^18 || ^19",
95
95
  "sanity": "^3",
96
96
  "styled-components": "^6.1"
97
97
  },
@@ -11,7 +11,7 @@ export const Root = styled.div`
11
11
  outline: none !important;
12
12
  border: ${({ theme }) => `1px solid ${theme.sanity.color.card.enabled.border}`};
13
13
  box-sizing: content-box;
14
- user-drag: none;
14
+ -webkit-user-drag: none;
15
15
 
16
16
  &:hover {
17
17
  opacity: 0.85;
@@ -34,7 +34,7 @@ export const CreditLine = styled(Card)`
34
34
  --creditline-fg: ${theme.sanity.color.card.enabled.fg};
35
35
  --creditline-bg: ${theme.sanity.color.card.enabled.bg};
36
36
  `};
37
- user-drag: none;
37
+ -webkit-user-drag: none;
38
38
  position: absolute;
39
39
  background-color: var(--creditline-bg);
40
40
  bottom: 0;
@@ -41,7 +41,7 @@ class UnsplashAssetSourceInternal extends React.Component<
41
41
  selectedAssets: undefined,
42
42
  }
43
43
 
44
- state = {
44
+ override state = {
45
45
  cursor: 0,
46
46
  query: '',
47
47
  page: 1,
@@ -54,7 +54,7 @@ class UnsplashAssetSourceInternal extends React.Component<
54
54
  searchSubject$ = new BehaviorSubject('')
55
55
  pageSubject$ = new BehaviorSubject(1)
56
56
 
57
- componentDidMount() {
57
+ override componentDidMount() {
58
58
  this.searchSubscription = search(
59
59
  this.props.client,
60
60
  this.searchSubject$,
@@ -70,7 +70,7 @@ class UnsplashAssetSourceInternal extends React.Component<
70
70
  })
71
71
  }
72
72
 
73
- componentWillUnmount() {
73
+ override componentWillUnmount() {
74
74
  if (this.searchSubscription) {
75
75
  this.searchSubscription.unsubscribe()
76
76
  }
@@ -169,7 +169,7 @@ class UnsplashAssetSourceInternal extends React.Component<
169
169
  )
170
170
  }
171
171
 
172
- render() {
172
+ override render() {
173
173
  const { query, searchResults, isLoading } = this.state
174
174
 
175
175
  return (
package/src/index.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { AssetSource, definePlugin } from 'sanity'
1
+ import { type AssetSource, definePlugin } from 'sanity'
2
2
 
3
3
  import Icon from './components/Icon'
4
4
  import Unsplash from './components/UnsplashAssetSource'