-
-
- { setCustomQuality(e.target.value as unknown as number) } }
- type="number"
- />
-
-
-
- { setCustomDPI(e.target.value as unknown as number) } }
- type="number"
- />
-
-
-
-
-
-
-
-
-
-
-
+
+
+
-
-
-
+
+
+
+
+
+ )
+ }
return (
diff --git a/assets/js/src/core/modules/element/dynamic-types/defintinitions/objects/data-related/components/block/block-content.tsx b/assets/js/src/core/modules/element/dynamic-types/defintinitions/objects/data-related/components/block/block-content.tsx
index 1e5c8ebe7..d6182a1d4 100644
--- a/assets/js/src/core/modules/element/dynamic-types/defintinitions/objects/data-related/components/block/block-content.tsx
+++ b/assets/js/src/core/modules/element/dynamic-types/defintinitions/objects/data-related/components/block/block-content.tsx
@@ -13,64 +13,94 @@
import { type FormListFieldData, type FormListOperation } from 'antd'
import { type BlockProps } from './block'
-import React from 'react'
-import { Accordion, type AccordionProps } from '@Pimcore/components/accordion/accordion'
+import React, { useState } from 'react'
import { FormListProvider } from '@Pimcore/modules/data-object/editor/types/object/tab-manager/tabs/edit/providers/form-list-provider/form-list-provider'
import { ObjectComponent } from '@Pimcore/modules/data-object/editor/types/object/tab-manager/tabs/edit/components/object-component'
-import { Button } from '@Pimcore/components/button/button'
+import { CollapseItem, type CollapseItemProps } from '@Pimcore/components/collapse/item/collapse-item'
+import { Space } from '@Pimcore/components/space/space'
+import { ToolStripBox } from '@Pimcore/components/toolstrip/box/tool-strip-box'
+import { BlockToolStrip } from './block-tool-strip'
import { Box } from '@Pimcore/components/box/box'
+import { Text } from '@Pimcore/components/text/text'
+import { IconTextButton } from '@Pimcore/components/icon-text-button/icon-text-button'
+import { type IconButtonProps } from '@Pimcore/components/icon-button/icon-button'
interface BlockContentProps extends BlockProps {
fields: FormListFieldData[]
operation: FormListOperation
}
-export const BlockContent = ({ title, fields, operation, children }: BlockContentProps): React.JSX.Element => {
- const items: AccordionProps['items'] = fields.map((field) => {
- return {
- title: <>{title} {field.name}>,
- forceRender: true,
- children: (
-
- )
- }
- })
+export const BlockContent = ({ title, fields, operation, children, collapsed }: BlockContentProps): React.JSX.Element => {
+ const [collapseActive, setCollapseActive] = useState(collapsed ?? false)
+
+ const onChange: CollapseItemProps['onChange'] = (keys) => {
+ setCollapseActive(keys.length > 0)
+ }
+
+ const onAddClick: IconButtonProps['onClick'] = (e): void => {
+ e.stopPropagation()
+ operation.add()
+ setCollapseActive(true)
+ }
return (
-