@sanity/hierarchical-document-list 0.1.0-next.1 → 0.1.1

package/lib/utils/treePatches.js

@@ -1,3 +1,23 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import * as Patch from '@sanity/form-builder/lib/patch/patches';
 import { randomKey } from '@sanity/util/content';
 import { getFlatDataFromTree } from 'react-sortable-tree';
@@ -5,51 +25,48 @@ import getAdjescentNodes from './getAdjescentNodes';
 import moveItemInArray from './moveItemInArray';
 import { normalizeNodeForStorage } from './treeData';
 export function getAddItemPatch(item) {
-    const normalizedNode = normalizeNodeForStorage(item);
+    var normalizedNode = normalizeNodeForStorage(item);
     return [
         // Add the node to the end of the tree
         Patch.insert([normalizedNode], 'after', [-1])
     ];
 }
 export function getDuplicateItemPatch(nodeProps) {
-    const newItem = {
-        ...nodeProps.node,
-        _key: randomKey(12)
-    };
-    const normalizedNode = normalizeNodeForStorage(newItem);
+    var newItem = __assign(__assign({}, nodeProps.node), { _key: randomKey(12) });
+    var normalizedNode = normalizeNodeForStorage(newItem);
     return [
         // Add duplicated node before the existing one
         Patch.insert([normalizedNode], 'before', [{ _key: nodeProps.node._key }])
     ];
 }
