@pimcore/studio-ui-bundle 2025.4.5 → 2025.4.7

package/dist/build/types/src/core/components/form/controls/numbered-list/provider/numbered-list/numbered-list-provider.d.ts

@@ -21,13 +21,23 @@ export interface NumberedListData {
     onChange?: (value: NumberedListData['values']) => void;
     getAdditionalComponentProps?: (name: NamePath) => Record<string, any>;
 }
-export type NumberedListContextProps = NumberedListData | undefined;
+export interface NumberedListStore {
+    subscribe: (listener: () => void) => () => void;
+    getSnapshot: () => NumberedListData['values'];
+}
+export interface NumberedListContextValue {
+    operations: NumberedListData['operations'];
+    store: NumberedListStore;
+    onChange?: (value: NumberedListData['values']) => void;
+    getAdditionalComponentProps?: (name: NamePath) => Record<string, any>;
+}
+export type NumberedListContextProps = NumberedListContextValue | undefined;
 export declare const NumberedListContext: React.Context<NumberedListContextProps>;
 export interface NumberedListProviderProps {
     children: React.ReactNode;
-    values: NumberedListData['values'];
+    store: NumberedListStore;
     operations: NumberedListData['operations'];
     onChange?: (value: NumberedListData['values']) => void;
     getAdditionalComponentProps?: (name: NamePath) => Record<string, any>;
 }
-export declare const NumberedListProvider: ({ children, values, operations, onChange, getAdditionalComponentProps }: NumberedListProviderProps) => React.JSX.Element;
+export declare const NumberedListProvider: ({ children, store, operations, onChange, getAdditionalComponentProps }: NumberedListProviderProps) => React.JSX.Element;

package/dist/build/types/src/core/components/form/controls/numbered-list/provider/numbered-list/use-numbered-list-value.d.ts

@@ -0,0 +1,14 @@
+/**
+ * This source file is available under the terms of the
+ * Pimcore Open Core License (POCL)
+ * Full copyright and license information is available in
+ * LICENSE.md which is distributed with this source code.
+ *
+ *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
+ *  @license    Pimcore Open Core License (POCL)
+ */
+import { type NamePath } from 'antd/es/form/interface';
+import { type NumberedListContextValue } from './numbered-list-provider';
+export declare const useNumberedListContext: () => NumberedListContextValue;
+export declare const useNumberedListValue: (name: NamePath) => any;
+export declare const useNumberedListSelector: <T = any>(selector: (values: any[]) => T) => T;

package/dist/build/types/src/core/components/form/controls/numbered-list/provider/numbered-list/use-numbered-list.d.ts

@@ -7,8 +7,13 @@
  *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
  *  @license    Pimcore Open Core License (POCL)
  */
+import { type NamePath } from 'antd/es/form/interface';
 import { type NumberedListData } from './numbered-list-provider';
