@wordpress/dataviews 10.3.1-next.2f1c7c01b.0 → 10.4.1-next.dc3f6d3c1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +23 -5
- package/README.md +413 -148
- package/build/components/dataviews-filters/filter.js +11 -1
- package/build/components/dataviews-filters/filter.js.map +2 -2
- package/build/components/dataviews-view-config/index.js +11 -396
- package/build/components/dataviews-view-config/index.js.map +3 -3
- package/build/components/dataviews-view-config/properties-section.js +177 -0
- package/build/components/dataviews-view-config/properties-section.js.map +7 -0
- package/build/constants.js +3 -0
- package/build/constants.js.map +2 -2
- package/build/dataform-controls/date.js +23 -7
- package/build/dataform-controls/date.js.map +2 -2
- package/build/dataform-controls/email.js +1 -1
- package/build/dataform-controls/email.js.map +1 -1
- package/build/dataform-layouts/details/index.js +78 -0
- package/build/dataform-layouts/details/index.js.map +7 -0
- package/build/dataform-layouts/index.js +5 -0
- package/build/dataform-layouts/index.js.map +3 -3
- package/build/dataform-layouts/normalize-form.js +5 -0
- package/build/dataform-layouts/normalize-form.js.map +2 -2
- package/build/dataviews-layouts/index.js +9 -0
- package/build/dataviews-layouts/index.js.map +3 -3
- package/build/dataviews-layouts/picker-table/index.js +422 -0
- package/build/dataviews-layouts/picker-table/index.js.map +7 -0
- package/build/dataviews-layouts/table/column-header-menu.js.map +2 -2
- package/build/dataviews-layouts/table/column-primary.js +1 -6
- package/build/dataviews-layouts/table/column-primary.js.map +2 -2
- package/build/dataviews-layouts/table/index.js +47 -2
- package/build/dataviews-layouts/table/index.js.map +2 -2
- package/build/field-types/date.js +4 -2
- package/build/field-types/date.js.map +2 -2
- package/build/types/dataform.js.map +1 -1
- package/build/types/dataviews.js.map +1 -1
- package/build/types/field-api.js.map +1 -1
- package/build/utils/normalize-fields.js +23 -3
- package/build/utils/normalize-fields.js.map +2 -2
- package/build/utils/week-starts-on.js +59 -0
- package/build/utils/week-starts-on.js.map +7 -0
- package/build-module/components/dataviews-filters/filter.js +11 -1
- package/build-module/components/dataviews-filters/filter.js.map +2 -2
- package/build-module/components/dataviews-view-config/index.js +15 -412
- package/build-module/components/dataviews-view-config/index.js.map +2 -2
- package/build-module/components/dataviews-view-config/properties-section.js +149 -0
- package/build-module/components/dataviews-view-config/properties-section.js.map +7 -0
- package/build-module/constants.js +2 -0
- package/build-module/constants.js.map +2 -2
- package/build-module/dataform-controls/date.js +23 -7
- package/build-module/dataform-controls/date.js.map +2 -2
- package/build-module/dataform-controls/email.js +2 -2
- package/build-module/dataform-controls/email.js.map +1 -1
- package/build-module/dataform-layouts/details/index.js +47 -0
- package/build-module/dataform-layouts/details/index.js.map +7 -0
- package/build-module/dataform-layouts/index.js +5 -0
- package/build-module/dataform-layouts/index.js.map +2 -2
- package/build-module/dataform-layouts/normalize-form.js +5 -0
- package/build-module/dataform-layouts/normalize-form.js.map +2 -2
- package/build-module/dataviews-layouts/index.js +11 -1
- package/build-module/dataviews-layouts/index.js.map +2 -2
- package/build-module/dataviews-layouts/picker-table/index.js +397 -0
- package/build-module/dataviews-layouts/picker-table/index.js.map +7 -0
- package/build-module/dataviews-layouts/table/column-header-menu.js.map +2 -2
- package/build-module/dataviews-layouts/table/column-primary.js +1 -6
- package/build-module/dataviews-layouts/table/column-primary.js.map +2 -2
- package/build-module/dataviews-layouts/table/index.js +48 -3
- package/build-module/dataviews-layouts/table/index.js.map +2 -2
- package/build-module/field-types/date.js +5 -3
- package/build-module/field-types/date.js.map +2 -2
- package/build-module/utils/normalize-fields.js +23 -3
- package/build-module/utils/normalize-fields.js.map +2 -2
- package/build-module/utils/week-starts-on.js +32 -0
- package/build-module/utils/week-starts-on.js.map +7 -0
- package/build-style/style-rtl.css +58 -54
- package/build-style/style.css +58 -54
- package/build-types/components/dataviews-filters/filter.d.ts.map +1 -1
- package/build-types/components/dataviews-filters/utils.d.ts.map +1 -1
- package/build-types/components/dataviews-view-config/index.d.ts.map +1 -1
- package/build-types/components/dataviews-view-config/properties-section.d.ts +4 -0
- package/build-types/components/dataviews-view-config/properties-section.d.ts.map +1 -0
- package/build-types/constants.d.ts +1 -0
- package/build-types/constants.d.ts.map +1 -1
- package/build-types/dataform-controls/date.d.ts.map +1 -1
- package/build-types/dataform-layouts/details/index.d.ts +6 -0
- package/build-types/dataform-layouts/details/index.d.ts.map +1 -0
- package/build-types/dataform-layouts/get-summary-fields.d.ts.map +1 -1
- package/build-types/dataform-layouts/index.d.ts +5 -0
- package/build-types/dataform-layouts/index.d.ts.map +1 -1
- package/build-types/dataform-layouts/normalize-form.d.ts.map +1 -1
- package/build-types/dataviews-layouts/index.d.ts +8 -0
- package/build-types/dataviews-layouts/index.d.ts.map +1 -1
- package/build-types/dataviews-layouts/picker-table/index.d.ts +4 -0
- package/build-types/dataviews-layouts/picker-table/index.d.ts.map +1 -0
- package/build-types/dataviews-layouts/table/column-header-menu.d.ts +3 -3
- package/build-types/dataviews-layouts/table/column-header-menu.d.ts.map +1 -1
- package/build-types/dataviews-layouts/table/column-primary.d.ts.map +1 -1
- package/build-types/dataviews-layouts/table/index.d.ts.map +1 -1
- package/build-types/field-types/date.d.ts.map +1 -1
- package/build-types/stories/dataform.story.d.ts +3 -0
- package/build-types/stories/dataform.story.d.ts.map +1 -1
- package/build-types/stories/dataviews-picker.story.d.ts +2 -0
- package/build-types/stories/dataviews-picker.story.d.ts.map +1 -1
- package/build-types/stories/dataviews.story.d.ts +7 -1
- package/build-types/stories/dataviews.story.d.ts.map +1 -1
- package/build-types/stories/field-types.story.d.ts +27 -1
- package/build-types/stories/field-types.story.d.ts.map +1 -1
- package/build-types/types/dataform.d.ts +11 -3
- package/build-types/types/dataform.d.ts.map +1 -1
- package/build-types/types/dataviews.d.ts +23 -2
- package/build-types/types/dataviews.d.ts.map +1 -1
- package/build-types/types/field-api.d.ts +28 -1
- package/build-types/types/field-api.d.ts.map +1 -1
- package/build-types/utils/normalize-fields.d.ts.map +1 -1
- package/build-types/utils/week-starts-on.d.ts +20 -0
- package/build-types/utils/week-starts-on.d.ts.map +1 -0
- package/build-wp/index.js +1497 -1188
- package/package.json +15 -15
- package/src/components/dataviews/style.scss +2 -0
- package/src/components/dataviews-filters/filter.tsx +11 -1
- package/src/components/dataviews-footer/style.scss +1 -1
- package/src/components/dataviews-view-config/index.tsx +8 -504
- package/src/components/dataviews-view-config/properties-section.tsx +201 -0
- package/src/components/dataviews-view-config/style.scss +2 -39
- package/src/constants.ts +1 -0
- package/src/dataform-controls/date.tsx +24 -6
- package/src/dataform-controls/email.tsx +2 -2
- package/src/dataform-layouts/details/index.tsx +71 -0
- package/src/dataform-layouts/details/style.scss +5 -0
- package/src/dataform-layouts/index.tsx +5 -0
- package/src/dataform-layouts/normalize-form.ts +6 -0
- package/src/dataviews-layouts/index.ts +10 -0
- package/src/dataviews-layouts/list/style.scss +1 -0
- package/src/dataviews-layouts/picker-table/index.tsx +487 -0
- package/src/dataviews-layouts/picker-table/style.scss +47 -0
- package/src/dataviews-layouts/table/column-header-menu.tsx +3 -2
- package/src/dataviews-layouts/table/column-primary.tsx +4 -7
- package/src/dataviews-layouts/table/index.tsx +55 -2
- package/src/dataviews-layouts/table/style.scss +36 -19
- package/src/field-types/date.tsx +11 -5
- package/src/stories/dataform.story.tsx +84 -0
- package/src/stories/dataviews-picker.story.tsx +11 -6
- package/src/stories/dataviews.story.tsx +10 -2
- package/src/stories/field-types.story.tsx +67 -2
- package/src/style.scss +2 -0
- package/src/test/normalize-fields.ts +53 -0
- package/src/types/dataform.ts +18 -3
- package/src/types/dataviews.ts +36 -2
- package/src/types/field-api.ts +42 -1
- package/src/utils/normalize-fields.ts +51 -2
- package/src/utils/week-starts-on.ts +46 -0
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dataform-controls/date.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport {\n\tformat,\n\tisValid as isValidDate,\n\tsubMonths,\n\tsubDays,\n\tsubYears,\n\tstartOfMonth,\n\tstartOfYear,\n} from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n\t__experimentalInputControl as InputControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getDate, getSettings } from '@wordpress/date';\nimport { error as errorIcon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport RelativeDateControl from './utils/relative-date-control';\nimport {\n\tOPERATOR_IN_THE_PAST,\n\tOPERATOR_OVER,\n\tOPERATOR_BETWEEN,\n} from '../constants';\nimport { unlock } from '../lock-unlock';\nimport type {\n\tDataFormControlProps,\n\tFieldValidity,\n\tNormalizedField,\n} from '../types';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { DateCalendar, DateRangeCalendar } = unlock( componentsPrivateApis );\n\ntype DateRange = [ string, string ] | undefined;\n\nconst DATE_PRESETS: {\n\tid: string;\n\tlabel: string;\n\tgetValue: () => Date;\n}[] = [\n\t{\n\t\tid: 'today',\n\t\tlabel: __( 'Today' ),\n\t\tgetValue: () => getDate( null ),\n\t},\n\t{\n\t\tid: 'yesterday',\n\t\tlabel: __( 'Yesterday' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subDays( today, 1 );\n\t\t},\n\t},\n\t{\n\t\tid: 'past-week',\n\t\tlabel: __( 'Past week' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subDays( today, 7 );\n\t\t},\n\t},\n\t{\n\t\tid: 'past-month',\n\t\tlabel: __( 'Past month' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subMonths( today, 1 );\n\t\t},\n\t},\n];\n\nconst DATE_RANGE_PRESETS = [\n\t{\n\t\tid: 'last-7-days',\n\t\tlabel: __( 'Last 7 days' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subDays( today, 7 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'last-30-days',\n\t\tlabel: __( 'Last 30 days' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subDays( today, 30 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'month-to-date',\n\t\tlabel: __( 'Month to date' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ startOfMonth( today ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'last-year',\n\t\tlabel: __( 'Last year' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subYears( today, 1 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'year-to-date',\n\t\tlabel: __( 'Year to date' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ startOfYear( today ), today ];\n\t\t},\n\t},\n];\n\nconst parseDate = ( dateString?: string ): Date | null => {\n\tif ( ! dateString ) {\n\t\treturn null;\n\t}\n\tconst parsed = getDate( dateString );\n\treturn parsed && isValidDate( parsed ) ? parsed : null;\n};\n\nconst formatDate = ( date?: Date | string ): string => {\n\tif ( ! date ) {\n\t\treturn '';\n\t}\n\treturn typeof date === 'string' ? date : format( date, 'yyyy-MM-dd' );\n};\n\nfunction ValidatedDateControl< Item >( {\n\tfield,\n\tvalidity,\n\tinputRefs,\n\tisTouched,\n\tsetIsTouched,\n\tchildren,\n}: {\n\tfield: NormalizedField< Item >;\n\tvalidity?: FieldValidity;\n\tinputRefs:\n\t\t| React.RefObject< HTMLInputElement >\n\t\t| React.RefObject< HTMLInputElement >[];\n\tisTouched: boolean;\n\tsetIsTouched: ( touched: boolean ) => void;\n\tchildren: React.ReactNode;\n} ) {\n\tconst { isValid } = field;\n\tconst [ customValidity, setCustomValidity ] = useState<\n\t\t| { type: 'valid' | 'validating' | 'invalid'; message?: string }\n\t\t| undefined\n\t>( undefined );\n\n\tconst validateRefs = useCallback( () => {\n\t\t// Check HTML5 validity on all refs\n\t\tconst refs = Array.isArray( inputRefs ) ? inputRefs : [ inputRefs ];\n\t\tfor ( const ref of refs ) {\n\t\t\tconst input = ref.current;\n\t\t\tif ( input && ! input.validity.valid ) {\n\t\t\t\tsetCustomValidity( {\n\t\t\t\t\ttype: 'invalid',\n\t\t\t\t\tmessage: input.validationMessage,\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// No errors\n\t\tsetCustomValidity( undefined );\n\t}, [ inputRefs ] );\n\n\tuseEffect( () => {\n\t\tif ( isTouched ) {\n\t\t\tconst timeoutId = setTimeout( () => {\n\t\t\t\tif ( validity ) {\n\t\t\t\t\tsetCustomValidity( getCustomValidity( isValid, validity ) );\n\t\t\t\t} else {\n\t\t\t\t\tvalidateRefs();\n\t\t\t\t}\n\t\t\t}, 0 );\n\t\t\treturn () => clearTimeout( timeoutId );\n\t\t}\n\t\treturn undefined;\n\t}, [ isTouched, isValid, validity, validateRefs ] );\n\n\tconst onBlur = ( event: React.FocusEvent< HTMLDivElement > ) => {\n\t\tif ( isTouched ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Only consider \"blurred from the component\" if focus has fully left the wrapping div.\n\t\t// This prevents unnecessary blurs from components with multiple focusable elements.\n\t\tif (\n\t\t\t! event.relatedTarget ||\n\t\t\t! event.currentTarget.contains( event.relatedTarget )\n\t\t) {\n\t\t\tsetIsTouched( true );\n\t\t}\n\t};\n\n\treturn (\n\t\t<div onBlur={ onBlur }>\n\t\t\t{ children }\n\t\t\t<div aria-live=\"polite\">\n\t\t\t\t{ customValidity && (\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'components-validated-control__indicator',\n\t\t\t\t\t\t\tcustomValidity.type === 'invalid'\n\t\t\t\t\t\t\t\t? 'is-invalid'\n\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\tcustomValidity.type === 'valid'\n\t\t\t\t\t\t\t\t? 'is-valid'\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-validated-control__indicator-icon\"\n\t\t\t\t\t\t\ticon={ errorIcon }\n\t\t\t\t\t\t\tsize={ 16 }\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ customValidity.message }\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction CalendarDateControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { id, label, setValue, getValue, isValid } = field;\n\tconst [ selectedPresetId, setSelectedPresetId ] = useState< string | null >(\n\t\tnull\n\t);\n\n\tconst fieldValue = getValue( { item: data } );\n\tconst value = typeof fieldValue === 'string' ? fieldValue : undefined;\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\tconst parsedDate = parseDate( value );\n\t\treturn parsedDate || new Date(); // Default to current month\n\t} );\n\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst onSelectDate = useCallback(\n\t\t( newDate: Date | undefined | null ) => {\n\t\t\tconst dateValue = newDate\n\t\t\t\t? format( newDate, 'yyyy-MM-dd' )\n\t\t\t\t: undefined;\n\t\t\tonChangeCallback( dateValue );\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst handlePresetClick = useCallback(\n\t\t( preset: ( typeof DATE_PRESETS )[ 0 ] ) => {\n\t\t\tconst presetDate = preset.getValue();\n\t\t\tconst dateValue = formatDate( presetDate );\n\n\t\t\tsetCalendarMonth( presetDate );\n\t\t\tonChangeCallback( dateValue );\n\t\t\tsetSelectedPresetId( preset.id );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst handleManualDateChange = useCallback(\n\t\t( newValue?: string ) => {\n\t\t\tonChangeCallback( newValue );\n\t\t\tif ( newValue ) {\n\t\t\t\tconst parsedDate = parseDate( newValue );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t}\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst {\n\t\ttimezone: { string: timezoneString },\n\t\tl10n: { startOfWeek },\n\t} = getSettings();\n\n\tconst displayLabel = isValid?.required\n\t\t? `${ label } (${ __( 'Required' ) })`\n\t\t: label;\n\n\treturn (\n\t\t<ValidatedDateControl\n\t\t\tfield={ field }\n\t\t\tvalidity={ validity }\n\t\t\tinputRefs={ validityTargetRef }\n\t\t\tisTouched={ isTouched }\n\t\t\tsetIsTouched={ setIsTouched }\n\t\t>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tid={ id }\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tlabel={ displayLabel }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ /* Preset buttons */ }\n\t\t\t\t\t<HStack spacing={ 2 } wrap justify=\"flex-start\">\n\t\t\t\t\t\t{ DATE_PRESETS.map( ( preset ) => {\n\t\t\t\t\t\t\tconst isSelected = selectedPresetId === preset.id;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\t\t\tkey={ preset.id }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\tisPressed={ isSelected }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\thandlePresetClick( preset )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ preset.label }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tisPressed={ ! selectedPresetId }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tdisabled={ !! selectedPresetId }\n\t\t\t\t\t\t\taccessibleWhenDisabled={ false }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Custom' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t{ /* Manual date input */ }\n\t\t\t\t\t<InputControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tref={ validityTargetRef }\n\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\tlabel={ __( 'Date' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ handleManualDateChange }\n\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ /* Calendar widget */ }\n\t\t\t\t\t<DateCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={\n\t\t\t\t\t\t\tvalue ? parseDate( value ) || undefined : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onSelectDate }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezoneString || undefined }\n\t\t\t\t\t\tweekStartsOn={ startOfWeek }\n\t\t\t\t\t/>\n\t\t\t\t</VStack>\n\t\t\t</BaseControl>\n\t\t</ValidatedDateControl>\n\t);\n}\n\nfunction CalendarDateRangeControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { id, label, getValue, setValue } = field;\n\tlet value: DateRange;\n\tconst fieldValue = getValue( { item: data } );\n\tif (\n\t\tArray.isArray( fieldValue ) &&\n\t\tfieldValue.length === 2 &&\n\t\tfieldValue.every( ( date ) => typeof date === 'string' )\n\t) {\n\t\tvalue = fieldValue as DateRange;\n\t}\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: DateRange ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst [ selectedPresetId, setSelectedPresetId ] = useState< string | null >(\n\t\tnull\n\t);\n\n\tconst selectedRange = useMemo( () => {\n\t\tif ( ! value ) {\n\t\t\treturn { from: undefined, to: undefined };\n\t\t}\n\n\t\tconst [ from, to ] = value;\n\t\treturn {\n\t\t\tfrom: parseDate( from ) || undefined,\n\t\t\tto: parseDate( to ) || undefined,\n\t\t};\n\t}, [ value ] );\n\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\treturn selectedRange.from || new Date();\n\t} );\n\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst fromInputRef = useRef< HTMLInputElement >( null );\n\tconst toInputRef = useRef< HTMLInputElement >( null );\n\n\tconst updateDateRange = useCallback(\n\t\t( fromDate?: Date | string, toDate?: Date | string ) => {\n\t\t\tif ( fromDate && toDate ) {\n\t\t\t\tonChangeCallback( [\n\t\t\t\t\tformatDate( fromDate ),\n\t\t\t\t\tformatDate( toDate ),\n\t\t\t\t] );\n\t\t\t} else if ( ! fromDate && ! toDate ) {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t\t// Do nothing if only one date is set - wait for both\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst onSelectCalendarRange = useCallback(\n\t\t(\n\t\t\tnewRange:\n\t\t\t\t| { from: Date | undefined; to?: Date | undefined }\n\t\t\t\t| undefined\n\t\t) => {\n\t\t\tupdateDateRange( newRange?.from, newRange?.to );\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ updateDateRange ]\n\t);\n\n\tconst handlePresetClick = useCallback(\n\t\t( preset: ( typeof DATE_RANGE_PRESETS )[ 0 ] ) => {\n\t\t\tconst [ startDate, endDate ] = preset.getValue();\n\t\t\tsetCalendarMonth( startDate );\n\t\t\tupdateDateRange( startDate, endDate );\n\t\t\tsetSelectedPresetId( preset.id );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ updateDateRange ]\n\t);\n\n\tconst handleManualDateChange = useCallback(\n\t\t( fromOrTo: 'from' | 'to', newValue?: string ) => {\n\t\t\tconst [ currentFrom, currentTo ] = value || [\n\t\t\t\tundefined,\n\t\t\t\tundefined,\n\t\t\t];\n\t\t\tconst updatedFrom = fromOrTo === 'from' ? newValue : currentFrom;\n\t\t\tconst updatedTo = fromOrTo === 'to' ? newValue : currentTo;\n\n\t\t\tupdateDateRange( updatedFrom, updatedTo );\n\n\t\t\tif ( newValue ) {\n\t\t\t\tconst parsedDate = parseDate( newValue );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ value, updateDateRange ]\n\t);\n\n\tconst { timezone, l10n } = getSettings();\n\n\tconst displayLabel = field.isValid?.required\n\t\t? `${ label } (${ __( 'Required' ) })`\n\t\t: label;\n\n\treturn (\n\t\t<ValidatedDateControl\n\t\t\tfield={ field }\n\t\t\tvalidity={ validity }\n\t\t\tinputRefs={ [ fromInputRef, toInputRef ] }\n\t\t\tisTouched={ isTouched }\n\t\t\tsetIsTouched={ setIsTouched }\n\t\t>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tid={ id }\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tlabel={ displayLabel }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ /* Preset buttons */ }\n\t\t\t\t\t<HStack spacing={ 2 } wrap justify=\"flex-start\">\n\t\t\t\t\t\t{ DATE_RANGE_PRESETS.map( ( preset ) => {\n\t\t\t\t\t\t\tconst isSelected = selectedPresetId === preset.id;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\t\t\tkey={ preset.id }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\tisPressed={ isSelected }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\thandlePresetClick( preset )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ preset.label }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tisPressed={ ! selectedPresetId }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\taccessibleWhenDisabled={ false }\n\t\t\t\t\t\t\tdisabled={ !! selectedPresetId }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Custom' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t{ /* Manual date range inputs */ }\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tref={ fromInputRef }\n\t\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\t\tlabel={ __( 'From' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tvalue={ value?.[ 0 ] }\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleManualDateChange( 'from', newValue )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tref={ toInputRef }\n\t\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\t\tlabel={ __( 'To' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tvalue={ value?.[ 1 ] }\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleManualDateChange( 'to', newValue )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t<DateRangeCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={ selectedRange }\n\t\t\t\t\t\tonSelect={ onSelectCalendarRange }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezone.string || undefined }\n\t\t\t\t\t\tweekStartsOn={ l10n.startOfWeek }\n\t\t\t\t\t/>\n\t\t\t\t</VStack>\n\t\t\t</BaseControl>\n\t\t</ValidatedDateControl>\n\t);\n}\n\nexport default function DateControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\toperator,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tif ( operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER ) {\n\t\treturn (\n\t\t\t<RelativeDateControl\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\toperator={ operator }\n\t\t\t/>\n\t\t);\n\t}\n\n\tif ( operator === OPERATOR_BETWEEN ) {\n\t\treturn (\n\t\t\t<CalendarDateRangeControl\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tvalidity={ validity }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<CalendarDateControl\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AACjB,sBAQO;AAKP,wBAQO;AACP,qBAMO;AACP,kBAAmB;AACnB,kBAAqC;AACrC,mBAAmC;AAKnC,mCAAgC;AAChC,uBAIO;AACP,yBAAuB;AAMvB,iCAA8B;AA+
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport {\n\tformat,\n\tisValid as isValidDate,\n\tsubMonths,\n\tsubDays,\n\tsubYears,\n\tstartOfMonth,\n\tstartOfYear,\n} from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tButton,\n\tIcon,\n\tprivateApis as componentsPrivateApis,\n\t__experimentalInputControl as InputControl,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport {\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { getDate, getSettings } from '@wordpress/date';\nimport { error as errorIcon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport RelativeDateControl from './utils/relative-date-control';\nimport {\n\tOPERATOR_IN_THE_PAST,\n\tOPERATOR_OVER,\n\tOPERATOR_BETWEEN,\n} from '../constants';\nimport { unlock } from '../lock-unlock';\nimport type {\n\tDataFormControlProps,\n\tFieldValidity,\n\tNormalizedField,\n} from '../types';\nimport getCustomValidity from './utils/get-custom-validity';\nimport { weekStartsOnToNumber } from '../utils/week-starts-on';\n\nconst { DateCalendar, DateRangeCalendar } = unlock( componentsPrivateApis );\n\ntype DateRange = [ string, string ] | undefined;\n\nconst DATE_PRESETS: {\n\tid: string;\n\tlabel: string;\n\tgetValue: () => Date;\n}[] = [\n\t{\n\t\tid: 'today',\n\t\tlabel: __( 'Today' ),\n\t\tgetValue: () => getDate( null ),\n\t},\n\t{\n\t\tid: 'yesterday',\n\t\tlabel: __( 'Yesterday' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subDays( today, 1 );\n\t\t},\n\t},\n\t{\n\t\tid: 'past-week',\n\t\tlabel: __( 'Past week' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subDays( today, 7 );\n\t\t},\n\t},\n\t{\n\t\tid: 'past-month',\n\t\tlabel: __( 'Past month' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn subMonths( today, 1 );\n\t\t},\n\t},\n];\n\nconst DATE_RANGE_PRESETS = [\n\t{\n\t\tid: 'last-7-days',\n\t\tlabel: __( 'Last 7 days' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subDays( today, 7 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'last-30-days',\n\t\tlabel: __( 'Last 30 days' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subDays( today, 30 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'month-to-date',\n\t\tlabel: __( 'Month to date' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ startOfMonth( today ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'last-year',\n\t\tlabel: __( 'Last year' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ subYears( today, 1 ), today ];\n\t\t},\n\t},\n\t{\n\t\tid: 'year-to-date',\n\t\tlabel: __( 'Year to date' ),\n\t\tgetValue: () => {\n\t\t\tconst today = getDate( null );\n\t\t\treturn [ startOfYear( today ), today ];\n\t\t},\n\t},\n];\n\nconst parseDate = ( dateString?: string ): Date | null => {\n\tif ( ! dateString ) {\n\t\treturn null;\n\t}\n\tconst parsed = getDate( dateString );\n\treturn parsed && isValidDate( parsed ) ? parsed : null;\n};\n\nconst formatDate = ( date?: Date | string ): string => {\n\tif ( ! date ) {\n\t\treturn '';\n\t}\n\treturn typeof date === 'string' ? date : format( date, 'yyyy-MM-dd' );\n};\n\nfunction ValidatedDateControl< Item >( {\n\tfield,\n\tvalidity,\n\tinputRefs,\n\tisTouched,\n\tsetIsTouched,\n\tchildren,\n}: {\n\tfield: NormalizedField< Item >;\n\tvalidity?: FieldValidity;\n\tinputRefs:\n\t\t| React.RefObject< HTMLInputElement >\n\t\t| React.RefObject< HTMLInputElement >[];\n\tisTouched: boolean;\n\tsetIsTouched: ( touched: boolean ) => void;\n\tchildren: React.ReactNode;\n} ) {\n\tconst { isValid } = field;\n\tconst [ customValidity, setCustomValidity ] = useState<\n\t\t| { type: 'valid' | 'validating' | 'invalid'; message?: string }\n\t\t| undefined\n\t>( undefined );\n\n\tconst validateRefs = useCallback( () => {\n\t\t// Check HTML5 validity on all refs\n\t\tconst refs = Array.isArray( inputRefs ) ? inputRefs : [ inputRefs ];\n\t\tfor ( const ref of refs ) {\n\t\t\tconst input = ref.current;\n\t\t\tif ( input && ! input.validity.valid ) {\n\t\t\t\tsetCustomValidity( {\n\t\t\t\t\ttype: 'invalid',\n\t\t\t\t\tmessage: input.validationMessage,\n\t\t\t\t} );\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\t// No errors\n\t\tsetCustomValidity( undefined );\n\t}, [ inputRefs ] );\n\n\tuseEffect( () => {\n\t\tif ( isTouched ) {\n\t\t\tconst timeoutId = setTimeout( () => {\n\t\t\t\tif ( validity ) {\n\t\t\t\t\tsetCustomValidity( getCustomValidity( isValid, validity ) );\n\t\t\t\t} else {\n\t\t\t\t\tvalidateRefs();\n\t\t\t\t}\n\t\t\t}, 0 );\n\t\t\treturn () => clearTimeout( timeoutId );\n\t\t}\n\t\treturn undefined;\n\t}, [ isTouched, isValid, validity, validateRefs ] );\n\n\tconst onBlur = ( event: React.FocusEvent< HTMLDivElement > ) => {\n\t\tif ( isTouched ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Only consider \"blurred from the component\" if focus has fully left the wrapping div.\n\t\t// This prevents unnecessary blurs from components with multiple focusable elements.\n\t\tif (\n\t\t\t! event.relatedTarget ||\n\t\t\t! event.currentTarget.contains( event.relatedTarget )\n\t\t) {\n\t\t\tsetIsTouched( true );\n\t\t}\n\t};\n\n\treturn (\n\t\t<div onBlur={ onBlur }>\n\t\t\t{ children }\n\t\t\t<div aria-live=\"polite\">\n\t\t\t\t{ customValidity && (\n\t\t\t\t\t<p\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'components-validated-control__indicator',\n\t\t\t\t\t\t\tcustomValidity.type === 'invalid'\n\t\t\t\t\t\t\t\t? 'is-invalid'\n\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\tcustomValidity.type === 'valid'\n\t\t\t\t\t\t\t\t? 'is-valid'\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-validated-control__indicator-icon\"\n\t\t\t\t\t\t\ticon={ errorIcon }\n\t\t\t\t\t\t\tsize={ 16 }\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ customValidity.message }\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction CalendarDateControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst {\n\t\tid,\n\t\ttype,\n\t\tlabel,\n\t\tsetValue,\n\t\tgetValue,\n\t\tisValid,\n\t\tformat: fieldFormat,\n\t} = field;\n\tconst [ selectedPresetId, setSelectedPresetId ] = useState< string | null >(\n\t\tnull\n\t);\n\n\tlet weekStartsOn;\n\tif ( type === 'date' ) {\n\t\tweekStartsOn = weekStartsOnToNumber( fieldFormat.weekStartsOn );\n\t}\n\n\tconst fieldValue = getValue( { item: data } );\n\tconst value = typeof fieldValue === 'string' ? fieldValue : undefined;\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\tconst parsedDate = parseDate( value );\n\t\treturn parsedDate || new Date(); // Default to current month\n\t} );\n\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst onSelectDate = useCallback(\n\t\t( newDate: Date | undefined | null ) => {\n\t\t\tconst dateValue = newDate\n\t\t\t\t? format( newDate, 'yyyy-MM-dd' )\n\t\t\t\t: undefined;\n\t\t\tonChangeCallback( dateValue );\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst handlePresetClick = useCallback(\n\t\t( preset: ( typeof DATE_PRESETS )[ 0 ] ) => {\n\t\t\tconst presetDate = preset.getValue();\n\t\t\tconst dateValue = formatDate( presetDate );\n\n\t\t\tsetCalendarMonth( presetDate );\n\t\t\tonChangeCallback( dateValue );\n\t\t\tsetSelectedPresetId( preset.id );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst handleManualDateChange = useCallback(\n\t\t( newValue?: string ) => {\n\t\t\tonChangeCallback( newValue );\n\t\t\tif ( newValue ) {\n\t\t\t\tconst parsedDate = parseDate( newValue );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t}\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst {\n\t\ttimezone: { string: timezoneString },\n\t} = getSettings();\n\n\tconst displayLabel = isValid?.required\n\t\t? `${ label } (${ __( 'Required' ) })`\n\t\t: label;\n\n\treturn (\n\t\t<ValidatedDateControl\n\t\t\tfield={ field }\n\t\t\tvalidity={ validity }\n\t\t\tinputRefs={ validityTargetRef }\n\t\t\tisTouched={ isTouched }\n\t\t\tsetIsTouched={ setIsTouched }\n\t\t>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tid={ id }\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tlabel={ displayLabel }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ /* Preset buttons */ }\n\t\t\t\t\t<HStack spacing={ 2 } wrap justify=\"flex-start\">\n\t\t\t\t\t\t{ DATE_PRESETS.map( ( preset ) => {\n\t\t\t\t\t\t\tconst isSelected = selectedPresetId === preset.id;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\t\t\tkey={ preset.id }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\tisPressed={ isSelected }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\thandlePresetClick( preset )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ preset.label }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tisPressed={ ! selectedPresetId }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tdisabled={ !! selectedPresetId }\n\t\t\t\t\t\t\taccessibleWhenDisabled={ false }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Custom' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t{ /* Manual date input */ }\n\t\t\t\t\t<InputControl\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tref={ validityTargetRef }\n\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\tlabel={ __( 'Date' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ handleManualDateChange }\n\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t/>\n\n\t\t\t\t\t{ /* Calendar widget */ }\n\t\t\t\t\t<DateCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={\n\t\t\t\t\t\t\tvalue ? parseDate( value ) || undefined : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onSelectDate }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezoneString || undefined }\n\t\t\t\t\t\tweekStartsOn={ weekStartsOn }\n\t\t\t\t\t/>\n\t\t\t\t</VStack>\n\t\t\t</BaseControl>\n\t\t</ValidatedDateControl>\n\t);\n}\n\nfunction CalendarDateRangeControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { id, type, label, getValue, setValue, format: fieldFormat } = field;\n\tlet value: DateRange;\n\tconst fieldValue = getValue( { item: data } );\n\tif (\n\t\tArray.isArray( fieldValue ) &&\n\t\tfieldValue.length === 2 &&\n\t\tfieldValue.every( ( date ) => typeof date === 'string' )\n\t) {\n\t\tvalue = fieldValue as DateRange;\n\t}\n\n\tlet weekStartsOn;\n\tif ( type === 'date' ) {\n\t\tweekStartsOn = weekStartsOnToNumber( fieldFormat.weekStartsOn );\n\t}\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: DateRange ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst [ selectedPresetId, setSelectedPresetId ] = useState< string | null >(\n\t\tnull\n\t);\n\n\tconst selectedRange = useMemo( () => {\n\t\tif ( ! value ) {\n\t\t\treturn { from: undefined, to: undefined };\n\t\t}\n\n\t\tconst [ from, to ] = value;\n\t\treturn {\n\t\t\tfrom: parseDate( from ) || undefined,\n\t\t\tto: parseDate( to ) || undefined,\n\t\t};\n\t}, [ value ] );\n\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\treturn selectedRange.from || new Date();\n\t} );\n\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\tconst fromInputRef = useRef< HTMLInputElement >( null );\n\tconst toInputRef = useRef< HTMLInputElement >( null );\n\n\tconst updateDateRange = useCallback(\n\t\t( fromDate?: Date | string, toDate?: Date | string ) => {\n\t\t\tif ( fromDate && toDate ) {\n\t\t\t\tonChangeCallback( [\n\t\t\t\t\tformatDate( fromDate ),\n\t\t\t\t\tformatDate( toDate ),\n\t\t\t\t] );\n\t\t\t} else if ( ! fromDate && ! toDate ) {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t\t// Do nothing if only one date is set - wait for both\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst onSelectCalendarRange = useCallback(\n\t\t(\n\t\t\tnewRange:\n\t\t\t\t| { from: Date | undefined; to?: Date | undefined }\n\t\t\t\t| undefined\n\t\t) => {\n\t\t\tupdateDateRange( newRange?.from, newRange?.to );\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ updateDateRange ]\n\t);\n\n\tconst handlePresetClick = useCallback(\n\t\t( preset: ( typeof DATE_RANGE_PRESETS )[ 0 ] ) => {\n\t\t\tconst [ startDate, endDate ] = preset.getValue();\n\t\t\tsetCalendarMonth( startDate );\n\t\t\tupdateDateRange( startDate, endDate );\n\t\t\tsetSelectedPresetId( preset.id );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ updateDateRange ]\n\t);\n\n\tconst handleManualDateChange = useCallback(\n\t\t( fromOrTo: 'from' | 'to', newValue?: string ) => {\n\t\t\tconst [ currentFrom, currentTo ] = value || [\n\t\t\t\tundefined,\n\t\t\t\tundefined,\n\t\t\t];\n\t\t\tconst updatedFrom = fromOrTo === 'from' ? newValue : currentFrom;\n\t\t\tconst updatedTo = fromOrTo === 'to' ? newValue : currentTo;\n\n\t\t\tupdateDateRange( updatedFrom, updatedTo );\n\n\t\t\tif ( newValue ) {\n\t\t\t\tconst parsedDate = parseDate( newValue );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tsetSelectedPresetId( null );\n\t\t\tsetIsTouched( true );\n\t\t},\n\t\t[ value, updateDateRange ]\n\t);\n\n\tconst { timezone } = getSettings();\n\n\tconst displayLabel = field.isValid?.required\n\t\t? `${ label } (${ __( 'Required' ) })`\n\t\t: label;\n\n\treturn (\n\t\t<ValidatedDateControl\n\t\t\tfield={ field }\n\t\t\tvalidity={ validity }\n\t\t\tinputRefs={ [ fromInputRef, toInputRef ] }\n\t\t\tisTouched={ isTouched }\n\t\t\tsetIsTouched={ setIsTouched }\n\t\t>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tid={ id }\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tlabel={ displayLabel }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t{ /* Preset buttons */ }\n\t\t\t\t\t<HStack spacing={ 2 } wrap justify=\"flex-start\">\n\t\t\t\t\t\t{ DATE_RANGE_PRESETS.map( ( preset ) => {\n\t\t\t\t\t\t\tconst isSelected = selectedPresetId === preset.id;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\t\t\tkey={ preset.id }\n\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\tisPressed={ isSelected }\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\thandlePresetClick( preset )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ preset.label }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"dataviews-controls__date-preset\"\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tisPressed={ ! selectedPresetId }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\taccessibleWhenDisabled={ false }\n\t\t\t\t\t\t\tdisabled={ !! selectedPresetId }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Custom' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t{ /* Manual date range inputs */ }\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tref={ fromInputRef }\n\t\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\t\tlabel={ __( 'From' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tvalue={ value?.[ 0 ] }\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleManualDateChange( 'from', newValue )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tref={ toInputRef }\n\t\t\t\t\t\t\ttype=\"date\"\n\t\t\t\t\t\t\tlabel={ __( 'To' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\tvalue={ value?.[ 1 ] }\n\t\t\t\t\t\t\tonChange={ ( newValue ) =>\n\t\t\t\t\t\t\t\thandleManualDateChange( 'to', newValue )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\trequired={ !! field.isValid?.required }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\n\t\t\t\t\t<DateRangeCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={ selectedRange }\n\t\t\t\t\t\tonSelect={ onSelectCalendarRange }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezone.string || undefined }\n\t\t\t\t\t\tweekStartsOn={ weekStartsOn }\n\t\t\t\t\t/>\n\t\t\t\t</VStack>\n\t\t\t</BaseControl>\n\t\t</ValidatedDateControl>\n\t);\n}\n\nexport default function DateControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\toperator,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tif ( operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER ) {\n\t\treturn (\n\t\t\t<RelativeDateControl\n\t\t\t\tclassName=\"dataviews-controls__date\"\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\toperator={ operator }\n\t\t\t/>\n\t\t);\n\t}\n\n\tif ( operator === OPERATOR_BETWEEN ) {\n\t\treturn (\n\t\t\t<CalendarDateRangeControl\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tvalidity={ validity }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<CalendarDateControl\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tvalidity={ validity }\n\t\t/>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["componentsPrivateApis", "isValidDate", "getCustomValidity", "clsx", "errorIcon", "VStack", "HStack", "InputControl", "RelativeDateControl"]
|
|
7
7
|
}
|
|
@@ -54,7 +54,7 @@ function Email({
|
|
|
54
54
|
hideLabelFromVision,
|
|
55
55
|
validity,
|
|
56
56
|
type: "email",
|
|
57
|
-
prefix: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.
|
|
57
|
+
prefix: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalInputControlPrefixWrapper, { variant: "icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Icon, { icon: import_icons.envelope }) })
|
|
58
58
|
}
|
|
59
59
|
}
|
|
60
60
|
);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dataform-controls/email.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\t__experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n} from '@wordpress/components';\nimport {
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tIcon,\n\t__experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n} from '@wordpress/components';\nimport { envelope } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../types';\nimport ValidatedText from './utils/validated-input';\n\nexport default function Email< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\treturn (\n\t\t<ValidatedText\n\t\t\t{ ...{\n\t\t\t\tdata,\n\t\t\t\tfield,\n\t\t\t\tonChange,\n\t\t\t\thideLabelFromVision,\n\t\t\t\tvalidity,\n\t\t\t\ttype: 'email',\n\t\t\t\tprefix: (\n\t\t\t\t\t<InputControlPrefixWrapper variant=\"icon\">\n\t\t\t\t\t\t<Icon icon={ envelope } />\n\t\t\t\t\t</InputControlPrefixWrapper>\n\t\t\t\t),\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAGO;AACP,mBAAyB;AAMzB,6BAA0B;AAoBpB;AAlBS,SAAR,MAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,SACC;AAAA,IAAC,uBAAAA;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,QACC,4CAAC,kBAAAC,yCAAA,EAA0B,SAAQ,QAClC,sDAAC,0BAAK,MAAO,uBAAW,GACzB;AAAA,MAEF;AAAA;AAAA,EACD;AAEF;",
|
|
6
6
|
"names": ["ValidatedText", "InputControlPrefixWrapper"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// packages/dataviews/src/dataform-layouts/details/index.tsx
|
|
31
|
+
var details_exports = {};
|
|
32
|
+
__export(details_exports, {
|
|
33
|
+
default: () => FormDetailsField
|
|
34
|
+
});
|
|
35
|
+
module.exports = __toCommonJS(details_exports);
|
|
36
|
+
var import_element = require("@wordpress/element");
|
|
37
|
+
var import_i18n = require("@wordpress/i18n");
|
|
38
|
+
var import_dataform_context = __toESM(require("../../components/dataform-context"));
|
|
39
|
+
var import_data_form_layout = require("../data-form-layout");
|
|
40
|
+
var import_normalize_form = require("../normalize-form");
|
|
41
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
42
|
+
function FormDetailsField({
|
|
43
|
+
data,
|
|
44
|
+
field,
|
|
45
|
+
onChange
|
|
46
|
+
}) {
|
|
47
|
+
const { fields } = (0, import_element.useContext)(import_dataform_context.default);
|
|
48
|
+
const form = (0, import_element.useMemo)(
|
|
49
|
+
() => ({
|
|
50
|
+
layout: import_normalize_form.DEFAULT_LAYOUT,
|
|
51
|
+
fields: field.children ?? []
|
|
52
|
+
}),
|
|
53
|
+
[field]
|
|
54
|
+
);
|
|
55
|
+
if (!field.children) {
|
|
56
|
+
return null;
|
|
57
|
+
}
|
|
58
|
+
const summaryFieldId = field.layout.summary ?? "";
|
|
59
|
+
const summaryField = summaryFieldId ? fields.find((fieldDef) => fieldDef.id === summaryFieldId) : void 0;
|
|
60
|
+
let summaryContent;
|
|
61
|
+
if (summaryField && summaryField.render) {
|
|
62
|
+
summaryContent = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(summaryField.render, { item: data, field: summaryField });
|
|
63
|
+
} else {
|
|
64
|
+
summaryContent = field.label || (0, import_i18n.__)("More details");
|
|
65
|
+
}
|
|
66
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { className: "dataforms-layouts-details__details", children: [
|
|
67
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { className: "dataforms-layouts-details__summary", children: summaryContent }),
|
|
68
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "dataforms-layouts-details__content", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
69
|
+
import_data_form_layout.DataFormLayout,
|
|
70
|
+
{
|
|
71
|
+
data,
|
|
72
|
+
form,
|
|
73
|
+
onChange
|
|
74
|
+
}
|
|
75
|
+
) })
|
|
76
|
+
] });
|
|
77
|
+
}
|
|
78
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/dataform-layouts/details/index.tsx"],
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useContext, useMemo } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tNormalizedForm,\n\tNormalizedDetailsLayout,\n\tFieldLayoutProps,\n} from '../../types';\nimport DataFormContext from '../../components/dataform-context';\nimport { DataFormLayout } from '../data-form-layout';\nimport { DEFAULT_LAYOUT } from '../normalize-form';\n\nexport default function FormDetailsField< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n}: FieldLayoutProps< Item > ) {\n\tconst { fields } = useContext( DataFormContext );\n\n\tconst form: NormalizedForm = useMemo(\n\t\t() => ( {\n\t\t\tlayout: DEFAULT_LAYOUT,\n\t\t\tfields: field.children ?? [],\n\t\t} ),\n\t\t[ field ]\n\t);\n\n\tif ( ! field.children ) {\n\t\treturn null;\n\t}\n\n\t// Find the summary field definition if specified\n\tconst summaryFieldId =\n\t\t( field.layout as NormalizedDetailsLayout ).summary ?? '';\n\tconst summaryField = summaryFieldId\n\t\t? fields.find( ( fieldDef ) => fieldDef.id === summaryFieldId )\n\t\t: undefined;\n\n\t// Render the summary content\n\tlet summaryContent;\n\tif ( summaryField && summaryField.render ) {\n\t\t// Use the field's render function to display the current value\n\t\tsummaryContent = (\n\t\t\t<summaryField.render item={ data } field={ summaryField } />\n\t\t);\n\t} else {\n\t\t// Fall back to the label\n\t\tsummaryContent = field.label || __( 'More details' );\n\t}\n\n\treturn (\n\t\t<details className=\"dataforms-layouts-details__details\">\n\t\t\t<summary className=\"dataforms-layouts-details__summary\">\n\t\t\t\t{ summaryContent }\n\t\t\t</summary>\n\t\t\t<div className=\"dataforms-layouts-details__content\">\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/>\n\t\t\t</div>\n\t\t</details>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAoC;AACpC,kBAAmB;AAUnB,8BAA4B;AAC5B,8BAA+B;AAC/B,4BAA+B;AAiC5B;AA/BY,SAAR,iBAA2C;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AACD,GAA8B;AAC7B,QAAM,EAAE,OAAO,QAAI,2BAAY,wBAAAA,OAAgB;AAE/C,QAAM,WAAuB;AAAA,IAC5B,OAAQ;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ,MAAM,YAAY,CAAC;AAAA,IAC5B;AAAA,IACA,CAAE,KAAM;AAAA,EACT;AAEA,MAAK,CAAE,MAAM,UAAW;AACvB,WAAO;AAAA,EACR;AAGA,QAAM,iBACH,MAAM,OAAoC,WAAW;AACxD,QAAM,eAAe,iBAClB,OAAO,KAAM,CAAE,aAAc,SAAS,OAAO,cAAe,IAC5D;AAGH,MAAI;AACJ,MAAK,gBAAgB,aAAa,QAAS;AAE1C,qBACC,4CAAC,aAAa,QAAb,EAAoB,MAAO,MAAO,OAAQ,cAAe;AAAA,EAE5D,OAAO;AAEN,qBAAiB,MAAM,aAAS,gBAAI,cAAe;AAAA,EACpD;AAEA,SACC,6CAAC,aAAQ,WAAU,sCAClB;AAAA,gDAAC,aAAQ,WAAU,sCAChB,0BACH;AAAA,IACA,4CAAC,SAAI,WAAU,sCACd;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACD,GACD;AAAA,KACD;AAEF;",
|
|
6
|
+
"names": ["DataFormContext"]
|
|
7
|
+
}
|
|
@@ -38,6 +38,7 @@ var import_regular = __toESM(require("./regular"));
|
|
|
38
38
|
var import_panel = __toESM(require("./panel"));
|
|
39
39
|
var import_card = __toESM(require("./card"));
|
|
40
40
|
var import_row = __toESM(require("./row"));
|
|
41
|
+
var import_details = __toESM(require("./details"));
|
|
41
42
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
42
43
|
var FORM_FIELD_LAYOUTS = [
|
|
43
44
|
{
|
|
@@ -69,6 +70,10 @@ var FORM_FIELD_LAYOUTS = [
|
|
|
69
70
|
children
|
|
70
71
|
}
|
|
71
72
|
) }) })
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
type: "details",
|
|
76
|
+
component: import_details.default
|
|
72
77
|
}
|
|
73
78
|
];
|
|
74
79
|
function getFormFieldLayout(type) {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dataform-layouts/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedLayout, NormalizedRowLayout } from '../types';\nimport FormRegularField from './regular';\nimport FormPanelField from './panel';\nimport FormCardField from './card';\nimport FormRowField from './row';\n\nconst FORM_FIELD_LAYOUTS = [\n\t{\n\t\ttype: 'regular',\n\t\tcomponent: FormRegularField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 4 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'panel',\n\t\tcomponent: FormPanelField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 2 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'card',\n\t\tcomponent: FormCardField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 6 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'row',\n\t\tcomponent: FormRowField,\n\t\twrapper: ( {\n\t\t\tchildren,\n\t\t\tlayout,\n\t\t}: {\n\t\t\tchildren: React.ReactNode;\n\t\t\tlayout: NormalizedLayout;\n\t\t} ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 4 }>\n\t\t\t\t<div className=\"dataforms-layouts-row__field\">\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 4 }\n\t\t\t\t\t\talignment={\n\t\t\t\t\t\t\t( layout as NormalizedRowLayout ).alignment\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</HStack>\n\t\t\t\t</div>\n\t\t\t</VStack>\n\t\t),\n\t},\n];\n\nexport function getFormFieldLayout( type: string ) {\n\treturn FORM_FIELD_LAYOUTS.find( ( layout ) => layout.type === type );\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAGO;AAMP,qBAA6B;AAC7B,mBAA2B;AAC3B,kBAA0B;AAC1B,iBAAyB;
|
|
6
|
-
"names": ["FormRegularField", "VStack", "FormPanelField", "FormCardField", "FormRowField", "HStack"]
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedLayout, NormalizedRowLayout } from '../types';\nimport FormRegularField from './regular';\nimport FormPanelField from './panel';\nimport FormCardField from './card';\nimport FormRowField from './row';\nimport FormDetailsField from './details';\n\nconst FORM_FIELD_LAYOUTS = [\n\t{\n\t\ttype: 'regular',\n\t\tcomponent: FormRegularField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 4 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'panel',\n\t\tcomponent: FormPanelField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 2 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'card',\n\t\tcomponent: FormCardField,\n\t\twrapper: ( { children }: { children: React.ReactNode } ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 6 }>\n\t\t\t\t{ children }\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'row',\n\t\tcomponent: FormRowField,\n\t\twrapper: ( {\n\t\t\tchildren,\n\t\t\tlayout,\n\t\t}: {\n\t\t\tchildren: React.ReactNode;\n\t\t\tlayout: NormalizedLayout;\n\t\t} ) => (\n\t\t\t<VStack className=\"dataforms-layouts__wrapper\" spacing={ 4 }>\n\t\t\t\t<div className=\"dataforms-layouts-row__field\">\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 4 }\n\t\t\t\t\t\talignment={\n\t\t\t\t\t\t\t( layout as NormalizedRowLayout ).alignment\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</HStack>\n\t\t\t\t</div>\n\t\t\t</VStack>\n\t\t),\n\t},\n\t{\n\t\ttype: 'details',\n\t\tcomponent: FormDetailsField,\n\t},\n];\n\nexport function getFormFieldLayout( type: string ) {\n\treturn FORM_FIELD_LAYOUTS.find( ( layout ) => layout.type === type );\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAGO;AAMP,qBAA6B;AAC7B,mBAA2B;AAC3B,kBAA0B;AAC1B,iBAAyB;AACzB,qBAA6B;AAO1B;AALH,IAAM,qBAAqB;AAAA,EAC1B;AAAA,IACC,MAAM;AAAA,IACN,WAAW,eAAAA;AAAA,IACX,SAAS,CAAE,EAAE,SAAS,MACrB,4CAAC,kBAAAC,sBAAA,EAAO,WAAU,8BAA6B,SAAU,GACtD,UACH;AAAA,EAEF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAW,aAAAC;AAAA,IACX,SAAS,CAAE,EAAE,SAAS,MACrB,4CAAC,kBAAAD,sBAAA,EAAO,WAAU,8BAA6B,SAAU,GACtD,UACH;AAAA,EAEF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAW,YAAAE;AAAA,IACX,SAAS,CAAE,EAAE,SAAS,MACrB,4CAAC,kBAAAF,sBAAA,EAAO,WAAU,8BAA6B,SAAU,GACtD,UACH;AAAA,EAEF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAW,WAAAG;AAAA,IACX,SAAS,CAAE;AAAA,MACV;AAAA,MACA;AAAA,IACD,MAIC,4CAAC,kBAAAH,sBAAA,EAAO,WAAU,8BAA6B,SAAU,GACxD,sDAAC,SAAI,WAAU,gCACd;AAAA,MAAC,kBAAAI;AAAA,MAAA;AAAA,QACA,SAAU;AAAA,QACV,WACG,OAAgC;AAAA,QAGjC;AAAA;AAAA,IACH,GACD,GACD;AAAA,EAEF;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAW,eAAAC;AAAA,EACZ;AACD;AAEO,SAAS,mBAAoB,MAAe;AAClD,SAAO,mBAAmB,KAAM,CAAE,WAAY,OAAO,SAAS,IAAK;AACpE;",
|
|
6
|
+
"names": ["FormRegularField", "VStack", "FormPanelField", "FormCardField", "FormRowField", "HStack", "FormDetailsField"]
|
|
7
7
|
}
|
|
@@ -80,6 +80,11 @@ function normalizeLayout(layout) {
|
|
|
80
80
|
alignment: layout?.alignment ?? "center",
|
|
81
81
|
styles: layout?.styles ?? {}
|
|
82
82
|
};
|
|
83
|
+
} else if (layout?.type === "details") {
|
|
84
|
+
normalizedLayout = {
|
|
85
|
+
type: "details",
|
|
86
|
+
summary: layout?.summary ?? ""
|
|
87
|
+
};
|
|
83
88
|
}
|
|
84
89
|
return normalizedLayout;
|
|
85
90
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dataform-layouts/normalize-form.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type {\n\tForm,\n\tLayout,\n\tNormalizedForm,\n\tNormalizedFormField,\n\tNormalizedLayout,\n\tNormalizedRegularLayout,\n\tNormalizedPanelLayout,\n\tNormalizedCardLayout,\n\tNormalizedRowLayout,\n\tNormalizedCardSummaryField,\n\tCardSummaryField,\n} from '../types';\n\nexport const DEFAULT_LAYOUT: NormalizedLayout = {\n\ttype: 'regular',\n\tlabelPosition: 'top',\n} as NormalizedRegularLayout;\n\nconst normalizeCardSummaryField = (\n\tsum: CardSummaryField\n): NormalizedCardSummaryField => {\n\tif ( typeof sum === 'string' ) {\n\t\treturn [ { id: sum, visibility: 'when-collapsed' } ];\n\t}\n\treturn sum.map( ( item ) => {\n\t\tif ( typeof item === 'string' ) {\n\t\t\treturn { id: item, visibility: 'when-collapsed' };\n\t\t}\n\t\treturn { id: item.id, visibility: item.visibility };\n\t} );\n};\n\n/**\n * Normalizes a layout configuration based on its type.\n *\n * @param layout The layout object to normalize.\n * @return The normalized layout object.\n */\nfunction normalizeLayout( layout?: Layout ): NormalizedLayout {\n\tlet normalizedLayout = DEFAULT_LAYOUT;\n\n\tif ( layout?.type === 'regular' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'regular',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'top',\n\t\t} satisfies NormalizedRegularLayout;\n\t} else if ( layout?.type === 'panel' ) {\n\t\tconst summary = layout.summary ?? [];\n\t\tconst normalizedSummary = Array.isArray( summary )\n\t\t\t? summary\n\t\t\t: [ summary ];\n\n\t\tnormalizedLayout = {\n\t\t\ttype: 'panel',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'side',\n\t\t\topenAs: layout?.openAs ?? 'dropdown',\n\t\t\tsummary: normalizedSummary,\n\t\t} satisfies NormalizedPanelLayout;\n\t} else if ( layout?.type === 'card' ) {\n\t\tif ( layout.withHeader === false ) {\n\t\t\t// Don't let isOpened be false if withHeader is false.\n\t\t\t// Otherwise, the card will not be visible.\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: false,\n\t\t\t\tisOpened: true,\n\t\t\t\tsummary: [],\n\t\t\t\tisCollapsible: false,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t} else {\n\t\t\tconst summary = layout.summary ?? [];\n\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: true,\n\t\t\t\tisOpened:\n\t\t\t\t\ttypeof layout.isOpened === 'boolean'\n\t\t\t\t\t\t? layout.isOpened\n\t\t\t\t\t\t: true,\n\t\t\t\tsummary: normalizeCardSummaryField( summary ),\n\t\t\t\tisCollapsible:\n\t\t\t\t\tlayout.isCollapsible === undefined\n\t\t\t\t\t\t? true\n\t\t\t\t\t\t: layout.isCollapsible,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t}\n\t} else if ( layout?.type === 'row' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'row',\n\t\t\talignment: layout?.alignment ?? 'center',\n\t\t\tstyles: layout?.styles ?? {},\n\t\t} satisfies NormalizedRowLayout;\n\t}\n\n\treturn normalizedLayout;\n}\n\nfunction normalizeForm( form: Form ): NormalizedForm {\n\tconst normalizedFormLayout = normalizeLayout( form?.layout );\n\n\tconst normalizedFields: NormalizedFormField[] = ( form.fields ?? [] ).map(\n\t\t( field ) => {\n\t\t\tif ( typeof field === 'string' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: field,\n\t\t\t\t\tlayout: normalizedFormLayout,\n\t\t\t\t} satisfies NormalizedFormField;\n\t\t\t}\n\n\t\t\tconst fieldLayout = field.layout\n\t\t\t\t? normalizeLayout( field.layout )\n\t\t\t\t: normalizedFormLayout;\n\n\t\t\treturn {\n\t\t\t\tid: field.id,\n\t\t\t\tlayout: fieldLayout,\n\t\t\t\t...( !! field.label && { label: field.label } ),\n\t\t\t\t...( !! field.description && {\n\t\t\t\t\tdescription: field.description,\n\t\t\t\t} ),\n\t\t\t\t...( 'children' in field &&\n\t\t\t\t\tArray.isArray( field.children ) && {\n\t\t\t\t\t\tchildren: normalizeForm( {\n\t\t\t\t\t\t\tfields: field.children,\n\t\t\t\t\t\t\tlayout: DEFAULT_LAYOUT,\n\t\t\t\t\t\t} ).fields,\n\t\t\t\t\t} ),\n\t\t\t} satisfies NormalizedFormField;\n\t\t}\n\t);\n\n\treturn {\n\t\tlayout: normalizedFormLayout,\n\t\tfields: normalizedFields,\n\t};\n}\n\nexport default normalizeForm;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["/**\n * Internal dependencies\n */\nimport type {\n\tForm,\n\tLayout,\n\tNormalizedForm,\n\tNormalizedFormField,\n\tNormalizedLayout,\n\tNormalizedRegularLayout,\n\tNormalizedPanelLayout,\n\tNormalizedCardLayout,\n\tNormalizedRowLayout,\n\tNormalizedDetailsLayout,\n\tNormalizedCardSummaryField,\n\tCardSummaryField,\n} from '../types';\n\nexport const DEFAULT_LAYOUT: NormalizedLayout = {\n\ttype: 'regular',\n\tlabelPosition: 'top',\n} as NormalizedRegularLayout;\n\nconst normalizeCardSummaryField = (\n\tsum: CardSummaryField\n): NormalizedCardSummaryField => {\n\tif ( typeof sum === 'string' ) {\n\t\treturn [ { id: sum, visibility: 'when-collapsed' } ];\n\t}\n\treturn sum.map( ( item ) => {\n\t\tif ( typeof item === 'string' ) {\n\t\t\treturn { id: item, visibility: 'when-collapsed' };\n\t\t}\n\t\treturn { id: item.id, visibility: item.visibility };\n\t} );\n};\n\n/**\n * Normalizes a layout configuration based on its type.\n *\n * @param layout The layout object to normalize.\n * @return The normalized layout object.\n */\nfunction normalizeLayout( layout?: Layout ): NormalizedLayout {\n\tlet normalizedLayout = DEFAULT_LAYOUT;\n\n\tif ( layout?.type === 'regular' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'regular',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'top',\n\t\t} satisfies NormalizedRegularLayout;\n\t} else if ( layout?.type === 'panel' ) {\n\t\tconst summary = layout.summary ?? [];\n\t\tconst normalizedSummary = Array.isArray( summary )\n\t\t\t? summary\n\t\t\t: [ summary ];\n\n\t\tnormalizedLayout = {\n\t\t\ttype: 'panel',\n\t\t\tlabelPosition: layout?.labelPosition ?? 'side',\n\t\t\topenAs: layout?.openAs ?? 'dropdown',\n\t\t\tsummary: normalizedSummary,\n\t\t} satisfies NormalizedPanelLayout;\n\t} else if ( layout?.type === 'card' ) {\n\t\tif ( layout.withHeader === false ) {\n\t\t\t// Don't let isOpened be false if withHeader is false.\n\t\t\t// Otherwise, the card will not be visible.\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: false,\n\t\t\t\tisOpened: true,\n\t\t\t\tsummary: [],\n\t\t\t\tisCollapsible: false,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t} else {\n\t\t\tconst summary = layout.summary ?? [];\n\n\t\t\tnormalizedLayout = {\n\t\t\t\ttype: 'card',\n\t\t\t\twithHeader: true,\n\t\t\t\tisOpened:\n\t\t\t\t\ttypeof layout.isOpened === 'boolean'\n\t\t\t\t\t\t? layout.isOpened\n\t\t\t\t\t\t: true,\n\t\t\t\tsummary: normalizeCardSummaryField( summary ),\n\t\t\t\tisCollapsible:\n\t\t\t\t\tlayout.isCollapsible === undefined\n\t\t\t\t\t\t? true\n\t\t\t\t\t\t: layout.isCollapsible,\n\t\t\t} satisfies NormalizedCardLayout;\n\t\t}\n\t} else if ( layout?.type === 'row' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'row',\n\t\t\talignment: layout?.alignment ?? 'center',\n\t\t\tstyles: layout?.styles ?? {},\n\t\t} satisfies NormalizedRowLayout;\n\t} else if ( layout?.type === 'details' ) {\n\t\tnormalizedLayout = {\n\t\t\ttype: 'details',\n\t\t\tsummary: layout?.summary ?? '',\n\t\t} satisfies NormalizedDetailsLayout;\n\t}\n\n\treturn normalizedLayout;\n}\n\nfunction normalizeForm( form: Form ): NormalizedForm {\n\tconst normalizedFormLayout = normalizeLayout( form?.layout );\n\n\tconst normalizedFields: NormalizedFormField[] = ( form.fields ?? [] ).map(\n\t\t( field ) => {\n\t\t\tif ( typeof field === 'string' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: field,\n\t\t\t\t\tlayout: normalizedFormLayout,\n\t\t\t\t} satisfies NormalizedFormField;\n\t\t\t}\n\n\t\t\tconst fieldLayout = field.layout\n\t\t\t\t? normalizeLayout( field.layout )\n\t\t\t\t: normalizedFormLayout;\n\n\t\t\treturn {\n\t\t\t\tid: field.id,\n\t\t\t\tlayout: fieldLayout,\n\t\t\t\t...( !! field.label && { label: field.label } ),\n\t\t\t\t...( !! field.description && {\n\t\t\t\t\tdescription: field.description,\n\t\t\t\t} ),\n\t\t\t\t...( 'children' in field &&\n\t\t\t\t\tArray.isArray( field.children ) && {\n\t\t\t\t\t\tchildren: normalizeForm( {\n\t\t\t\t\t\t\tfields: field.children,\n\t\t\t\t\t\t\tlayout: DEFAULT_LAYOUT,\n\t\t\t\t\t\t} ).fields,\n\t\t\t\t\t} ),\n\t\t\t} satisfies NormalizedFormField;\n\t\t}\n\t);\n\n\treturn {\n\t\tlayout: normalizedFormLayout,\n\t\tfields: normalizedFields,\n\t};\n}\n\nexport default normalizeForm;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -39,6 +39,7 @@ var import_table = __toESM(require("./table"));
|
|
|
39
39
|
var import_grid = __toESM(require("./grid"));
|
|
40
40
|
var import_list = __toESM(require("./list"));
|
|
41
41
|
var import_picker_grid = __toESM(require("./picker-grid"));
|
|
42
|
+
var import_picker_table = __toESM(require("./picker-table"));
|
|
42
43
|
var import_constants = require("../constants");
|
|
43
44
|
var import_preview_size_picker = __toESM(require("./utils/preview-size-picker"));
|
|
44
45
|
var import_density_picker = __toESM(require("./table/density-picker"));
|
|
@@ -70,6 +71,14 @@ var VIEW_LAYOUTS = [
|
|
|
70
71
|
icon: import_icons.category,
|
|
71
72
|
viewConfigOptions: import_preview_size_picker.default,
|
|
72
73
|
isPicker: true
|
|
74
|
+
},
|
|
75
|
+
{
|
|
76
|
+
type: import_constants.LAYOUT_PICKER_TABLE,
|
|
77
|
+
label: (0, import_i18n.__)("Table"),
|
|
78
|
+
component: import_picker_table.default,
|
|
79
|
+
icon: import_icons.blockTable,
|
|
80
|
+
viewConfigOptions: import_density_picker.default,
|
|
81
|
+
isPicker: true
|
|
73
82
|
}
|
|
74
83
|
];
|
|
75
84
|
// Annotate the CommonJS export names for ESM import in node:
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/dataviews-layouts/index.ts"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport ViewPickerGrid from './picker-grid';\nimport {\n\tLAYOUT_GRID,\n\tLAYOUT_LIST,\n\tLAYOUT_TABLE,\n\tLAYOUT_PICKER_GRID,\n} from '../constants';\nimport PreviewSizePicker from './utils/preview-size-picker';\nimport DensityPicker from './table/density-picker';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewPickerGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t\tisPicker: true,\n\t},\n];\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAC1B,mBAKO;AAKP,mBAAsB;AACtB,kBAAqB;AACrB,kBAAqB;AACrB,yBAA2B;AAC3B,
|
|
6
|
-
"names": ["ViewTable", "DensityPicker", "ViewGrid", "PreviewSizePicker", "ViewList", "ViewPickerGrid"]
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport {\n\tblockTable,\n\tcategory,\n\tformatListBullets,\n\tformatListBulletsRTL,\n} from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport ViewTable from './table';\nimport ViewGrid from './grid';\nimport ViewList from './list';\nimport ViewPickerGrid from './picker-grid';\nimport ViewPickerTable from './picker-table';\nimport {\n\tLAYOUT_GRID,\n\tLAYOUT_LIST,\n\tLAYOUT_TABLE,\n\tLAYOUT_PICKER_GRID,\n\tLAYOUT_PICKER_TABLE,\n} from '../constants';\nimport PreviewSizePicker from './utils/preview-size-picker';\nimport DensityPicker from './table/density-picker';\n\nexport const VIEW_LAYOUTS = [\n\t{\n\t\ttype: LAYOUT_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t},\n\t{\n\t\ttype: LAYOUT_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t},\n\t{\n\t\ttype: LAYOUT_LIST,\n\t\tlabel: __( 'List' ),\n\t\tcomponent: ViewList,\n\t\ticon: isRTL() ? formatListBulletsRTL : formatListBullets,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_GRID,\n\t\tlabel: __( 'Grid' ),\n\t\tcomponent: ViewPickerGrid,\n\t\ticon: category,\n\t\tviewConfigOptions: PreviewSizePicker,\n\t\tisPicker: true,\n\t},\n\t{\n\t\ttype: LAYOUT_PICKER_TABLE,\n\t\tlabel: __( 'Table' ),\n\t\tcomponent: ViewPickerTable,\n\t\ticon: blockTable,\n\t\tviewConfigOptions: DensityPicker,\n\t\tisPicker: true,\n\t},\n];\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAA0B;AAC1B,mBAKO;AAKP,mBAAsB;AACtB,kBAAqB;AACrB,kBAAqB;AACrB,yBAA2B;AAC3B,0BAA4B;AAC5B,uBAMO;AACP,iCAA8B;AAC9B,4BAA0B;AAEnB,IAAM,eAAe;AAAA,EAC3B;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,OAAQ;AAAA,IACnB,WAAW,aAAAA;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAC;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,YAAAC;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,2BAAAC;AAAA,EACpB;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,YAAAC;AAAA,IACX,UAAM,mBAAM,IAAI,oCAAuB;AAAA,EACxC;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,MAAO;AAAA,IAClB,WAAW,mBAAAC;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,2BAAAF;AAAA,IACnB,UAAU;AAAA,EACX;AAAA,EACA;AAAA,IACC,MAAM;AAAA,IACN,WAAO,gBAAI,OAAQ;AAAA,IACnB,WAAW,oBAAAG;AAAA,IACX,MAAM;AAAA,IACN,mBAAmB,sBAAAL;AAAA,IACnB,UAAU;AAAA,EACX;AACD;",
|
|
6
|
+
"names": ["ViewTable", "DensityPicker", "ViewGrid", "PreviewSizePicker", "ViewList", "ViewPickerGrid", "ViewPickerTable"]
|
|
7
7
|
}
|