-export function getRemoveItemPatch({ node }) {
-    const keyPath = { _key: node._key };
-    const children = getChildrenPaths(node);
-    return [
+export function getRemoveItemPatch(_a) {
+    var node = _a.node;
+    var keyPath = { _key: node._key };
+    var children = getChildrenPaths(node);
+    return __spreadArray([
         // 1. Unset the removed node
-        Patch.unset([keyPath]),
-        // 2. Unset its children
-        ...children.map((path) => Patch.unset([{ _key: path }]))
-    ];
+        Patch.unset([keyPath])
+    ], children.map(function (path) { return Patch.unset([{ _key: path }]); }), true);
 }
 export function getMovedNodePatch(data) {
-    const { nextParentNode } = data;
-    const keyPath = { _key: data.node._key };
+    var _a, _b;
+    var nextParentNode = data.nextParentNode;
+    var keyPath = { _key: data.node._key };
     // === REMOVING NODE FROM TREE ===
     // `nextPath` will be null if the item is removed from tree
     if (!Array.isArray(data.nextPath)) {
         return getRemoveItemPatch({ node: data.node });
     }
-    const nextFlatTree = getFlatDataFromTree({
+    var nextFlatTree = getFlatDataFromTree({
         treeData: data.treeData,
-        getNodeKey: (t) => t.node._key
+        getNodeKey: function (t) { return t.node._key; }
     });
-    const normalizedNode = normalizeNodeForStorage(data.node);
-    const { leadingNode, followingNode } = getAdjescentNodes({
+    var normalizedNode = normalizeNodeForStorage(data.node);
+    var _c = getAdjescentNodes({
         flatTree: nextFlatTree,
         node: data.node,
         treeIndex: data.nextTreeIndex
-    });
+    }), leadingNode = _c.leadingNode, followingNode = _c.followingNode;
     return [
         // 1. Unset the moved node
         // (will be ignored by Content Lake on new nodes with _key not yet in tree)
@@ -57,13 +74,12 @@ export function getMovedNodePatch(data) {
         // 2. SIBLING-BASED PLACEMENT
         // If we were to place solely based on nextTreeIndex, concurrent changes from other editors could put the new node in an unexpected position.
         // Let's instead anchor it to the _key of the sibling coming before or after it.
-        leadingNode?.node?._key
+        ((_a = leadingNode === null || leadingNode === void 0 ? void 0 : leadingNode.node) === null || _a === void 0 ? void 0 : _a._key)
             ? // After the sibling before it
                 Patch.insert([normalizedNode], 'after', [{ _key: leadingNode.node._key }])
             : // Or before the sibling right after it, in case there's no leading sibling node
-                Patch.insert([normalizedNode], 'before', [
-                    followingNode?.node?._key ? { _key: followingNode.node._key } : data.nextTreeIndex
-                ]),
+                // prettier-ignore
+                Patch.insert([normalizedNode], 'before', [((_b = followingNode === null || followingNode === void 0 ? void 0 : followingNode.node) === null || _b === void 0 ? void 0 : _b._key) ? { _key: followingNode.node._key } : data.nextTreeIndex]),
         // 3. Patch the new node with its new `parent`
         nextParentNode
             ? // If it has a parent node, set that parent's _key
@@ -77,51 +93,43 @@ function getChildrenPaths(node) {
         return [];
     }
     return node.children
-        .reduce((keyPaths, child) => [...keyPaths, child._key, ...getChildrenPaths(child)], [])
+        .reduce(function (keyPaths, child) { return __spreadArray(__spreadArray(__spreadArray([], keyPaths, true), [child._key], false), getChildrenPaths(child), true); }, [])
         .filter(Boolean);
 }
-export function getMoveItemPatch({ nodeProps: { node, treeIndex, parentNode }, localTree, direction = 'up' }) {
-    const keyPath = { _key: node._key };
-    const nextTreeIndex = treeIndex + (direction === 'up' ? -1 : 1);
-    const flatTree = getFlatDataFromTree({
+export function getMoveItemPatch(_a) {
+    var _b, _c;
+    var _d = _a.nodeProps, node = _d.node, treeIndex = _d.treeIndex, localTree = _a.localTree, _e = _a.direction, direction = _e === void 0 ? 'up' : _e;
+    var keyPath = { _key: node._key };
+    var nextTreeIndex = treeIndex + (direction === 'up' ? -1 : 1);
+    var flatTree = getFlatDataFromTree({
         treeData: localTree,
-        getNodeKey: (t) => t.node._key
+        getNodeKey: function (t) { return t.node._key; }
     });
-    const nextFlatTree = moveItemInArray({
+    var nextFlatTree = moveItemInArray({
         array: flatTree,
         fromIndex: treeIndex,
         toIndex: nextTreeIndex
     });
-    const { leadingNode, followingNode } = getAdjescentNodes({
+    var _f = getAdjescentNodes({
         flatTree: nextFlatTree,
-        node,
+        node: node,
         treeIndex: nextTreeIndex
-    });
-    const normalizedNode = normalizeNodeForStorage(node);
-    console.log(`Move ${direction}`, {
-        node,
-        treeIndex,
-        parentNode,
-        nextFlatTree,
-        flatTree,
-        localTree,
-        leadingSibling: leadingNode,
-        followingSibling: followingNode
-    });
+    }), leadingNode = _f.leadingNode, followingNode = _f.followingNode;
+    var normalizedNode = normalizeNodeForStorage(node);
     // When moving up, look at following node to figure out what is the next parent.
-    const nodeToInheritParent = direction === 'up' ? followingNode : leadingNode;
-    const nextParentNode = nodeToInheritParent?.parentNode;
+    var nodeToInheritParent = direction === 'up' ? followingNode : leadingNode;
+    var nextParentNode = nodeToInheritParent === null || nodeToInheritParent === void 0 ? void 0 : nodeToInheritParent.parentNode;
     return [
         // 1. Unset the moved node
         // (will be ignored by Content Lake on new nodes with _key not yet in tree)
         Patch.unset([keyPath]),
         // 2. SIBLING-BASED PLACEMENT
-        leadingNode?.node?._key
+        ((_b = leadingNode === null || leadingNode === void 0 ? void 0 : leadingNode.node) === null || _b === void 0 ? void 0 : _b._key)
             ? // After the sibling before it
                 Patch.insert([normalizedNode], 'after', [{ _key: leadingNode.node._key }])
             : // Or before the sibling right after it, in case there's no leading sibling node
                 Patch.insert([normalizedNode], 'before', [
-                    followingNode?.node?._key ? { _key: followingNode.node._key } : nextTreeIndex
+                    ((_c = followingNode === null || followingNode === void 0 ? void 0 : followingNode.node) === null || _c === void 0 ? void 0 : _c._key) ? { _key: followingNode.node._key } : nextTreeIndex
                 ]),
         // 3. Patch the new node with its new `parent`
         nextParentNode

package/lib/utils/useAllItems.js

@@ -1,48 +1,54 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import sanityClient from 'part:@sanity/base/client';
 import React from 'react';
 import { isDraft, unprefixId } from './idUtils';
-const client = sanityClient.withConfig({
+var client = sanityClient.withConfig({
     apiVersion: '2021-09-01'
 });
-function getDeskFilter({ referenceTo, referenceOptions }) {
-    const filterParts = ['_type in $docTypes'];
-    if (referenceOptions?.filter) {
+function getDeskFilter(_a) {
+    var referenceTo = _a.referenceTo, referenceOptions = _a.referenceOptions;
+    var filterParts = ['_type in $docTypes'];
+    if (referenceOptions === null || referenceOptions === void 0 ? void 0 : referenceOptions.filter) {
         filterParts.push(referenceOptions.filter);
     }
     return {
         filter: filterParts.join(' && '),
-        params: {
-            ...(referenceOptions?.filterParams || {}),
-            docTypes: referenceTo.map((schemaType) => schemaType)
-        }
+        params: __assign(__assign({}, ((referenceOptions === null || referenceOptions === void 0 ? void 0 : referenceOptions.filterParams) || {})), { docTypes: referenceTo.map(function (schemaType) { return schemaType; }) })
     };
 }
 function updateItemInState(state, item) {
-    const newState = { ...state };
-    const publishedId = unprefixId(item._id);
-    newState[publishedId] = {
-        ...(newState[publishedId] || {}),
-        [isDraft(item._id) ? 'draft' : 'published']: item
-    };
+    var _a;
+    var newState = __assign({}, state);
+    var publishedId = unprefixId(item._id);
+    newState[publishedId] = __assign(__assign({}, (newState[publishedId] || {})), (_a = {}, _a[isDraft(item._id) ? 'draft' : 'published'] = item, _a));
     return newState;
 }
 function allItemsReducer(state, action) {
-    if (action.type === 'addOrEditItem' && action.item?._id) {
+    var _a;
+    var _b, _c, _d;
+    if (action.type === 'addOrEditItem' && ((_b = action.item) === null || _b === void 0 ? void 0 : _b._id)) {
         return updateItemInState(state, action.item);
     }
     if (action.type === 'removeItem') {
-        const publishedId = unprefixId(action.itemId);
-        return {
-            ...state,
-            [publishedId]: isDraft(action.itemId)
-                ? // If a draft, keep only published
-                    {
-                        published: state[publishedId]?.published
-                    }
-                : {
-                    draft: state[publishedId]?.draft
+        var publishedId = unprefixId(action.itemId);
+        return __assign(__assign({}, state), (_a = {}, _a[publishedId] = isDraft(action.itemId)
+            ? // If a draft, keep only published
+                {
+                    published: (_c = state[publishedId]) === null || _c === void 0 ? void 0 : _c.published
                 }
-        };
+            : {
+                draft: (_d = state[publishedId]) === null || _d === void 0 ? void 0 : _d.draft
+            }, _a));
     }
     if (action.type === 'setInitialData') {
         return action.items.reduce(updateItemInState, {});
@@ -50,8 +56,8 @@ function allItemsReducer(state, action) {
     return state;
 }
 export default function useAllItems(options) {
-    const [status, setStatus] = React.useState('loading');
-    const [allItems, dispatch] = React.useReducer(allItemsReducer, {});
+    var _a = React.useState('loading'), status = _a[0], setStatus = _a[1];
+    var _b = React.useReducer(allItemsReducer, {}), allItems = _b[0], dispatch = _b[1];
     function handleListener(event) {
         if (event.type !== 'mutation') {
             return;
@@ -64,29 +70,25 @@ export default function useAllItems(options) {
         }
     }
     function handleFirstLoad(items) {
-        dispatch({ type: 'setInitialData', items });
+        dispatch({ type: 'setInitialData', items: items });
         setStatus('success');
     }
-    React.useEffect(() => {
-        const { filter, params } = getDeskFilter(options);
-        const query = `*[${filter}] {
-      _id,
-      _type,
-      _updatedAt,
-    }`;
+    React.useEffect(function () {
+        var _a = getDeskFilter(options), filter = _a.filter, params = _a.params;
+        var query = "*[".concat(filter, "] {\n      _id,\n      _type,\n      _updatedAt,\n    }");
         client
             .fetch(query, params)
             .then(handleFirstLoad)
-            .catch(() => {
+            .catch(function () {
             setStatus('error');
         });
-        const listener = client.listen(query, params).subscribe(handleListener);
-        return () => {
+        var listener = client.listen(query, params).subscribe(handleListener);
+        return function () {
             listener.unsubscribe();
         };
     }, []);
     return {
-        status,
-        allItems
+        status: status,
+        allItems: allItems
     };
 }

package/lib/utils/useLocalTree.d.ts

@@ -1,17 +1,17 @@
-import { OnVisibilityToggleData, TreeItem } from 'react-sortable-tree';
-import { AllItems, SanityTreeItem } from '../types';
+import { OnVisibilityToggleData } from 'react-sortable-tree';
+import { AllItems, LocalTreeItem, StoredTreeItem } from '../types';
 /**
  * Enhances tree data with information on:
  *   - `expanded` - native property of react-sortable-tree to determine collapsing & expanding of a node's children
- *   - `draftId` & `publishedId` - refer to SanityTreeItem's type annotations
+ *   - `draftId` & `publishedId` - refer to LocalTreeItem's type annotations
  *
  * Doesn't modify the main tree or has side-effects on data.
  * Has the added benefit of being local to the user, so external changes won't affect local visibility.
  */
 export default function useLocalTree({ tree, allItems }: {
-    tree: SanityTreeItem[];
+    tree: StoredTreeItem[];
     allItems: AllItems;
 }): {
     handleVisibilityToggle: (data: OnVisibilityToggleData) => void;
-    localTree: TreeItem[];
+    localTree: LocalTreeItem[];
 };

package/lib/utils/useLocalTree.js

@@ -1,27 +1,37 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import React from 'react';
 import { dataToEditorTree } from './treeData';
 /**
  * Enhances tree data with information on:
  *   - `expanded` - native property of react-sortable-tree to determine collapsing & expanding of a node's children
- *   - `draftId` & `publishedId` - refer to SanityTreeItem's type annotations
+ *   - `draftId` & `publishedId` - refer to LocalTreeItem's type annotations
  *
  * Doesn't modify the main tree or has side-effects on data.
  * Has the added benefit of being local to the user, so external changes won't affect local visibility.
  */
-export default function useLocalTree({ tree, allItems }) {
-    const [visibilityMap, setVisibilityMap] = React.useState({});
+export default function useLocalTree(_a) {
+    var tree = _a.tree, allItems = _a.allItems;
+    var _b = React.useState({}), visibilityMap = _b[0], setVisibilityMap = _b[1];
     function handleVisibilityToggle(data) {
-        setVisibilityMap({
-            ...visibilityMap,
-            [data.node._key]: data.expanded
-        });
+        var _a;
+        setVisibilityMap(__assign(__assign({}, visibilityMap), (_a = {}, _a[data.node._key] = data.expanded, _a)));
     }
     return {
         localTree: dataToEditorTree({
-            tree,
-            allItems,
-            visibilityMap
+            tree: tree,
+            allItems: allItems,
+            visibilityMap: visibilityMap
         }),
-        handleVisibilityToggle
+        handleVisibilityToggle: handleVisibilityToggle
     };
 }

package/lib/utils/useTreeOperations.js

@@ -2,7 +2,7 @@ import React from 'react';
 function placeholder() {
     // no-op
 }
-export const TreeOperationsContext = React.createContext({
+export var TreeOperationsContext = React.createContext({
     addItem: placeholder,
     duplicateItem: placeholder,
     removeItem: placeholder,

package/lib/utils/useTreeOperationsProvider.d.ts

@@ -1,15 +1,14 @@
-import { NodeRendererProps, TreeItem } from 'react-sortable-tree';
-import { SanityTreeItem } from '../types';
+import { LocalTreeItem, NodeProps } from '../types';
 import { HandleMovedNode } from './treePatches';
 export default function useTreeOperationsProvider(props: {
     patchPrefix?: string;
     onChange: (patch: unknown) => void;
-    localTree: TreeItem[];
+    localTree: LocalTreeItem[];
 }): {
     handleMovedNode: HandleMovedNode;
-    addItem: (item: SanityTreeItem) => void;
-    duplicateItem: (nodeProps: NodeRendererProps) => void;
-    removeItem: (nodeProps: NodeRendererProps) => void;
-    moveItemUp: (nodeProps: NodeRendererProps) => void;
-    moveItemDown: (nodeProps: NodeRendererProps) => void;
+    addItem: (item: LocalTreeItem) => void;
+    duplicateItem: (nodeProps: NodeProps) => void;
+    removeItem: (nodeProps: NodeProps) => void;
+    moveItemUp: (nodeProps: NodeProps) => void;
+    moveItemDown: (nodeProps: NodeProps) => void;
 };

package/lib/utils/useTreeOperationsProvider.js

@@ -1,17 +1,25 @@
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import * as Patch from '@sanity/form-builder/lib/patch/patches';
 import PatchEvent from '@sanity/form-builder/PatchEvent';
 import { getAddItemPatch, getDuplicateItemPatch, getMovedNodePatch, getMoveItemPatch, getRemoveItemPatch } from './treePatches';
 export default function useTreeOperationsProvider(props) {
-    const { localTree } = props;
+    var localTree = props.localTree;
     function runPatches(patches) {
-        const finalPatches = [
+        var finalPatches = __spreadArray([
             // Ensure tree array exists before any operation
-            Patch.setIfMissing([]),
-            ...(patches || [])
-        ];
-        let patchEvent = PatchEvent.from(finalPatches);
+            Patch.setIfMissing([])
+        ], (patches || []), true);
+        var patchEvent = PatchEvent.from(finalPatches);
         if (props.patchPrefix) {
-            patchEvent = PatchEvent.from(finalPatches.map((patch) => Patch.prefixPath(patch, props.patchPrefix)));
+            patchEvent = PatchEvent.from(finalPatches.map(function (patch) { return Patch.prefixPath(patch, props.patchPrefix); }));
         }
         props.onChange(patchEvent);
     }
@@ -29,24 +37,24 @@ export default function useTreeOperationsProvider(props) {
     }
     function moveItemUp(nodeProps) {
         runPatches(getMoveItemPatch({
-            nodeProps,
-            localTree,
+            nodeProps: nodeProps,
+            localTree: localTree,
             direction: 'up'
         }));
     }
     function moveItemDown(nodeProps) {
         runPatches(getMoveItemPatch({
-            nodeProps,
-            localTree,
+            nodeProps: nodeProps,
+            localTree: localTree,
             direction: 'down'
         }));
     }
     return {
-        handleMovedNode,
-        addItem,
-        removeItem,
-        moveItemUp,
-        moveItemDown,
-        duplicateItem
+        handleMovedNode: handleMovedNode,
+        addItem: addItem,
+        removeItem: removeItem,
+        moveItemUp: moveItemUp,
+        moveItemDown: moveItemDown,
+        duplicateItem: duplicateItem
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/hierarchical-document-list",
-  "version": "0.1.0-next.1",
+  "version": "0.1.1",
   "author": "Sanity <hello@sanity.io>",
   "license": "MIT",
   "main": "lib/index.js",
@@ -19,6 +19,12 @@
     "lint": "eslint src"
   },
   "devDependencies": {
+    "@sanity/base": ">= 2.25.0",
+    "@sanity/color": "^2.1.6",
+    "@sanity/desk-tool": ">= 2.25.0",
+    "@sanity/form-builder": "^2.25.0",
+    "@sanity/icons": ">= 1.2.0",
+    "@sanity/ui": ">= 0.37.0",
     "@types/assert": "^1.5.6",
     "@types/react": "^17.0.38",
     "@types/react-dom": "^17.0.11",
@@ -30,25 +36,21 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-config-sanity": "^5.1.0",
     "prettier": "^2.5.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "styled-components": "^5.3.3",
     "typescript": "^4.5.5"
   },
   "type": "module",
   "dependencies": {
-    "@sanity/base": ">= 2.25.0",
-    "@sanity/color": "^2.1.6",
-    "@sanity/desk-tool": ">= 2.25.0",
-    "@sanity/form-builder": "^2.25.0",
-    "@sanity/icons": ">= 1.2.0",
-    "@sanity/ui": ">= 0.37.0",
     "assert": "^2.0.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
     "react-sortable-tree": "^2.8.0"
   },
   "peerDependencies": {
     "@sanity/base": ">= 2.25.0",
     "@sanity/desk-tool": ">= 2.25.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "styled-components": ">= 5.2.0"
   }
 }

package/sanity.json

@@ -6,7 +6,7 @@
   "parts": [
     {
       "implements": "part:@sanity/base/schema-type",
-      "path": "hierarchy.tree.js"
+      "path": "schemas/hierarchy.tree.js"
     }
   ]
 }

package/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "ESNext",
+    "target": "es5",
     "useDefineForClassFields": true,
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
     "allowJs": false,

package/lib/hiearchy.tree.js

@@ -1,28 +0,0 @@
-import createHierarchicalField from './createHierarchicalField';
-export default {
-    name: 'hierarchy.tree',
-    title: 'Hierarchical tree',
-    type: 'document',
-    liveEdit: true,
-    fields: [
-        createHierarchicalField({
-            name: 'tree',
-            title: 'Tree',
-            options: {
-                referenceTo: ['document']
-            }
-        })
-    ],
-    preview: {
-        select: {
-            id: '_id',
-            tree: 'tree'
-        },
-        prepare({ id, tree }) {
-            return {
-                title: `Hierarchical documents (ID: ${id})`,
-                subtitle: `${tree?.length || 0} document(s) in its list.`
-            };
-        }
-    }
-};