-export interface UseNumberedListReturn extends NumberedListData {
+export interface UseNumberedListReturn {
+    values: NumberedListData['values'];
+    operations: NumberedListData['operations'];
+    onChange?: (value: NumberedListData['values']) => void;
+    getAdditionalComponentProps?: (name: NamePath) => Record<string, any>;
     getValueByKey: (key: string) => any;
 }
 export declare const useNumberedList: () => UseNumberedListReturn;

package/dist/build/types/src/core/components/formatted-date-time/formatted-date-time.d.ts

@@ -10,6 +10,7 @@
 import React from 'react';
 interface FormattedDateProps {
     timestamp: number;
+    timeStyle?: 'short' | 'medium' | 'long' | 'full';
 }
 declare const FormattedDateTime: (props: FormattedDateProps) => React.JSX.Element;
 export { FormattedDateTime };

package/dist/build/types/src/core/components/header/header.d.ts

@@ -8,9 +8,17 @@
  *  @license    Pimcore Open Core License (POCL)
  */
 import React from 'react';
+import { type FlexProps } from 'antd';
+import { type BoxProps } from '../../components/box/box';
 export interface HeaderProps extends React.HTMLAttributes<HTMLDivElement> {
     icon?: React.JSX.Element;
     fullWidth?: boolean;
-    title: string;
+    title?: string;
+    justify?: FlexProps['justify'];
+    align?: FlexProps['align'];
+    position?: 'top' | 'bottom' | 'content' | 'none';
+    borderStyle?: 'default' | 'primary';
+    padding?: BoxProps['padding'];
+    margin?: BoxProps['margin'];
 }
 export declare const Header: (props: HeaderProps) => React.JSX.Element;

package/dist/build/types/src/core/components/header/header.stories.d.ts

@@ -0,0 +1,19 @@
+/**
+ * This source file is available under the terms of the
+ * Pimcore Open Core License (POCL)
+ * Full copyright and license information is available in
+ * LICENSE.md which is distributed with this source code.
+ *
+ *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
+ *  @license    Pimcore Open Core License (POCL)
+ */
+import { Header } from '../../components/header/header';
+import { type StoryObj, type Meta } from '@storybook/react';
+declare const config: Meta;
+export default config;
+type Story = StoryObj<typeof Header>;
+export declare const _default: Story;
+export declare const WithActions: Story;
+export declare const WithActionsAndBorder: Story;
+export declare const OnlyTitle: Story;
+export declare const OnlyTitleWithIcon: Story;

package/dist/build/types/src/core/components/header/header.styles.d.ts

@@ -10,6 +10,7 @@
 export declare const useStyles: (props?: unknown) => {
     styles: {
         header: string;
+        headlineMode: string;
     };
     cx: import("antd-style/es/types").ClassNamesUtil;
     theme: import("antd-style/lib/types/theme").FullToken;

package/dist/build/types/src/core/components/icon-selector/utils/element-icon.test.d.ts

@@ -0,0 +1,10 @@
+/**
+ * This source file is available under the terms of the
+ * Pimcore Open Core License (POCL)
+ * Full copyright and license information is available in
+ * LICENSE.md which is distributed with this source code.
+ *
+ *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
+ *  @license    Pimcore Open Core License (POCL)
+ */
+export {};

package/dist/build/types/src/core/components/image-preview/image-preview.stories.d.ts

@@ -7,6 +7,7 @@
  *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
  *  @license    Pimcore Open Core License (POCL)
  */
+import React from 'react';
 import { type Meta } from '@storybook/react';
 declare const config: Meta;
 export default config;
@@ -19,3 +20,30 @@ export declare const _default: {
         };
     };
 };
+export declare const WithDropdownItems: {
+    args: {
+        width: number;
+        height: number;
+        style: {
+            border: string;
+        };
+        dropdownItems: ({
+            key: string;
+            label: string;
+            icon: React.JSX.Element;
+            type?: undefined;
+        } | {
+            type: string;
+            key: string;
+            label?: undefined;
+            icon?: undefined;
+        })[];
+    };
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};

package/dist/build/types/src/core/components/modal/form-modal/form-modal.stories.d.ts

@@ -29,6 +29,14 @@ export declare const InputWithInitialValue: {
         initialValue: string;
     };
 };
