@sanity/orderable-document-list 0.0.10 → 1.0.0-v3-studio.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/README.md +136 -54
- package/lib/index.d.ts +38 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/index.js +849 -30
- package/lib/index.js.map +1 -1
- package/lib/index.modern.js +840 -0
- package/lib/index.modern.js.map +1 -0
- package/package.json +56 -22
- package/src/{Document.js → Document.tsx} +30 -27
- package/src/{DocumentListQuery.js → DocumentListQuery.tsx} +27 -23
- package/src/{DocumentListWrapper.js → DocumentListWrapper.tsx} +24 -29
- package/src/DraggableList.tsx +304 -0
- package/src/{Feedback.js → Feedback.tsx} +2 -7
- package/src/OrderableContext.ts +7 -0
- package/src/{OrderableDocumentList.js → OrderableDocumentList.tsx} +23 -12
- package/src/desk-structure/globalClientWorkaround.ts +33 -0
- package/src/desk-structure/{orderableDocumentListDeskItem.js → orderableDocumentListDeskItem.ts} +26 -10
- package/src/fields/orderRankField.ts +45 -0
- package/src/fields/{orderRankOrdering.js → orderRankOrdering.ts} +0 -0
- package/src/helpers/client.ts +13 -0
- package/src/helpers/constants.ts +1 -0
- package/src/helpers/{initialRank.js → initialRank.ts} +2 -2
- package/src/helpers/{reorderDocuments.js → reorderDocuments.ts} +33 -44
- package/src/helpers/{resetOrder.js → resetOrder.ts} +3 -8
- package/src/index.ts +9 -0
- package/.babelrc +0 -3
- package/.eslintignore +0 -1
- package/.eslintrc.js +0 -50
- package/lib/Document.js +0 -101
- package/lib/Document.js.map +0 -1
- package/lib/DocumentListQuery.js +0 -163
- package/lib/DocumentListQuery.js.map +0 -1
- package/lib/DocumentListWrapper.js +0 -107
- package/lib/DocumentListWrapper.js.map +0 -1
- package/lib/DraggableList.js +0 -314
- package/lib/DraggableList.js.map +0 -1
- package/lib/Feedback.js +0 -31
- package/lib/Feedback.js.map +0 -1
- package/lib/OrderableContext.js +0 -15
- package/lib/OrderableContext.js.map +0 -1
- package/lib/OrderableDocumentList.js +0 -103
- package/lib/OrderableDocumentList.js.map +0 -1
- package/lib/desk-structure/orderableDocumentListDeskItem.js +0 -57
- package/lib/desk-structure/orderableDocumentListDeskItem.js.map +0 -1
- package/lib/fields/orderRankField.js +0 -64
- package/lib/fields/orderRankField.js.map +0 -1
- package/lib/fields/orderRankOrdering.js +0 -19
- package/lib/fields/orderRankOrdering.js.map +0 -1
- package/lib/helpers/constants.js +0 -9
- package/lib/helpers/constants.js.map +0 -1
- package/lib/helpers/initialRank.js +0 -18
- package/lib/helpers/initialRank.js.map +0 -1
- package/lib/helpers/reorderDocuments.js +0 -131
- package/lib/helpers/reorderDocuments.js.map +0 -1
- package/lib/helpers/resetOrder.js +0 -62
- package/lib/helpers/resetOrder.js.map +0 -1
- package/sanity.json +0 -7
- package/src/DraggableList.js +0 -276
- package/src/OrderableContext.js +0 -3
- package/src/fields/orderRankField.js +0 -35
- package/src/helpers/constants.js +0 -1
- package/src/index.js +0 -5
package/LICENSE
CHANGED
package/README.md
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
# @sanity/orderable-document-list
|
|
2
2
|
|
|
3
|
+
> **NOTE**
|
|
4
|
+
>
|
|
5
|
+
> This is the **Sanity Studio v3 version** of @sanity/orderable-document-list.
|
|
6
|
+
>
|
|
7
|
+
> For the v2 version, please refer to the [v2-branch](https://github.com/sanity-io/orderable-document-list).
|
|
8
|
+
|
|
9
|
+
## What is it?
|
|
3
10
|
Drag-and-drop Document Ordering without leaving the Editing surface.
|
|
4
11
|
|
|
5
12
|

|
|
@@ -8,46 +15,83 @@ This plugin aims to be OS-like in that you can select and move multiple document
|
|
|
8
15
|
|
|
9
16
|
## Requirements
|
|
10
17
|
|
|
11
|
-
A Sanity Studio with [Desk Structure](https://www.sanity.io/docs/structure-builder-introduction) configured
|
|
18
|
+
A Sanity Studio with [Desk Structure](https://www.sanity.io/docs/structure-builder-introduction) configured:
|
|
19
|
+
|
|
20
|
+
```ts
|
|
21
|
+
import {createConfig} from "sanity";
|
|
22
|
+
import {deskTool, StructureBuilder} from "sanity/desk";
|
|
23
|
+
|
|
24
|
+
export default createConfig({
|
|
25
|
+
//...
|
|
26
|
+
plugins: [
|
|
27
|
+
deskTool({
|
|
28
|
+
structure: (S, context) => { /* Strucure code */},
|
|
29
|
+
})
|
|
30
|
+
]
|
|
31
|
+
})
|
|
32
|
+
|
|
33
|
+
```
|
|
12
34
|
|
|
13
35
|
## Installation
|
|
14
36
|
|
|
37
|
+
Run the following command in your studio directory
|
|
38
|
+
|
|
39
|
+
```sh
|
|
40
|
+
npm install --save @sanity/orderable-document-list@studio-v3
|
|
15
41
|
```
|
|
16
|
-
|
|
42
|
+
|
|
43
|
+
or
|
|
44
|
+
|
|
45
|
+
```sh
|
|
46
|
+
yarn add @sanity/orderable-document-list@studio-v3
|
|
17
47
|
```
|
|
18
48
|
|
|
19
|
-
|
|
49
|
+
## Usage
|
|
20
50
|
|
|
21
|
-
|
|
51
|
+
### 1. Import the Document List into your Desk Structure
|
|
22
52
|
|
|
23
|
-
|
|
24
|
-
|
|
53
|
+
The config parameter requires `type`, `S` and `context`. It also accepts `title`, `icon`, `filter` and `params`.
|
|
54
|
+
`S` and `context` are available in desk-tool structure callback, and should be forwarded as is:
|
|
25
55
|
|
|
26
|
-
|
|
56
|
+
```ts
|
|
57
|
+
import {createConfig} from "sanity";
|
|
58
|
+
import {deskTool, StructureBuilder} from "sanity/desk";
|
|
27
59
|
import {orderableDocumentListDeskItem} from '@sanity/orderable-document-list'
|
|
28
60
|
|
|
29
|
-
export default (
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
61
|
+
export default createConfig({
|
|
62
|
+
//...
|
|
63
|
+
plugins: [
|
|
64
|
+
deskTool({
|
|
65
|
+
structure: (S, context) => {
|
|
66
|
+
return S.list()
|
|
67
|
+
.title('Content')
|
|
68
|
+
.items([
|
|
69
|
+
// Minimum required configuration
|
|
70
|
+
orderableDocumentListDeskItem({type: 'category', S, context}),
|
|
71
|
+
|
|
72
|
+
// Optional configuration
|
|
73
|
+
orderableDocumentListDeskItem({
|
|
74
|
+
type: 'project',
|
|
75
|
+
title: 'Projects',
|
|
76
|
+
icon: Paint,
|
|
77
|
+
// Required if using multiple lists of the same 'type'
|
|
78
|
+
id: 'orderable-en-projects',
|
|
79
|
+
// See notes on adding a `filter` below
|
|
80
|
+
filter: `__i18n_lang == $lang`,
|
|
81
|
+
params: {
|
|
82
|
+
lang: 'en_US'
|
|
83
|
+
},
|
|
84
|
+
// pass from the structure callback params above
|
|
85
|
+
S,
|
|
86
|
+
context
|
|
87
|
+
}),
|
|
88
|
+
|
|
89
|
+
// ... all other desk items
|
|
90
|
+
])
|
|
91
|
+
},
|
|
92
|
+
})
|
|
93
|
+
]
|
|
94
|
+
})
|
|
51
95
|
```
|
|
52
96
|
|
|
53
97
|
**Caution: Adding a `filter`**
|
|
@@ -58,43 +102,62 @@ However, order ranks are still computed based on _all_ documents of the same `ty
|
|
|
58
102
|
|
|
59
103
|
### 2. Add the `orderRank` field to your schema(s).
|
|
60
104
|
|
|
61
|
-
You must pass in the `type` of the schema
|
|
105
|
+
You must pass in the `type` of the schema and the schema `context`, to create an `initialValue` value.
|
|
106
|
+
Context is available in the schema callback, and should be forwarded as is.
|
|
62
107
|
|
|
63
108
|
Additionally, pass in overrides for the field, such as making it visible by passing `hidden: false`.
|
|
64
109
|
|
|
65
110
|
You cannot override the `name`, `type` or `initialValue` attributes.
|
|
66
111
|
|
|
67
|
-
|
|
112
|
+
Take note that orderRankField requires a configured sanity client, that must be passed
|
|
113
|
+
from the schema configuration context as shown in the following example:
|
|
68
114
|
|
|
69
115
|
```js
|
|
70
|
-
//
|
|
71
|
-
|
|
72
|
-
import {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
116
|
+
// sanity.config.js
|
|
117
|
+
import {createConfig} from "sanity";
|
|
118
|
+
import {deskTool, StructureBuilder} from "sanity/desk";
|
|
119
|
+
import {orderableDocumentListDeskItem} from '@sanity/orderable-document-list'
|
|
120
|
+
|
|
121
|
+
export default createConfig({
|
|
122
|
+
//...
|
|
123
|
+
plugins: [
|
|
124
|
+
deskTool({structure: (S, context) => {/* snip */}})
|
|
125
|
+
],
|
|
126
|
+
schema: {
|
|
127
|
+
// pass context to orderRankField
|
|
128
|
+
types: (previousTypes, context) => {
|
|
129
|
+
return [
|
|
130
|
+
...previousTypes,
|
|
131
|
+
{
|
|
132
|
+
name: "category",
|
|
133
|
+
title: "Category",
|
|
134
|
+
type: "document",
|
|
135
|
+
// Optional: The plugin also exports a set of 'orderings' for use in other Document Lists
|
|
136
|
+
// https://www.sanity.io/docs/sort-orders
|
|
137
|
+
orderings: [orderRankOrdering],
|
|
138
|
+
fields: [
|
|
139
|
+
// Minimum required configuration
|
|
140
|
+
orderRankField({ type: "category", context }),
|
|
141
|
+
|
|
142
|
+
// OR you can override _some_ of the field settings
|
|
143
|
+
orderRankField({ type: 'category', hidden: false, context }),
|
|
144
|
+
|
|
145
|
+
// ...all other fields
|
|
146
|
+
],
|
|
147
|
+
},
|
|
148
|
+
]
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
}
|
|
91
152
|
```
|
|
92
153
|
|
|
93
154
|
### 3. Generate initial Ranks
|
|
94
155
|
|
|
95
|
-
On first load, your Document list will not have any Order. You can select "Reset Order" from the menu in the top right of the list.
|
|
156
|
+
On first load, your Document list will not have any Order. You can select "Reset Order" from the menu in the top right of the list.
|
|
157
|
+
You can also re-run this at any time.
|
|
96
158
|
|
|
97
|
-
The `orderRankField` will query the last Document to set an `initialValue` to come after it.
|
|
159
|
+
The `orderRankField` will query the last Document to set an `initialValue` to come after it.
|
|
160
|
+
New Documents always start at the end of the Ordered list.
|
|
98
161
|
|
|
99
162
|
## Querying Ordered Documents
|
|
100
163
|
|
|
@@ -113,6 +176,10 @@ To get this first version out the door there are few configuration settings and
|
|
|
113
176
|
|
|
114
177
|
Feedback and PRs welcome :)
|
|
115
178
|
|
|
179
|
+
### Breaking change in the v3 version
|
|
180
|
+
`orderRank` and `orderableDocumentListDeskItem` requires context from sanity config now.
|
|
181
|
+
See the examples above.
|
|
182
|
+
|
|
116
183
|
## How it works
|
|
117
184
|
|
|
118
185
|
Uses [kvandakes](https://github.com/kvandake)'s [TypeScript implementation](https://github.com/kvandake/lexorank-ts) of [Jira's Lexorank](https://www.youtube.com/watch?v=OjQv9xMoFbg) to create a "lexographical" Document order.
|
|
@@ -123,3 +190,18 @@ Put simply it updates the position of an individual – or many – Documents in
|
|
|
123
190
|
|
|
124
191
|
MIT © Simeon Griggs
|
|
125
192
|
See LICENSE
|
|
193
|
+
|
|
194
|
+
## Develop & test
|
|
195
|
+
|
|
196
|
+
This plugin uses [@sanity/plugin-kit](https://github.com/sanity-io/plugin-kit)
|
|
197
|
+
with default configuration for build & watch scripts.
|
|
198
|
+
|
|
199
|
+
See [Testing a plugin in Sanity Studio](https://github.com/sanity-io/plugin-kit#testing-a-plugin-in-sanity-studio)
|
|
200
|
+
on how to run this plugin with hotreload in the studio.d & watch
|
|
201
|
+
|
|
202
|
+
## Release new version
|
|
203
|
+
|
|
204
|
+
Run ["CI & Release" workflow](https://github.com/sanity-io/code-input/actions).
|
|
205
|
+
Make sure to select the main branch and check "Release new version".
|
|
206
|
+
|
|
207
|
+
Semantic release will only release on configured branches, so it is safe to run release on any branch.
|
package/lib/index.d.ts
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { ConfigContext } from "sanity";
|
|
2
|
+
import { ComponentType } from "react";
|
|
3
|
+
import { StructureBuilder } from "sanity/desk";
|
|
4
|
+
type SchemaContext = Omit<ConfigContext, 'schema' | 'currentUser' | 'client'>;
|
|
5
|
+
export interface RankFieldConfig {
|
|
6
|
+
type: string;
|
|
7
|
+
context: SchemaContext;
|
|
8
|
+
}
|
|
9
|
+
export const orderRankField: (config: RankFieldConfig) => {
|
|
10
|
+
name: "orderRank";
|
|
11
|
+
type: string;
|
|
12
|
+
initialValue: () => Promise<string>;
|
|
13
|
+
context: SchemaContext;
|
|
14
|
+
title: string;
|
|
15
|
+
readOnly: boolean;
|
|
16
|
+
hidden: boolean;
|
|
17
|
+
};
|
|
18
|
+
export const orderRankOrdering: {
|
|
19
|
+
title: string;
|
|
20
|
+
name: string;
|
|
21
|
+
by: {
|
|
22
|
+
field: "orderRank";
|
|
23
|
+
direction: string;
|
|
24
|
+
}[];
|
|
25
|
+
};
|
|
26
|
+
export interface OrderableListConfig {
|
|
27
|
+
type: string;
|
|
28
|
+
id?: string;
|
|
29
|
+
title?: string;
|
|
30
|
+
icon?: ComponentType;
|
|
31
|
+
params?: Record<string, unknown>;
|
|
32
|
+
filter?: string;
|
|
33
|
+
context: ConfigContext;
|
|
34
|
+
S: StructureBuilder;
|
|
35
|
+
}
|
|
36
|
+
export function orderableDocumentListDeskItem(config: OrderableListConfig): import("sanity/desk").ListItem;
|
|
37
|
+
|
|
38
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"mappings":";;;AGMA,qBAA4B,IAAI,CAAC,aAAa,EAAE,QAAQ,GAAG,aAAa,GAAG,QAAQ,CAAC,CAAA;AAEpF;IACE,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,aAAa,CAAA;CACvB;AAED,OAAO,MAAM,yBAA0B,eAAe;;;;aAH3C,aAAa;;;;CAkCvB,CAAA;AC1CD,OAAO,MAAM;;;;;;;CAIZ,CAAA;AWED;IACE,IAAI,EAAE,MAAM,CAAA;IACZ,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAChC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,aAAa,CAAA;IACtB,CAAC,EAAE,gBAAgB,CAAA;CACpB;AAED,8CAA8C,MAAM,EAAE,mBAAmB,kCA4CxE","sources":["src/src/helpers/constants.ts","src/src/helpers/initialRank.ts","src/src/desk-structure/globalClientWorkaround.ts","src/src/fields/orderRankField.ts","src/src/fields/orderRankOrdering.ts","src/src/OrderableContext.ts","src/src/Document.tsx","src/src/helpers/reorderDocuments.ts","src/src/helpers/client.ts","src/src/DraggableList.tsx","src/src/Feedback.tsx","src/src/DocumentListQuery.tsx","src/src/DocumentListWrapper.tsx","src/src/helpers/resetOrder.ts","src/src/OrderableDocumentList.tsx","src/src/desk-structure/orderableDocumentListDeskItem.ts","src/src/index.ts","src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,"import {orderRankField, RankFieldConfig} from './fields/orderRankField'\nimport {orderRankOrdering} from './fields/orderRankOrdering'\nimport {\n orderableDocumentListDeskItem,\n type OrderableListConfig,\n} from './desk-structure/orderableDocumentListDeskItem'\n\nexport type {OrderableListConfig, RankFieldConfig}\nexport {orderRankField, orderRankOrdering, orderableDocumentListDeskItem}\n"],"names":[],"version":3,"file":"index.d.ts.map","sourceRoot":"../"}
|