@ynput/ayon-frontend-shared 0.2.9 → 0.2.10

package/dist/shared/src/context/DetailsPanelContext.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsPanelContext.es.js","sources":["../../../../src/context/DetailsPanelContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useCallback, ReactNode, useState } from 'react'\nimport { useLocalStorage } from '@shared/hooks'\nimport { DetailsPanelEntityType } from '@shared/api'\nimport type { UserModel } from '@shared/api'\nimport { useLocation, useNavigate, useParams } from 'react-router-dom'\nimport { useSearchParams } from 'react-router-dom'\n\nexport type FeedFilters = 'activity' | 'comments' | 'versions' | 'checklists'\n\nexport type DetailsPanelTab = FeedFilters | 'attribs' | 'files'\n\nexport type SlideOut = {\n  entityId: string\n  entityType: DetailsPanelEntityType\n  projectName: string\n}\n\nexport type DetailsPanelPip = {\n  entityType: DetailsPanelEntityType\n  entities: { id: string; projectName: string }[]\n  scope: string\n}\n\nexport interface OpenStateByScope {\n  [scope: string]: boolean\n}\n\n// Create a new interface for managing tab state by scope\nexport interface TabStateByScope {\n  [scope: string]: DetailsPanelTab\n}\n\n// these props get forwarded to the details panel value\n// it's mainly redux callbacks that cannot be used in shared library\nexport interface DetailsPanelContextProps {\n  dispatch?: any // this is a redux dispatch function and it's quite annoying we need to do this\n  user: UserModel\n  viewer?: {\n    reviewableIds: string[]\n    taskId?: string | null\n    folderId?: string | null\n  }\n  // redux callback actions\n  onOpenImage?: (args: any) => void\n  onGoToFrame?: (frame: number) => void\n  onOpenViewer?: (args: any) => void\n  onUpdateEntity?: (data: { operations: any[]; entityType: string }) => void\n  // route hooks\n  useParams: typeof useParams\n  useNavigate: typeof useNavigate\n  useLocation: typeof useLocation\n  useSearchParams: typeof useSearchParams\n}\n\n// Interface for our simplified context\nexport interface DetailsPanelContextType extends DetailsPanelContextProps {\n  // Open state for the panel by scope\n  panelOpenByScope: OpenStateByScope\n  getOpenForScope: (scope: string) => boolean\n  setPanelOpen: (scope: string, isOpen: boolean) => void\n  setPanelOpenByScope: (newState: OpenStateByScope) => void\n\n  // Tab preferences by scope\n  tabsByScope: TabStateByScope\n  getTabForScope: (scope: string) => DetailsPanelTab\n  setTab: (scope: string, tab: DetailsPanelTab) => void\n\n  // Slide out state\n  slideOut: null | SlideOut\n  openSlideOut: (slideOut: SlideOut) => void\n  closeSlideOut: () => void\n\n  // Highlighted activities\n  highlightedActivities: string[]\n  setHighlightedActivities: (activities: string[]) => void\n\n  // PiP state\n  pip: DetailsPanelPip | null\n  openPip: (pip: DetailsPanelPip) => void\n  closePip: () => void\n}\n\n// Create the context\nconst DetailsPanelContext = createContext<DetailsPanelContextType | undefined>(undefined)\n\n// Provider component\nexport interface DetailsPanelProviderProps extends DetailsPanelContextProps {\n  children: ReactNode\n  defaultTab?: DetailsPanelTab\n}\n\nexport const DetailsPanelProvider: React.FC<DetailsPanelProviderProps> = ({\n  children,\n  defaultTab = 'activity',\n  ...forwardedProps\n}) => {\n  // keep track of the currently open panel by scope\n  const [panelOpenByScope, setPanelOpenByScope] = useState<OpenStateByScope>({})\n\n  //  get the current open state for a specific scope\n  const getOpenForScope = useCallback(\n    (scope: string): boolean => {\n      // Check if we have a saved preference for this scope\n      if (panelOpenByScope[scope]) {\n        return panelOpenByScope[scope]\n      }\n\n      // Fall back to default\n      return false\n    },\n    [panelOpenByScope],\n  )\n  // Set open state for a scope\n  const setPanelOpen = useCallback(\n    (scope: string, isOpen: boolean) => {\n      // Create a new state object based on current open state\n      const newState = { ...panelOpenByScope }\n      newState[scope] = isOpen\n\n      // Update the state with the new object\n      setPanelOpenByScope(newState)\n    },\n    [panelOpenByScope],\n  )\n\n  // Use localStorage to persist tab preferences by scope\n  const [tabsByScope, setTabsByScope] = useLocalStorage<TabStateByScope>(\n    'details/tabs-by-scope',\n    {},\n  )\n\n  // Get the current tab for a specific scope\n  const getTabForScope = useCallback(\n    (scope: string): DetailsPanelTab => {\n      // Check if we have a saved preference for this scope\n      if (tabsByScope[scope]) {\n        return tabsByScope[scope]\n      }\n\n      // Fall back to default\n      return defaultTab\n    },\n    [tabsByScope, defaultTab],\n  )\n\n  // Set tab for a scope\n  const setTab = useCallback(\n    (scope: string, tab: DetailsPanelTab) => {\n      // Create a new state object based on current tabsByScope\n      const newState = { ...tabsByScope }\n      newState[scope] = tab\n\n      // Update the state with the new object\n      setTabsByScope(newState)\n    },\n    [tabsByScope, setTabsByScope],\n  )\n\n  // is the slide out open?\n  const [slideOut, setSlideOut] = useState<null | SlideOut>(null)\n\n  // open the slide out\n  const openSlideOut = useCallback<DetailsPanelContextType['openSlideOut']>((params) => {\n    setSlideOut(params)\n  }, [])\n\n  // close the slide out\n  const closeSlideOut = useCallback(() => {\n    setSlideOut(null)\n    setHighlightedActivities([])\n  }, [])\n\n  const [pip, setPip] = useState<DetailsPanelPip | null>(null)\n\n  const openPip = useCallback((pip: DetailsPanelPip) => {\n    setPip(pip)\n  }, [])\n  const closePip = useCallback(() => {\n    setPip(null)\n  }, [])\n\n  const [highlightedActivities, setHighlightedActivities] = useState<string[]>([])\n\n  const value = {\n    // open state for the panel by scope\n    panelOpenByScope,\n    getOpenForScope,\n    setPanelOpen,\n    setPanelOpenByScope,\n    // tab preferences\n    tabsByScope,\n    getTabForScope,\n    setTab,\n    // slide out state\n    slideOut,\n    openSlideOut,\n    closeSlideOut,\n    // highlighted activities\n    highlightedActivities,\n    setHighlightedActivities,\n    // PiP state\n    pip,\n    openPip,\n    closePip,\n    ...forwardedProps,\n  }\n\n  return <DetailsPanelContext.Provider value={value}>{children}</DetailsPanelContext.Provider>\n}\n\n// Custom hook to use the details context\nexport const useDetailsPanelContext = (): DetailsPanelContextType => {\n  const context = useContext(DetailsPanelContext)\n  if (context === undefined) {\n    throw new Error('useDetailsPanel must be used within a DetailsProvider')\n  }\n  return context\n}\n\n// Add a specialized hook for using a panel in a specific scope\nexport const useScopedDetailsPanel = (scope: string) => {\n  const { getTabForScope, setTab, getOpenForScope, setPanelOpen } = useDetailsPanelContext()\n\n  return {\n    isOpen: getOpenForScope(scope),\n    setOpen: (isOpen: boolean) => setPanelOpen(scope, isOpen),\n    currentTab: getTabForScope(scope),\n    setTab: (tab: DetailsPanelTab) => setTab(scope, tab),\n    isFeed: ['activity', 'comments', 'versions', 'checklists'].includes(getTabForScope(scope)),\n  }\n}\n"],"names":["pip","jsx"],"mappings":"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"}
+{"version":3,"file":"DetailsPanelContext.es.js","sources":["../../../../src/context/DetailsPanelContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useCallback, ReactNode, useState } from 'react'\nimport { useLocalStorage } from '@shared/hooks'\nimport { DetailsPanelEntityType } from '@shared/api'\nimport type { UserModel } from '@shared/api'\nimport { useLocation, useNavigate, useParams } from 'react-router-dom'\nimport { useSearchParams } from 'react-router-dom'\nimport { SavedAnnotationMetadata } from '@shared/containers'\n\nexport type FeedFilters = 'activity' | 'comments' | 'versions' | 'checklists'\n\nexport type DetailsPanelTab = FeedFilters | 'attribs' | 'files'\n\nexport type SlideOut = {\n  entityId: string\n  entityType: DetailsPanelEntityType\n  projectName: string\n}\n\nexport type DetailsPanelPip = {\n  entityType: DetailsPanelEntityType\n  entities: { id: string; projectName: string }[]\n  scope: string\n}\n\nexport interface OpenStateByScope {\n  [scope: string]: boolean\n}\n\n// Create a new interface for managing tab state by scope\nexport interface TabStateByScope {\n  [scope: string]: DetailsPanelTab\n}\n\n// these props get forwarded to the details panel value\n// it's mainly redux callbacks that cannot be used in shared library\nexport interface DetailsPanelContextProps {\n  dispatch?: any // this is a redux dispatch function and it's quite annoying we need to do this\n  user: UserModel\n  viewer?: {\n    reviewableIds: string[]\n    taskId?: string | null\n    folderId?: string | null\n  }\n  // redux callback actions\n  onOpenImage?: (args: any) => void\n  onGoToFrame?: (frame: number) => void\n  onOpenViewer?: (args: any) => void\n  onUpdateEntity?: (data: { operations: any[]; entityType: string }) => void\n  // route hooks\n  useParams: typeof useParams\n  useNavigate: typeof useNavigate\n  useLocation: typeof useLocation\n  useSearchParams: typeof useSearchParams\n  feedAnnotationsEnabled?: boolean\n}\n\n// Interface for our simplified context\nexport interface DetailsPanelContextType extends DetailsPanelContextProps {\n  // Open state for the panel by scope\n  panelOpenByScope: OpenStateByScope\n  getOpenForScope: (scope: string) => boolean\n  setPanelOpen: (scope: string, isOpen: boolean) => void\n  setPanelOpenByScope: (newState: OpenStateByScope) => void\n\n  // Tab preferences by scope\n  tabsByScope: TabStateByScope\n  getTabForScope: (scope: string) => DetailsPanelTab\n  setTab: (scope: string, tab: DetailsPanelTab) => void\n\n  // Slide out state\n  slideOut: null | SlideOut\n  openSlideOut: (slideOut: SlideOut) => void\n  closeSlideOut: () => void\n\n  // Highlighted activities\n  highlightedActivities: string[]\n  setHighlightedActivities: (activities: string[]) => void\n\n  // PiP state\n  pip: DetailsPanelPip | null\n  openPip: (pip: DetailsPanelPip) => void\n  closePip: () => void\n\n  // Annotations\n  feedAnnotations: SavedAnnotationMetadata[]\n  setFeedAnnotations: (annotations: SavedAnnotationMetadata[]) => void\n}\n\n// Create the context\nconst DetailsPanelContext = createContext<DetailsPanelContextType | undefined>(undefined)\n\n// Provider component\nexport interface DetailsPanelProviderProps extends DetailsPanelContextProps {\n  children: ReactNode\n  defaultTab?: DetailsPanelTab\n}\n\nexport const DetailsPanelProvider: React.FC<DetailsPanelProviderProps> = ({\n  children,\n  defaultTab = 'activity',\n  ...forwardedProps\n}) => {\n  // keep track of the currently open panel by scope\n  const [panelOpenByScope, setPanelOpenByScope] = useState<OpenStateByScope>({})\n  const [feedAnnotations, setFeedAnnotations] = useState<SavedAnnotationMetadata[]>([])\n\n  //  get the current open state for a specific scope\n  const getOpenForScope = useCallback(\n    (scope: string): boolean => {\n      // Check if we have a saved preference for this scope\n      if (panelOpenByScope[scope]) {\n        return panelOpenByScope[scope]\n      }\n\n      // Fall back to default\n      return false\n    },\n    [panelOpenByScope],\n  )\n  // Set open state for a scope\n  const setPanelOpen = useCallback(\n    (scope: string, isOpen: boolean) => {\n      // Create a new state object based on current open state\n      const newState = { ...panelOpenByScope }\n      newState[scope] = isOpen\n\n      // Update the state with the new object\n      setPanelOpenByScope(newState)\n    },\n    [panelOpenByScope],\n  )\n\n  // Use localStorage to persist tab preferences by scope\n  const [tabsByScope, setTabsByScope] = useLocalStorage<TabStateByScope>(\n    'details/tabs-by-scope',\n    {},\n  )\n\n  // Get the current tab for a specific scope\n  const getTabForScope = useCallback(\n    (scope: string): DetailsPanelTab => {\n      // Check if we have a saved preference for this scope\n      if (tabsByScope[scope]) {\n        return tabsByScope[scope]\n      }\n\n      // Fall back to default\n      return defaultTab\n    },\n    [tabsByScope, defaultTab],\n  )\n\n  // Set tab for a scope\n  const setTab = useCallback(\n    (scope: string, tab: DetailsPanelTab) => {\n      // Create a new state object based on current tabsByScope\n      const newState = { ...tabsByScope }\n      newState[scope] = tab\n\n      // Update the state with the new object\n      setTabsByScope(newState)\n    },\n    [tabsByScope, setTabsByScope],\n  )\n\n  // is the slide out open?\n  const [slideOut, setSlideOut] = useState<null | SlideOut>(null)\n\n  // open the slide out\n  const openSlideOut = useCallback<DetailsPanelContextType['openSlideOut']>((params) => {\n    setSlideOut(params)\n  }, [])\n\n  // close the slide out\n  const closeSlideOut = useCallback(() => {\n    setSlideOut(null)\n    setHighlightedActivities([])\n  }, [])\n\n  const [pip, setPip] = useState<DetailsPanelPip | null>(null)\n\n  const openPip = useCallback((pip: DetailsPanelPip) => {\n    setPip(pip)\n  }, [])\n  const closePip = useCallback(() => {\n    setPip(null)\n  }, [])\n\n  const [highlightedActivities, setHighlightedActivities] = useState<string[]>([])\n\n  const value = {\n    // open state for the panel by scope\n    panelOpenByScope,\n    getOpenForScope,\n    setPanelOpen,\n    setPanelOpenByScope,\n    // tab preferences\n    tabsByScope,\n    getTabForScope,\n    setTab,\n    // slide out state\n    slideOut,\n    openSlideOut,\n    closeSlideOut,\n    // highlighted activities\n    highlightedActivities,\n    setHighlightedActivities,\n    // PiP state\n    pip,\n    openPip,\n    closePip,\n    feedAnnotations,\n    setFeedAnnotations,\n    ...forwardedProps,\n  }\n\n  return <DetailsPanelContext.Provider value={value}>{children}</DetailsPanelContext.Provider>\n}\n\n// Custom hook to use the details context\nexport const useDetailsPanelContext = (): DetailsPanelContextType => {\n  const context = useContext(DetailsPanelContext)\n  if (context === undefined) {\n    throw new Error('useDetailsPanel must be used within a DetailsProvider')\n  }\n  return context\n}\n\n// Add a specialized hook for using a panel in a specific scope\nexport const useScopedDetailsPanel = (scope: string) => {\n  const { getTabForScope, setTab, getOpenForScope, setPanelOpen } = useDetailsPanelContext()\n\n  return {\n    isOpen: getOpenForScope(scope),\n    setOpen: (isOpen: boolean) => setPanelOpen(scope, isOpen),\n    currentTab: getTabForScope(scope),\n    setTab: (tab: DetailsPanelTab) => setTab(scope, tab),\n    isFeed: ['activity', 'comments', 'versions', 'checklists'].includes(getTabForScope(scope)),\n  }\n}\n"],"names":["pip","jsx"],"mappings":"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"}