+export declare const InputWithWarning: {
+    args: {
+        type: string;
+        title: string;
+        label: string;
+        warningMessage: string;
+    };
+};
 export declare const Confirmation: {
     args: {
         type: string;

package/dist/build/types/src/core/components/modal/form-modal/hooks/form-modal-types.d.ts

@@ -0,0 +1,47 @@
+/**
+ * This source file is available under the terms of the
+ * Pimcore Open Core License (POCL)
+ * Full copyright and license information is available in
+ * LICENSE.md which is distributed with this source code.
+ *
+ *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
+ *  @license    Pimcore Open Core License (POCL)
+ */
+import { type ModalFuncProps } from 'antd';
+import { type Rule } from 'antd/lib/form';
+export type ConfigUpdate = ModalFuncProps | ((prevConfig: ModalFuncProps) => ModalFuncProps);
+export type InputFormModalProps = Omit<ModalFuncProps, 'content'> & {
+    label?: string;
+    rule?: Rule;
+    initialValue?: string;
+    warningMessage?: string;
+};
+export type TextareaFormModalProps = Omit<ModalFuncProps, 'content'> & {
+    label?: string;
+    initialValue?: string;
+    placeholder?: string;
+};
+export interface UploadFormModalProps extends Omit<InputFormModalProps, 'initialValues'> {
+    accept?: string;
+}
+export type ConfirmFormModalProps = ModalFuncProps & {
+    dontAskAgainKey?: string;
+};
+export interface UseFormModalHookResponse {
+    input: (props: InputFormModalProps) => {
+        destroy: () => void;
+        update: (configUpdate: ConfigUpdate) => void;
+    };
+    textarea: (props: TextareaFormModalProps) => {
+        destroy: () => void;
+        update: (configUpdate: ConfigUpdate) => void;
+    };
+    confirm: (props: ConfirmFormModalProps) => {
+        destroy: () => void;
+        update: (configUpdate: ConfigUpdate) => void;
+    };
+    upload: (props: UploadFormModalProps) => {
+        destroy: () => void;
+        update: (configUpdate: ConfigUpdate) => void;
+    };
+}

package/dist/build/types/src/core/components/modal/form-modal/hooks/use-form-modal.d.ts

@@ -9,45 +9,10 @@
  */
 import React from 'react';
 import { type ModalFuncProps } from 'antd';
-import { type Rule } from 'antd/lib/form';
-export type ConfigUpdate = ModalFuncProps | ((prevConfig: ModalFuncProps) => ModalFuncProps);
-export type InputFormModalProps = Omit<ModalFuncProps, 'content'> & {
-    label?: string;
-    rule?: Rule;
-    initialValue?: string;
-};
-export type TextareaFormModalProps = Omit<ModalFuncProps, 'content'> & {
-    label?: string;
-    initialValue?: string;
-    placeholder?: string;
-};
-interface UploadFormModalProps extends Omit<InputFormModalProps, 'initialValues'> {
-    accept?: string;
-}
-export type ConfirmFormModalProps = ModalFuncProps & {
-    dontAskAgainKey?: string;
-};
-export interface UseFormModalHookResponse {
-    input: (props: InputFormModalProps) => {
-        destroy: () => void;
-        update: (configUpdate: ConfigUpdate) => void;
-    };
-    textarea: (props: TextareaFormModalProps) => {
-        destroy: () => void;
-        update: (configUpdate: ConfigUpdate) => void;
-    };
-    confirm: (props: ConfirmFormModalProps) => {
-        destroy: () => void;
-        update: (configUpdate: ConfigUpdate) => void;
-    };
-    upload: (props: UploadFormModalProps) => {
-        destroy: () => void;
-        update: (configUpdate: ConfigUpdate) => void;
-    };
-}
+import type { InputFormModalProps, TextareaFormModalProps, ConfirmFormModalProps, UseFormModalHookResponse, UploadFormModalProps } from './form-modal-types';
+export type { ConfigUpdate, InputFormModalProps, TextareaFormModalProps, ConfirmFormModalProps, UseFormModalHookResponse } from './form-modal-types';
 export declare function useFormModal(): UseFormModalHookResponse;
 export declare function withInput(props: InputFormModalProps, onKeyBoardSubmit: any, onSetModalLoading: any): ModalFuncProps;
 export declare function withTextarea(props: TextareaFormModalProps): ModalFuncProps;
 export declare function withConfirm(props: ConfirmFormModalProps, dontAskAgainRef: React.MutableRefObject<boolean>): ModalFuncProps;
 export declare function withUpload(props: UploadFormModalProps): ModalFuncProps;
-export {};

package/dist/build/types/src/core/components/modal/window-modal/window-modal.styles.d.ts

@@ -13,6 +13,7 @@ export declare const useStyle: (props?: {
     styles: {
         wrapper: string;
         modal: string;
+        draggableContainer: string;
     };
     cx: import("antd-style/es/types").ClassNamesUtil;
     theme: import("antd-style/lib/types/theme").FullToken;

package/dist/build/types/src/core/components/modal-upload/modal-upload.d.ts

@@ -54,6 +54,8 @@ export interface ModalUploadPropsBase {
      * time rather than at render time.
      */
     skipConflictCheck?: boolean | React.RefObject<boolean>;
+    /** Set `current` to `false` inside `onSuccess` to suppress the upload success toast. */
+    showSuccessMessage?: React.MutableRefObject<boolean>;
 }
 interface ModalUploadPropsWithAction extends ModalUploadPropsBase {
     action: string;

package/dist/build/types/src/core/components/preview-card/preview-card.d.ts

@@ -12,7 +12,7 @@ import { type DropdownProps } from '../dropdown/dropdown';
 import { type ElementIcon } from '../../modules/asset/asset-api-slice.gen';
 export declare enum SizeTypes {
     SMALL = "small",
-    MEDIUM = "medium"
+    LARGE = "large"
 }
 interface PreviewCardProps {
     name: string;

package/dist/build/types/src/core/components/preview-card/preview-card.styles.d.ts

@@ -10,11 +10,11 @@
 export declare const useStyle: (props?: unknown) => {
     styles: {
         card: string;
-        cardMedium: string;
+        cardLarge: string;
         imgContainer: string;
-        imgContainerMedium: string;
+        imgContainerLarge: string;
         img: string;
-        imgMedium: string;
+        imgLarge: string;
         dropdownButton: string;
         metaBlock: string;
     };

package/dist/build/types/src/core/components/tag/tag.d.ts

@@ -14,6 +14,7 @@ export interface TagProps extends AntTagPropsProps, React.RefAttributes<HTMLSpan
     iconName?: string;
     className?: string;
     theme?: TagTheme;
+    colorInverted?: string;
 }
 export type TagTheme = 'transparent';
 export declare const Tag: React.ForwardRefExoticComponent<Omit<TagProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/build/types/src/core/components/tag/tag.stories.d.ts

@@ -70,3 +70,18 @@ export declare const TagWithBadge: {
         icon: React.JSX.Element;
     };
 };
+export declare const ColorInverted: {
+    args: {
+        colorInverted: string;
+        children: string;
+    };
+};
+export declare const ColorInvertedGreen: {
+    args: {
+        colorInverted: string;
+        children: string;
+    };
+};
+export declare const ColorInvertedMultiple: {
+    render: () => React.JSX.Element;
+};

package/dist/build/types/src/core/components/tag/tag.styles.d.ts

@@ -10,6 +10,7 @@
 export declare const useStyles: (props?: unknown) => {
     styles: {
         tag: string;
+        colorInverted: string;
         tooltip: string;
     };
     cx: import("antd-style/es/types").ClassNamesUtil;

package/dist/build/types/src/core/components/toolbar/toolbar.d.ts

@@ -16,7 +16,7 @@ export interface ToolbarProps {
     align?: FlexProps['align'];
     theme?: 'primary' | 'secondary';
     borderStyle?: 'default' | 'primary';
-    position?: 'top' | 'bottom' | 'content';
+    position?: 'top' | 'bottom' | 'content' | 'none';
     size?: 'small' | 'auto' | 'default';
     padding?: BoxProps['padding'];
     margin?: BoxProps['margin'];

package/dist/build/types/src/core/components/toolbar/toolbar.stories.d.ts

@@ -14,8 +14,7 @@ export default config;
 type Story = StoryObj<typeof Toolbar>;
 export declare const _default: Story;
 export declare const Secondary: Story;
-export declare const Size: Story;
-export declare const Position: Story;
-export declare const SpaceBetweenSearch: Story;
+export declare const Small: Story;
+export declare const PositionTop: Story;
 export declare const RightAligned: Story;
 export declare const LeftAligned: Story;

package/dist/build/types/src/core/components/tree-element/tree-element-item.d.ts

@@ -8,12 +8,9 @@
  *  @license    Pimcore Open Core License (POCL)
  */
 import React from 'react';
-import { type TreeAction } from '../../../sdk/components';
 export interface ITreeElementItemProps {
     title: string;
-    actions?: TreeAction[];
     onSelected?: () => void;
-    onActionsClick?: (action: string, title: string) => void;
 }
-declare const TreeElementItem: ({ title, actions, onSelected, onActionsClick }: ITreeElementItemProps) => React.JSX.Element;
+declare const TreeElementItem: ({ title, onSelected }: ITreeElementItemProps) => React.JSX.Element;
 export { TreeElementItem };

package/dist/build/types/src/core/components/users-roles-dropdown/users-roles-dropdown.d.ts

@@ -10,17 +10,18 @@
 import React from 'react';
 import type { RoleGetCollectionApiResponse } from '../../modules/user/roles/roles-api-slice.gen';
 import type { UserGetCollectionApiResponse } from '../../modules/auth/user/user-api-slice.gen';
-interface IUsersRolesDropdownProps {
+export interface UsersRolesChange {
+    sharedUsers: number[];
+    sharedRoles: number[];
+}
+export interface IUsersRolesDropdownProps {
     roleList?: RoleGetCollectionApiResponse;
-    initialSharedRoles: number[];
+    initialSharedRoles?: number[];
     userList?: UserGetCollectionApiResponse;
-    initialSharedUsers: number[];
-    handleClose: () => void;
-    handleApplyChanges: ({ sharedUsers, sharedRoles }: {
-        sharedUsers: number[];
-        sharedRoles: number[];
-    }) => void;
+    initialSharedUsers?: number[];
+    onChange: (change: UsersRolesChange) => void;
     placement?: 'top' | 'bottom';
+    renderAsPopup?: boolean;
+    onClose?: () => void;
 }
-export declare const UsersRolesDropdown: ({ userList, initialSharedUsers, roleList, initialSharedRoles, handleClose, handleApplyChanges, placement }: IUsersRolesDropdownProps) => React.JSX.Element;
-export {};
+export declare const UsersRolesDropdown: ({ userList, initialSharedUsers, roleList, initialSharedRoles, onChange, placement, renderAsPopup, onClose }: IUsersRolesDropdownProps) => React.JSX.Element;

package/dist/build/types/src/core/components/users-roles-dropdown/users-roles-dropdown.styles.d.ts

@@ -12,8 +12,9 @@ export declare const useStyles: (props?: unknown) => {
         dropdown: string;
         dropdownBottom: string;
         dropdownTop: string;
+        popupHeader: string;
         tabs: string;
-        btnGroupWrapper: string;
+        clearOption: string;
     };
     cx: import("antd-style/es/types").ClassNamesUtil;
     theme: import("antd-style/lib/types/theme").FullToken;

package/dist/build/types/src/core/lib/event-bus/event-types.d.ts

@@ -21,4 +21,5 @@ export declare const eventTypes: {
     'data-object:editor:post-update': string;
     'document:editor:post-update': string;
     'asset:editor:post-update': string;
+    'element:item:deleted': string;
 };

package/dist/build/types/src/core/modules/app/app-view.d.ts

@@ -8,4 +8,7 @@
  *  @license    Pimcore Open Core License (POCL)
  */
 import React from 'react';
-export declare const AppView: () => React.JSX.Element;
+export interface AppViewProps {
+    themeId?: string;
+}
+export declare const AppView: ({ themeId }?: AppViewProps) => React.JSX.Element;

package/dist/build/types/src/core/modules/app/context-menu-registry/context-menu-config.d.ts

@@ -62,6 +62,7 @@ export declare const contextMenuConfig: {
             unpublish: number;
             delete: number;
             rename: number;
+            open: number;
         };
     };
     assetEditorToolbar: {

package/dist/build/types/src/core/modules/app/theme/constants/theme-ids.d.ts

@@ -12,5 +12,4 @@
  */
 export declare const studioThemeIds: {
     readonly light: "studio-default-light";
-    readonly dark: "studio-default-dark";
 };

package/dist/build/types/src/core/modules/app/theme/dynamic-types/definitions/studio-default-light/dynamic-type-theme-studio-default-light.d.ts

@@ -21,6 +21,11 @@ export declare const studioDefaultLightThemeConfig: {
         colorFill: string;
         colorFillQuaternary: string;
         colorBgLayout: string;
+        colorBgCanvas: string;
+        colorBgLogoOrbit: string;
+        colorBgMainNavColumn: string;
+        colorBorderFieldset: string;
+        colorBgFieldset: string;
         colorBgSpotlight: string;
         colorPrimary: string;
         fontSize: number;
@@ -31,6 +36,7 @@ export declare const studioDefaultLightThemeConfig: {
         colorBorderActive: string;
         colorLogo: string;
         colorBorderTertiary: string;
+        colorBorderPanelTitle: string;
         colorTextTreeElement: string;
         colorIconTree: string;
         colorIconTreeUnpublished: string;
@@ -38,6 +44,7 @@ export declare const studioDefaultLightThemeConfig: {
         paddingTabs: number;
         colorTextSidebarTitle: string;
         colorBgToolbar: string;
+        colorBgToolstrip: string;
         colorFillActive: string;
         colorFillAdditional: string;
         colorBgSidebarOptions: string;
@@ -190,6 +197,8 @@ export declare const studioDefaultLightThemeConfig: {
             colorBgSelectedTab: string;
             itemColor: string;
             itemActiveColor: string;
+            itemSelectedColor: string;
+            inkBarColor: string;
             itemHoverColor: string;
             itemUnselectedIconColor: string;
             colorBorderActiveTab: string;

package/dist/build/types/src/core/modules/app/theme/utils/theme-from-url.d.ts

@@ -0,0 +1,21 @@
+/**
+ * This source file is available under the terms of the
+ * Pimcore Open Core License (POCL)
+ * Full copyright and license information is available in
+ * LICENSE.md which is distributed with this source code.
+ *
+ *  @copyright  Copyright (c) Pimcore GmbH (https://www.pimcore.com)
+ *  @license    Pimcore Open Core License (POCL)
+ */
+/**
+ * Query parameter used to select the theme via URL. The value must be the id
+ * of a registered theme, e.g. `?theme=studio-default-light`.
+ */
+export declare const themeUrlParameter = "theme";
+/**
+ * Resolve the theme id requested through the URL query string.
+ *
+ * Returns `undefined` when no theme parameter is present so that the default
+ * theme is applied.
+ */
+export declare const getThemeIdFromUrl: (search?: string) => string | undefined;

package/dist/build/types/src/core/modules/app/translations/translations-api-slice.gen.d.ts

@@ -94,6 +94,7 @@ export type TranslationGetListApiArg = {
             pageSize?: number;
             columnFilters?: object;
             sortFilter?: object;
+            additionalSortFilters?: object;
         };
     };
 };