{
  "version": 3,
  "sources": ["../../../../src/components/dataform-layouts/card/index.tsx"],
  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tuseCallback,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n// TODO: enable in the ESlint rule once we complete\n// https://github.com/WordPress/gutenberg/issues/76135.\n// eslint-disable-next-line @wordpress/use-recommended-components\nimport { Card, CollapsibleCard, Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { getFormFieldLayout } from '..';\nimport DataFormContext from '../../dataform-context';\nimport type {\n\tFieldLayoutProps,\n\tNormalizedCardLayout,\n\tNormalizedField,\n\tNormalizedForm,\n\tNormalizedLayout,\n} from '../../../types';\nimport { DataFormLayout } from '../data-form-layout';\nimport { DEFAULT_LAYOUT } from '../normalize-form';\nimport { getSummaryFields } from '../get-summary-fields';\nimport useReportValidity from '../../../hooks/use-report-validity';\nimport ValidationBadge from '../validation-badge';\n\nfunction isSummaryFieldVisible< Item >(\n\tsummaryField: NormalizedField< Item >,\n\tsummaryConfig: NormalizedCardLayout[ 'summary' ],\n\tisOpen: boolean\n) {\n\t// If no summary config, dont't show any fields\n\tif (\n\t\t! summaryConfig ||\n\t\t( Array.isArray( summaryConfig ) && summaryConfig.length === 0 )\n\t) {\n\t\treturn false;\n\t}\n\n\t// Convert to array for consistent handling\n\tconst summaryConfigArray = Array.isArray( summaryConfig )\n\t\t? summaryConfig\n\t\t: [ summaryConfig ];\n\n\t// Find the config for this specific field\n\tconst fieldConfig = summaryConfigArray.find( ( config ) => {\n\t\tif ( typeof config === 'string' ) {\n\t\t\treturn config === summaryField.id;\n\t\t}\n\t\tif ( typeof config === 'object' && 'id' in config ) {\n\t\t\treturn config.id === summaryField.id;\n\t\t}\n\t\treturn false;\n\t} );\n\n\t// If field is not in summary config, don't show it\n\tif ( ! fieldConfig ) {\n\t\treturn false;\n\t}\n\n\t// If it's a string, always show it\n\tif ( typeof fieldConfig === 'string' ) {\n\t\treturn true;\n\t}\n\n\t// If it has visibility rules, respect them\n\tif ( typeof fieldConfig === 'object' && 'visibility' in fieldConfig ) {\n\t\treturn (\n\t\t\tfieldConfig.visibility === 'always' ||\n\t\t\t( fieldConfig.visibility === 'when-collapsed' && ! isOpen )\n\t\t);\n\t}\n\n\t// Default to always show\n\treturn true;\n}\n\nfunction HeaderContent< Item >( {\n\tdata,\n\tfields,\n\tlabel,\n\tlayout,\n\tisOpen,\n\ttouched,\n\tvalidity,\n}: {\n\tdata: Item;\n\tfields: NormalizedField< Item >[];\n\tlabel: string | undefined;\n\tlayout: NormalizedCardLayout;\n\tisOpen: boolean;\n\ttouched: boolean;\n\tvalidity: FieldLayoutProps< Item >[ 'validity' ];\n} ) {\n\tconst summaryFields = getSummaryFields< Item >( layout.summary, fields );\n\n\tconst visibleSummaryFields = summaryFields.filter( ( summaryField ) =>\n\t\tisSummaryFieldVisible( summaryField, layout.summary, isOpen )\n\t);\n\n\tconst hasBadge = touched && layout.isCollapsible;\n\tconst hasSummary = visibleSummaryFields.length > 0 && layout.withHeader;\n\n\treturn (\n\t\t<Stack\n\t\t\talign=\"center\"\n\t\t\tjustify=\"space-between\"\n\t\t\tclassName=\"dataforms-layouts-card__field-header-content\"\n\t\t>\n\t\t\t<Card.Title>{ label }</Card.Title>\n\t\t\t{ ( hasBadge || hasSummary ) && (\n\t\t\t\t<CollapsibleCard.HeaderDescription className=\"dataforms-layouts-card__field-header-content-description\">\n\t\t\t\t\t{ hasBadge && <ValidationBadge validity={ validity } /> }\n\t\t\t\t\t{ hasSummary && (\n\t\t\t\t\t\t<div className=\"dataforms-layouts-card__field-summary\">\n\t\t\t\t\t\t\t{ visibleSummaryFields.map( ( summaryField ) => (\n\t\t\t\t\t\t\t\t<summaryField.render\n\t\t\t\t\t\t\t\t\tkey={ summaryField.id }\n\t\t\t\t\t\t\t\t\titem={ data }\n\t\t\t\t\t\t\t\t\tfield={ summaryField }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</CollapsibleCard.HeaderDescription>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n\nfunction BodyContent< Item >( {\n\tdata,\n\tfield,\n\tform,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n\twithHeader,\n}: {\n\tdata: Item;\n\tfield: FieldLayoutProps< Item >[ 'field' ];\n\tform: NormalizedForm;\n\tonChange: FieldLayoutProps< Item >[ 'onChange' ];\n\thideLabelFromVision?: boolean;\n\tmarkWhenOptional?: boolean;\n\tvalidity: FieldLayoutProps< Item >[ 'validity' ];\n\twithHeader: boolean;\n} ) {\n\tif ( field.children ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ field.description && (\n\t\t\t\t\t<div className=\"dataforms-layouts-card__field-description\">\n\t\t\t\t\t\t{ field.description }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<DataFormLayout\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tform={ form }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tvalidity={ validity?.children }\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t}\n\n\tconst SingleFieldLayout = getFormFieldLayout( 'regular' )?.component;\n\tif ( ! SingleFieldLayout ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SingleFieldLayout\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision || withHeader }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n}\n\nexport default function FormCardField< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: FieldLayoutProps< Item > ) {\n\tconst { fields } = useContext( DataFormContext );\n\tconst layout = field.layout as NormalizedCardLayout;\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\n\tconst form: NormalizedForm = useMemo(\n\t\t() => ( {\n\t\t\tlayout: DEFAULT_LAYOUT as NormalizedLayout,\n\t\t\tfields: field.children ?? [],\n\t\t} ),\n\t\t[ field ]\n\t);\n\n\tconst { isOpened, isCollapsible } = layout;\n\tconst [ isOpen, setIsOpen ] = useState( isOpened );\n\tconst [ touched, setTouched ] = useState( false );\n\n\t// Sync internal state when the isOpened prop changes.\n\t// This is unlikely to happen in production, but it helps with storybook controls.\n\tuseEffect( () => {\n\t\tsetIsOpen( isOpened );\n\t}, [ isOpened ] );\n\n\tconst handleOpenChange = useCallback( ( open: boolean ) => {\n\t\t// Mark as touched when collapsing (going from open to closed)\n\t\tif ( ! open ) {\n\t\t\tsetTouched( true );\n\t\t}\n\t\tsetIsOpen( open );\n\t}, [] );\n\n\t// Mark the card as touched when any field inside it is blurred.\n\t// This aligns with how validated controls show errors on blur.\n\tconst handleBlur = useCallback( () => {\n\t\tsetTouched( true );\n\t}, [] );\n\n\t// When the card is expanded after being touched (collapsed with errors),\n\t// trigger reportValidity to show field-level errors.\n\tuseReportValidity(\n\t\tcontentRef,\n\t\t( isCollapsible ? isOpen : true ) && touched\n\t);\n\n\tlet label = field.label;\n\tlet withHeader: boolean;\n\n\tif ( field.children ) {\n\t\twithHeader = !! label && layout.withHeader;\n\t} else {\n\t\tconst fieldDefinition = fields.find(\n\t\t\t( fieldDef ) => fieldDef.id === field.id\n\t\t);\n\n\t\tif ( ! fieldDefinition || ! fieldDefinition.Edit ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tlabel = fieldDefinition.label;\n\t\twithHeader = !! label && layout.withHeader;\n\t}\n\n\tconst bodyContent = (\n\t\t<BodyContent\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tform={ form }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t\twithHeader={ withHeader }\n\t\t/>\n\t);\n\n\tconst headerContent = (\n\t\t<HeaderContent\n\t\t\tdata={ data }\n\t\t\tfields={ fields }\n\t\t\tlabel={ label }\n\t\t\tlayout={ layout }\n\t\t\tisOpen={ isCollapsible ? !! isOpen : true }\n\t\t\ttouched={ touched }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n\n\tif ( withHeader && isCollapsible ) {\n\t\treturn (\n\t\t\t<CollapsibleCard.Root\n\t\t\t\tclassName=\"dataforms-layouts-card__field\"\n\t\t\t\topen={ isOpen }\n\t\t\t\tonOpenChange={ handleOpenChange }\n\t\t\t>\n\t\t\t\t<CollapsibleCard.Header>\n\t\t\t\t\t{ headerContent }\n\t\t\t\t</CollapsibleCard.Header>\n\t\t\t\t<CollapsibleCard.Content\n\t\t\t\t\tref={ contentRef }\n\t\t\t\t\tonBlur={ handleBlur }\n\t\t\t\t>\n\t\t\t\t\t{ bodyContent }\n\t\t\t\t</CollapsibleCard.Content>\n\t\t\t</CollapsibleCard.Root>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Card.Root className=\"dataforms-layouts-card__field\">\n\t\t\t{ withHeader && <Card.Header>{ headerContent }</Card.Header> }\n\t\t\t<Card.Content ref={ contentRef } onBlur={ handleBlur }>\n\t\t\t\t{ bodyContent }\n\t\t\t</Card.Content>\n\t\t</Card.Root>\n\t);\n}\n"],
  "mappings": "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",
  "names": []
}
