@itwin/saved-views-react 0.5.0 → 0.6.0

package/README.md

@@ -2,10 +2,59 @@
 
 ## About
 
-A collection of React components for building applications that deal with [Saved Views](https://developer.bentley.com/apis/savedviews/overview/).
+A collection of utilities and React components for building iTwin applications that deal with [Saved Views](https://developer.bentley.com/apis/savedviews/overview/).
 
 ## Documentation
 
+### [captureSavedViewData](./src/captureSavedViewData.ts)
+
+Captures current viewport state into serializable format. The returned data can later be used to restore viewport's view.
+
+```ts
+const { viewData, extensions = [] } = await captureSavedViewData({ viewport });
+extensions.push(myCustomExtension(viewport));
+console.log({ viewData, extensions }); /*
+{
+  viewData: { itwin3dView: {...} },
+  extensions: {
+    { extensionName: "EmphasizeElements", data: "{...}" },
+    { extensionName: "MyCustomExtension", data: "my_custom_extension_data" },
+  }
+} */
+```
+
+### [captureSavedViewThumbnail](./src/captureSavedViewThumbnail.ts)
+
+Generates Saved View thumbnail based on what is currently displayed on the viewport.
+
+```ts
+const thumbnail = captureSavedViewThumbnail(viewport);
+console.log(thumbnail); // "data:image/png;base64,iVBORw0KGoAAAANSUhEUg..."
+```
+
+### [applySavedView](./src/applySavedView.ts)
+
+Updates viewport state to match captured Saved View.
+
+```ts
+// Capture viewport state
+const savedViewData = await captureSavedViewData({ viewport });
+// Restore viewport state
+await applySavedView(iModel, viewport, savedViewData);
+```
+
+### [createViewState](./src/createViewState.ts)
+
+Creates ViewState object out of Saved View data. It provides a lower-level access to view data for advanced use.
+
+```ts
+const viewState = await createViewState(iModel, savedViewData.viewData);
+await applySavedView(iModel, viewport, savedViewData, { viewState });
+
+// The two lines above are equivalent to
+await applySavedView(iModel, viewport, savedViewData);
+```
+
 ### React components
 
 * [SavedViewTile](./src/SavedViewTile/SavedViewTile.tsx)
@@ -42,7 +91,7 @@ export function SavedViewsWidget(props) {
 }
 ```
 
-### useSavedViews
+### [useSavedViews](./src/useSavedViews.tsx)
 
 [useSavedViews](./src/useSavedViews.tsx) React hook provides basic functionality to jump-start your Saved Views widget. It accepts [`ITwinSavedViewsClient`](./src/SavedViewsClient/ITwinSavedViewsClient.ts) which is used to pull Saved View data and synchronize it back to the [Saved Views service](https://developer.bentley.com/apis/savedviews/overview/).
 

package/lib/SavedView.d.ts

@@ -1,18 +1,39 @@
+import type { ViewData } from "@itwin/saved-views-client";
 import type { ReactNode } from "react";
 export interface SavedView {
     id: string;
     displayName: string;
+    viewData?: ViewData | undefined;
     groupId?: string | undefined;
     creatorId?: string | undefined;
     tagIds?: string[] | undefined;
     shared?: boolean | undefined;
     thumbnail?: ReactNode | string | undefined;
-    /** `extensionName` and `data` pairs. */
-    extensions?: Map<string, string> | undefined;
+    extensions?: SavedViewExtension[] | undefined;
     /** Time the saved view was created as an ISO8601 string, `"YYYY-MM-DDTHH:mm:ss.sssZ"` */
-    creationTime?: string;
+    creationTime?: string | undefined;
     /** Time the saved view was last modified as an ISO8601 string, `"YYYY-MM-DDTHH:mm:ss.sssZ"` */
-    lastModified?: string;
+    lastModified?: string | undefined;
+}
+export interface SavedViewExtension {
+    /** Extension identifier. Saved View cannot contain multiple extensions that share the same `extensionName`. */
+    extensionName: string;
+    /**
+     * Serialized extension data.
+     *
+     * @example
+     * const extension = {
+     *   // Unique identifier makes extension data format portable between applications because it avoids collision
+     *   // with different implementations
+     *   extensionName: "CustomHighlight_$5be36494-ae03-4400-bb80-24ffd9db2a87",
+     *   data: JSON.stringify({
+     *     description: "For illustrative purposes only. We do not provide implementation for this extensionName."
+     *     highlightColor: "#f05599",
+     *     models: ["0x20000000006"],
+     *   }),
+     * };
+     */
+    data: string;
 }
 export interface SavedViewTag {
     id: string;
@@ -24,3 +45,4 @@ export interface SavedViewGroup {
     creatorId?: string | undefined;
     shared?: boolean | undefined;
 }
+export type WriteableSavedViewProperties = Omit<SavedView, "id" | "creatorId" | "creationTime" | "lastModified">;

package/lib/SavedViewTile/SavedViewTile.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
-import { SvgEdit, SvgImageFrame, SvgMore, SvgShare, SvgTag } from "@itwin/itwinui-icons-react";
+import { SvgEdit, SvgMore, SvgSavedView, SvgShare, SvgTag } from "@itwin/itwinui-icons-react";
 import { Button, IconButton, Input, Text, Tile } from "@itwin/itwinui-react";
 import { useLayoutEffect, useMemo, useRef, useState, } from "react";
 import { LayeredDropdownMenu } from "../LayeredDropdownMenu/LayeredDropdownMenu.js";
@@ -67,7 +67,7 @@ export function SavedViewTile(props) {
                             ? _jsx(Tile.ThumbnailPicture, { url: props.savedView.thumbnail })
                             : props.savedView.thumbnail
                                 ? props.savedView.thumbnail
-                                : _jsx(Tile.ThumbnailPicture, { children: _jsx(SvgImageFrame, {}) }), _jsx(TileIconContainer, { style: { placeSelf: "start" }, icons: props.leftIcons }), _jsx(TileIconContainer, { style: { placeSelf: "start end" }, icons: rightIcons })] }), _jsxs(Tile.ContentArea, { children: [_jsx(Tile.Metadata, { children: metadata }), (typeof props.options === "function" || (props.options && props.options.length > 0)) &&
+                                : _jsx(Tile.ThumbnailPicture, { children: _jsx(SvgSavedView, {}) }), _jsx(TileIconContainer, { style: { placeSelf: "start" }, icons: props.leftIcons }), _jsx(TileIconContainer, { style: { placeSelf: "start end" }, icons: rightIcons })] }), _jsxs(Tile.ContentArea, { children: [_jsx(Tile.Metadata, { children: metadata }), (typeof props.options === "function" || (props.options && props.options.length > 0)) &&
                             _jsx("div", { className: "svr-tile--more-options", onClick: (ev) => ev.stopPropagation(), children: _jsx(LayeredDropdownMenu, { menuItems: props.options, children: _jsx(IconButton, { size: "small", styleType: "borderless", children: _jsx(SvgMore, {}) }) }) })] })] }) }));
 }
 function isOverflowing(element) {

package/lib/SavedViewsClient/ITwinSavedViewsClient.d.ts

@@ -1,23 +1,23 @@
-import { type SavedViewRepresentation } from "@itwin/saved-views-client";
 import type { SavedView, SavedViewGroup, SavedViewTag } from "../SavedView.js";
-import type { CreateGroupParams, CreateSavedViewParams, CreateTagParams, DeleteGroupParams, DeleteSavedViewParams, DeleteTagParams, GetSavedViewInfoParams, GetSingularSavedViewParams, GetThumbnailUrlParams, SavedViewInfo, SavedViewsClient, UpdateGroupParams, UpdateSavedViewParams, UpdateTagParams, UploadThumbnailParams } from "./SavedViewsClient.js";
+import type { CreateGroupParams, CreateSavedViewParams, CreateTagParams, DeleteGroupParams, DeleteSavedViewParams, DeleteTagParams, GetAllGroupsParams, GetAllSavedViewsParams, GetAllTagsParams, GetSavedViewParams, GetThumbnailUrlParams, SavedViewsClient, UpdateGroupParams, UpdateSavedViewParams, UpdateTagParams, UploadThumbnailParams } from "./SavedViewsClient.js";
 interface ITwinSavedViewsClientParams {
-    /** @default "https://api.bentley.com/savedviews"  */
-    getAccessToken: () => Promise<string>;
     /**
      * Authorization token that grants access to iTwin Saved Views API. The token should be valid for `savedviews:read`
      * and `savedviews:modify` OIDC scopes.
-     */
+    */
+    getAccessToken: () => Promise<string>;
+    /** @default "https://api.bentley.com/savedviews"  */
     baseUrl?: string | undefined;
 }
-/**  */
 export declare class ITwinSavedViewsClient implements SavedViewsClient {
-    private client;
+    #private;
     constructor(args: ITwinSavedViewsClientParams);
-    getSavedViewInfo(args: GetSavedViewInfoParams): Promise<SavedViewInfo>;
-    getSingularSavedView(args: GetSingularSavedViewParams): Promise<SavedViewRepresentation>;
+    getAllSavedViews(args: GetAllSavedViewsParams): AsyncIterableIterator<SavedView[]>;
+    getAllGroups(args: GetAllGroupsParams): Promise<SavedViewGroup[]>;
+    getAllTags(args: GetAllTagsParams): Promise<SavedViewTag[]>;
     getThumbnailUrl(args: GetThumbnailUrlParams): Promise<string | undefined>;
     uploadThumbnail(args: UploadThumbnailParams): Promise<void>;
+    getSavedView(args: GetSavedViewParams): Promise<SavedView>;
     createSavedView(args: CreateSavedViewParams): Promise<SavedView>;
     updateSavedView(args: UpdateSavedViewParams): Promise<SavedView>;
     deleteSavedView(args: DeleteSavedViewParams): Promise<void>;

package/lib/SavedViewsClient/ITwinSavedViewsClient.js

@@ -3,33 +3,39 @@
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
 import { ITwinSavedViewsClient as Client, } from "@itwin/saved-views-client";
-/**  */
 export class ITwinSavedViewsClient {
-    client;
+    #client;
     constructor(args) {
-        this.client = new Client(args);
-    }
-    async getSavedViewInfo(args) {
-        const [{ savedViews }, { groups }, { tags }] = await Promise.all([
-            this.client.getAllSavedViewsMinimal(args),
-            this.client.getAllGroups(args),
-            this.client.getAllTags(args),
-        ]);
-        return {
-            savedViews: savedViews.map(savedViewResponseToSavedView),
-            groups: groups.map(groupResponseToSavedViewGroup),
-            tags: tags.map(tagResponseToSavedViewTag),
-        };
-    }
-    async getSingularSavedView(args) {
-        const response = await this.client.getSavedViewRepresentation({
-            savedViewId: args.savedViewId,
+        this.#client = new Client(args);
+    }
+    async *getAllSavedViews(args) {
+        const iterable = this.#client.getAllSavedViewsRepresentation({
+            iTwinId: args.iTwinId,
+            iModelId: args.iModelId,
+            signal: args.signal,
+        });
+        for await (const page of iterable) {
+            yield page.savedViews.map(savedViewResponseToSavedView);
+        }
+    }
+    async getAllGroups(args) {
+        const response = await this.#client.getAllGroups({
+            iTwinId: args.iTwinId,
+            iModelId: args.iModelId,
             signal: args.signal,
         });
-        return response.savedView;
+        return response.groups.map(groupResponseToSavedViewGroup);
+    }
+    async getAllTags(args) {
+        const response = await this.#client.getAllTags({
+            iTwinId: args.iTwinId,
+            iModelId: args.iModelId,
+            signal: args.signal,
+        });
+        return response.tags.map(tagResponseToSavedViewTag);
     }
     async getThumbnailUrl(args) {
-        const response = await this.client.getImage({
+        const response = await this.#client.getImage({
             savedViewId: args.savedViewId,
             size: "thumbnail",
             signal: args.signal,
@@ -37,43 +43,55 @@ export class ITwinSavedViewsClient {
         return response.href;
     }
     async uploadThumbnail(args) {
-        await this.client.updateImage({
+        await this.#client.updateImage({
             savedViewId: args.savedViewId,
             image: args.image,
             signal: args.signal,
         });
     }
+    async getSavedView(args) {
+        const response = await this.#client.getSavedViewRepresentation({
+            savedViewId: args.savedViewId,
+            signal: args.signal,
+        });
+        return savedViewResponseToSavedView(response.savedView);
+    }
     async createSavedView(args) {
-        const { savedView } = await this.client.createSavedView({
+        const { savedView } = await this.#client.createSavedView({
             iTwinId: args.iTwinId,
             iModelId: args.iModelId,
             displayName: args.savedView.displayName,
             tagIds: args.savedView.tagIds,
             groupId: args.savedView.groupId,
             shared: args.savedView.shared,
-            savedViewData: args.savedViewData,
+            savedViewData: args.savedView.viewData,
+            extensions: args.savedView.extensions,
             signal: args.signal,
         });
         return savedViewResponseToSavedView(savedView);
     }
     async updateSavedView(args) {
-        const { savedView } = await this.client.updateSavedView({
+        const { savedView } = await this.#client.updateSavedView({
             savedViewId: args.savedView.id,
             displayName: args.savedView.displayName,
             tagIds: args.savedView.tagIds,
             groupId: args.savedView.groupId,
             shared: args.savedView.shared,
-            savedViewData: args.savedViewData,
-            extensions: args.extensions,
+            savedViewData: args.savedView.viewData,
             signal: args.signal,
         });
+        await Promise.all((args.savedView.extensions ?? []).map(({ extensionName, data }) => this.#client.createExtension({
+            savedViewId: args.savedView.id,
+            extensionName,
+            data,
+        })));
         return savedViewResponseToSavedView(savedView);
     }
     async deleteSavedView(args) {
-        await this.client.deleteSavedView({ savedViewId: args.savedViewId, signal: args.signal });
+        await this.#client.deleteSavedView({ savedViewId: args.savedViewId, signal: args.signal });
     }
     async createGroup(args) {
-        const { group } = await this.client.createGroup({
+        const { group } = await this.#client.createGroup({
             iTwinId: args.iTwinId,
             iModelId: args.iModelId,
             displayName: args.group.displayName,
@@ -82,7 +100,7 @@ export class ITwinSavedViewsClient {
         return groupResponseToSavedViewGroup(group);
     }
     async updateGroup(args) {
-        const { group } = await this.client.updateGroup({
+        const { group } = await this.#client.updateGroup({
             groupId: args.group.id,
             displayName: args.group.displayName,
             shared: args.group.shared,
@@ -91,12 +109,14 @@ export class ITwinSavedViewsClient {
         return groupResponseToSavedViewGroup(group);
     }
     async deleteGroup(args) {
-        const savedViews = await this.client.getAllSavedViewsMinimal({ groupId: args.groupId, signal: args.signal });
-        await Promise.all(savedViews.savedViews.map(({ id }) => this.client.deleteSavedView({ savedViewId: id, signal: args.signal })));
-        await this.client.deleteGroup({ groupId: args.groupId, signal: args.signal });
+        const savedViewPages = this.#client.getAllSavedViewsMinimal({ groupId: args.groupId, signal: args.signal });
+        for await (const savedViews of savedViewPages) {
+            await Promise.all(savedViews.savedViews.map(({ id }) => this.#client.deleteSavedView({ savedViewId: id, signal: args.signal })));
+        }
+        await this.#client.deleteGroup({ groupId: args.groupId, signal: args.signal });
     }
     async createTag(args) {
-        const { tag } = await this.client.createTag({
+        const { tag } = await this.#client.createTag({
             iTwinId: args.iTwinId,
             iModelId: args.iModelId,
             displayName: args.displayName,
@@ -105,7 +125,7 @@ export class ITwinSavedViewsClient {
         return tagResponseToSavedViewTag(tag);
     }
     async updateTag(args) {
-        const { tag } = await this.client.updateTag({
+        const { tag } = await this.#client.updateTag({
             tagId: args.tag.id,
             displayName: args.tag.displayName,
             signal: args.signal,
@@ -113,18 +133,20 @@ export class ITwinSavedViewsClient {
         return tagResponseToSavedViewTag(tag);
     }
     async deleteTag(args) {
-        await this.client.deleteTag({ tagId: args.tagId, signal: args.signal });
+        await this.#client.deleteTag({ tagId: args.tagId, signal: args.signal });
     }
 }
 function savedViewResponseToSavedView(response) {
     return {
         id: response.id,
         displayName: response.displayName,
+        viewData: response.savedViewData,
         tagIds: response.tags?.map((tag) => tag.id),
         groupId: response._links.group?.href.split("/").at(-1),
         creatorId: response._links.creator?.href.split("/").at(-1),
         shared: response.shared,
         thumbnail: undefined,
+        extensions: response.extensions,
         creationTime: response.creationTime,
         lastModified: response.lastModified,
     };

package/lib/SavedViewsClient/SavedViewsClient.d.ts

@@ -1,15 +1,12 @@
-import type { ExtensionMin, ExtensionSavedViewCreate, SavedViewRepresentation, ViewData } from "@itwin/saved-views-client";
-import type { SavedView, SavedViewGroup, SavedViewTag } from "../SavedView.js";
-export interface SavedViewInfo {
-    savedViews: SavedView[];
-    groups: SavedViewGroup[];
-    tags: SavedViewTag[];
-}
+import type { SavedView, SavedViewGroup, SavedViewTag, WriteableSavedViewProperties } from "../SavedView.js";
+import type { PartialExcept } from "../utils.js";
 export interface SavedViewsClient {
-    getSavedViewInfo: (args: GetSavedViewInfoParams) => Promise<SavedViewInfo>;
-    getSingularSavedView: (args: GetSingularSavedViewParams) => Promise<SavedViewRepresentation>;
+    getAllSavedViews: (args: GetAllSavedViewsParams) => AsyncIterableIterator<SavedView[]>;
+    getAllGroups: (args: GetAllGroupsParams) => Promise<SavedViewGroup[]>;
+    getAllTags: (args: GetAllTagsParams) => Promise<SavedViewTag[]>;
     getThumbnailUrl: (args: GetThumbnailUrlParams) => Promise<string | undefined>;
     uploadThumbnail: (args: UploadThumbnailParams) => Promise<void>;
+    getSavedView: (args: GetSavedViewParams) => Promise<SavedView>;
     createSavedView: (args: CreateSavedViewParams) => Promise<SavedView>;
     updateSavedView: (args: UpdateSavedViewParams) => Promise<SavedView>;
     deleteSavedView: (args: DeleteSavedViewParams) => Promise<void>;
@@ -20,32 +17,43 @@ export interface SavedViewsClient {
     updateTag: (args: UpdateTagParams) => Promise<SavedViewTag>;
     deleteTag: (args: DeleteTagParams) => Promise<void>;
 }
-export interface GetSavedViewInfoParams extends CommonParams {
+export interface GetAllSavedViewsParams extends CommonParams {
     iTwinId: string;
     iModelId?: string | undefined;
 }
-export interface GetSingularSavedViewParams extends CommonParams {
-    savedViewId: string;
+export interface GetAllGroupsParams extends CommonParams {
+    iTwinId: string;
+    iModelId?: string | undefined;
+}
+export interface GetAllTagsParams extends CommonParams {
+    iTwinId: string;
+    iModelId?: string | undefined;
 }
 export interface GetThumbnailUrlParams extends CommonParams {
     savedViewId: string;
 }
 export interface UploadThumbnailParams extends CommonParams {
     savedViewId: string;
-    /** Image data encoded as base64 data URL. */
+    /**
+     * Image data encoded as base64 data URL.
+     *
+     * @example
+     * "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII="
+     */
     image: string;
 }
+export interface GetSavedViewParams extends CommonParams {
+    savedViewId: string;
+}
 export interface CreateSavedViewParams extends CommonParams {
     iTwinId: string;
     iModelId?: string | undefined;
-    savedView: Pick<SavedView, "displayName" | "tagIds" | "groupId" | "shared">;
-    savedViewData: ViewData;
-    extensions?: ExtensionSavedViewCreate[] | undefined;
+    savedView: PartialExcept<WriteableSavedViewProperties, "displayName" | "viewData">;
 }
 export interface UpdateSavedViewParams extends CommonParams {
-    savedView: Pick<SavedView, "id"> & Partial<SavedView>;
-    savedViewData?: ViewData | undefined;
-    extensions?: ExtensionMin[] | undefined;
+    savedView: Partial<WriteableSavedViewProperties> & {
+        id: string;
+    };
 }
 export interface DeleteSavedViewParams extends CommonParams {
     savedViewId: string;

package/lib/applySavedView.d.ts

@@ -1,5 +1,5 @@
 import { ViewState, type IModelConnection, type Viewport } from "@itwin/core-frontend";
-import { type SavedViewRepresentation } from "@itwin/saved-views-client";
+import type { SavedView } from "./SavedView.js";
 export interface ApplySavedViewSettings {
     /**
      * Strategy to use when other setting does not specify one. By default, viewport is reset to default state and then
@@ -11,8 +11,8 @@ export interface ApplySavedViewSettings {
      */
     all?: ApplyStrategy | undefined;
     /**
-     * How to handle captured {@link ViewState} data. The default behavior is to generate a new `ViewState` object and
-     * apply it to viewport.
+     * How to handle captured {@link ViewState} data. The default behavior is to generate a new `ViewState` object out of
+     * {@linkcode SavedView.viewData} and apply it to viewport.
      *
      * You can optionally provide a pre-made `ViewState` instance to conserve resources. It is usually obtained from
      * {@link createViewState} result.
@@ -25,8 +25,11 @@ export interface ApplySavedViewSettings {
      *   applySavedView(iModel, viewport1, savedView, { viewState }),
      *   applySavedView(iModel, viewport2, savedView, { viewState }),
      * ]);
+     *
+     * @remarks
+     * When neither `SavedView.viewData` nor `ViewState` is provided, current {@linkcode Viewport.view} is preserved.
      */
-    viewState?: Exclude<ApplyStrategy, "reset"> | ViewState | undefined;
+    viewState?: ApplyStrategy | ViewState | undefined;
     /**
      * How to handle visibility of models and categories that exist in iModel but are not captured in Saved View data. Has
      * effect only when `modelAndCategoryVisibility` strategy is set to `"apply"`.
@@ -56,9 +59,9 @@ type ApplyStrategy = "apply" | "reset" | "keep";
  * // e.g. when applying the same Saved View to multiple viewports
  * const viewState = await createViewState(iModel, savedView);
  * await Promise.all([
- *   applySavedView(iModel, firstViewport, savedView, { viewState }),
- *   applySavedView(iModel, secondViewport, savedView, { viewState }),
+ *   applySavedView(iModel, viewport1, savedView, { viewState }),
+ *   applySavedView(iModel, viewport2, savedView, { viewState }),
  * ]);
  */
-export declare function applySavedView(iModel: IModelConnection, viewport: Viewport, savedView: Pick<SavedViewRepresentation, "savedViewData" | "extensions">, settings?: ApplySavedViewSettings | undefined): Promise<void>;
+export declare function applySavedView(iModel: IModelConnection, viewport: Viewport, savedViewData: Pick<SavedView, "viewData" | "extensions">, settings?: ApplySavedViewSettings | undefined): Promise<void>;
 export {};

package/lib/applySavedView.js

@@ -13,23 +13,23 @@ import { extensionHandlers } from "./translation/SavedViewsExtensionHandlers.js"
  * // e.g. when applying the same Saved View to multiple viewports
  * const viewState = await createViewState(iModel, savedView);
  * await Promise.all([
- *   applySavedView(iModel, firstViewport, savedView, { viewState }),
- *   applySavedView(iModel, secondViewport, savedView, { viewState }),
+ *   applySavedView(iModel, viewport1, savedView, { viewState }),
+ *   applySavedView(iModel, viewport2, savedView, { viewState }),
  * ]);
  */
-export async function applySavedView(iModel, viewport, savedView, settings = {}) {
+export async function applySavedView(iModel, viewport, savedViewData, settings = {}) {
     const defaultStrategy = settings.all ?? "apply";
     if ((settings.viewState ?? defaultStrategy) !== "keep") {
         if (settings.viewState instanceof ViewState) {
             viewport.changeView(settings.viewState);
         }
-        else {
+        else if (savedViewData.viewData) {
             const { modelAndCategoryVisibilityFallback } = settings;
-            const viewState = await createViewState(iModel, savedView.savedViewData, { modelAndCategoryVisibilityFallback });
+            const viewState = await createViewState(iModel, savedViewData.viewData, { modelAndCategoryVisibilityFallback });
             viewport.changeView(viewState);
         }
     }
-    const extensions = new Map(savedView.extensions?.map(({ extensionName, data }) => [extensionName, data]));
+    const extensions = new Map(savedViewData.extensions?.map(({ extensionName, data }) => [extensionName, data]));
     const processExtension = (extensionHandler, strategy = defaultStrategy) => {
         if (strategy === "keep") {
             return;

package/lib/captureSavedViewData.d.ts

@@ -1,11 +1,41 @@
 import { Id64Array } from "@itwin/core-bentley";
 import { type IModelConnection, type Viewport } from "@itwin/core-frontend";
 import { type ViewData } from "@itwin/saved-views-client";
+import type { SavedViewExtension } from "./SavedView.js";
 interface CaptureSavedViewDataArgs {
     /** Viewport to capture. */
     viewport: Viewport;
+    /**
+     * Whether to skip capturing data for `"EmphasizeElements"` extension.
+     * @default false
+     */
+    omitEmphasis?: boolean | undefined;
+    /**
+     * Whether to skip capturing data for `"PerModelCategoryVisibility"` extension.
+     * @default false
+     */
+    omitPerModelCategoryVisibility?: boolean | undefined;
 }
-export declare function captureSavedViewData(args: CaptureSavedViewDataArgs): Promise<ViewData>;
+interface CaptureSavedViewDataResult {
+    viewData: ViewData;
+    /** Value is `undefined` when no extension data is captured. */
+    extensions: SavedViewExtension[] | undefined;
+}
+/**
+ * Captures current {@link Viewport} state into serializable format. The returned data can later be used to restore
+ * viewport's view.
+ *
+ * @example
+ * import { captureSavedViewData, captureSavedViewThumbnail } from "@itwin/saved-views-react";
+ *
+ * async function saveViewport(viewport) {
+ *   const { viewData, extensions = [] } = await captureSavedViewData({ viewport });
+ *   const myExtensions = captureMyCustomState(viewport);
+ *   const thumbnail = captureSavedViewThumbnail(viewport);
+ *   return { thumbnail, viewData, extensions: extensions.concat(myExtensions) };
+ * }
+ */
+export declare function captureSavedViewData(args: CaptureSavedViewDataArgs): Promise<CaptureSavedViewDataResult>;
 export declare function getMissingModels(iModel: IModelConnection, knownModels: Set<string>): Promise<string[]>;
 export declare function getMissingCategories(iModel: IModelConnection, knownCategories: Set<string>): Promise<Id64Array>;
 export {};

package/lib/captureSavedViewData.js

@@ -1,19 +1,45 @@
 import { QueryRowFormat } from "@itwin/core-common";
+import { extensionHandlers } from "./translation/SavedViewsExtensionHandlers.js";
 import { extractClipVectorsFromLegacy } from "./translation/clipVectorsLegacyExtractor.js";
 import { extractDisplayStyle2dFromLegacy, extractDisplayStyle3dFromLegacy, } from "./translation/displayStyleExtractor.js";
+/**
+ * Captures current {@link Viewport} state into serializable format. The returned data can later be used to restore
+ * viewport's view.
+ *
+ * @example
+ * import { captureSavedViewData, captureSavedViewThumbnail } from "@itwin/saved-views-react";
+ *
+ * async function saveViewport(viewport) {
+ *   const { viewData, extensions = [] } = await captureSavedViewData({ viewport });
+ *   const myExtensions = captureMyCustomState(viewport);
+ *   const thumbnail = captureSavedViewThumbnail(viewport);
+ *   return { thumbnail, viewData, extensions: extensions.concat(myExtensions) };
+ * }
+ */
 export async function captureSavedViewData(args) {
-    const hiddenCategoriesPromise = getMissingCategories(args.viewport.iModel, new Set(args.viewport.view.categorySelector.toJSON().categories));
-    if (args.viewport.view.isSpatialView()) {
+    return {
+        viewData: await createSavedViewVariant(args.viewport),
+        extensions: [extensionHandlers.emphasizeElements, extensionHandlers.perModelCategoryVisibility]
+            .map((extension) => ({
+            extensionName: extension.extensionName,
+            data: extension.capture(args.viewport),
+        }))
+            .filter(({ data }) => data !== undefined),
+    };
+}
+async function createSavedViewVariant(viewport) {
+    const hiddenCategoriesPromise = getMissingCategories(viewport.iModel, new Set(viewport.view.categorySelector.toJSON().categories));
+    if (viewport.view.isSpatialView()) {
         const [hiddenCategories, hiddenModels] = await Promise.all([
             hiddenCategoriesPromise,
-            getMissingModels(args.viewport.iModel, new Set(args.viewport.view.modelSelector.toJSON().models)),
+            getMissingModels(viewport.iModel, new Set(viewport.view.modelSelector.toJSON().models)),
         ]);
-        return createSpatialSavedViewObject(args.viewport, hiddenCategories, hiddenModels);
+        return createSpatialSavedViewObject(viewport, hiddenCategories, hiddenModels);
     }
-    if (args.viewport.view.isDrawingView()) {
-        return createDrawingSavedViewObject(args.viewport, await hiddenCategoriesPromise);
+    if (viewport.view.isDrawingView()) {
+        return createDrawingSavedViewObject(viewport, await hiddenCategoriesPromise);
     }
-    return createSheetSavedViewObject(args.viewport, await hiddenCategoriesPromise);
+    return createSheetSavedViewObject(viewport, await hiddenCategoriesPromise);
 }
 function createSpatialSavedViewObject(vp, hiddenCategories, hiddenModels) {
     const viewState = vp.view;

package/lib/captureSavedViewThumbnail.d.ts

@@ -1,3 +1,10 @@
 import { type Viewport } from "@itwin/core-frontend";
-/** Generates Saved View thumbnail based on what is currently visible in the {@linkcode viewport}. */
+/**
+ * Generates Saved View thumbnail based on what is currently displayed on the {@linkcode viewport}.
+ * @returns base64-encoded URL string
+ *
+ * @example
+ * const thumbnail = captureSavedViewThumbnail(viewport);
+ * console.log(thumbnail); // "data:image/png;base64,iVBORw0KGoAAAANSUhEUg..."
+ */
 export declare function captureSavedViewThumbnail(viewport: Viewport, width?: number, height?: number): string | undefined;

package/lib/captureSavedViewThumbnail.js

@@ -1,6 +1,13 @@
 import { getCenteredViewRect, imageBufferToCanvas } from "@itwin/core-frontend";
 import { Point2d } from "@itwin/core-geometry";
-/** Generates Saved View thumbnail based on what is currently visible in the {@linkcode viewport}. */
+/**
+ * Generates Saved View thumbnail based on what is currently displayed on the {@linkcode viewport}.
+ * @returns base64-encoded URL string
+ *
+ * @example
+ * const thumbnail = captureSavedViewThumbnail(viewport);
+ * console.log(thumbnail); // "data:image/png;base64,iVBORw0KGoAAAANSUhEUg..."
+ */
 export function captureSavedViewThumbnail(viewport, width = 280, height = 200) {
     const thumbnail = getThumbnail(viewport, width, height);
     if (!thumbnail) {

package/lib/createViewState.d.ts

@@ -2,9 +2,14 @@ import { type IModelConnection, type ViewState } from "@itwin/core-frontend";
 import { ViewData } from "@itwin/saved-views-client";
 export interface ViewStateCreateSettings {
     /**
-     * Normally before {@link createViewState} function returns a {@link ViewState}, its {@linkcode ViewState.load} method
-     * is called and awaited. You may skip this step if you intend to perform it later.
+     * Normally {@link createViewState} function invokes and awaits {@linkcode ViewState.load} method before returning.
+     * You may skip this step if you intend to perform it later.
      * @default false
+     *
+     * @example
+     * const viewState = await createViewState(iModel, savedView.viewdata, { skipViewStateLoad: true });
+     * viewState.categorySelector.addCategories("<additional_category_id>");
+     * await viewState.load();
      */
     skipViewStateLoad?: boolean | undefined;
     /**
@@ -13,4 +18,15 @@ export interface ViewStateCreateSettings {
      */
     modelAndCategoryVisibilityFallback?: "visible" | "hidden" | undefined;
 }
-export declare function createViewState(iModel: IModelConnection, savedViewData: ViewData, settings?: ViewStateCreateSettings): Promise<ViewState>;
+/**
+ * Creates {@link ViewState} object out of Saved View data. It provides a lower-level access to view data for advanced
+ * use.
+ *
+ * @example
+ * const viewState = await createViewState(iModel, savedViewData.viewData);
+ * await applySavedView(iModel, viewport, savedViewData, { viewState });
+ *
+ * // The two lines above are equivalent to
+ * await applySavedView(iModel, viewport, savedViewData);
+ */
+export declare function createViewState(iModel: IModelConnection, viewData: ViewData, settings?: ViewStateCreateSettings): Promise<ViewState>;

package/lib/createViewState.js

@@ -8,10 +8,21 @@ import { isViewDataITwin3d, isViewDataITwinDrawing, isViewDataITwinSheet, } from
 import { getMissingCategories, getMissingModels } from "./captureSavedViewData.js";
 import { extractClipVectors } from "./translation/clipVectorsExtractor.js";
 import { extractDisplayStyle, extractDisplayStyle3d } from "./translation/displayStyleExtractor.js";
-export async function createViewState(iModel, savedViewData, settings = {}) {
-    const viewState = await createViewStateVariant(iModel, savedViewData);
+/**
+ * Creates {@link ViewState} object out of Saved View data. It provides a lower-level access to view data for advanced
+ * use.
+ *
+ * @example
+ * const viewState = await createViewState(iModel, savedViewData.viewData);
+ * await applySavedView(iModel, viewport, savedViewData, { viewState });
+ *
+ * // The two lines above are equivalent to
+ * await applySavedView(iModel, viewport, savedViewData);
+ */
+export async function createViewState(iModel, viewData, settings = {}) {
+    const viewState = await createViewStateVariant(iModel, viewData);
     if (settings.modelAndCategoryVisibilityFallback === "visible") {
-        await unhideNewModelsAndCategories(iModel, viewState, savedViewData);
+        await unhideNewModelsAndCategories(iModel, viewState, viewData);
     }
     if (!settings.skipViewStateLoad) {
         await viewState.load();

package/lib/index.d.ts

@@ -4,7 +4,7 @@ export { SavedViewOptions } from "./SavedViewTile/SavedViewOptions.js";
 export { SavedViewTile } from "./SavedViewTile/SavedViewTile.js";
 export { useSavedViewTileContext, type SavedViewTileContext } from "./SavedViewTile/SavedViewTileContext.js";
 export { ITwinSavedViewsClient } from "./SavedViewsClient/ITwinSavedViewsClient.js";
-export type { CreateGroupParams, CreateSavedViewParams, CreateTagParams, DeleteGroupParams, DeleteSavedViewParams, DeleteTagParams, GetSavedViewInfoParams, GetSingularSavedViewParams, GetThumbnailUrlParams, SavedViewInfo, SavedViewsClient, UpdateGroupParams, UpdateSavedViewParams, UpdateTagParams, UploadThumbnailParams, } from "./SavedViewsClient/SavedViewsClient.js";
+export type { CreateGroupParams, CreateSavedViewParams, CreateTagParams, DeleteGroupParams, DeleteSavedViewParams, DeleteTagParams, GetAllGroupsParams, GetAllSavedViewsParams, GetAllTagsParams, GetSavedViewParams, GetThumbnailUrlParams, SavedViewsClient, UpdateGroupParams, UpdateSavedViewParams, UpdateTagParams, UploadThumbnailParams, } from "./SavedViewsClient/SavedViewsClient.js";
 export { SavedViewsContextProvider, type SavedViewsContext } from "./SavedViewsContext.js";
 export { StickyExpandableBlock } from "./StickyExpandableBlock/StickyExpandableBlock.js";
 export { TileGrid } from "./TileGrid/TileGrid.js";

package/lib/translation/SavedViewsExtensionHandlers.d.ts

@@ -3,16 +3,19 @@ export interface ExtensionHandler {
     extensionName: string;
     apply: (extensionData: string, viewport: Viewport) => void;
     reset: (viewport: Viewport) => void;
+    capture: (viewport: Viewport) => string | undefined;
 }
 export declare const extensionHandlers: {
     emphasizeElements: {
         extensionName: string;
         apply: (extensionData: string, viewport: Viewport) => void;
         reset: (viewport: Viewport) => void;
+        capture: (viewport: Viewport) => string | undefined;
     };
     perModelCategoryVisibility: {
         extensionName: string;
         apply: (extensionData: string, viewport: Viewport) => void;
         reset: (viewport: Viewport) => void;
+        capture: (viewport: Viewport) => string | undefined;
     };
 };

package/lib/translation/SavedViewsExtensionHandlers.js

@@ -21,6 +21,10 @@ export const extensionHandlers = {
                 viewport.isFadeOutActive = false;
             }
         },
+        capture: (viewport) => {
+            const emphasizeElementsProps = EmphasizeElements.get(viewport)?.toJSON(viewport);
+            return emphasizeElementsProps ? JSON.stringify({ emphasizeElementsProps }) : undefined;
+        },
     },
     perModelCategoryVisibility: {
         extensionName: "PerModelCategoryVisibility",
@@ -35,5 +39,15 @@ export const extensionHandlers = {
         reset: (viewport) => {
             viewport.perModelCategoryVisibility.clearOverrides();
         },
+        capture: (viewport) => {
+            if (!viewport.view.isSpatialView()) {
+                return undefined;
+            }
+            const props = [];
+            for (const { modelId, categoryId, visible } of viewport.perModelCategoryVisibility) {
+                props.push({ modelId, categoryId, visible });
+            }
+            return props.length > 0 ? JSON.stringify({ perModelCategoryVisibilityProps: props }) : undefined;
+        },
     },
 };

package/lib/translation/displayStyleExtractor.js

@@ -14,9 +14,18 @@ const viewFlagMappings = [
     extractBoolean("hiddenEdges", "hidEdges"),
     extractBoolean("shadows"),
     extractBoolean("clipVolume", "clipVol"),
+    extractBoolean("hiddenLineMaterialColors", "hlMatColors"),
     extractBoolean("monochrome"),
     extractBoolean("backgroundMap"),
     extractBoolean("ambientOcclusion"),
+    extractBoolean("acs"),
+    extractBoolean("thematicDisplay"),
+    extractBoolean("wiremesh"),
+    extractBoolean("forceSurfaceDiscard"),
+    extractBoolean("noWhiteOnWhiteReversal"),
+    extractBoolean("noSolarLight"),
+    extractBoolean("noSourceLights"),
+    extractBoolean("noCameraLights"),
 ];
 const viewFlagLegacyMappings = [
     extractNumber("renderMode"),
@@ -33,9 +42,18 @@ const viewFlagLegacyMappings = [
     extractBoolean("hidEdges", "hiddenEdges"),
     extractBoolean("shadows"),
     extractBoolean("clipVol", "clipVolume"),
+    extractBoolean("hlMatColors", "hiddenLineMaterialColors"),
     extractBoolean("monochrome"),
     extractBoolean("backgroundMap"),
     extractBoolean("ambientOcclusion"),
+    extractBoolean("acs"),
+    extractBoolean("thematicDisplay"),
+    extractBoolean("wiremesh"),
+    extractBoolean("forceSurfaceDiscard"),
+    extractBoolean("noWhiteOnWhiteReversal"),
+    extractBoolean("noSolarLight"),
+    extractBoolean("noSourceLights"),
+    extractBoolean("noCameraLights"),
 ];
 const planarClipMaskMappings = [
     extractNumber("mode"),
@@ -284,6 +302,56 @@ const hiddenLineSettingsLegacyMappings = [
     extractObject(hiddenLineStyleLegacyMappings, "hidden"),
     extractNumber("transThreshold", "transparencyThreshold"),
 ];
+const keyColorPropsMappings = [
+    extractNumber("value"),
+    extractColor("color"),
+];
+const keyColorPropsLegacyMappings = [
+    extractNumber("value"),
+    extractColorLegacy("color"),
+];
+const thematicGradientSettingsPropsMappings = [
+    extractNumber("mode"),
+    extractNumber("stepCount"),
+    extractColor("marginColor"),
+    extractNumber("colorScheme"),
+    extractArray(keyColorPropsMappings, "customKeys"),
+    extractNumber("colorMix"),
+    extractNumber("transparencyMode"),
+];
+const thematicGradientSettingsPropsLegacyMappings = [
+    extractNumber("mode"),
+    extractNumber("stepCount"),
+    extractColorLegacy("marginColor"),
+    extractNumber("colorScheme"),
+    extractArray(keyColorPropsLegacyMappings, "customKeys"),
+    extractNumber("colorMix"),
+    extractNumber("transparencyMode"),
+];
+const thematicDisplaySensorPropsMappings = [
+    extractSimpleArray(simpleTypeOf("number"), "position"),
+    extractNumber("value"),
+];
+const thematicDisplaySensorSettingsPropsMappings = [
+    extractArray(thematicDisplaySensorPropsMappings, "sensors"),
+    extractNumber("distanceCutoff"),
+];
+const thematicDisplaySettingsMappings = [
+    extractNumber("displayMode"),
+    extractObject(thematicGradientSettingsPropsMappings, "gradientSettings"),
+    extractSimpleArray(simpleTypeOf("number"), "range"),
+    extractSimpleArray(simpleTypeOf("number"), "axis"),
+    extractSimpleArray(simpleTypeOf("number"), "sunDirection"),
+    extractObject(thematicDisplaySensorSettingsPropsMappings, "gradientSettings"),
+];
+const thematicDisplaySettingsLegacyMappings = [
+    extractNumber("displayMode"),
+    extractObject(thematicGradientSettingsPropsLegacyMappings, "gradientSettings"),
+    extractSimpleArray(simpleTypeOf("number"), "range"),
+    extractSimpleArray(simpleTypeOf("number"), "axis"),
+    extractSimpleArray(simpleTypeOf("number"), "sunDirection"),
+    extractObject(thematicDisplaySensorSettingsPropsMappings, "gradientSettings"),
+];
 const cutStyleMappings = [
     extractObject(viewFlagOverridesMapping, "viewflags"),
     extractObject(hiddenLineSettingsMappings, "hiddenLine"),
@@ -475,6 +543,8 @@ const displayStyle3dMapping = [
     extractObject(solarShadowMappings, "solarShadows"),
     extractObject(lightsMappings, "lights"),
     extractPlainTypedMap(planProjectionSettingsMappings, simpleTypeOf("string"), "planProjections"),
+    extractObject(thematicDisplaySettingsMappings, "thematic"),
+    extractObject(hiddenLineSettingsMappings, "hiddenLine", "hline"),
 ];
 const displayStyle3dLegacyMapping = [
     ...displayStylesLegacyMapping,
@@ -483,6 +553,8 @@ const displayStyle3dLegacyMapping = [
     extractObject(solarShadowLegacyMappings, "solarShadows"),
     extractObject(lightsLegacyMappings, "lights"),
     extractPlainTypedMap(planProjectionSettingsMappings, simpleTypeOf("string"), "planProjections"),
+    extractObject(thematicDisplaySettingsLegacyMappings, "thematic"),
+    extractObject(hiddenLineSettingsLegacyMappings, "hline", "hiddenLine"),
 ];
 /**
  * Extracts the display style from a legacy view displayStyle field

package/lib/useSavedViews.d.ts

@@ -1,6 +1,6 @@
-import type { ViewData } from "@itwin/saved-views-client";
-import type { SavedView, SavedViewGroup, SavedViewTag } from "./SavedView.js";
+import type { SavedView, SavedViewGroup, SavedViewTag, WriteableSavedViewProperties } from "./SavedView.js";
 import type { SavedViewsClient } from "./SavedViewsClient/SavedViewsClient.js";
+import type { PartialExcept } from "./utils.js";
 interface UseSavedViewsParams {
     /** iTwin identifier. */
     iTwinId: string;
@@ -25,7 +25,7 @@ interface UseSavedViewsResult {
     actions: SavedViewActions;
 }
 export interface SavedViewActions {
-    submitSavedView: (savedView: string | Partial<SavedView> & Pick<SavedView, "displayName">, savedViewData: ViewData) => Promise<string>;
+    submitSavedView: (savedView: SavedViewCreationProps | SavedViewUpdateProps) => Promise<string>;
     renameSavedView: (savedViewId: string, newName: string | undefined) => void;
     shareSavedView: (savedViewId: string, share: boolean) => void;
     deleteSavedView: (savedViewId: string) => void;
@@ -40,11 +40,16 @@ export interface SavedViewActions {
     removeTag: (savedViewId: string, tagId: string) => void;
     uploadThumbnail: (savedViewId: string, imageDataUrl: string) => void;
 }
+type SavedViewCreationProps = PartialExcept<WriteableSavedViewProperties, "displayName" | "viewData">;
+type SavedViewUpdateProps = WriteableSavedViewProperties & {
+    id: string;
+};
 /**
  * Pulls Saved View data from a store and provides means to update and synchronize the data back to it. Interaction with
  * the store is performed via {@linkcode SavedViewsClient} interface which could communicate, for instance, with
  * [iTwin Saved Views API](https://developer.bentley.com/apis/savedviews/overview/) using `ITwinSavedViewsClient`.
  *
+ * @remarks
  * Note on the current implementation limitations. While the result of the first update action is reflected immediately,
  * subsequent actions are put in a queue and executed serially. This may cause the UI to feel sluggish when user makes
  * changes to Saved Views faster than the Saved Views store can be updated.

package/lib/useSavedViews.js

@@ -1,10 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
 import { useCallback, useEffect, useRef, useState, } from "react";
 /**
  * Pulls Saved View data from a store and provides means to update and synchronize the data back to it. Interaction with
  * the store is performed via {@linkcode SavedViewsClient} interface which could communicate, for instance, with
  * [iTwin Saved Views API](https://developer.bentley.com/apis/savedviews/overview/) using `ITwinSavedViewsClient`.
  *
+ * @remarks
  * Note on the current implementation limitations. While the result of the first update action is reflected immediately,
  * subsequent actions are put in a queue and executed serially. This may cause the UI to feel sluggish when user makes
  * changes to Saved Views faster than the Saved Views store can be updated.
@@ -66,11 +71,7 @@ export function useSavedViews(args) {
         providerRef.current.actionQueue = [];
         void (async () => {
             try {
-                const result = await args.client.getSavedViewInfo({
-                    iTwinId: args.iTwinId,
-                    iModelId: args.iModelId,
-                    signal: signal,
-                });
+                const result = await getSavedViewInfo(args.client, args.iTwinId, args.iModelId, signal);
                 if (signal.aborted) {
                     return;
                 }
@@ -118,28 +119,30 @@ function useEvent(handleEvent) {
     handleEventRef.current = handleEvent;
     return useCallback((...args) => handleEventRef.current(...args), []);
 }
+async function getSavedViewInfo(client, iTwinId, iModelId, signal) {
+    const args = { iTwinId, iModelId, signal };
+    const collectSavedViews = async () => {
+        let savedViews = [];
+        const iterable = client.getAllSavedViews(args);
+        for await (const page of iterable) {
+            savedViews = savedViews.concat(page);
+        }
+        return savedViews;
+    };
+    const [savedViews, groups, tags] = await Promise.all([
+        collectSavedViews(),
+        client.getAllGroups(args),
+        client.getAllTags(args),
+    ]);
+    return { savedViews, groups, tags };
+}
 function createSavedViewActions(iTwinId, iModelId, client, setState, ref, onUpdateInProgress, onUpdateComplete, onUpdateError) {
     const signal = ref.current.abortController.signal;
     return {
-        submitSavedView: actionWrapper(async (savedView, savedViewData) => {
-            let newSavedView;
-            if (typeof savedView !== "string" && savedView.id) {
-                newSavedView = await client.updateSavedView({
-                    // TypeScript cannot tell that `savedView` object contains `id` string without a little help
-                    savedView: { id: savedView.id, ...savedView },
-                    savedViewData,
-                    signal,
-                });
-            }
-            else {
-                newSavedView = await client.createSavedView({
-                    iTwinId: iTwinId,
-                    iModelId: iModelId,
-                    savedView: typeof savedView === "string" ? { displayName: savedView } : savedView,
-                    savedViewData,
-                    signal,
-                });
-            }
+        submitSavedView: actionWrapper(async (savedView) => {
+            const newSavedView = "id" in savedView
+                ? await client.updateSavedView({ savedView, signal })
+                : await client.createSavedView({ iTwinId, iModelId, savedView, signal });
             updateSavedViews((savedViews) => {
                 const entries = Array.from(savedViews.values());
                 entries.push(newSavedView);

package/lib/utils.d.ts

@@ -1 +1,2 @@
+export type PartialExcept<T, K extends keyof T> = Partial<Omit<T, K>> & Pick<Required<T>, K>;
 export declare function trimInputString(string: string): string;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@itwin/saved-views-react",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "license": "MIT",
   "repository": {
     "type": "git",
     "url": "https://github.com/iTwin/saved-views.git",
     "directory": "packages/saved-views-react"
   },
-  "homepage": "https://github.com/iTwin/saved-views",
+  "homepage": "https://github.com/iTwin/saved-views/tree/master/packages/saved-views-react",
   "author": {
     "name": "Bentley Systems, Inc.",
     "url": "https://www.bentley.com"
@@ -58,10 +58,10 @@
     "react-dom": "^17.0.0 || ^18.0.0"
   },
   "dependencies": {
-    "@itwin/itwinui-icons-react": "^2.4.0",
+    "@itwin/itwinui-icons-react": "^2.9.0",
     "@itwin/itwinui-react": "^3.8.1",
     "fuse.js": "^6.6.2",
-    "@itwin/saved-views-client": "^0.3.0"
+    "@itwin/saved-views-client": "^0.4.0"
   },
   "scripts": {
     "build": "run-p build:*",