package/dist/types/containers/Feed/components/CommentInput/CommentInput.d.ts

@@ -14,7 +14,7 @@ export declare const mentionTypeOptions: {
 interface CommentInputProps {
     initValue: string | null;
     initFiles?: any[];
-    onSubmit: (markdown: string, files: any[]) => Promise<void>;
+    onSubmit: (markdown: string, files: any[], data?: any) => Promise<void>;
     isEditing?: boolean;
     disabled?: boolean;
     isLoading?: boolean;

package/dist/types/containers/Feed/components/CommentInput/helpers.d.ts

@@ -1,4 +1,9 @@
 export declare const parseImages: (body: any) => any;
 export declare function typeWithDelay(quill: any, retain: any, type: any, delay?: number): Promise<void>;
-export declare const uploadFile: (file: any, projectName: any, onUploadProgress: any) => Promise<unknown>;
+type UploadedFile = {
+    file: any;
+    data: any;
+};
+export declare const uploadFile: (file: any, projectName: any, onUploadProgress: any) => Promise<UploadedFile>;
 export declare const handleFileDrop: (e: any, projectName: any, onProgress: any, onSuccess: any) => void;
+export {};

package/dist/types/containers/Feed/components/CommentInput/hooks/useAnnotationsSync.d.ts

@@ -3,7 +3,7 @@ type Props = {
     filesUploading: File[];
 };
 export type AnnotationPreview = any & {
-    isAnnotation: true;
+    isUnsavedAnnotation: true;
 };
 export declare const filterEntityAnnotations: (annotations: Record<string, any>, entityId: string, filesUploading: File[]) => AnnotationPreview[];
 declare const useAnnotationsSync: ({ entityId, filesUploading }: Props) => {

package/dist/types/containers/Feed/components/CommentInput/hooks/useAnnotationsUpload.d.ts

@@ -1,6 +1,10 @@
+import { SavedAnnotationMetadata } from '../../../index';
 type Props = {
     projectName: string;
     onSuccess: (data: any) => void;
 };
-declare const useAnnotationsUpload: ({ projectName, onSuccess }: Props) => (annotations: any[]) => Promise<any[]>;
+declare const useAnnotationsUpload: ({ projectName, onSuccess }: Props) => (annotations: any[]) => Promise<{
+    files: any[];
+    metadata: SavedAnnotationMetadata[];
+}>;
 export default useAnnotationsUpload;

package/dist/types/containers/Feed/components/FileUploadCard/FileUploadCard.d.ts

@@ -1,14 +1,17 @@
+import { SavedAnnotationMetadata } from '../../..';
 export interface FileUploadCardProps extends React.HTMLAttributes<HTMLDivElement> {
     name: string;
     mime?: string;
     src?: string;
-    isAnnotation?: boolean;
+    isUnsavedAnnotation?: boolean;
+    savedAnnotation: SavedAnnotationMetadata;
     size: number;
     progress: number;
     onRemove?: () => void;
     isCompact?: boolean;
     isDownloadable?: boolean;
     onExpand?: () => void;
+    onJumpTo?: () => void;
 }
-declare const FileUploadCard: ({ name, mime, src, isAnnotation, size, progress, onRemove, isCompact, isDownloadable, onExpand, className, ...props }: FileUploadCardProps) => import("react/jsx-runtime").JSX.Element;
+declare const FileUploadCard: ({ name, mime, src, isUnsavedAnnotation, savedAnnotation, size, progress, onRemove, isCompact, isDownloadable, onExpand, onJumpTo, className, ...props }: FileUploadCardProps) => import("react/jsx-runtime").JSX.Element;
 export default FileUploadCard;

package/dist/types/containers/Feed/components/FileUploadCard/FileUploadCard.styled.d.ts

@@ -2,3 +2,7 @@ export declare const File: import('styled-components/dist/types').IStyledCompone
 export declare const Footer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
 export declare const ContentWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ImageWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Buttons: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ExpandButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<import('@ynput/ayon-react-components').ButtonProps & import('react').RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import('react').DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import('react').RefObject<HTMLButtonElement> | null | undefined;
+}, never>> & string & Omit<import('react').ForwardRefExoticComponent<import('@ynput/ayon-react-components').ButtonProps & import('react').RefAttributes<HTMLButtonElement>>, keyof import('react').Component<any, {}, any>>;

package/dist/types/containers/Feed/components/FilesGrid/FilesGrid.d.ts

@@ -2,7 +2,7 @@ export interface FilesGridProps {
     files?: any[];
     activityId?: string;
     isCompact?: boolean;
-    onRemove?: (id: string, name: string, isAnnotation: boolean) => void;
+    onRemove?: (id: string, name: string, isUnsavedAnnotation: boolean) => void;
     projectName: string;
     isDownloadable?: boolean;
     onExpand?: (data: {

package/dist/types/containers/Feed/helpers/mergeAnnotationAttachments.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (activities: any[]) => any[];
+export default _default;

package/dist/types/containers/Feed/hooks/useCommentMutations.d.ts

@@ -21,7 +21,7 @@ interface CommentMutationsProps {
 }
 export declare const bodyHasChecklist: (body: string) => boolean;
 declare const useCommentMutations: ({ projectName, entityType, entities, filter, }: CommentMutationsProps) => {
-    submitComment: (value: string, files?: File[]) => Promise<void>;
+    submitComment: (value: string, files?: File[], data?: any) => Promise<void>;
     updateComment: (activity: Activity, value: string, files?: File[]) => Promise<void>;
     deleteComment: (id: string, entityId: string, refs?: any[]) => Promise<void>;
     isSaving: boolean;

package/dist/types/containers/Feed/index.d.ts

@@ -5,3 +5,9 @@ export * from './components/FileUploadPreview';
 export * from './context/FeedContext';
 export { ActivityReferenceTooltip, FileUploadPreview };
 export * from './hooks/useTableKeyboardNavigation';
+export type SavedAnnotationMetadata = {
+    id: string;
+    composite: string;
+    transparent: string;
+    range: number[];
+};

package/dist/types/context/DetailsPanelContext.d.ts

@@ -1,6 +1,7 @@
 import { default as React, ReactNode } from 'react';
 import { DetailsPanelEntityType, UserModel } from '../api';
 import { useLocation, useNavigate, useParams, useSearchParams } from 'react-router-dom';
+import { SavedAnnotationMetadata } from '../containers';
 export type FeedFilters = 'activity' | 'comments' | 'versions' | 'checklists';
 export type DetailsPanelTab = FeedFilters | 'attribs' | 'files';
 export type SlideOut = {
@@ -41,6 +42,7 @@ export interface DetailsPanelContextProps {
     useNavigate: typeof useNavigate;
     useLocation: typeof useLocation;
     useSearchParams: typeof useSearchParams;
+    feedAnnotationsEnabled?: boolean;
 }
 export interface DetailsPanelContextType extends DetailsPanelContextProps {
     panelOpenByScope: OpenStateByScope;
@@ -58,6 +60,8 @@ export interface DetailsPanelContextType extends DetailsPanelContextProps {
     pip: DetailsPanelPip | null;
     openPip: (pip: DetailsPanelPip) => void;
     closePip: () => void;
+    feedAnnotations: SavedAnnotationMetadata[];
+    setFeedAnnotations: (annotations: SavedAnnotationMetadata[]) => void;
 }
 export interface DetailsPanelProviderProps extends DetailsPanelContextProps {
     children: ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ynput/ayon-frontend-shared",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "Shared React components for AYON frontend",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",