sanity-plugin-utils 1.6.5 → 1.6.7
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/lib/index.cjs +578 -945
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +132 -0
- package/lib/index.d.ts +9 -7
- package/lib/index.js +594 -933
- package/lib/index.js.map +1 -1
- package/package.json +16 -22
- package/src/components/Feedback.tsx +4 -4
- package/src/components/Table.tsx +3 -3
- package/src/components/UserSelectMenu/index.tsx +4 -4
- package/src/hooks/useOpenInNewPane.tsx +4 -4
- package/src/hooks/useProjectUsers.tsx +47 -25
- package/src/index.ts +5 -6
- package/lib/index.cjs.js +0 -13
package/lib/index.cjs
CHANGED
|
@@ -1,1010 +1,643 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
var React = require('react');
|
|
7
|
-
var sanity = require('sanity');
|
|
8
|
-
var isEqual = require('react-fast-compare');
|
|
9
|
-
var operators = require('rxjs/operators');
|
|
10
|
-
var structure = require('sanity/structure');
|
|
11
|
-
var router = require('sanity/router');
|
|
12
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
13
|
-
var ui = require('@sanity/ui');
|
|
14
|
-
var styled = require('styled-components');
|
|
15
|
-
var icons = require('@sanity/icons');
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: !0 });
|
|
3
|
+
var jsxRuntime = require("react/jsx-runtime"), ui = require("@sanity/ui"), styledComponents = require("styled-components"), icons = require("@sanity/icons"), react = require("react"), sanity = require("sanity"), isEqual = require("react-fast-compare"), operators = require("rxjs/operators"), router = require("sanity/router"), structure = require("sanity/structure");
|
|
16
4
|
function _interopDefaultCompat(e) {
|
|
17
|
-
return e && typeof e
|
|
18
|
-
default: e
|
|
19
|
-
};
|
|
5
|
+
return e && typeof e == "object" && "default" in e ? e : { default: e };
|
|
20
6
|
}
|
|
21
|
-
var
|
|
22
|
-
var
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
7
|
+
var isEqual__default = /* @__PURE__ */ _interopDefaultCompat(isEqual), __defProp$3 = Object.defineProperty, __getOwnPropSymbols$3 = Object.getOwnPropertySymbols, __hasOwnProp$3 = Object.prototype.hasOwnProperty, __propIsEnum$3 = Object.prototype.propertyIsEnumerable, __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$3 = (a, b) => {
|
|
8
|
+
for (var prop in b || (b = {}))
|
|
9
|
+
__hasOwnProp$3.call(b, prop) && __defNormalProp$3(a, prop, b[prop]);
|
|
10
|
+
if (__getOwnPropSymbols$3)
|
|
11
|
+
for (var prop of __getOwnPropSymbols$3(b))
|
|
12
|
+
__propIsEnum$3.call(b, prop) && __defNormalProp$3(a, prop, b[prop]);
|
|
13
|
+
return a;
|
|
14
|
+
};
|
|
15
|
+
const DEFAULT_PROPS = {
|
|
16
|
+
tone: "primary"
|
|
17
|
+
};
|
|
18
|
+
function Feedback(props) {
|
|
19
|
+
const { title, description, icon, tone, children } = __spreadValues$3(__spreadValues$3({}, DEFAULT_PROPS), props);
|
|
20
|
+
return /* @__PURE__ */ jsxRuntime.jsx(ui.Card, { tone, padding: 4, radius: 3, border: !0, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { children: [
|
|
21
|
+
icon ? "display icon" : null,
|
|
22
|
+
children || /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { flex: 1, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, { space: 4, children: [
|
|
23
|
+
title ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { weight: "semibold", children: title }) : null,
|
|
24
|
+
description ? /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: 2, children: description }) : null
|
|
25
|
+
] }) })
|
|
26
|
+
] }) });
|
|
27
27
|
}
|
|
28
|
-
var
|
|
29
|
-
var
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
var
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
};
|
|
28
|
+
var __defProp$2 = Object.defineProperty, __defProps$1 = Object.defineProperties, __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors, __getOwnPropSymbols$2 = Object.getOwnPropertySymbols, __hasOwnProp$2 = Object.prototype.hasOwnProperty, __propIsEnum$2 = Object.prototype.propertyIsEnumerable, __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$2 = (a, b) => {
|
|
29
|
+
for (var prop in b || (b = {}))
|
|
30
|
+
__hasOwnProp$2.call(b, prop) && __defNormalProp$2(a, prop, b[prop]);
|
|
31
|
+
if (__getOwnPropSymbols$2)
|
|
32
|
+
for (var prop of __getOwnPropSymbols$2(b))
|
|
33
|
+
__propIsEnum$2.call(b, prop) && __defNormalProp$2(a, prop, b[prop]);
|
|
34
|
+
return a;
|
|
35
|
+
}, __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b)), __objRest = (source, exclude) => {
|
|
36
|
+
var target = {};
|
|
37
|
+
for (var prop in source)
|
|
38
|
+
__hasOwnProp$2.call(source, prop) && exclude.indexOf(prop) < 0 && (target[prop] = source[prop]);
|
|
39
|
+
if (source != null && __getOwnPropSymbols$2)
|
|
40
|
+
for (var prop of __getOwnPropSymbols$2(source))
|
|
41
|
+
exclude.indexOf(prop) < 0 && __propIsEnum$2.call(source, prop) && (target[prop] = source[prop]);
|
|
42
|
+
return target;
|
|
43
|
+
};
|
|
44
|
+
const TableWrapper = (props = {}) => /* @__PURE__ */ jsxRuntime.jsx(ui.Card, __spreadValues$2({ as: "table" }, props)), StyledTable = styledComponents.styled(TableWrapper)(
|
|
45
|
+
() => styledComponents.css`
|
|
46
|
+
display: table;
|
|
47
|
+
width: 100%;
|
|
48
|
+
border-collapse: collapse;
|
|
49
|
+
|
|
50
|
+
&:not([hidden]) {
|
|
51
|
+
display: table;
|
|
52
|
+
border-collapse: collapse;
|
|
53
|
+
}
|
|
54
|
+
`
|
|
55
|
+
);
|
|
56
|
+
function Table(props) {
|
|
57
|
+
const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
|
|
58
|
+
return /* @__PURE__ */ jsxRuntime.jsx(StyledTable, __spreadProps$1(__spreadValues$2({}, rest), { children }));
|
|
58
59
|
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
60
|
+
const RowWrapper = (props = {}) => /* @__PURE__ */ jsxRuntime.jsx(ui.Card, __spreadValues$2({ as: "tr" }, props)), StyledRow = styledComponents.styled(RowWrapper)(
|
|
61
|
+
() => styledComponents.css`
|
|
62
|
+
display: table-row;
|
|
63
|
+
|
|
64
|
+
&:not([hidden]) {
|
|
65
|
+
display: table-row;
|
|
66
66
|
}
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
})
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
67
|
+
`
|
|
68
|
+
);
|
|
69
|
+
function Row(props) {
|
|
70
|
+
const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
|
|
71
|
+
return /* @__PURE__ */ jsxRuntime.jsx(StyledRow, __spreadProps$1(__spreadValues$2({}, rest), { children }));
|
|
72
|
+
}
|
|
73
|
+
const CellWrapper = (props = {}) => /* @__PURE__ */ jsxRuntime.jsx(ui.Card, __spreadValues$2({ as: "td" }, props)), StyledCell = styledComponents.styled(CellWrapper)(
|
|
74
|
+
() => styledComponents.css`
|
|
75
|
+
display: table-cell;
|
|
76
|
+
|
|
77
|
+
&:not([hidden]) {
|
|
78
|
+
display: table-cell;
|
|
79
|
+
}
|
|
80
|
+
`
|
|
81
|
+
);
|
|
82
|
+
function Cell(props) {
|
|
83
|
+
const _a = props, { children } = _a, rest = __objRest(_a, ["children"]);
|
|
84
|
+
return /* @__PURE__ */ jsxRuntime.jsx(StyledCell, __spreadProps$1(__spreadValues$2({}, rest), { children }));
|
|
85
|
+
}
|
|
86
|
+
var __defProp$1 = Object.defineProperty, __getOwnPropSymbols$1 = Object.getOwnPropertySymbols, __hasOwnProp$1 = Object.prototype.hasOwnProperty, __propIsEnum$1 = Object.prototype.propertyIsEnumerable, __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues$1 = (a, b) => {
|
|
87
|
+
for (var prop in b || (b = {}))
|
|
88
|
+
__hasOwnProp$1.call(b, prop) && __defNormalProp$1(a, prop, b[prop]);
|
|
89
|
+
if (__getOwnPropSymbols$1)
|
|
90
|
+
for (var prop of __getOwnPropSymbols$1(b))
|
|
91
|
+
__propIsEnum$1.call(b, prop) && __defNormalProp$1(a, prop, b[prop]);
|
|
92
|
+
return a;
|
|
81
93
|
};
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
94
|
+
function searchUsers(users, searchString) {
|
|
95
|
+
return users.filter((user) => !!((user.displayName || "").toLowerCase().startsWith(searchString) || (user.givenName || "").toLowerCase().startsWith(searchString) || (user.middleName || "").toLowerCase().startsWith(searchString) || (user.familyName || "").toLowerCase().startsWith(searchString)));
|
|
96
|
+
}
|
|
97
|
+
const LABELS = {
|
|
98
|
+
addMe: "Assign myself",
|
|
99
|
+
removeMe: "Unassign myself",
|
|
100
|
+
clear: "Clear assignees",
|
|
101
|
+
searchPlaceholder: "Search users",
|
|
102
|
+
notFound: "No users found"
|
|
85
103
|
};
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
104
|
+
function UserSelectMenu(props) {
|
|
105
|
+
const {
|
|
106
|
+
value = [],
|
|
107
|
+
userList = [],
|
|
108
|
+
onAdd,
|
|
109
|
+
onRemove,
|
|
110
|
+
onClear,
|
|
111
|
+
style = {}
|
|
112
|
+
} = props, labels = props != null && props.labels ? __spreadValues$1(__spreadValues$1({}, LABELS), props.labels) : LABELS, [searchString, setSearchString] = react.useState(""), searchResults = searchUsers(userList || [], searchString), me = userList.find((u) => u.isCurrentUser), meAssigned = me && value.includes(me.id), input = react.useRef(null), handleSearchChange = (event) => {
|
|
113
|
+
setSearchString(event.target.value);
|
|
114
|
+
}, handleSelect = (isChecked, user) => {
|
|
115
|
+
isChecked ? onRemove && onRemove(user.id) : onAdd && onAdd(user.id);
|
|
116
|
+
}, handleAssignMyself = () => {
|
|
117
|
+
me && onAdd && onAdd(me.id);
|
|
118
|
+
}, handleUnassignMyself = () => {
|
|
119
|
+
me && onRemove && onRemove(me.id);
|
|
120
|
+
}, handleClearAssigneesClick = () => {
|
|
121
|
+
onClear && onClear();
|
|
122
|
+
};
|
|
123
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(ui.Menu, { style, children: [
|
|
124
|
+
meAssigned ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
125
|
+
ui.MenuItem,
|
|
126
|
+
{
|
|
127
|
+
tone: "caution",
|
|
128
|
+
disabled: !me,
|
|
129
|
+
onClick: handleUnassignMyself,
|
|
130
|
+
icon: icons.RemoveCircleIcon,
|
|
131
|
+
text: labels.removeMe
|
|
98
132
|
}
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
133
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
134
|
+
ui.MenuItem,
|
|
135
|
+
{
|
|
136
|
+
tone: "positive",
|
|
137
|
+
onClick: handleAssignMyself,
|
|
138
|
+
icon: icons.AddCircleIcon,
|
|
139
|
+
text: labels.addMe
|
|
105
140
|
}
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
asset: {
|
|
116
|
-
_ref: source._id || ''
|
|
141
|
+
),
|
|
142
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
143
|
+
ui.MenuItem,
|
|
144
|
+
{
|
|
145
|
+
tone: "critical",
|
|
146
|
+
disabled: value.length === 0,
|
|
147
|
+
onClick: handleClearAssigneesClick,
|
|
148
|
+
icon: icons.RestoreIcon,
|
|
149
|
+
text: labels.clear
|
|
117
150
|
}
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
151
|
+
),
|
|
152
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { padding: 1, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
153
|
+
ui.TextInput,
|
|
154
|
+
{
|
|
155
|
+
ref: input,
|
|
156
|
+
onChange: handleSearchChange,
|
|
157
|
+
placeholder: labels.searchPlaceholder,
|
|
158
|
+
value: searchString
|
|
124
159
|
}
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
}
|
|
141
|
-
return applyDefaults(image);
|
|
160
|
+
) }),
|
|
161
|
+
searchString && (searchResults == null ? void 0 : searchResults.length) === 0 && /* @__PURE__ */ jsxRuntime.jsx(ui.MenuItem, { disabled: !0, text: labels.notFound }),
|
|
162
|
+
searchResults && searchResults.map((user) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
163
|
+
ui.MenuItem,
|
|
164
|
+
{
|
|
165
|
+
pressed: value.includes(user.id),
|
|
166
|
+
onClick: () => handleSelect(value.indexOf(user.id) > -1, user),
|
|
167
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { align: "center", children: [
|
|
168
|
+
/* @__PURE__ */ jsxRuntime.jsx(sanity.UserAvatar, { user, size: 1 }),
|
|
169
|
+
/* @__PURE__ */ jsxRuntime.jsx(ui.Box, { paddingX: 2, flex: 1, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { children: user.displayName }) }),
|
|
170
|
+
user.isCurrentUser && /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { fontSize: 1, tone: "positive", mode: "outline", children: "Me" })
|
|
171
|
+
] })
|
|
172
|
+
},
|
|
173
|
+
user.id
|
|
174
|
+
))
|
|
175
|
+
] });
|
|
142
176
|
}
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
return /^https?:\/\//.test("".concat(url));
|
|
177
|
+
function getDefaultExportFromCjs(x) {
|
|
178
|
+
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x.default : x;
|
|
146
179
|
}
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
180
|
+
var builder = {}, urlForImage = {}, parseAssetId = {}, hasRequiredParseAssetId;
|
|
181
|
+
function requireParseAssetId() {
|
|
182
|
+
if (hasRequiredParseAssetId) return parseAssetId;
|
|
183
|
+
hasRequiredParseAssetId = 1, Object.defineProperty(parseAssetId, "__esModule", { value: !0 });
|
|
184
|
+
var example = "image-Tb9Ew8CXIwaY6R1kjMvI0uRR-2000x3000-jpg";
|
|
185
|
+
function parseAssetId$1(ref) {
|
|
186
|
+
var _a = ref.split("-"), id = _a[1], dimensionString = _a[2], format = _a[3];
|
|
187
|
+
if (!id || !dimensionString || !format)
|
|
188
|
+
throw new Error("Malformed asset _ref '".concat(ref, `'. Expected an id like "`).concat(example, '".'));
|
|
189
|
+
var _b = dimensionString.split("x"), imgWidthStr = _b[0], imgHeightStr = _b[1], width = +imgWidthStr, height = +imgHeightStr, isValidAssetId = isFinite(width) && isFinite(height);
|
|
190
|
+
if (!isValidAssetId)
|
|
191
|
+
throw new Error("Malformed asset _ref '".concat(ref, `'. Expected an id like "`).concat(example, '".'));
|
|
192
|
+
return { id, width, height, format };
|
|
193
|
+
}
|
|
194
|
+
return parseAssetId.default = parseAssetId$1, parseAssetId;
|
|
150
195
|
}
|
|
151
|
-
|
|
152
|
-
function
|
|
153
|
-
if (
|
|
154
|
-
|
|
196
|
+
var parseSource = {}, hasRequiredParseSource;
|
|
197
|
+
function requireParseSource() {
|
|
198
|
+
if (hasRequiredParseSource) return parseSource;
|
|
199
|
+
hasRequiredParseSource = 1;
|
|
200
|
+
var __assign = parseSource && parseSource.__assign || function() {
|
|
201
|
+
return __assign = Object.assign || function(t) {
|
|
202
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
203
|
+
s = arguments[i];
|
|
204
|
+
for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
|
|
205
|
+
}
|
|
206
|
+
return t;
|
|
207
|
+
}, __assign.apply(this, arguments);
|
|
208
|
+
};
|
|
209
|
+
Object.defineProperty(parseSource, "__esModule", { value: !0 });
|
|
210
|
+
var isRef = function(src) {
|
|
211
|
+
var source = src;
|
|
212
|
+
return source ? typeof source._ref == "string" : !1;
|
|
213
|
+
}, isAsset = function(src) {
|
|
214
|
+
var source = src;
|
|
215
|
+
return source ? typeof source._id == "string" : !1;
|
|
216
|
+
}, isAssetStub = function(src) {
|
|
217
|
+
var source = src;
|
|
218
|
+
return source && source.asset ? typeof source.asset.url == "string" : !1;
|
|
219
|
+
};
|
|
220
|
+
function parseSource$1(source) {
|
|
221
|
+
if (!source)
|
|
222
|
+
return null;
|
|
223
|
+
var image;
|
|
224
|
+
if (typeof source == "string" && isUrl(source))
|
|
225
|
+
image = {
|
|
226
|
+
asset: { _ref: urlToId(source) }
|
|
227
|
+
};
|
|
228
|
+
else if (typeof source == "string")
|
|
229
|
+
image = {
|
|
230
|
+
asset: { _ref: source }
|
|
231
|
+
};
|
|
232
|
+
else if (isRef(source))
|
|
233
|
+
image = {
|
|
234
|
+
asset: source
|
|
235
|
+
};
|
|
236
|
+
else if (isAsset(source))
|
|
237
|
+
image = {
|
|
238
|
+
asset: {
|
|
239
|
+
_ref: source._id || ""
|
|
240
|
+
}
|
|
241
|
+
};
|
|
242
|
+
else if (isAssetStub(source))
|
|
243
|
+
image = {
|
|
244
|
+
asset: {
|
|
245
|
+
_ref: urlToId(source.asset.url)
|
|
246
|
+
}
|
|
247
|
+
};
|
|
248
|
+
else if (typeof source.asset == "object")
|
|
249
|
+
image = __assign({}, source);
|
|
250
|
+
else
|
|
251
|
+
return null;
|
|
252
|
+
var img = source;
|
|
253
|
+
return img.crop && (image.crop = img.crop), img.hotspot && (image.hotspot = img.hotspot), applyDefaults(image);
|
|
155
254
|
}
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
255
|
+
parseSource.default = parseSource$1;
|
|
256
|
+
function isUrl(url) {
|
|
257
|
+
return /^https?:\/\//.test("".concat(url));
|
|
258
|
+
}
|
|
259
|
+
function urlToId(url) {
|
|
260
|
+
var parts = url.split("/").slice(-1);
|
|
261
|
+
return "image-".concat(parts[0]).replace(/\.([a-z]+)$/, "-$1");
|
|
262
|
+
}
|
|
263
|
+
function applyDefaults(image) {
|
|
264
|
+
if (image.crop && image.hotspot)
|
|
265
|
+
return image;
|
|
266
|
+
var result = __assign({}, image);
|
|
267
|
+
return result.crop || (result.crop = {
|
|
160
268
|
left: 0,
|
|
161
269
|
top: 0,
|
|
162
270
|
bottom: 0,
|
|
163
271
|
right: 0
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
if (!result.hotspot) {
|
|
167
|
-
result.hotspot = {
|
|
272
|
+
}), result.hotspot || (result.hotspot = {
|
|
168
273
|
x: 0.5,
|
|
169
274
|
y: 0.5,
|
|
170
|
-
height: 1
|
|
171
|
-
width: 1
|
|
172
|
-
};
|
|
275
|
+
height: 1,
|
|
276
|
+
width: 1
|
|
277
|
+
}), result;
|
|
173
278
|
}
|
|
174
|
-
return
|
|
279
|
+
return parseSource;
|
|
175
280
|
}
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
for (var
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
"default": mod
|
|
190
|
-
};
|
|
191
|
-
};
|
|
192
|
-
Object.defineProperty(exports, "__esModule", {
|
|
193
|
-
value: true
|
|
194
|
-
});
|
|
195
|
-
exports.parseSource = exports.SPEC_NAME_TO_URL_NAME_MAPPINGS = void 0;
|
|
196
|
-
var parseAssetId_1 = __importDefault(parseAssetId$1);
|
|
197
|
-
var parseSource_1 = __importDefault(parseSource$1);
|
|
198
|
-
exports.parseSource = parseSource_1.default;
|
|
199
|
-
exports.SPEC_NAME_TO_URL_NAME_MAPPINGS = [['width', 'w'], ['height', 'h'], ['format', 'fm'], ['download', 'dl'], ['blur', 'blur'], ['sharpen', 'sharp'], ['invert', 'invert'], ['orientation', 'or'], ['minHeight', 'min-h'], ['maxHeight', 'max-h'], ['minWidth', 'min-w'], ['maxWidth', 'max-w'], ['quality', 'q'], ['fit', 'fit'], ['crop', 'crop'], ['saturation', 'sat'], ['auto', 'auto'], ['dpr', 'dpr'], ['pad', 'pad']];
|
|
200
|
-
function urlForImage(options) {
|
|
201
|
-
var spec = __assign({}, options || {});
|
|
202
|
-
var source = spec.source;
|
|
203
|
-
delete spec.source;
|
|
204
|
-
var image = (0, parseSource_1.default)(source);
|
|
205
|
-
if (!image) {
|
|
206
|
-
throw new Error("Unable to resolve image URL from source (".concat(JSON.stringify(source), ")"));
|
|
207
|
-
}
|
|
208
|
-
var id = image.asset._ref || image.asset._id || '';
|
|
209
|
-
var asset = (0, parseAssetId_1.default)(id);
|
|
210
|
-
// Compute crop rect in terms of pixel coordinates in the raw source image
|
|
211
|
-
var cropLeft = Math.round(image.crop.left * asset.width);
|
|
212
|
-
var cropTop = Math.round(image.crop.top * asset.height);
|
|
213
|
-
var crop = {
|
|
214
|
-
left: cropLeft,
|
|
215
|
-
top: cropTop,
|
|
216
|
-
width: Math.round(asset.width - image.crop.right * asset.width - cropLeft),
|
|
217
|
-
height: Math.round(asset.height - image.crop.bottom * asset.height - cropTop)
|
|
281
|
+
var hasRequiredUrlForImage;
|
|
282
|
+
function requireUrlForImage() {
|
|
283
|
+
return hasRequiredUrlForImage || (hasRequiredUrlForImage = 1, function(exports2) {
|
|
284
|
+
var __assign = urlForImage && urlForImage.__assign || function() {
|
|
285
|
+
return __assign = Object.assign || function(t) {
|
|
286
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
287
|
+
s = arguments[i];
|
|
288
|
+
for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
|
|
289
|
+
}
|
|
290
|
+
return t;
|
|
291
|
+
}, __assign.apply(this, arguments);
|
|
292
|
+
}, __importDefault = urlForImage && urlForImage.__importDefault || function(mod) {
|
|
293
|
+
return mod && mod.__esModule ? mod : { default: mod };
|
|
218
294
|
};
|
|
219
|
-
|
|
220
|
-
var
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
295
|
+
Object.defineProperty(exports2, "__esModule", { value: !0 }), exports2.parseSource = exports2.SPEC_NAME_TO_URL_NAME_MAPPINGS = void 0;
|
|
296
|
+
var parseAssetId_1 = __importDefault(requireParseAssetId()), parseSource_1 = __importDefault(requireParseSource());
|
|
297
|
+
exports2.parseSource = parseSource_1.default, exports2.SPEC_NAME_TO_URL_NAME_MAPPINGS = [
|
|
298
|
+
["width", "w"],
|
|
299
|
+
["height", "h"],
|
|
300
|
+
["format", "fm"],
|
|
301
|
+
["download", "dl"],
|
|
302
|
+
["blur", "blur"],
|
|
303
|
+
["sharpen", "sharp"],
|
|
304
|
+
["invert", "invert"],
|
|
305
|
+
["orientation", "or"],
|
|
306
|
+
["minHeight", "min-h"],
|
|
307
|
+
["maxHeight", "max-h"],
|
|
308
|
+
["minWidth", "min-w"],
|
|
309
|
+
["maxWidth", "max-w"],
|
|
310
|
+
["quality", "q"],
|
|
311
|
+
["fit", "fit"],
|
|
312
|
+
["crop", "crop"],
|
|
313
|
+
["saturation", "sat"],
|
|
314
|
+
["auto", "auto"],
|
|
315
|
+
["dpr", "dpr"],
|
|
316
|
+
["pad", "pad"]
|
|
317
|
+
];
|
|
318
|
+
function urlForImage$1(options) {
|
|
319
|
+
var spec = __assign({}, options || {}), source = spec.source;
|
|
320
|
+
delete spec.source;
|
|
321
|
+
var image = (0, parseSource_1.default)(source);
|
|
322
|
+
if (!image)
|
|
323
|
+
throw new Error("Unable to resolve image URL from source (".concat(JSON.stringify(source), ")"));
|
|
324
|
+
var id = image.asset._ref || image.asset._id || "", asset = (0, parseAssetId_1.default)(id), cropLeft = Math.round(image.crop.left * asset.width), cropTop = Math.round(image.crop.top * asset.height), crop = {
|
|
325
|
+
left: cropLeft,
|
|
326
|
+
top: cropTop,
|
|
327
|
+
width: Math.round(asset.width - image.crop.right * asset.width - cropLeft),
|
|
328
|
+
height: Math.round(asset.height - image.crop.bottom * asset.height - cropTop)
|
|
329
|
+
}, hotSpotVerticalRadius = image.hotspot.height * asset.height / 2, hotSpotHorizontalRadius = image.hotspot.width * asset.width / 2, hotSpotCenterX = image.hotspot.x * asset.width, hotSpotCenterY = image.hotspot.y * asset.height, hotspot = {
|
|
330
|
+
left: hotSpotCenterX - hotSpotHorizontalRadius,
|
|
331
|
+
top: hotSpotCenterY - hotSpotVerticalRadius,
|
|
332
|
+
right: hotSpotCenterX + hotSpotHorizontalRadius,
|
|
333
|
+
bottom: hotSpotCenterY + hotSpotVerticalRadius
|
|
334
|
+
};
|
|
335
|
+
return spec.rect || spec.focalPoint || spec.ignoreImageParams || spec.crop || (spec = __assign(__assign({}, spec), fit({ crop, hotspot }, spec))), specToImageUrl(__assign(__assign({}, spec), { asset }));
|
|
237
336
|
}
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
function specToImageUrl(spec) {
|
|
245
|
-
var cdnUrl = (spec.baseUrl || 'https://cdn.sanity.io').replace(/\/+$/, '');
|
|
246
|
-
var filename = "".concat(spec.asset.id, "-").concat(spec.asset.width, "x").concat(spec.asset.height, ".").concat(spec.asset.format);
|
|
247
|
-
var baseUrl = "".concat(cdnUrl, "/images/").concat(spec.projectId, "/").concat(spec.dataset, "/").concat(filename);
|
|
248
|
-
var params = [];
|
|
249
|
-
if (spec.rect) {
|
|
250
|
-
// Only bother url with a crop if it actually crops anything
|
|
251
|
-
var _a = spec.rect,
|
|
252
|
-
left = _a.left,
|
|
253
|
-
top_1 = _a.top,
|
|
254
|
-
width = _a.width,
|
|
255
|
-
height = _a.height;
|
|
256
|
-
var isEffectiveCrop = left !== 0 || top_1 !== 0 || height !== spec.asset.height || width !== spec.asset.width;
|
|
257
|
-
if (isEffectiveCrop) {
|
|
258
|
-
params.push("rect=".concat(left, ",").concat(top_1, ",").concat(width, ",").concat(height));
|
|
337
|
+
exports2.default = urlForImage$1;
|
|
338
|
+
function specToImageUrl(spec) {
|
|
339
|
+
var cdnUrl = (spec.baseUrl || "https://cdn.sanity.io").replace(/\/+$/, ""), filename = "".concat(spec.asset.id, "-").concat(spec.asset.width, "x").concat(spec.asset.height, ".").concat(spec.asset.format), baseUrl = "".concat(cdnUrl, "/images/").concat(spec.projectId, "/").concat(spec.dataset, "/").concat(filename), params = [];
|
|
340
|
+
if (spec.rect) {
|
|
341
|
+
var _a = spec.rect, left = _a.left, top_1 = _a.top, width = _a.width, height = _a.height, isEffectiveCrop = left !== 0 || top_1 !== 0 || height !== spec.asset.height || width !== spec.asset.width;
|
|
342
|
+
isEffectiveCrop && params.push("rect=".concat(left, ",").concat(top_1, ",").concat(width, ",").concat(height));
|
|
259
343
|
}
|
|
344
|
+
spec.bg && params.push("bg=".concat(spec.bg)), spec.focalPoint && (params.push("fp-x=".concat(spec.focalPoint.x)), params.push("fp-y=".concat(spec.focalPoint.y)));
|
|
345
|
+
var flip = [spec.flipHorizontal && "h", spec.flipVertical && "v"].filter(Boolean).join("");
|
|
346
|
+
return flip && params.push("flip=".concat(flip)), exports2.SPEC_NAME_TO_URL_NAME_MAPPINGS.forEach(function(mapping) {
|
|
347
|
+
var specName = mapping[0], param = mapping[1];
|
|
348
|
+
typeof spec[specName] < "u" ? params.push("".concat(param, "=").concat(encodeURIComponent(spec[specName]))) : typeof spec[param] < "u" && params.push("".concat(param, "=").concat(encodeURIComponent(spec[param])));
|
|
349
|
+
}), params.length === 0 ? baseUrl : "".concat(baseUrl, "?").concat(params.join("&"));
|
|
260
350
|
}
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
// Map from spec name to url param name, and allow using the actual param name as an alternative
|
|
273
|
-
exports.SPEC_NAME_TO_URL_NAME_MAPPINGS.forEach(function (mapping) {
|
|
274
|
-
var specName = mapping[0],
|
|
275
|
-
param = mapping[1];
|
|
276
|
-
if (typeof spec[specName] !== 'undefined') {
|
|
277
|
-
params.push("".concat(param, "=").concat(encodeURIComponent(spec[specName])));
|
|
278
|
-
} else if (typeof spec[param] !== 'undefined') {
|
|
279
|
-
params.push("".concat(param, "=").concat(encodeURIComponent(spec[param])));
|
|
351
|
+
function fit(source, spec) {
|
|
352
|
+
var cropRect, imgWidth = spec.width, imgHeight = spec.height;
|
|
353
|
+
if (!(imgWidth && imgHeight))
|
|
354
|
+
return { width: imgWidth, height: imgHeight, rect: source.crop };
|
|
355
|
+
var crop = source.crop, hotspot = source.hotspot, desiredAspectRatio = imgWidth / imgHeight, cropAspectRatio = crop.width / crop.height;
|
|
356
|
+
if (cropAspectRatio > desiredAspectRatio) {
|
|
357
|
+
var height = Math.round(crop.height), width = Math.round(height * desiredAspectRatio), top_2 = Math.max(0, Math.round(crop.top)), hotspotXCenter = Math.round((hotspot.right - hotspot.left) / 2 + hotspot.left), left = Math.max(0, Math.round(hotspotXCenter - width / 2));
|
|
358
|
+
left < crop.left ? left = crop.left : left + width > crop.left + crop.width && (left = crop.left + crop.width - width), cropRect = { left, top: top_2, width, height };
|
|
359
|
+
} else {
|
|
360
|
+
var width = crop.width, height = Math.round(width / desiredAspectRatio), left = Math.max(0, Math.round(crop.left)), hotspotYCenter = Math.round((hotspot.bottom - hotspot.top) / 2 + hotspot.top), top_3 = Math.max(0, Math.round(hotspotYCenter - height / 2));
|
|
361
|
+
top_3 < crop.top ? top_3 = crop.top : top_3 + height > crop.top + crop.height && (top_3 = crop.top + crop.height - height), cropRect = { left, top: top_3, width, height };
|
|
280
362
|
}
|
|
281
|
-
});
|
|
282
|
-
if (params.length === 0) {
|
|
283
|
-
return baseUrl;
|
|
284
|
-
}
|
|
285
|
-
return "".concat(baseUrl, "?").concat(params.join('&'));
|
|
286
|
-
}
|
|
287
|
-
function fit(source, spec) {
|
|
288
|
-
var cropRect;
|
|
289
|
-
var imgWidth = spec.width;
|
|
290
|
-
var imgHeight = spec.height;
|
|
291
|
-
// If we are not constraining the aspect ratio, we'll just use the whole crop
|
|
292
|
-
if (!(imgWidth && imgHeight)) {
|
|
293
363
|
return {
|
|
294
364
|
width: imgWidth,
|
|
295
365
|
height: imgHeight,
|
|
296
|
-
rect:
|
|
366
|
+
rect: cropRect
|
|
297
367
|
};
|
|
298
368
|
}
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
var
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
var hotspotXCenter = Math.round((hotspot.right - hotspot.left) / 2 + hotspot.left);
|
|
311
|
-
var left = Math.max(0, Math.round(hotspotXCenter - width / 2));
|
|
312
|
-
// Keep output within crop
|
|
313
|
-
if (left < crop.left) {
|
|
314
|
-
left = crop.left;
|
|
315
|
-
} else if (left + width > crop.left + crop.width) {
|
|
316
|
-
left = crop.left + crop.width - width;
|
|
317
|
-
}
|
|
318
|
-
cropRect = {
|
|
319
|
-
left: left,
|
|
320
|
-
top: top_2,
|
|
321
|
-
width: width,
|
|
322
|
-
height: height
|
|
323
|
-
};
|
|
324
|
-
} else {
|
|
325
|
-
// The crop is taller than the desired ratio, we are cutting from top and bottom
|
|
326
|
-
var width = crop.width;
|
|
327
|
-
var height = Math.round(width / desiredAspectRatio);
|
|
328
|
-
var left = Math.max(0, Math.round(crop.left));
|
|
329
|
-
// Center output vertically over hotspot
|
|
330
|
-
var hotspotYCenter = Math.round((hotspot.bottom - hotspot.top) / 2 + hotspot.top);
|
|
331
|
-
var top_3 = Math.max(0, Math.round(hotspotYCenter - height / 2));
|
|
332
|
-
// Keep output rect within crop
|
|
333
|
-
if (top_3 < crop.top) {
|
|
334
|
-
top_3 = crop.top;
|
|
335
|
-
} else if (top_3 + height > crop.top + crop.height) {
|
|
336
|
-
top_3 = crop.top + crop.height - height;
|
|
369
|
+
}(urlForImage)), urlForImage;
|
|
370
|
+
}
|
|
371
|
+
var hasRequiredBuilder;
|
|
372
|
+
function requireBuilder() {
|
|
373
|
+
if (hasRequiredBuilder) return builder;
|
|
374
|
+
hasRequiredBuilder = 1;
|
|
375
|
+
var __assign = builder && builder.__assign || function() {
|
|
376
|
+
return __assign = Object.assign || function(t) {
|
|
377
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
378
|
+
s = arguments[i];
|
|
379
|
+
for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && (t[p] = s[p]);
|
|
337
380
|
}
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
381
|
+
return t;
|
|
382
|
+
}, __assign.apply(this, arguments);
|
|
383
|
+
}, __createBinding = builder && builder.__createBinding || (Object.create ? function(o, m, k, k2) {
|
|
384
|
+
k2 === void 0 && (k2 = k), Object.defineProperty(o, k2, { enumerable: !0, get: function() {
|
|
385
|
+
return m[k];
|
|
386
|
+
} });
|
|
387
|
+
} : function(o, m, k, k2) {
|
|
388
|
+
k2 === void 0 && (k2 = k), o[k2] = m[k];
|
|
389
|
+
}), __setModuleDefault = builder && builder.__setModuleDefault || (Object.create ? function(o, v) {
|
|
390
|
+
Object.defineProperty(o, "default", { enumerable: !0, value: v });
|
|
391
|
+
} : function(o, v) {
|
|
392
|
+
o.default = v;
|
|
393
|
+
}), __importStar = builder && builder.__importStar || function(mod) {
|
|
394
|
+
if (mod && mod.__esModule) return mod;
|
|
395
|
+
var result = {};
|
|
396
|
+
if (mod != null) for (var k in mod) k !== "default" && Object.prototype.hasOwnProperty.call(mod, k) && __createBinding(result, mod, k);
|
|
397
|
+
return __setModuleDefault(result, mod), result;
|
|
398
|
+
};
|
|
399
|
+
Object.defineProperty(builder, "__esModule", { value: !0 }), builder.ImageUrlBuilder = void 0;
|
|
400
|
+
var urlForImage_1 = __importStar(requireUrlForImage()), validFits = ["clip", "crop", "fill", "fillmax", "max", "scale", "min"], validCrops = ["top", "bottom", "left", "right", "center", "focalpoint", "entropy"], validAutoModes = ["format"];
|
|
401
|
+
function isSanityModernClientLike(client) {
|
|
402
|
+
return client && "config" in client ? typeof client.config == "function" : !1;
|
|
403
|
+
}
|
|
404
|
+
function isSanityClientLike(client) {
|
|
405
|
+
return client && "clientConfig" in client ? typeof client.clientConfig == "object" : !1;
|
|
350
406
|
}
|
|
351
|
-
|
|
352
|
-
var
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
407
|
+
function rewriteSpecName(key) {
|
|
408
|
+
for (var specs = urlForImage_1.SPEC_NAME_TO_URL_NAME_MAPPINGS, _i = 0, specs_1 = specs; _i < specs_1.length; _i++) {
|
|
409
|
+
var entry = specs_1[_i], specName = entry[0], param = entry[1];
|
|
410
|
+
if (key === specName || key === param)
|
|
411
|
+
return specName;
|
|
357
412
|
}
|
|
358
|
-
return
|
|
359
|
-
}
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
var
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
413
|
+
return key;
|
|
414
|
+
}
|
|
415
|
+
function urlBuilder(options) {
|
|
416
|
+
if (isSanityModernClientLike(options)) {
|
|
417
|
+
var _a = options.config(), apiUrl = _a.apiHost, projectId = _a.projectId, dataset = _a.dataset, apiHost = apiUrl || "https://api.sanity.io";
|
|
418
|
+
return new ImageUrlBuilder(null, {
|
|
419
|
+
baseUrl: apiHost.replace(/^https:\/\/api\./, "https://cdn."),
|
|
420
|
+
projectId,
|
|
421
|
+
dataset
|
|
422
|
+
});
|
|
368
423
|
}
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
value: v
|
|
378
|
-
});
|
|
379
|
-
} : function (o, v) {
|
|
380
|
-
o["default"] = v;
|
|
381
|
-
});
|
|
382
|
-
var __importStar = commonjsGlobal && commonjsGlobal.__importStar || function (mod) {
|
|
383
|
-
if (mod && mod.__esModule) return mod;
|
|
384
|
-
var result = {};
|
|
385
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
386
|
-
__setModuleDefault(result, mod);
|
|
387
|
-
return result;
|
|
388
|
-
};
|
|
389
|
-
Object.defineProperty(builder, "__esModule", {
|
|
390
|
-
value: true
|
|
391
|
-
});
|
|
392
|
-
builder.ImageUrlBuilder = void 0;
|
|
393
|
-
var urlForImage_1 = __importStar(urlForImage);
|
|
394
|
-
var validFits = ['clip', 'crop', 'fill', 'fillmax', 'max', 'scale', 'min'];
|
|
395
|
-
var validCrops = ['top', 'bottom', 'left', 'right', 'center', 'focalpoint', 'entropy'];
|
|
396
|
-
var validAutoModes = ['format'];
|
|
397
|
-
function isSanityModernClientLike(client) {
|
|
398
|
-
return client && 'config' in client ? typeof client.config === 'function' : false;
|
|
399
|
-
}
|
|
400
|
-
function isSanityClientLike(client) {
|
|
401
|
-
return client && 'clientConfig' in client ? typeof client.clientConfig === 'object' : false;
|
|
402
|
-
}
|
|
403
|
-
function rewriteSpecName(key) {
|
|
404
|
-
var specs = urlForImage_1.SPEC_NAME_TO_URL_NAME_MAPPINGS;
|
|
405
|
-
for (var _i = 0, specs_1 = specs; _i < specs_1.length; _i++) {
|
|
406
|
-
var entry = specs_1[_i];
|
|
407
|
-
var specName = entry[0],
|
|
408
|
-
param = entry[1];
|
|
409
|
-
if (key === specName || key === param) {
|
|
410
|
-
return specName;
|
|
424
|
+
var client = options;
|
|
425
|
+
if (isSanityClientLike(client)) {
|
|
426
|
+
var _b = client.clientConfig, apiUrl = _b.apiHost, projectId = _b.projectId, dataset = _b.dataset, apiHost = apiUrl || "https://api.sanity.io";
|
|
427
|
+
return new ImageUrlBuilder(null, {
|
|
428
|
+
baseUrl: apiHost.replace(/^https:\/\/api\./, "https://cdn."),
|
|
429
|
+
projectId,
|
|
430
|
+
dataset
|
|
431
|
+
});
|
|
411
432
|
}
|
|
433
|
+
return new ImageUrlBuilder(null, options);
|
|
412
434
|
}
|
|
413
|
-
|
|
435
|
+
builder.default = urlBuilder;
|
|
436
|
+
var ImageUrlBuilder = (
|
|
437
|
+
/** @class */
|
|
438
|
+
function() {
|
|
439
|
+
function ImageUrlBuilder2(parent, options) {
|
|
440
|
+
this.options = parent ? __assign(__assign({}, parent.options || {}), options || {}) : __assign({}, options || {});
|
|
441
|
+
}
|
|
442
|
+
return ImageUrlBuilder2.prototype.withOptions = function(options) {
|
|
443
|
+
var baseUrl = options.baseUrl || this.options.baseUrl, newOptions = { baseUrl };
|
|
444
|
+
for (var key in options)
|
|
445
|
+
if (options.hasOwnProperty(key)) {
|
|
446
|
+
var specKey = rewriteSpecName(key);
|
|
447
|
+
newOptions[specKey] = options[key];
|
|
448
|
+
}
|
|
449
|
+
return new ImageUrlBuilder2(this, __assign({ baseUrl }, newOptions));
|
|
450
|
+
}, ImageUrlBuilder2.prototype.image = function(source) {
|
|
451
|
+
return this.withOptions({ source });
|
|
452
|
+
}, ImageUrlBuilder2.prototype.dataset = function(dataset) {
|
|
453
|
+
return this.withOptions({ dataset });
|
|
454
|
+
}, ImageUrlBuilder2.prototype.projectId = function(projectId) {
|
|
455
|
+
return this.withOptions({ projectId });
|
|
456
|
+
}, ImageUrlBuilder2.prototype.bg = function(bg) {
|
|
457
|
+
return this.withOptions({ bg });
|
|
458
|
+
}, ImageUrlBuilder2.prototype.dpr = function(dpr) {
|
|
459
|
+
return this.withOptions(dpr && dpr !== 1 ? { dpr } : {});
|
|
460
|
+
}, ImageUrlBuilder2.prototype.width = function(width) {
|
|
461
|
+
return this.withOptions({ width });
|
|
462
|
+
}, ImageUrlBuilder2.prototype.height = function(height) {
|
|
463
|
+
return this.withOptions({ height });
|
|
464
|
+
}, ImageUrlBuilder2.prototype.focalPoint = function(x, y) {
|
|
465
|
+
return this.withOptions({ focalPoint: { x, y } });
|
|
466
|
+
}, ImageUrlBuilder2.prototype.maxWidth = function(maxWidth) {
|
|
467
|
+
return this.withOptions({ maxWidth });
|
|
468
|
+
}, ImageUrlBuilder2.prototype.minWidth = function(minWidth) {
|
|
469
|
+
return this.withOptions({ minWidth });
|
|
470
|
+
}, ImageUrlBuilder2.prototype.maxHeight = function(maxHeight) {
|
|
471
|
+
return this.withOptions({ maxHeight });
|
|
472
|
+
}, ImageUrlBuilder2.prototype.minHeight = function(minHeight) {
|
|
473
|
+
return this.withOptions({ minHeight });
|
|
474
|
+
}, ImageUrlBuilder2.prototype.size = function(width, height) {
|
|
475
|
+
return this.withOptions({ width, height });
|
|
476
|
+
}, ImageUrlBuilder2.prototype.blur = function(blur) {
|
|
477
|
+
return this.withOptions({ blur });
|
|
478
|
+
}, ImageUrlBuilder2.prototype.sharpen = function(sharpen) {
|
|
479
|
+
return this.withOptions({ sharpen });
|
|
480
|
+
}, ImageUrlBuilder2.prototype.rect = function(left, top, width, height) {
|
|
481
|
+
return this.withOptions({ rect: { left, top, width, height } });
|
|
482
|
+
}, ImageUrlBuilder2.prototype.format = function(format) {
|
|
483
|
+
return this.withOptions({ format });
|
|
484
|
+
}, ImageUrlBuilder2.prototype.invert = function(invert) {
|
|
485
|
+
return this.withOptions({ invert });
|
|
486
|
+
}, ImageUrlBuilder2.prototype.orientation = function(orientation) {
|
|
487
|
+
return this.withOptions({ orientation });
|
|
488
|
+
}, ImageUrlBuilder2.prototype.quality = function(quality) {
|
|
489
|
+
return this.withOptions({ quality });
|
|
490
|
+
}, ImageUrlBuilder2.prototype.forceDownload = function(download) {
|
|
491
|
+
return this.withOptions({ download });
|
|
492
|
+
}, ImageUrlBuilder2.prototype.flipHorizontal = function() {
|
|
493
|
+
return this.withOptions({ flipHorizontal: !0 });
|
|
494
|
+
}, ImageUrlBuilder2.prototype.flipVertical = function() {
|
|
495
|
+
return this.withOptions({ flipVertical: !0 });
|
|
496
|
+
}, ImageUrlBuilder2.prototype.ignoreImageParams = function() {
|
|
497
|
+
return this.withOptions({ ignoreImageParams: !0 });
|
|
498
|
+
}, ImageUrlBuilder2.prototype.fit = function(value) {
|
|
499
|
+
if (validFits.indexOf(value) === -1)
|
|
500
|
+
throw new Error('Invalid fit mode "'.concat(value, '"'));
|
|
501
|
+
return this.withOptions({ fit: value });
|
|
502
|
+
}, ImageUrlBuilder2.prototype.crop = function(value) {
|
|
503
|
+
if (validCrops.indexOf(value) === -1)
|
|
504
|
+
throw new Error('Invalid crop mode "'.concat(value, '"'));
|
|
505
|
+
return this.withOptions({ crop: value });
|
|
506
|
+
}, ImageUrlBuilder2.prototype.saturation = function(saturation) {
|
|
507
|
+
return this.withOptions({ saturation });
|
|
508
|
+
}, ImageUrlBuilder2.prototype.auto = function(value) {
|
|
509
|
+
if (validAutoModes.indexOf(value) === -1)
|
|
510
|
+
throw new Error('Invalid auto mode "'.concat(value, '"'));
|
|
511
|
+
return this.withOptions({ auto: value });
|
|
512
|
+
}, ImageUrlBuilder2.prototype.pad = function(pad) {
|
|
513
|
+
return this.withOptions({ pad });
|
|
514
|
+
}, ImageUrlBuilder2.prototype.url = function() {
|
|
515
|
+
return (0, urlForImage_1.default)(this.options);
|
|
516
|
+
}, ImageUrlBuilder2.prototype.toString = function() {
|
|
517
|
+
return this.url();
|
|
518
|
+
}, ImageUrlBuilder2;
|
|
519
|
+
}()
|
|
520
|
+
);
|
|
521
|
+
return builder.ImageUrlBuilder = ImageUrlBuilder, builder;
|
|
414
522
|
}
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
if (
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
var apiHost = apiUrl || 'https://api.sanity.io';
|
|
424
|
-
return new ImageUrlBuilder(null, {
|
|
425
|
-
baseUrl: apiHost.replace(/^https:\/\/api\./, 'https://cdn.'),
|
|
426
|
-
projectId: projectId,
|
|
427
|
-
dataset: dataset
|
|
428
|
-
});
|
|
429
|
-
}
|
|
430
|
-
// Did we get a SanityClient?
|
|
431
|
-
var client = options;
|
|
432
|
-
if (isSanityClientLike(client)) {
|
|
433
|
-
// Inherit config from client
|
|
434
|
-
var _b = client.clientConfig,
|
|
435
|
-
apiUrl = _b.apiHost,
|
|
436
|
-
projectId = _b.projectId,
|
|
437
|
-
dataset = _b.dataset;
|
|
438
|
-
var apiHost = apiUrl || 'https://api.sanity.io';
|
|
439
|
-
return new ImageUrlBuilder(null, {
|
|
440
|
-
baseUrl: apiHost.replace(/^https:\/\/api\./, 'https://cdn.'),
|
|
441
|
-
projectId: projectId,
|
|
442
|
-
dataset: dataset
|
|
443
|
-
});
|
|
444
|
-
}
|
|
445
|
-
// Or just accept the options as given
|
|
446
|
-
return new ImageUrlBuilder(null, options);
|
|
523
|
+
var node, hasRequiredNode;
|
|
524
|
+
function requireNode() {
|
|
525
|
+
if (hasRequiredNode) return node;
|
|
526
|
+
hasRequiredNode = 1;
|
|
527
|
+
var __importDefault = node && node.__importDefault || function(mod) {
|
|
528
|
+
return mod && mod.__esModule ? mod : { default: mod };
|
|
529
|
+
}, builder_1 = __importDefault(requireBuilder());
|
|
530
|
+
return node = builder_1.default, node;
|
|
447
531
|
}
|
|
448
|
-
|
|
449
|
-
var ImageUrlBuilder = /** @class */function () {
|
|
450
|
-
function ImageUrlBuilder(parent, options) {
|
|
451
|
-
this.options = parent ? __assign(__assign({}, parent.options || {}), options || {}) : __assign({}, options || {}); // Copy options
|
|
452
|
-
}
|
|
453
|
-
ImageUrlBuilder.prototype.withOptions = function (options) {
|
|
454
|
-
var baseUrl = options.baseUrl || this.options.baseUrl;
|
|
455
|
-
var newOptions = {
|
|
456
|
-
baseUrl: baseUrl
|
|
457
|
-
};
|
|
458
|
-
for (var key in options) {
|
|
459
|
-
if (options.hasOwnProperty(key)) {
|
|
460
|
-
var specKey = rewriteSpecName(key);
|
|
461
|
-
newOptions[specKey] = options[key];
|
|
462
|
-
}
|
|
463
|
-
}
|
|
464
|
-
return new ImageUrlBuilder(this, __assign({
|
|
465
|
-
baseUrl: baseUrl
|
|
466
|
-
}, newOptions));
|
|
467
|
-
};
|
|
468
|
-
// The image to be represented. Accepts a Sanity 'image'-document, 'asset'-document or
|
|
469
|
-
// _id of asset. To get the benefit of automatic hot-spot/crop integration with the content
|
|
470
|
-
// studio, the 'image'-document must be provided.
|
|
471
|
-
ImageUrlBuilder.prototype.image = function (source) {
|
|
472
|
-
return this.withOptions({
|
|
473
|
-
source: source
|
|
474
|
-
});
|
|
475
|
-
};
|
|
476
|
-
// Specify the dataset
|
|
477
|
-
ImageUrlBuilder.prototype.dataset = function (dataset) {
|
|
478
|
-
return this.withOptions({
|
|
479
|
-
dataset: dataset
|
|
480
|
-
});
|
|
481
|
-
};
|
|
482
|
-
// Specify the projectId
|
|
483
|
-
ImageUrlBuilder.prototype.projectId = function (projectId) {
|
|
484
|
-
return this.withOptions({
|
|
485
|
-
projectId: projectId
|
|
486
|
-
});
|
|
487
|
-
};
|
|
488
|
-
// Specify background color
|
|
489
|
-
ImageUrlBuilder.prototype.bg = function (bg) {
|
|
490
|
-
return this.withOptions({
|
|
491
|
-
bg: bg
|
|
492
|
-
});
|
|
493
|
-
};
|
|
494
|
-
// Set DPR scaling factor
|
|
495
|
-
ImageUrlBuilder.prototype.dpr = function (dpr) {
|
|
496
|
-
// A DPR of 1 is the default - so only include it if we have a different value
|
|
497
|
-
return this.withOptions(dpr && dpr !== 1 ? {
|
|
498
|
-
dpr: dpr
|
|
499
|
-
} : {});
|
|
500
|
-
};
|
|
501
|
-
// Specify the width of the image in pixels
|
|
502
|
-
ImageUrlBuilder.prototype.width = function (width) {
|
|
503
|
-
return this.withOptions({
|
|
504
|
-
width: width
|
|
505
|
-
});
|
|
506
|
-
};
|
|
507
|
-
// Specify the height of the image in pixels
|
|
508
|
-
ImageUrlBuilder.prototype.height = function (height) {
|
|
509
|
-
return this.withOptions({
|
|
510
|
-
height: height
|
|
511
|
-
});
|
|
512
|
-
};
|
|
513
|
-
// Specify focal point in fraction of image dimensions. Each component 0.0-1.0
|
|
514
|
-
ImageUrlBuilder.prototype.focalPoint = function (x, y) {
|
|
515
|
-
return this.withOptions({
|
|
516
|
-
focalPoint: {
|
|
517
|
-
x: x,
|
|
518
|
-
y: y
|
|
519
|
-
}
|
|
520
|
-
});
|
|
521
|
-
};
|
|
522
|
-
ImageUrlBuilder.prototype.maxWidth = function (maxWidth) {
|
|
523
|
-
return this.withOptions({
|
|
524
|
-
maxWidth: maxWidth
|
|
525
|
-
});
|
|
526
|
-
};
|
|
527
|
-
ImageUrlBuilder.prototype.minWidth = function (minWidth) {
|
|
528
|
-
return this.withOptions({
|
|
529
|
-
minWidth: minWidth
|
|
530
|
-
});
|
|
531
|
-
};
|
|
532
|
-
ImageUrlBuilder.prototype.maxHeight = function (maxHeight) {
|
|
533
|
-
return this.withOptions({
|
|
534
|
-
maxHeight: maxHeight
|
|
535
|
-
});
|
|
536
|
-
};
|
|
537
|
-
ImageUrlBuilder.prototype.minHeight = function (minHeight) {
|
|
538
|
-
return this.withOptions({
|
|
539
|
-
minHeight: minHeight
|
|
540
|
-
});
|
|
541
|
-
};
|
|
542
|
-
// Specify width and height in pixels
|
|
543
|
-
ImageUrlBuilder.prototype.size = function (width, height) {
|
|
544
|
-
return this.withOptions({
|
|
545
|
-
width: width,
|
|
546
|
-
height: height
|
|
547
|
-
});
|
|
548
|
-
};
|
|
549
|
-
// Specify blur between 0 and 100
|
|
550
|
-
ImageUrlBuilder.prototype.blur = function (blur) {
|
|
551
|
-
return this.withOptions({
|
|
552
|
-
blur: blur
|
|
553
|
-
});
|
|
554
|
-
};
|
|
555
|
-
ImageUrlBuilder.prototype.sharpen = function (sharpen) {
|
|
556
|
-
return this.withOptions({
|
|
557
|
-
sharpen: sharpen
|
|
558
|
-
});
|
|
559
|
-
};
|
|
560
|
-
// Specify the desired rectangle of the image
|
|
561
|
-
ImageUrlBuilder.prototype.rect = function (left, top, width, height) {
|
|
562
|
-
return this.withOptions({
|
|
563
|
-
rect: {
|
|
564
|
-
left: left,
|
|
565
|
-
top: top,
|
|
566
|
-
width: width,
|
|
567
|
-
height: height
|
|
568
|
-
}
|
|
569
|
-
});
|
|
570
|
-
};
|
|
571
|
-
// Specify the image format of the image. 'jpg', 'pjpg', 'png', 'webp'
|
|
572
|
-
ImageUrlBuilder.prototype.format = function (format) {
|
|
573
|
-
return this.withOptions({
|
|
574
|
-
format: format
|
|
575
|
-
});
|
|
576
|
-
};
|
|
577
|
-
ImageUrlBuilder.prototype.invert = function (invert) {
|
|
578
|
-
return this.withOptions({
|
|
579
|
-
invert: invert
|
|
580
|
-
});
|
|
581
|
-
};
|
|
582
|
-
// Rotation in degrees 0, 90, 180, 270
|
|
583
|
-
ImageUrlBuilder.prototype.orientation = function (orientation) {
|
|
584
|
-
return this.withOptions({
|
|
585
|
-
orientation: orientation
|
|
586
|
-
});
|
|
587
|
-
};
|
|
588
|
-
// Compression quality 0-100
|
|
589
|
-
ImageUrlBuilder.prototype.quality = function (quality) {
|
|
590
|
-
return this.withOptions({
|
|
591
|
-
quality: quality
|
|
592
|
-
});
|
|
593
|
-
};
|
|
594
|
-
// Make it a download link. Parameter is default filename.
|
|
595
|
-
ImageUrlBuilder.prototype.forceDownload = function (download) {
|
|
596
|
-
return this.withOptions({
|
|
597
|
-
download: download
|
|
598
|
-
});
|
|
599
|
-
};
|
|
600
|
-
// Flip image horizontally
|
|
601
|
-
ImageUrlBuilder.prototype.flipHorizontal = function () {
|
|
602
|
-
return this.withOptions({
|
|
603
|
-
flipHorizontal: true
|
|
604
|
-
});
|
|
605
|
-
};
|
|
606
|
-
// Flip image vertically
|
|
607
|
-
ImageUrlBuilder.prototype.flipVertical = function () {
|
|
608
|
-
return this.withOptions({
|
|
609
|
-
flipVertical: true
|
|
610
|
-
});
|
|
611
|
-
};
|
|
612
|
-
// Ignore crop/hotspot from image record, even when present
|
|
613
|
-
ImageUrlBuilder.prototype.ignoreImageParams = function () {
|
|
614
|
-
return this.withOptions({
|
|
615
|
-
ignoreImageParams: true
|
|
616
|
-
});
|
|
617
|
-
};
|
|
618
|
-
ImageUrlBuilder.prototype.fit = function (value) {
|
|
619
|
-
if (validFits.indexOf(value) === -1) {
|
|
620
|
-
throw new Error("Invalid fit mode \"".concat(value, "\""));
|
|
621
|
-
}
|
|
622
|
-
return this.withOptions({
|
|
623
|
-
fit: value
|
|
624
|
-
});
|
|
625
|
-
};
|
|
626
|
-
ImageUrlBuilder.prototype.crop = function (value) {
|
|
627
|
-
if (validCrops.indexOf(value) === -1) {
|
|
628
|
-
throw new Error("Invalid crop mode \"".concat(value, "\""));
|
|
629
|
-
}
|
|
630
|
-
return this.withOptions({
|
|
631
|
-
crop: value
|
|
632
|
-
});
|
|
633
|
-
};
|
|
634
|
-
// Saturation
|
|
635
|
-
ImageUrlBuilder.prototype.saturation = function (saturation) {
|
|
636
|
-
return this.withOptions({
|
|
637
|
-
saturation: saturation
|
|
638
|
-
});
|
|
639
|
-
};
|
|
640
|
-
ImageUrlBuilder.prototype.auto = function (value) {
|
|
641
|
-
if (validAutoModes.indexOf(value) === -1) {
|
|
642
|
-
throw new Error("Invalid auto mode \"".concat(value, "\""));
|
|
643
|
-
}
|
|
644
|
-
return this.withOptions({
|
|
645
|
-
auto: value
|
|
646
|
-
});
|
|
647
|
-
};
|
|
648
|
-
// Specify the number of pixels to pad the image
|
|
649
|
-
ImageUrlBuilder.prototype.pad = function (pad) {
|
|
650
|
-
return this.withOptions({
|
|
651
|
-
pad: pad
|
|
652
|
-
});
|
|
653
|
-
};
|
|
654
|
-
// Gets the url based on the submitted parameters
|
|
655
|
-
ImageUrlBuilder.prototype.url = function () {
|
|
656
|
-
return (0, urlForImage_1.default)(this.options);
|
|
657
|
-
};
|
|
658
|
-
// Alias for url()
|
|
659
|
-
ImageUrlBuilder.prototype.toString = function () {
|
|
660
|
-
return this.url();
|
|
661
|
-
};
|
|
662
|
-
return ImageUrlBuilder;
|
|
663
|
-
}();
|
|
664
|
-
builder.ImageUrlBuilder = ImageUrlBuilder;
|
|
665
|
-
var __importDefault = commonjsGlobal && commonjsGlobal.__importDefault || function (mod) {
|
|
666
|
-
return mod && mod.__esModule ? mod : {
|
|
667
|
-
"default": mod
|
|
668
|
-
};
|
|
669
|
-
};
|
|
670
|
-
var builder_1 = __importDefault(builder);
|
|
671
|
-
var node = builder_1.default;
|
|
672
|
-
var createImageUrlBuilder = /*@__PURE__*/getDefaultExportFromCjs(node);
|
|
532
|
+
var nodeExports = /* @__PURE__ */ requireNode(), createImageUrlBuilder = /* @__PURE__ */ getDefaultExportFromCjs(nodeExports);
|
|
673
533
|
function useImageUrlBuilder(clientOptions) {
|
|
674
534
|
const client = sanity.useClient(clientOptions);
|
|
675
|
-
|
|
676
|
-
return builder;
|
|
535
|
+
return react.useMemo(() => createImageUrlBuilder(client), [client]);
|
|
677
536
|
}
|
|
678
537
|
function useImageUrlBuilderImage(source, clientOptions) {
|
|
679
|
-
const
|
|
680
|
-
|
|
681
|
-
|
|
538
|
+
const builder2 = useImageUrlBuilder(clientOptions);
|
|
539
|
+
return react.useMemo(
|
|
540
|
+
() => source && builder2 ? builder2.image(source) : null,
|
|
541
|
+
[builder2, source]
|
|
542
|
+
);
|
|
682
543
|
}
|
|
683
|
-
const DEFAULT_PARAMS = {};
|
|
684
|
-
const DEFAULT_OPTIONS = {
|
|
685
|
-
apiVersion: "v2023-05-01"
|
|
686
|
-
};
|
|
687
|
-
const DEFAULT_INITIAL_VALUE = null;
|
|
544
|
+
const DEFAULT_PARAMS = {}, DEFAULT_OPTIONS = { apiVersion: "v2023-05-01" }, DEFAULT_INITIAL_VALUE = null;
|
|
688
545
|
function useParams(params) {
|
|
689
|
-
const stringifiedParams =
|
|
690
|
-
|
|
546
|
+
const stringifiedParams = react.useMemo(
|
|
547
|
+
() => JSON.stringify(params || {}),
|
|
548
|
+
[params]
|
|
549
|
+
);
|
|
550
|
+
return react.useMemo(() => JSON.parse(stringifiedParams), [stringifiedParams]);
|
|
691
551
|
}
|
|
692
|
-
function useListeningQuery(query,
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
const [data, setData] = React.useState(initialValue);
|
|
701
|
-
const memoParams = useParams(params);
|
|
702
|
-
const memoOptions = useParams(options);
|
|
703
|
-
const subscription = React.useRef(null);
|
|
704
|
-
const documentStore = sanity.useDocumentStore();
|
|
705
|
-
React.useEffect(() => {
|
|
706
|
-
if (query && !error && !subscription.current) {
|
|
552
|
+
function useListeningQuery(query, {
|
|
553
|
+
params = DEFAULT_PARAMS,
|
|
554
|
+
options = DEFAULT_OPTIONS,
|
|
555
|
+
initialValue = DEFAULT_INITIAL_VALUE
|
|
556
|
+
}) {
|
|
557
|
+
const [loading, setLoading] = react.useState(!0), [error, setError] = react.useState(!1), [data, setData] = react.useState(initialValue), memoParams = useParams(params), memoOptions = useParams(options), subscription = react.useRef(null), documentStore = sanity.useDocumentStore();
|
|
558
|
+
return react.useEffect(() => {
|
|
559
|
+
if (query && !error && !subscription.current)
|
|
707
560
|
try {
|
|
708
|
-
subscription.current = documentStore.listenQuery(query, memoParams, memoOptions).pipe(
|
|
709
|
-
|
|
710
|
-
setError(err)
|
|
711
|
-
|
|
712
|
-
setData(
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
setData(current => isEqual__default.default(current, documents) ? current : documents);
|
|
716
|
-
setLoading(false);
|
|
717
|
-
setError(false);
|
|
561
|
+
subscription.current = documentStore.listenQuery(query, memoParams, memoOptions).pipe(
|
|
562
|
+
operators.distinctUntilChanged(isEqual__default.default),
|
|
563
|
+
operators.catchError((err) => (console.error(err), setError(err), setLoading(!1), setData(null), err))
|
|
564
|
+
).subscribe((documents) => {
|
|
565
|
+
setData(
|
|
566
|
+
(current) => isEqual__default.default(current, documents) ? current : documents
|
|
567
|
+
), setLoading(!1), setError(!1);
|
|
718
568
|
});
|
|
719
569
|
} catch (err) {
|
|
720
|
-
console.error(err);
|
|
721
|
-
setLoading(false);
|
|
722
|
-
setError(err);
|
|
570
|
+
console.error(err), setLoading(!1), setError(err);
|
|
723
571
|
}
|
|
724
|
-
|
|
725
|
-
if (error && subscription.current) {
|
|
726
|
-
subscription.current.unsubscribe();
|
|
727
|
-
}
|
|
728
|
-
return () => {
|
|
572
|
+
return error && subscription.current && subscription.current.unsubscribe(), () => {
|
|
729
573
|
var _a;
|
|
730
|
-
|
|
731
|
-
(_a = subscription == null ? void 0 : subscription.current) == null ? void 0 : _a.unsubscribe();
|
|
732
|
-
subscription.current = null;
|
|
733
|
-
}
|
|
574
|
+
subscription.current && ((_a = subscription == null ? void 0 : subscription.current) == null || _a.unsubscribe(), subscription.current = null);
|
|
734
575
|
};
|
|
735
|
-
}, [query, error, memoParams, memoOptions, documentStore]);
|
|
736
|
-
return {
|
|
737
|
-
data,
|
|
738
|
-
loading,
|
|
739
|
-
error
|
|
740
|
-
};
|
|
741
|
-
}
|
|
742
|
-
function useProjectUsers(_ref2) {
|
|
743
|
-
let {
|
|
744
|
-
apiVersion
|
|
745
|
-
} = _ref2;
|
|
746
|
-
const {
|
|
747
|
-
currentUser
|
|
748
|
-
} = sanity.useWorkspace();
|
|
749
|
-
const client = sanity.useClient({
|
|
750
|
-
apiVersion: apiVersion != null ? apiVersion : "2023-01-01"
|
|
751
|
-
});
|
|
752
|
-
const [users, setUsers] = React.useState([]);
|
|
753
|
-
React.useEffect(() => {
|
|
754
|
-
const {
|
|
755
|
-
projectId
|
|
756
|
-
} = client.config();
|
|
757
|
-
async function getUser(id) {
|
|
758
|
-
const userDetails = await client.request({
|
|
759
|
-
url: "/projects/".concat(projectId, "/users/").concat(id)
|
|
760
|
-
});
|
|
761
|
-
return userDetails;
|
|
762
|
-
}
|
|
763
|
-
async function getUsersWithRoles() {
|
|
764
|
-
const userRoles = await client.request({
|
|
765
|
-
url: "/projects/".concat(projectId, "/acl")
|
|
766
|
-
}).then(async res => Promise.all(res.map(async user => ({
|
|
767
|
-
isCurrentUser: user.projectUserId === (currentUser == null ? void 0 : currentUser.id),
|
|
768
|
-
...(await getUser(user.projectUserId))
|
|
769
|
-
})))).catch(err => err);
|
|
770
|
-
setUsers(userRoles);
|
|
771
|
-
}
|
|
772
|
-
if (!users.length) {
|
|
773
|
-
getUsersWithRoles();
|
|
774
|
-
}
|
|
775
|
-
}, [client, currentUser == null ? void 0 : currentUser.id, users.length]);
|
|
776
|
-
return users;
|
|
576
|
+
}, [query, error, memoParams, memoOptions, documentStore]), { data, loading, error };
|
|
777
577
|
}
|
|
778
578
|
function useOpenInNewPane(id, type) {
|
|
779
|
-
const routerContext =
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
groupIndex
|
|
783
|
-
} = structure.usePaneRouter();
|
|
784
|
-
const openInNewPane = React__default.default.useCallback(() => {
|
|
785
|
-
if (!routerContext || !id || !type) {
|
|
579
|
+
const routerContext = react.useContext(router.RouterContext), { routerPanesState, groupIndex } = structure.usePaneRouter();
|
|
580
|
+
return react.useCallback(() => {
|
|
581
|
+
if (!routerContext || !id || !type)
|
|
786
582
|
return;
|
|
787
|
-
}
|
|
788
583
|
const panes = [...routerPanesState];
|
|
789
|
-
panes.splice(groupIndex + 1, 0, [
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
type
|
|
584
|
+
panes.splice(groupIndex + 1, 0, [
|
|
585
|
+
{
|
|
586
|
+
id,
|
|
587
|
+
params: { type }
|
|
793
588
|
}
|
|
794
|
-
|
|
795
|
-
const href = routerContext.resolvePathFromState({
|
|
796
|
-
|
|
797
|
-
});
|
|
798
|
-
routerContext.navigateUrl({
|
|
799
|
-
path: href
|
|
800
|
-
});
|
|
589
|
+
]);
|
|
590
|
+
const href = routerContext.resolvePathFromState({ panes });
|
|
591
|
+
routerContext.navigateUrl({ path: href });
|
|
801
592
|
}, [id, type, routerContext, routerPanesState, groupIndex]);
|
|
802
|
-
return openInNewPane;
|
|
803
|
-
}
|
|
804
|
-
const DEFAULT_PROPS = {
|
|
805
|
-
tone: "primary"
|
|
806
|
-
};
|
|
807
|
-
function Feedback(props) {
|
|
808
|
-
const {
|
|
809
|
-
title,
|
|
810
|
-
description,
|
|
811
|
-
icon,
|
|
812
|
-
tone,
|
|
813
|
-
children
|
|
814
|
-
} = {
|
|
815
|
-
...DEFAULT_PROPS,
|
|
816
|
-
...props
|
|
817
|
-
};
|
|
818
|
-
return /* @__PURE__ */jsxRuntime.jsx(ui.Card, {
|
|
819
|
-
tone,
|
|
820
|
-
padding: 4,
|
|
821
|
-
radius: 3,
|
|
822
|
-
border: true,
|
|
823
|
-
children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
|
|
824
|
-
children: [icon ? "display icon" : null, children ? children : /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
|
|
825
|
-
flex: 1,
|
|
826
|
-
children: /* @__PURE__ */jsxRuntime.jsxs(ui.Stack, {
|
|
827
|
-
space: 4,
|
|
828
|
-
children: [title ? /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
|
|
829
|
-
weight: "semibold",
|
|
830
|
-
children: title
|
|
831
|
-
}) : null, description ? /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
|
|
832
|
-
size: 2,
|
|
833
|
-
children: description
|
|
834
|
-
}) : null]
|
|
835
|
-
})
|
|
836
|
-
})]
|
|
837
|
-
})
|
|
838
|
-
});
|
|
839
593
|
}
|
|
840
|
-
var
|
|
841
|
-
var
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
const StyledTable = styled__default.default(TableWrapper)(() => styled.css(_a || (_a = __template(["\n display: table;\n width: 100%;\n border-collapse: collapse;\n\n &:not([hidden]) {\n display: table;\n border-collapse: collapse;\n }\n "]))));
|
|
854
|
-
function Table(props) {
|
|
855
|
-
const {
|
|
856
|
-
children,
|
|
857
|
-
...rest
|
|
858
|
-
} = props;
|
|
859
|
-
return /* @__PURE__ */jsxRuntime.jsx(StyledTable, {
|
|
860
|
-
...rest,
|
|
861
|
-
children
|
|
862
|
-
});
|
|
594
|
+
var __defProp = Object.defineProperty, __defProps = Object.defineProperties, __getOwnPropDescs = Object.getOwnPropertyDescriptors, __getOwnPropSymbols = Object.getOwnPropertySymbols, __hasOwnProp = Object.prototype.hasOwnProperty, __propIsEnum = Object.prototype.propertyIsEnumerable, __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __spreadValues = (a, b) => {
|
|
595
|
+
for (var prop in b || (b = {}))
|
|
596
|
+
__hasOwnProp.call(b, prop) && __defNormalProp(a, prop, b[prop]);
|
|
597
|
+
if (__getOwnPropSymbols)
|
|
598
|
+
for (var prop of __getOwnPropSymbols(b))
|
|
599
|
+
__propIsEnum.call(b, prop) && __defNormalProp(a, prop, b[prop]);
|
|
600
|
+
return a;
|
|
601
|
+
}, __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
602
|
+
function chunkArray(array, size) {
|
|
603
|
+
const chunks = [];
|
|
604
|
+
for (let i = 0; i < array.length; i += size)
|
|
605
|
+
chunks.push(array.slice(i, i + size));
|
|
606
|
+
return chunks;
|
|
863
607
|
}
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
return
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
const
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
};
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
children
|
|
898
|
-
});
|
|
899
|
-
}
|
|
900
|
-
function searchUsers(users, searchString) {
|
|
901
|
-
return users.filter(user => {
|
|
902
|
-
const displayName = (user.displayName || "").toLowerCase();
|
|
903
|
-
if (displayName.startsWith(searchString)) return true;
|
|
904
|
-
const givenName = (user.givenName || "").toLowerCase();
|
|
905
|
-
if (givenName.startsWith(searchString)) return true;
|
|
906
|
-
const middleName = (user.middleName || "").toLowerCase();
|
|
907
|
-
if (middleName.startsWith(searchString)) return true;
|
|
908
|
-
const familyName = (user.familyName || "").toLowerCase();
|
|
909
|
-
if (familyName.startsWith(searchString)) return true;
|
|
910
|
-
return false;
|
|
911
|
-
});
|
|
912
|
-
}
|
|
913
|
-
const LABELS = {
|
|
914
|
-
addMe: "Assign myself",
|
|
915
|
-
removeMe: "Unassign myself",
|
|
916
|
-
clear: "Clear assignees",
|
|
917
|
-
searchPlaceholder: "Search users",
|
|
918
|
-
notFound: "No users found"
|
|
919
|
-
};
|
|
920
|
-
function UserSelectMenu(props) {
|
|
921
|
-
const {
|
|
922
|
-
value = [],
|
|
923
|
-
userList = [],
|
|
924
|
-
onAdd,
|
|
925
|
-
onRemove,
|
|
926
|
-
onClear,
|
|
927
|
-
style = {}
|
|
928
|
-
} = props;
|
|
929
|
-
const labels = (props == null ? void 0 : props.labels) ? {
|
|
930
|
-
...LABELS,
|
|
931
|
-
...props.labels
|
|
932
|
-
} : LABELS;
|
|
933
|
-
const [searchString, setSearchString] = React__default.default.useState("");
|
|
934
|
-
const searchResults = searchUsers(userList || [], searchString);
|
|
935
|
-
const me = userList.find(u => u.isCurrentUser);
|
|
936
|
-
const meAssigned = me && value.includes(me.id);
|
|
937
|
-
const input = React.useRef(null);
|
|
938
|
-
const handleSearchChange = event => {
|
|
939
|
-
setSearchString(event.target.value);
|
|
940
|
-
};
|
|
941
|
-
const handleSelect = (isChecked, user) => {
|
|
942
|
-
if (!isChecked) {
|
|
943
|
-
if (onAdd) onAdd(user.id);
|
|
944
|
-
} else if (onRemove) onRemove(user.id);
|
|
945
|
-
};
|
|
946
|
-
const handleAssignMyself = () => {
|
|
947
|
-
if (me && onAdd) onAdd(me.id);
|
|
948
|
-
};
|
|
949
|
-
const handleUnassignMyself = () => {
|
|
950
|
-
if (me && onRemove) onRemove(me.id);
|
|
951
|
-
};
|
|
952
|
-
const handleClearAssigneesClick = () => {
|
|
953
|
-
if (onClear) onClear();
|
|
954
|
-
};
|
|
955
|
-
return /* @__PURE__ */jsxRuntime.jsxs(ui.Menu, {
|
|
956
|
-
style,
|
|
957
|
-
children: [meAssigned ? /* @__PURE__ */jsxRuntime.jsx(ui.MenuItem, {
|
|
958
|
-
tone: "caution",
|
|
959
|
-
disabled: !me,
|
|
960
|
-
onClick: handleUnassignMyself,
|
|
961
|
-
icon: icons.RemoveCircleIcon,
|
|
962
|
-
text: labels.removeMe
|
|
963
|
-
}) : /* @__PURE__ */jsxRuntime.jsx(ui.MenuItem, {
|
|
964
|
-
tone: "positive",
|
|
965
|
-
onClick: handleAssignMyself,
|
|
966
|
-
icon: icons.AddCircleIcon,
|
|
967
|
-
text: labels.addMe
|
|
968
|
-
}), /* @__PURE__ */jsxRuntime.jsx(ui.MenuItem, {
|
|
969
|
-
tone: "critical",
|
|
970
|
-
disabled: value.length === 0,
|
|
971
|
-
onClick: handleClearAssigneesClick,
|
|
972
|
-
icon: icons.RestoreIcon,
|
|
973
|
-
text: labels.clear
|
|
974
|
-
}), /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
|
|
975
|
-
padding: 1,
|
|
976
|
-
children: /* @__PURE__ */jsxRuntime.jsx(ui.TextInput, {
|
|
977
|
-
ref: input,
|
|
978
|
-
onChange: handleSearchChange,
|
|
979
|
-
placeholder: labels.searchPlaceholder,
|
|
980
|
-
value: searchString
|
|
981
|
-
})
|
|
982
|
-
}), searchString && (searchResults == null ? void 0 : searchResults.length) === 0 && /* @__PURE__ */jsxRuntime.jsx(ui.MenuItem, {
|
|
983
|
-
disabled: true,
|
|
984
|
-
text: labels.notFound
|
|
985
|
-
}), searchResults && searchResults.map(user => /* @__PURE__ */jsxRuntime.jsx(ui.MenuItem, {
|
|
986
|
-
pressed: value.includes(user.id),
|
|
987
|
-
onClick: () => handleSelect(value.indexOf(user.id) > -1, user),
|
|
988
|
-
children: /* @__PURE__ */jsxRuntime.jsxs(ui.Flex, {
|
|
989
|
-
align: "center",
|
|
990
|
-
children: [/* @__PURE__ */jsxRuntime.jsx(sanity.UserAvatar, {
|
|
991
|
-
user,
|
|
992
|
-
size: 1
|
|
993
|
-
}), /* @__PURE__ */jsxRuntime.jsx(ui.Box, {
|
|
994
|
-
paddingX: 2,
|
|
995
|
-
flex: 1,
|
|
996
|
-
children: /* @__PURE__ */jsxRuntime.jsx(ui.Text, {
|
|
997
|
-
children: user.displayName
|
|
998
|
-
})
|
|
999
|
-
}), user.isCurrentUser && /* @__PURE__ */jsxRuntime.jsx(ui.Badge, {
|
|
1000
|
-
fontSize: 1,
|
|
1001
|
-
tone: "positive",
|
|
1002
|
-
mode: "outline",
|
|
1003
|
-
children: "Me"
|
|
1004
|
-
})]
|
|
1005
|
-
})
|
|
1006
|
-
}, user.id))]
|
|
1007
|
-
});
|
|
608
|
+
function useProjectUsers({ apiVersion }) {
|
|
609
|
+
const { currentUser } = sanity.useWorkspace(), client = sanity.useClient({ apiVersion: apiVersion != null ? apiVersion : "2023-01-01" }), [users, setUsers] = react.useState([]);
|
|
610
|
+
return react.useEffect(() => {
|
|
611
|
+
const { projectId } = client.config();
|
|
612
|
+
async function getUsersWithRoles() {
|
|
613
|
+
try {
|
|
614
|
+
const aclData = await client.request({
|
|
615
|
+
url: `/projects/${projectId}/acl`
|
|
616
|
+
}), userIds = aclData.map((user) => user.projectUserId), userIdChunks = chunkArray(userIds, 200);
|
|
617
|
+
let usersData = [];
|
|
618
|
+
for (const chunk of userIdChunks) {
|
|
619
|
+
const chunkedUserIds = chunk.join(","), response = await client.request({
|
|
620
|
+
url: `/projects/${projectId}/users/${chunkedUserIds}`
|
|
621
|
+
});
|
|
622
|
+
usersData = [...usersData, ...response];
|
|
623
|
+
}
|
|
624
|
+
const usersWithRoles = usersData.map((user) => {
|
|
625
|
+
var _a;
|
|
626
|
+
const userRoles = ((_a = aclData.find(
|
|
627
|
+
(aclUser) => aclUser.projectUserId === user.id
|
|
628
|
+
)) == null ? void 0 : _a.roles) || [];
|
|
629
|
+
return __spreadProps(__spreadValues({}, user), {
|
|
630
|
+
isCurrentUser: user.id === (currentUser == null ? void 0 : currentUser.id),
|
|
631
|
+
roles: userRoles
|
|
632
|
+
});
|
|
633
|
+
});
|
|
634
|
+
setUsers(usersWithRoles);
|
|
635
|
+
} catch (err) {
|
|
636
|
+
console.error("Failed to fetch users:", err);
|
|
637
|
+
}
|
|
638
|
+
}
|
|
639
|
+
users.length || getUsersWithRoles();
|
|
640
|
+
}, [client, currentUser == null ? void 0 : currentUser.id, users.length]), users;
|
|
1008
641
|
}
|
|
1009
642
|
exports.Cell = Cell;
|
|
1010
643
|
exports.Feedback = Feedback;
|