@delmaredigital/payload-puck 0.6.12 → 0.6.13
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/README.md +50 -1
- package/dist/admin/EditWithPuckButton.d.ts +1 -1
- package/dist/admin/EditWithPuckButton.d.ts.map +1 -1
- package/dist/admin/EditWithPuckButton.js +65 -25
- package/dist/admin/EditWithPuckButton.js.map +1 -1
- package/dist/admin/EditWithPuckCell.js +43 -13
- package/dist/admin/EditWithPuckCell.js.map +1 -1
- package/dist/admin/PuckEditorView.d.ts +1 -1
- package/dist/admin/PuckEditorView.d.ts.map +1 -1
- package/dist/admin/PuckEditorView.js +118 -32
- package/dist/admin/PuckEditorView.js.map +1 -1
- package/dist/admin/client.d.ts +2 -2
- package/dist/admin/client.d.ts.map +1 -1
- package/dist/admin/client.js +4 -4
- package/dist/admin/client.js.map +1 -1
- package/dist/admin/generateAdminComponents.js +7 -7
- package/dist/admin/generateAdminComponents.js.map +1 -1
- package/dist/admin/index.d.ts +5 -5
- package/dist/admin/index.d.ts.map +1 -1
- package/dist/admin/index.js +3 -2
- package/dist/admin/index.js.map +1 -1
- package/dist/ai/collections/AiContext.js +56 -29
- package/dist/ai/collections/AiContext.js.map +1 -1
- package/dist/ai/collections/AiPrompts.js +24 -19
- package/dist/ai/collections/AiPrompts.js.map +1 -1
- package/dist/ai/createAiApiRoutes.js +28 -19
- package/dist/ai/createAiApiRoutes.js.map +1 -1
- package/dist/ai/createAiGenerate.js +7 -8
- package/dist/ai/createAiGenerate.js.map +1 -1
- package/dist/ai/createAiPlugin.js +7 -9
- package/dist/ai/createAiPlugin.js.map +1 -1
- package/dist/ai/hooks/useAiContext.js +50 -39
- package/dist/ai/hooks/useAiContext.js.map +1 -1
- package/dist/ai/hooks/useAiPrompts.js +33 -25
- package/dist/ai/hooks/useAiPrompts.js.map +1 -1
- package/dist/ai/index.js +9 -10
- package/dist/ai/index.js.map +1 -1
- package/dist/ai/plugins/ContextEditorPanel.d.ts +1 -1
- package/dist/ai/plugins/ContextEditorPanel.d.ts.map +1 -1
- package/dist/ai/plugins/ContextEditorPanel.js +399 -107
- package/dist/ai/plugins/ContextEditorPanel.js.map +1 -1
- package/dist/ai/plugins/PromptEditorPanel.d.ts +1 -1
- package/dist/ai/plugins/PromptEditorPanel.d.ts.map +1 -1
- package/dist/ai/plugins/PromptEditorPanel.js +237 -51
- package/dist/ai/plugins/PromptEditorPanel.js.map +1 -1
- package/dist/ai/plugins/contextEditorPlugin.js +12 -5
- package/dist/ai/plugins/contextEditorPlugin.js.map +1 -1
- package/dist/ai/plugins/promptApiRoutes.js +119 -50
- package/dist/ai/plugins/promptApiRoutes.js.map +1 -1
- package/dist/ai/plugins/promptEditorPlugin.js +12 -5
- package/dist/ai/plugins/promptEditorPlugin.js.map +1 -1
- package/dist/ai/presets/componentAiDefaults.js +108 -83
- package/dist/ai/presets/componentAiDefaults.js.map +1 -1
- package/dist/ai/presets/index.js +12 -18
- package/dist/ai/presets/index.js.map +1 -1
- package/dist/ai/presets/instructions/interactive.js +85 -75
- package/dist/ai/presets/instructions/interactive.js.map +1 -1
- package/dist/ai/presets/instructions/layout.js +122 -117
- package/dist/ai/presets/instructions/layout.js.map +1 -1
- package/dist/ai/presets/instructions/media.js +31 -29
- package/dist/ai/presets/instructions/media.js.map +1 -1
- package/dist/ai/presets/instructions/pagePatterns.js +4 -6
- package/dist/ai/presets/instructions/pagePatterns.js.map +1 -1
- package/dist/ai/presets/instructions/schemas.js +495 -137
- package/dist/ai/presets/instructions/schemas.js.map +1 -1
- package/dist/ai/presets/instructions/typography.js +38 -33
- package/dist/ai/presets/instructions/typography.js.map +1 -1
- package/dist/ai/tools/index.js +92 -55
- package/dist/ai/tools/index.js.map +1 -1
- package/dist/ai/types.js +7 -1
- package/dist/ai/types.js.map +1 -1
- package/dist/ai/utils/injectAiConfig.js +33 -40
- package/dist/ai/utils/injectAiConfig.js.map +1 -1
- package/dist/api/createPuckApiRoutes.d.ts +1 -1
- package/dist/api/createPuckApiRoutes.d.ts.map +1 -1
- package/dist/api/createPuckApiRoutes.js +123 -65
- package/dist/api/createPuckApiRoutes.js.map +1 -1
- package/dist/api/createPuckApiRoutesVersions.d.ts +1 -1
- package/dist/api/createPuckApiRoutesVersions.d.ts.map +1 -1
- package/dist/api/createPuckApiRoutesVersions.js +88 -37
- package/dist/api/createPuckApiRoutesVersions.js.map +1 -1
- package/dist/api/createPuckApiRoutesWithId.d.ts +1 -1
- package/dist/api/createPuckApiRoutesWithId.d.ts.map +1 -1
- package/dist/api/createPuckApiRoutesWithId.js +166 -72
- package/dist/api/createPuckApiRoutesWithId.js.map +1 -1
- package/dist/api/index.d.ts +5 -5
- package/dist/api/index.d.ts.map +1 -1
- package/dist/api/index.js +6 -6
- package/dist/api/index.js.map +1 -1
- package/dist/api/payload-config.d.js +15 -0
- package/dist/api/payload-config.d.js.map +1 -0
- package/dist/api/types.js +4 -1
- package/dist/api/types.js.map +1 -1
- package/dist/api/utils/mapRootProps.d.ts +1 -1
- package/dist/api/utils/mapRootProps.d.ts.map +1 -1
- package/dist/api/utils/mapRootProps.js +77 -44
- package/dist/api/utils/mapRootProps.js.map +1 -1
- package/dist/collections/Templates.js +24 -20
- package/dist/collections/Templates.js.map +1 -1
- package/dist/components/AccordionClient.d.ts +2 -2
- package/dist/components/AccordionClient.d.ts.map +1 -1
- package/dist/components/AccordionClient.js +81 -22
- package/dist/components/AccordionClient.js.map +1 -1
- package/dist/components/AnimatedWrapper.d.ts +2 -2
- package/dist/components/AnimatedWrapper.d.ts.map +1 -1
- package/dist/components/AnimatedWrapper.js +31 -16
- package/dist/components/AnimatedWrapper.js.map +1 -1
- package/dist/components/exports.js +2 -2
- package/dist/components/exports.js.map +1 -1
- package/dist/components/index.d.ts +5 -5
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +7 -7
- package/dist/components/index.js.map +1 -1
- package/dist/components/interactive/Accordion.d.ts +1 -1
- package/dist/components/interactive/Accordion.d.ts.map +1 -1
- package/dist/components/interactive/Accordion.js +149 -55
- package/dist/components/interactive/Accordion.js.map +1 -1
- package/dist/components/interactive/Accordion.server.d.ts +1 -1
- package/dist/components/interactive/Accordion.server.d.ts.map +1 -1
- package/dist/components/interactive/Accordion.server.js +25 -7
- package/dist/components/interactive/Accordion.server.js.map +1 -1
- package/dist/components/interactive/Button.d.ts +3 -3
- package/dist/components/interactive/Button.d.ts.map +1 -1
- package/dist/components/interactive/Button.js +89 -43
- package/dist/components/interactive/Button.js.map +1 -1
- package/dist/components/interactive/Button.server.d.ts +2 -2
- package/dist/components/interactive/Button.server.d.ts.map +1 -1
- package/dist/components/interactive/Button.server.js +40 -20
- package/dist/components/interactive/Button.server.js.map +1 -1
- package/dist/components/interactive/Card.d.ts +3 -3
- package/dist/components/interactive/Card.d.ts.map +1 -1
- package/dist/components/interactive/Card.js +131 -39
- package/dist/components/interactive/Card.js.map +1 -1
- package/dist/components/interactive/Card.server.d.ts +3 -3
- package/dist/components/interactive/Card.server.d.ts.map +1 -1
- package/dist/components/interactive/Card.server.js +72 -11
- package/dist/components/interactive/Card.server.js.map +1 -1
- package/dist/components/interactive/Divider.d.ts +1 -1
- package/dist/components/interactive/Divider.d.ts.map +1 -1
- package/dist/components/interactive/Divider.js +54 -26
- package/dist/components/interactive/Divider.js.map +1 -1
- package/dist/components/interactive/Divider.server.d.ts +1 -1
- package/dist/components/interactive/Divider.server.d.ts.map +1 -1
- package/dist/components/interactive/Divider.server.js +28 -12
- package/dist/components/interactive/Divider.server.js.map +1 -1
- package/dist/components/interactive/index.d.ts +4 -4
- package/dist/components/interactive/index.d.ts.map +1 -1
- package/dist/components/interactive/index.js +5 -5
- package/dist/components/interactive/index.js.map +1 -1
- package/dist/components/layout/Container.d.ts +1 -1
- package/dist/components/layout/Container.d.ts.map +1 -1
- package/dist/components/layout/Container.js +101 -47
- package/dist/components/layout/Container.js.map +1 -1
- package/dist/components/layout/Container.server.d.ts +1 -1
- package/dist/components/layout/Container.server.d.ts.map +1 -1
- package/dist/components/layout/Container.server.js +67 -19
- package/dist/components/layout/Container.server.js.map +1 -1
- package/dist/components/layout/Flex.d.ts +2 -2
- package/dist/components/layout/Flex.d.ts.map +1 -1
- package/dist/components/layout/Flex.js +124 -55
- package/dist/components/layout/Flex.js.map +1 -1
- package/dist/components/layout/Flex.server.d.ts +1 -1
- package/dist/components/layout/Flex.server.d.ts.map +1 -1
- package/dist/components/layout/Flex.server.js +50 -14
- package/dist/components/layout/Flex.server.js.map +1 -1
- package/dist/components/layout/Grid.d.ts +1 -1
- package/dist/components/layout/Grid.d.ts.map +1 -1
- package/dist/components/layout/Grid.js +93 -44
- package/dist/components/layout/Grid.js.map +1 -1
- package/dist/components/layout/Grid.server.d.ts +1 -1
- package/dist/components/layout/Grid.server.d.ts.map +1 -1
- package/dist/components/layout/Grid.server.js +56 -14
- package/dist/components/layout/Grid.server.js.map +1 -1
- package/dist/components/layout/Section.d.ts +1 -1
- package/dist/components/layout/Section.d.ts.map +1 -1
- package/dist/components/layout/Section.js +147 -64
- package/dist/components/layout/Section.js.map +1 -1
- package/dist/components/layout/Section.server.d.ts +1 -1
- package/dist/components/layout/Section.server.d.ts.map +1 -1
- package/dist/components/layout/Section.server.js +92 -28
- package/dist/components/layout/Section.server.js.map +1 -1
- package/dist/components/layout/Spacer.d.ts +1 -1
- package/dist/components/layout/Spacer.d.ts.map +1 -1
- package/dist/components/layout/Spacer.js +80 -30
- package/dist/components/layout/Spacer.js.map +1 -1
- package/dist/components/layout/Spacer.server.d.ts +1 -1
- package/dist/components/layout/Spacer.server.d.ts.map +1 -1
- package/dist/components/layout/Spacer.server.js +31 -9
- package/dist/components/layout/Spacer.server.js.map +1 -1
- package/dist/components/layout/Template.d.ts +1 -1
- package/dist/components/layout/Template.d.ts.map +1 -1
- package/dist/components/layout/Template.js +58 -30
- package/dist/components/layout/Template.js.map +1 -1
- package/dist/components/layout/Template.server.d.ts +1 -1
- package/dist/components/layout/Template.server.d.ts.map +1 -1
- package/dist/components/layout/Template.server.js +43 -11
- package/dist/components/layout/Template.server.js.map +1 -1
- package/dist/components/layout/index.d.ts +8 -8
- package/dist/components/layout/index.d.ts.map +1 -1
- package/dist/components/layout/index.js +8 -8
- package/dist/components/layout/index.js.map +1 -1
- package/dist/components/media/Image.d.ts +3 -3
- package/dist/components/media/Image.d.ts.map +1 -1
- package/dist/components/media/Image.js +122 -39
- package/dist/components/media/Image.js.map +1 -1
- package/dist/components/media/Image.server.d.ts +3 -3
- package/dist/components/media/Image.server.d.ts.map +1 -1
- package/dist/components/media/Image.server.js +76 -13
- package/dist/components/media/Image.server.js.map +1 -1
- package/dist/components/media/index.d.ts +1 -1
- package/dist/components/media/index.d.ts.map +1 -1
- package/dist/components/media/index.js +2 -2
- package/dist/components/media/index.js.map +1 -1
- package/dist/components/typography/Heading.d.ts +2 -2
- package/dist/components/typography/Heading.d.ts.map +1 -1
- package/dist/components/typography/Heading.js +45 -25
- package/dist/components/typography/Heading.js.map +1 -1
- package/dist/components/typography/Heading.server.d.ts +2 -2
- package/dist/components/typography/Heading.server.d.ts.map +1 -1
- package/dist/components/typography/Heading.server.js +16 -10
- package/dist/components/typography/Heading.server.js.map +1 -1
- package/dist/components/typography/RichText.editor.d.ts +1 -1
- package/dist/components/typography/RichText.editor.d.ts.map +1 -1
- package/dist/components/typography/RichText.editor.js +44 -19
- package/dist/components/typography/RichText.editor.js.map +1 -1
- package/dist/components/typography/RichText.server.d.ts +2 -2
- package/dist/components/typography/RichText.server.d.ts.map +1 -1
- package/dist/components/typography/RichText.server.js +33 -14
- package/dist/components/typography/RichText.server.js.map +1 -1
- package/dist/components/typography/Text.d.ts +2 -2
- package/dist/components/typography/Text.d.ts.map +1 -1
- package/dist/components/typography/Text.js +49 -23
- package/dist/components/typography/Text.js.map +1 -1
- package/dist/components/typography/Text.server.d.ts +2 -2
- package/dist/components/typography/Text.server.d.ts.map +1 -1
- package/dist/components/typography/Text.server.js +21 -8
- package/dist/components/typography/Text.server.js.map +1 -1
- package/dist/components/typography/index.d.ts +4 -4
- package/dist/components/typography/index.d.ts.map +1 -1
- package/dist/components/typography/index.js +5 -5
- package/dist/components/typography/index.js.map +1 -1
- package/dist/config/config.editor.d.ts +3 -3
- package/dist/config/config.editor.d.ts.map +1 -1
- package/dist/config/config.editor.js +119 -54
- package/dist/config/config.editor.js.map +1 -1
- package/dist/config/index.d.ts +4 -4
- package/dist/config/index.d.ts.map +1 -1
- package/dist/config/index.js +62 -35
- package/dist/config/index.js.map +1 -1
- package/dist/config/merge.d.ts +1 -1
- package/dist/config/merge.d.ts.map +1 -1
- package/dist/config/merge.js +23 -26
- package/dist/config/merge.js.map +1 -1
- package/dist/config/presets.d.ts +4 -4
- package/dist/config/presets.js +195 -75
- package/dist/config/presets.js.map +1 -1
- package/dist/config/types.js +6 -2
- package/dist/config/types.js.map +1 -1
- package/dist/editor/PuckEditor.d.ts +4 -4
- package/dist/editor/PuckEditor.d.ts.map +1 -1
- package/dist/editor/PuckEditor.js +162 -70
- package/dist/editor/PuckEditor.js.map +1 -1
- package/dist/editor/PuckEditorImpl.client.d.ts +4 -4
- package/dist/editor/PuckEditorImpl.client.d.ts.map +1 -1
- package/dist/editor/PuckEditorImpl.client.js +304 -152
- package/dist/editor/PuckEditorImpl.client.js.map +1 -1
- package/dist/editor/components/DarkModeStyles.js +11 -12
- package/dist/editor/components/DarkModeStyles.js.map +1 -1
- package/dist/editor/components/HeaderActions.js +308 -64
- package/dist/editor/components/HeaderActions.js.map +1 -1
- package/dist/editor/components/IframeWrapper.d.ts +1 -1
- package/dist/editor/components/IframeWrapper.d.ts.map +1 -1
- package/dist/editor/components/IframeWrapper.js +82 -58
- package/dist/editor/components/IframeWrapper.js.map +1 -1
- package/dist/editor/components/LoadingState.d.ts +1 -1
- package/dist/editor/components/LoadingState.d.ts.map +1 -1
- package/dist/editor/components/LoadingState.js +17 -3
- package/dist/editor/components/LoadingState.js.map +1 -1
- package/dist/editor/components/PreviewModal.js +234 -78
- package/dist/editor/components/PreviewModal.js.map +1 -1
- package/dist/editor/components/PreviewModeToggle.js +43 -15
- package/dist/editor/components/PreviewModeToggle.js.map +1 -1
- package/dist/editor/components/VersionHistory.js +219 -71
- package/dist/editor/components/VersionHistory.js.map +1 -1
- package/dist/editor/hooks/useDarkMode.js +36 -23
- package/dist/editor/hooks/useDarkMode.js.map +1 -1
- package/dist/editor/hooks/useUnsavedChanges.js +8 -8
- package/dist/editor/hooks/useUnsavedChanges.js.map +1 -1
- package/dist/editor/index.js +5 -6
- package/dist/editor/index.js.map +1 -1
- package/dist/editor/plugins/VersionHistoryPanel.js +236 -75
- package/dist/editor/plugins/VersionHistoryPanel.js.map +1 -1
- package/dist/editor/plugins/index.js +4 -4
- package/dist/editor/plugins/index.js.map +1 -1
- package/dist/editor/plugins/versionHistoryPlugin.js +10 -8
- package/dist/editor/plugins/versionHistoryPlugin.js.map +1 -1
- package/dist/editor/utils/detectPageTree.js +5 -5
- package/dist/editor/utils/detectPageTree.js.map +1 -1
- package/dist/editor/utils/index.js +1 -0
- package/dist/editor/utils/index.js.map +1 -1
- package/dist/editor/utils/injectPageTreeFields.js +13 -9
- package/dist/editor/utils/injectPageTreeFields.js.map +1 -1
- package/dist/endpoints/ai.js +58 -34
- package/dist/endpoints/ai.js.map +1 -1
- package/dist/endpoints/context.js +86 -40
- package/dist/endpoints/context.js.map +1 -1
- package/dist/endpoints/index.js +153 -76
- package/dist/endpoints/index.js.map +1 -1
- package/dist/endpoints/postcss.d.js +5 -0
- package/dist/endpoints/postcss.d.js.map +1 -0
- package/dist/endpoints/prompts.js +81 -39
- package/dist/endpoints/prompts.js.map +1 -1
- package/dist/endpoints/styles.js +34 -36
- package/dist/endpoints/styles.js.map +1 -1
- package/dist/exports/client.js +2 -2
- package/dist/exports/client.js.map +1 -1
- package/dist/exports/rsc.js +2 -2
- package/dist/exports/rsc.js.map +1 -1
- package/dist/fields/AlignmentField.d.ts +1 -1
- package/dist/fields/AlignmentField.d.ts.map +1 -1
- package/dist/fields/AlignmentField.js +93 -30
- package/dist/fields/AlignmentField.js.map +1 -1
- package/dist/fields/AnimationField.d.ts +2 -2
- package/dist/fields/AnimationField.d.ts.map +1 -1
- package/dist/fields/AnimationField.js +558 -84
- package/dist/fields/AnimationField.js.map +1 -1
- package/dist/fields/BackgroundField.d.ts +2 -2
- package/dist/fields/BackgroundField.d.ts.map +1 -1
- package/dist/fields/BackgroundField.js +754 -120
- package/dist/fields/BackgroundField.js.map +1 -1
- package/dist/fields/BorderField.d.ts +2 -2
- package/dist/fields/BorderField.d.ts.map +1 -1
- package/dist/fields/BorderField.js +275 -73
- package/dist/fields/BorderField.js.map +1 -1
- package/dist/fields/ColorPickerField.d.ts +2 -2
- package/dist/fields/ColorPickerField.d.ts.map +1 -1
- package/dist/fields/ColorPickerField.js +210 -68
- package/dist/fields/ColorPickerField.js.map +1 -1
- package/dist/fields/ContentAlignmentField.d.ts +1 -1
- package/dist/fields/ContentAlignmentField.d.ts.map +1 -1
- package/dist/fields/ContentAlignmentField.js +161 -75
- package/dist/fields/ContentAlignmentField.js.map +1 -1
- package/dist/fields/DimensionsField.d.ts +2 -2
- package/dist/fields/DimensionsField.d.ts.map +1 -1
- package/dist/fields/DimensionsField.js +575 -146
- package/dist/fields/DimensionsField.js.map +1 -1
- package/dist/fields/FlexAlignmentField.d.ts +2 -2
- package/dist/fields/FlexAlignmentField.d.ts.map +1 -1
- package/dist/fields/FlexAlignmentField.js +189 -51
- package/dist/fields/FlexAlignmentField.js.map +1 -1
- package/dist/fields/FolderPickerField.d.ts +8 -1
- package/dist/fields/FolderPickerField.d.ts.map +1 -1
- package/dist/fields/FolderPickerField.js +288 -75
- package/dist/fields/FolderPickerField.js.map +1 -1
- package/dist/fields/GradientEditor.d.ts +2 -2
- package/dist/fields/GradientEditor.d.ts.map +1 -1
- package/dist/fields/GradientEditor.js +462 -86
- package/dist/fields/GradientEditor.js.map +1 -1
- package/dist/fields/LockedField.d.ts +15 -2
- package/dist/fields/LockedField.d.ts.map +1 -1
- package/dist/fields/LockedField.js +180 -49
- package/dist/fields/LockedField.js.map +1 -1
- package/dist/fields/MarginField.d.ts +2 -2
- package/dist/fields/MarginField.d.ts.map +1 -1
- package/dist/fields/MarginField.js +144 -46
- package/dist/fields/MarginField.js.map +1 -1
- package/dist/fields/MediaField.d.ts +1 -1
- package/dist/fields/MediaField.d.ts.map +1 -1
- package/dist/fields/MediaField.js +688 -186
- package/dist/fields/MediaField.js.map +1 -1
- package/dist/fields/PaddingField.d.ts +2 -2
- package/dist/fields/PaddingField.d.ts.map +1 -1
- package/dist/fields/PaddingField.js +144 -46
- package/dist/fields/PaddingField.js.map +1 -1
- package/dist/fields/PageSegmentField.d.ts +15 -2
- package/dist/fields/PageSegmentField.d.ts.map +1 -1
- package/dist/fields/PageSegmentField.js +156 -54
- package/dist/fields/PageSegmentField.js.map +1 -1
- package/dist/fields/ResetField.d.ts +1 -1
- package/dist/fields/ResetField.d.ts.map +1 -1
- package/dist/fields/ResetField.js +59 -31
- package/dist/fields/ResetField.js.map +1 -1
- package/dist/fields/ResponsiveField.d.ts +1 -1
- package/dist/fields/ResponsiveField.d.ts.map +1 -1
- package/dist/fields/ResponsiveField.js +233 -90
- package/dist/fields/ResponsiveField.js.map +1 -1
- package/dist/fields/ResponsiveVisibilityField.d.ts +2 -2
- package/dist/fields/ResponsiveVisibilityField.d.ts.map +1 -1
- package/dist/fields/ResponsiveVisibilityField.js +119 -36
- package/dist/fields/ResponsiveVisibilityField.js.map +1 -1
- package/dist/fields/SizeField.d.ts +3 -3
- package/dist/fields/SizeField.d.ts.map +1 -1
- package/dist/fields/SizeField.js +226 -52
- package/dist/fields/SizeField.js.map +1 -1
- package/dist/fields/SlugPreviewField.d.ts +8 -1
- package/dist/fields/SlugPreviewField.d.ts.map +1 -1
- package/dist/fields/SlugPreviewField.js +65 -16
- package/dist/fields/SlugPreviewField.js.map +1 -1
- package/dist/fields/TemplateField.d.ts +1 -1
- package/dist/fields/TemplateField.d.ts.map +1 -1
- package/dist/fields/TemplateField.js +362 -120
- package/dist/fields/TemplateField.js.map +1 -1
- package/dist/fields/TransformField.d.ts +2 -2
- package/dist/fields/TransformField.d.ts.map +1 -1
- package/dist/fields/TransformField.js +517 -81
- package/dist/fields/TransformField.js.map +1 -1
- package/dist/fields/VerticalAlignmentField.d.ts +1 -1
- package/dist/fields/VerticalAlignmentField.d.ts.map +1 -1
- package/dist/fields/VerticalAlignmentField.js +93 -30
- package/dist/fields/VerticalAlignmentField.js.map +1 -1
- package/dist/fields/WidthField.d.ts +2 -2
- package/dist/fields/WidthField.d.ts.map +1 -1
- package/dist/fields/WidthField.js +278 -81
- package/dist/fields/WidthField.js.map +1 -1
- package/dist/fields/index.d.ts +41 -41
- package/dist/fields/index.d.ts.map +1 -1
- package/dist/fields/index.js +37 -43
- package/dist/fields/index.js.map +1 -1
- package/dist/fields/richtext/controls/ColorPickerControl.d.ts +13 -2
- package/dist/fields/richtext/controls/ColorPickerControl.d.ts.map +1 -1
- package/dist/fields/richtext/controls/ColorPickerControl.js +212 -47
- package/dist/fields/richtext/controls/ColorPickerControl.js.map +1 -1
- package/dist/fields/richtext/controls/DropdownPortal.d.ts +2 -2
- package/dist/fields/richtext/controls/DropdownPortal.d.ts.map +1 -1
- package/dist/fields/richtext/controls/DropdownPortal.js +36 -4
- package/dist/fields/richtext/controls/DropdownPortal.js.map +1 -1
- package/dist/fields/richtext/controls/FontSizeControl.d.ts +9 -1
- package/dist/fields/richtext/controls/FontSizeControl.d.ts.map +1 -1
- package/dist/fields/richtext/controls/FontSizeControl.js +109 -24
- package/dist/fields/richtext/controls/FontSizeControl.js.map +1 -1
- package/dist/fields/richtext/controls/HighlightControl.d.ts +12 -1
- package/dist/fields/richtext/controls/HighlightControl.d.ts.map +1 -1
- package/dist/fields/richtext/controls/HighlightControl.js +54 -17
- package/dist/fields/richtext/controls/HighlightControl.js.map +1 -1
- package/dist/fields/richtext/controls/index.d.ts +5 -5
- package/dist/fields/richtext/controls/index.d.ts.map +1 -1
- package/dist/fields/richtext/controls/index.js +8 -11
- package/dist/fields/richtext/controls/index.js.map +1 -1
- package/dist/fields/richtext/controls/shared.js +108 -63
- package/dist/fields/richtext/controls/shared.js.map +1 -1
- package/dist/fields/richtext/createRichTextField.d.ts +18 -4
- package/dist/fields/richtext/createRichTextField.d.ts.map +1 -1
- package/dist/fields/richtext/createRichTextField.js +113 -26
- package/dist/fields/richtext/createRichTextField.js.map +1 -1
- package/dist/fields/richtext/extensions/FontSize.js +26 -20
- package/dist/fields/richtext/extensions/FontSize.js.map +1 -1
- package/dist/fields/richtext/extensions/index.d.ts +1 -1
- package/dist/fields/richtext/extensions/index.d.ts.map +1 -1
- package/dist/fields/richtext/extensions/index.js +2 -2
- package/dist/fields/richtext/extensions/index.js.map +1 -1
- package/dist/fields/richtext/index.d.ts +6 -6
- package/dist/fields/richtext/index.d.ts.map +1 -1
- package/dist/fields/richtext/index.js +8 -8
- package/dist/fields/richtext/index.js.map +1 -1
- package/dist/fields/shared.d.ts +1 -1
- package/dist/fields/shared.d.ts.map +1 -1
- package/dist/fields/shared.js +915 -478
- package/dist/fields/shared.js.map +1 -1
- package/dist/hooks/index.d.ts +2 -2
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +3 -3
- package/dist/hooks/index.js.map +1 -1
- package/dist/hooks/useResponsiveStyles.d.ts +1 -1
- package/dist/hooks/useResponsiveStyles.d.ts.map +1 -1
- package/dist/hooks/useResponsiveStyles.js +36 -32
- package/dist/hooks/useResponsiveStyles.js.map +1 -1
- package/dist/hooks/useScrollAnimation.js +26 -24
- package/dist/hooks/useScrollAnimation.js.map +1 -1
- package/dist/index.d.ts +4 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/dist/layouts/LayoutWrapper.d.ts +3 -3
- package/dist/layouts/LayoutWrapper.d.ts.map +1 -1
- package/dist/layouts/LayoutWrapper.js +115 -51
- package/dist/layouts/LayoutWrapper.js.map +1 -1
- package/dist/layouts/defaults.d.ts +1 -1
- package/dist/layouts/defaults.d.ts.map +1 -1
- package/dist/layouts/defaults.js +23 -31
- package/dist/layouts/defaults.js.map +1 -1
- package/dist/layouts/index.d.ts +4 -4
- package/dist/layouts/index.d.ts.map +1 -1
- package/dist/layouts/index.js +5 -4
- package/dist/layouts/index.js.map +1 -1
- package/dist/layouts/types.js +4 -2
- package/dist/layouts/types.js.map +1 -1
- package/dist/layouts/utils.d.ts +1 -1
- package/dist/layouts/utils.d.ts.map +1 -1
- package/dist/layouts/utils.js +32 -40
- package/dist/layouts/utils.js.map +1 -1
- package/dist/next/index.js +31 -34
- package/dist/next/index.js.map +1 -1
- package/dist/plugin/collections/Pages.d.ts +2 -2
- package/dist/plugin/collections/Pages.d.ts.map +1 -1
- package/dist/plugin/collections/Pages.js +46 -43
- package/dist/plugin/collections/Pages.js.map +1 -1
- package/dist/plugin/fields/index.d.ts +3 -3
- package/dist/plugin/fields/index.d.ts.map +1 -1
- package/dist/plugin/fields/index.js +100 -78
- package/dist/plugin/fields/index.js.map +1 -1
- package/dist/plugin/fields/types.d.ts +1 -1
- package/dist/plugin/fields/types.d.ts.map +1 -1
- package/dist/plugin/fields/types.js +26 -2
- package/dist/plugin/fields/types.js.map +1 -1
- package/dist/plugin/hooks/index.d.ts +1 -1
- package/dist/plugin/hooks/index.d.ts.map +1 -1
- package/dist/plugin/hooks/index.js +2 -2
- package/dist/plugin/hooks/index.js.map +1 -1
- package/dist/plugin/hooks/isHomepageUnique.js +28 -19
- package/dist/plugin/hooks/isHomepageUnique.js.map +1 -1
- package/dist/plugin/index.d.ts +8 -8
- package/dist/plugin/index.d.ts.map +1 -1
- package/dist/plugin/index.js +190 -188
- package/dist/plugin/index.js.map +1 -1
- package/dist/render/HybridPageRenderer.d.ts +2 -2
- package/dist/render/HybridPageRenderer.d.ts.map +1 -1
- package/dist/render/HybridPageRenderer.js +58 -10
- package/dist/render/HybridPageRenderer.js.map +1 -1
- package/dist/render/PageRenderer.d.ts +2 -2
- package/dist/render/PageRenderer.d.ts.map +1 -1
- package/dist/render/PageRenderer.js +31 -14
- package/dist/render/PageRenderer.js.map +1 -1
- package/dist/render/PuckEditor.client.d.ts +1 -1
- package/dist/render/PuckEditor.client.d.ts.map +1 -1
- package/dist/render/PuckEditor.client.js +33 -16
- package/dist/render/PuckEditor.client.js.map +1 -1
- package/dist/render/index.d.ts +5 -5
- package/dist/render/index.d.ts.map +1 -1
- package/dist/render/index.js +5 -6
- package/dist/render/index.js.map +1 -1
- package/dist/styles/puck-dark-mode.css +101 -0
- package/dist/theme/context.d.ts +2 -2
- package/dist/theme/context.d.ts.map +1 -1
- package/dist/theme/context.js +21 -18
- package/dist/theme/context.js.map +1 -1
- package/dist/theme/defaults.d.ts +1 -1
- package/dist/theme/defaults.d.ts.map +1 -1
- package/dist/theme/defaults.js +83 -37
- package/dist/theme/defaults.js.map +1 -1
- package/dist/theme/example.d.ts +1 -1
- package/dist/theme/example.d.ts.map +1 -1
- package/dist/theme/example.js +68 -30
- package/dist/theme/example.js.map +1 -1
- package/dist/theme/index.d.ts +5 -5
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/index.js +6 -5
- package/dist/theme/index.js.map +1 -1
- package/dist/theme/types.js +6 -2
- package/dist/theme/types.js.map +1 -1
- package/dist/theme/utils.d.ts +1 -1
- package/dist/theme/utils.d.ts.map +1 -1
- package/dist/theme/utils.js +24 -25
- package/dist/theme/utils.js.map +1 -1
- package/dist/types/index.d.ts +6 -6
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/index.js +3 -1
- package/dist/types/index.js.map +1 -1
- package/dist/utils/index.d.ts +2 -2
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +13 -22
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/migration.d.ts +1 -1
- package/dist/utils/migration.d.ts.map +1 -1
- package/dist/utils/migration.js +43 -49
- package/dist/utils/migration.js.map +1 -1
- package/dist/utils/validation.d.ts +1 -1
- package/dist/utils/validation.d.ts.map +1 -1
- package/dist/utils/validation.js +36 -43
- package/dist/utils/validation.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +2 -1
- package/dist/version.js.map +1 -1
- package/dist/views/PuckConfigContext.d.ts +1 -1
- package/dist/views/PuckConfigContext.d.ts.map +1 -1
- package/dist/views/PuckConfigContext.js +25 -10
- package/dist/views/PuckConfigContext.js.map +1 -1
- package/dist/views/PuckEditorView.d.ts +1 -1
- package/dist/views/PuckEditorView.d.ts.map +1 -1
- package/dist/views/PuckEditorView.js +106 -38
- package/dist/views/PuckEditorView.js.map +1 -1
- package/dist/views/index.js +2 -2
- package/dist/views/index.js.map +1 -1
- package/package.json +62 -42
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* PageSegmentField - Custom Puck field for page segment editing
|
|
3
|
+
*
|
|
4
|
+
* Provides an editable text field with automatic slugification.
|
|
5
|
+
* Integrates with @delmaredigital/payload-page-tree plugin.
|
|
6
|
+
*
|
|
7
|
+
* Exports:
|
|
8
|
+
* - PageSegmentField: Basic editable page segment field
|
|
9
|
+
* - LockedPageSegmentField: Locked by default, requires clicking lock icon to edit
|
|
10
|
+
* - createPageSegmentField: Factory for basic field
|
|
11
|
+
* - createLockedPageSegmentField: Factory for locked field (recommended for page-tree)
|
|
12
|
+
*/
|
|
13
|
+
import React from 'react';
|
|
1
14
|
import type { CustomField } from '@puckeditor/core';
|
|
2
15
|
interface PageSegmentFieldProps {
|
|
3
16
|
value: string;
|
|
@@ -8,7 +21,7 @@ interface PageSegmentFieldProps {
|
|
|
8
21
|
interface LockedPageSegmentFieldProps extends PageSegmentFieldProps {
|
|
9
22
|
warningMessage?: string;
|
|
10
23
|
}
|
|
11
|
-
export declare function PageSegmentField({ value, onChange, label, placeholder, }: PageSegmentFieldProps):
|
|
24
|
+
export declare function PageSegmentField({ value, onChange, label, placeholder, }: PageSegmentFieldProps): React.JSX.Element;
|
|
12
25
|
/**
|
|
13
26
|
* Creates a Puck field configuration for page segment editing
|
|
14
27
|
*/
|
|
@@ -20,7 +33,7 @@ export declare function createPageSegmentField(config?: {
|
|
|
20
33
|
* PageSegmentField with lock/unlock functionality.
|
|
21
34
|
* Starts locked to prevent accidental URL changes.
|
|
22
35
|
*/
|
|
23
|
-
export declare function LockedPageSegmentField({ value, onChange, label, placeholder, warningMessage, }: LockedPageSegmentFieldProps):
|
|
36
|
+
export declare function LockedPageSegmentField({ value, onChange, label, placeholder, warningMessage, }: LockedPageSegmentFieldProps): React.JSX.Element;
|
|
24
37
|
/**
|
|
25
38
|
* Creates a Puck field configuration for a locked page segment field.
|
|
26
39
|
* Recommended for page-tree integration to prevent accidental URL changes.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageSegmentField.d.ts","sourceRoot":"","sources":["../../src/fields/PageSegmentField.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PageSegmentField.d.ts","sourceRoot":"","sources":["../../src/fields/PageSegmentField.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAmD,MAAM,OAAO,CAAA;AACvE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAwBnD,UAAU,qBAAqB;IAC7B,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAMD,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,QAAQ,EACR,KAAsB,EACtB,WAA4B,GAC7B,EAAE,qBAAqB,qBAqFvB;AAMD;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,CAAC,EAAE;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,GAAG,WAAW,CAAC,MAAM,CAAC,CAatB;AAMD;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,KAAK,EACL,QAAQ,EACR,KAAsB,EACtB,WAA4B,EAC5B,cAAoD,GACrD,EAAE,2BAA2B,qBA4I7B;AAMD;;;GAGG;AACH,wBAAgB,4BAA4B,CAAC,MAAM,CAAC,EAAE;IACpD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,GAAG,WAAW,CAAC,MAAM,CAAC,CActB"}
|
|
@@ -11,63 +11,81 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
11
11
|
* - LockedPageSegmentField: Locked by default, requires clicking lock icon to edit
|
|
12
12
|
* - createPageSegmentField: Factory for basic field
|
|
13
13
|
* - createLockedPageSegmentField: Factory for locked field (recommended for page-tree)
|
|
14
|
-
*/
|
|
15
|
-
import { useState, useCallback, useEffect, useRef } from 'react';
|
|
14
|
+
*/ import React, { useState, useCallback, useEffect, useRef } from 'react';
|
|
16
15
|
import { Lock, Unlock } from 'lucide-react';
|
|
17
16
|
// =============================================================================
|
|
18
17
|
// Slugify Utility
|
|
19
18
|
// =============================================================================
|
|
20
19
|
/**
|
|
21
20
|
* Converts a string to a URL-safe slug
|
|
22
|
-
*/
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
.replace(/[\s_]+/g, '-') // Replace spaces and underscores with hyphens
|
|
29
|
-
.replace(/-+/g, '-') // Remove consecutive hyphens
|
|
30
|
-
.replace(/^-+|-+$/g, ''); // Remove leading/trailing hyphens
|
|
21
|
+
*/ function slugify(text) {
|
|
22
|
+
return text.toLowerCase().trim().replace(/[^\w\s-]/g, '') // Remove special characters
|
|
23
|
+
.replace(/[\s_]+/g, '-') // Replace spaces and underscores with hyphens
|
|
24
|
+
.replace(/-+/g, '-') // Remove consecutive hyphens
|
|
25
|
+
.replace(/^-+|-+$/g, '') // Remove leading/trailing hyphens
|
|
26
|
+
;
|
|
31
27
|
}
|
|
32
28
|
// =============================================================================
|
|
33
29
|
// PageSegmentField Component
|
|
34
30
|
// =============================================================================
|
|
35
|
-
export function PageSegmentField({ value, onChange, label = 'Page Segment', placeholder = 'page-segment'
|
|
31
|
+
export function PageSegmentField({ value, onChange, label = 'Page Segment', placeholder = 'page-segment' }) {
|
|
36
32
|
const [localValue, setLocalValue] = useState(value);
|
|
37
33
|
const [isFocused, setIsFocused] = useState(false);
|
|
38
34
|
const inputRef = useRef(null);
|
|
39
35
|
// Sync with external value changes
|
|
40
|
-
useEffect(()
|
|
36
|
+
useEffect(()=>{
|
|
41
37
|
if (!isFocused) {
|
|
42
38
|
setLocalValue(value);
|
|
43
39
|
}
|
|
44
|
-
}, [
|
|
45
|
-
|
|
40
|
+
}, [
|
|
41
|
+
value,
|
|
42
|
+
isFocused
|
|
43
|
+
]);
|
|
44
|
+
const handleChange = useCallback((e)=>{
|
|
46
45
|
const newValue = e.target.value;
|
|
47
46
|
setLocalValue(newValue);
|
|
48
47
|
}, []);
|
|
49
|
-
const handleBlur = useCallback(()
|
|
48
|
+
const handleBlur = useCallback(()=>{
|
|
50
49
|
setIsFocused(false);
|
|
51
50
|
// Slugify on blur
|
|
52
51
|
const slugified = slugify(localValue);
|
|
53
52
|
setLocalValue(slugified);
|
|
54
53
|
onChange(slugified);
|
|
55
|
-
}, [
|
|
56
|
-
|
|
54
|
+
}, [
|
|
55
|
+
localValue,
|
|
56
|
+
onChange
|
|
57
|
+
]);
|
|
58
|
+
const handleFocus = useCallback(()=>{
|
|
57
59
|
setIsFocused(true);
|
|
58
60
|
}, []);
|
|
59
|
-
const handleKeyDown = useCallback((e)
|
|
61
|
+
const handleKeyDown = useCallback((e)=>{
|
|
60
62
|
if (e.key === 'Enter') {
|
|
61
63
|
inputRef.current?.blur();
|
|
62
64
|
}
|
|
63
65
|
}, []);
|
|
64
|
-
return
|
|
66
|
+
return /*#__PURE__*/ _jsxs("div", {
|
|
67
|
+
className: "puck-field",
|
|
68
|
+
children: [
|
|
69
|
+
/*#__PURE__*/ _jsx("label", {
|
|
70
|
+
style: {
|
|
65
71
|
display: 'block',
|
|
66
72
|
fontSize: '14px',
|
|
67
73
|
fontWeight: 500,
|
|
68
74
|
color: 'var(--puck-color-grey-04)',
|
|
69
|
-
marginBottom: '8px'
|
|
70
|
-
},
|
|
75
|
+
marginBottom: '8px'
|
|
76
|
+
},
|
|
77
|
+
children: label
|
|
78
|
+
}),
|
|
79
|
+
/*#__PURE__*/ _jsx("input", {
|
|
80
|
+
ref: inputRef,
|
|
81
|
+
type: "text",
|
|
82
|
+
value: localValue,
|
|
83
|
+
onChange: handleChange,
|
|
84
|
+
onFocus: handleFocus,
|
|
85
|
+
onBlur: handleBlur,
|
|
86
|
+
onKeyDown: handleKeyDown,
|
|
87
|
+
placeholder: placeholder,
|
|
88
|
+
style: {
|
|
71
89
|
width: '100%',
|
|
72
90
|
padding: '8px 12px',
|
|
73
91
|
fontSize: '14px',
|
|
@@ -76,24 +94,35 @@ export function PageSegmentField({ value, onChange, label = 'Page Segment', plac
|
|
|
76
94
|
backgroundColor: 'var(--puck-color-white)',
|
|
77
95
|
color: 'var(--puck-color-grey-04)',
|
|
78
96
|
outline: 'none',
|
|
79
|
-
transition: 'border-color 0.15s ease'
|
|
80
|
-
}
|
|
97
|
+
transition: 'border-color 0.15s ease'
|
|
98
|
+
}
|
|
99
|
+
}),
|
|
100
|
+
/*#__PURE__*/ _jsx("p", {
|
|
101
|
+
style: {
|
|
81
102
|
marginTop: '6px',
|
|
82
103
|
fontSize: '12px',
|
|
83
|
-
color: 'var(--puck-color-grey-06)'
|
|
84
|
-
},
|
|
104
|
+
color: 'var(--puck-color-grey-06)'
|
|
105
|
+
},
|
|
106
|
+
children: "Auto-slugified on blur. Used in URL path."
|
|
107
|
+
})
|
|
108
|
+
]
|
|
109
|
+
});
|
|
85
110
|
}
|
|
86
111
|
// =============================================================================
|
|
87
112
|
// Field Configuration Factory
|
|
88
113
|
// =============================================================================
|
|
89
114
|
/**
|
|
90
115
|
* Creates a Puck field configuration for page segment editing
|
|
91
|
-
*/
|
|
92
|
-
export function createPageSegmentField(config) {
|
|
116
|
+
*/ export function createPageSegmentField(config) {
|
|
93
117
|
return {
|
|
94
118
|
type: 'custom',
|
|
95
119
|
label: config?.label ?? 'Page Segment',
|
|
96
|
-
render: ({ value, onChange })
|
|
120
|
+
render: ({ value, onChange })=>/*#__PURE__*/ _jsx(PageSegmentField, {
|
|
121
|
+
value: value || '',
|
|
122
|
+
onChange: onChange,
|
|
123
|
+
label: config?.label,
|
|
124
|
+
placeholder: config?.placeholder
|
|
125
|
+
})
|
|
97
126
|
};
|
|
98
127
|
}
|
|
99
128
|
// =============================================================================
|
|
@@ -102,47 +131,66 @@ export function createPageSegmentField(config) {
|
|
|
102
131
|
/**
|
|
103
132
|
* PageSegmentField with lock/unlock functionality.
|
|
104
133
|
* Starts locked to prevent accidental URL changes.
|
|
105
|
-
*/
|
|
106
|
-
export function LockedPageSegmentField({ value, onChange, label = 'Page Segment', placeholder = 'page-segment', warningMessage = 'Changing may break existing links', }) {
|
|
134
|
+
*/ export function LockedPageSegmentField({ value, onChange, label = 'Page Segment', placeholder = 'page-segment', warningMessage = 'Changing may break existing links' }) {
|
|
107
135
|
const [isLocked, setIsLocked] = useState(true);
|
|
108
136
|
const [localValue, setLocalValue] = useState(value);
|
|
109
137
|
const [isFocused, setIsFocused] = useState(false);
|
|
110
138
|
const inputRef = useRef(null);
|
|
111
139
|
// Sync with external value changes
|
|
112
|
-
useEffect(()
|
|
140
|
+
useEffect(()=>{
|
|
113
141
|
if (!isFocused) {
|
|
114
142
|
setLocalValue(value);
|
|
115
143
|
}
|
|
116
|
-
}, [
|
|
117
|
-
|
|
144
|
+
}, [
|
|
145
|
+
value,
|
|
146
|
+
isFocused
|
|
147
|
+
]);
|
|
148
|
+
const handleChange = useCallback((e)=>{
|
|
118
149
|
const newValue = e.target.value;
|
|
119
150
|
setLocalValue(newValue);
|
|
120
151
|
}, []);
|
|
121
|
-
const handleBlur = useCallback(()
|
|
152
|
+
const handleBlur = useCallback(()=>{
|
|
122
153
|
setIsFocused(false);
|
|
123
154
|
// Slugify on blur
|
|
124
155
|
const slugified = slugify(localValue);
|
|
125
156
|
setLocalValue(slugified);
|
|
126
157
|
onChange(slugified);
|
|
127
|
-
}, [
|
|
128
|
-
|
|
158
|
+
}, [
|
|
159
|
+
localValue,
|
|
160
|
+
onChange
|
|
161
|
+
]);
|
|
162
|
+
const handleFocus = useCallback(()=>{
|
|
129
163
|
setIsFocused(true);
|
|
130
164
|
}, []);
|
|
131
|
-
const handleKeyDown = useCallback((e)
|
|
165
|
+
const handleKeyDown = useCallback((e)=>{
|
|
132
166
|
if (e.key === 'Enter') {
|
|
133
167
|
inputRef.current?.blur();
|
|
134
168
|
}
|
|
135
169
|
}, []);
|
|
136
|
-
return
|
|
170
|
+
return /*#__PURE__*/ _jsxs("div", {
|
|
171
|
+
className: "puck-field",
|
|
172
|
+
children: [
|
|
173
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
174
|
+
className: "puck-field-header",
|
|
175
|
+
style: {
|
|
137
176
|
display: 'flex',
|
|
138
177
|
alignItems: 'center',
|
|
139
178
|
justifyContent: 'space-between',
|
|
140
|
-
marginBottom: '8px'
|
|
141
|
-
},
|
|
179
|
+
marginBottom: '8px'
|
|
180
|
+
},
|
|
181
|
+
children: [
|
|
182
|
+
/*#__PURE__*/ _jsx("label", {
|
|
183
|
+
style: {
|
|
142
184
|
fontSize: '14px',
|
|
143
185
|
fontWeight: 500,
|
|
144
|
-
color: 'var(--puck-color-grey-04)'
|
|
145
|
-
},
|
|
186
|
+
color: 'var(--puck-color-grey-04)'
|
|
187
|
+
},
|
|
188
|
+
children: label
|
|
189
|
+
}),
|
|
190
|
+
/*#__PURE__*/ _jsx("button", {
|
|
191
|
+
type: "button",
|
|
192
|
+
onClick: ()=>setIsLocked(!isLocked),
|
|
193
|
+
style: {
|
|
146
194
|
background: 'none',
|
|
147
195
|
border: 'none',
|
|
148
196
|
padding: '4px',
|
|
@@ -152,8 +200,33 @@ export function LockedPageSegmentField({ value, onChange, label = 'Page Segment'
|
|
|
152
200
|
alignItems: 'center',
|
|
153
201
|
justifyContent: 'center',
|
|
154
202
|
borderRadius: '4px',
|
|
155
|
-
transition: 'all 0.15s ease'
|
|
156
|
-
},
|
|
203
|
+
transition: 'all 0.15s ease'
|
|
204
|
+
},
|
|
205
|
+
title: isLocked ? 'Click to unlock' : 'Click to lock',
|
|
206
|
+
children: isLocked ? /*#__PURE__*/ _jsx(Lock, {
|
|
207
|
+
size: 14
|
|
208
|
+
}) : /*#__PURE__*/ _jsx(Unlock, {
|
|
209
|
+
size: 14
|
|
210
|
+
})
|
|
211
|
+
})
|
|
212
|
+
]
|
|
213
|
+
}),
|
|
214
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
215
|
+
style: {
|
|
216
|
+
position: 'relative'
|
|
217
|
+
},
|
|
218
|
+
children: [
|
|
219
|
+
/*#__PURE__*/ _jsx("input", {
|
|
220
|
+
ref: inputRef,
|
|
221
|
+
type: "text",
|
|
222
|
+
value: localValue,
|
|
223
|
+
onChange: handleChange,
|
|
224
|
+
onFocus: handleFocus,
|
|
225
|
+
onBlur: handleBlur,
|
|
226
|
+
onKeyDown: handleKeyDown,
|
|
227
|
+
disabled: isLocked,
|
|
228
|
+
placeholder: placeholder,
|
|
229
|
+
style: {
|
|
157
230
|
width: '100%',
|
|
158
231
|
padding: '8px 12px',
|
|
159
232
|
paddingRight: isLocked ? '32px' : '12px',
|
|
@@ -164,21 +237,44 @@ export function LockedPageSegmentField({ value, onChange, label = 'Page Segment'
|
|
|
164
237
|
color: isLocked ? 'var(--puck-color-grey-05)' : 'var(--puck-color-grey-04)',
|
|
165
238
|
cursor: isLocked ? 'not-allowed' : 'text',
|
|
166
239
|
outline: 'none',
|
|
167
|
-
transition: 'all 0.15s ease'
|
|
168
|
-
}
|
|
240
|
+
transition: 'all 0.15s ease'
|
|
241
|
+
}
|
|
242
|
+
}),
|
|
243
|
+
isLocked && /*#__PURE__*/ _jsx(Lock, {
|
|
244
|
+
size: 14,
|
|
245
|
+
style: {
|
|
169
246
|
position: 'absolute',
|
|
170
247
|
right: '10px',
|
|
171
248
|
top: '50%',
|
|
172
249
|
transform: 'translateY(-50%)',
|
|
173
|
-
color: 'var(--puck-color-grey-07)'
|
|
174
|
-
}
|
|
250
|
+
color: 'var(--puck-color-grey-07)'
|
|
251
|
+
}
|
|
252
|
+
})
|
|
253
|
+
]
|
|
254
|
+
}),
|
|
255
|
+
/*#__PURE__*/ _jsx("p", {
|
|
256
|
+
style: {
|
|
175
257
|
marginTop: '6px',
|
|
176
258
|
fontSize: '12px',
|
|
177
259
|
color: 'var(--puck-color-grey-06)',
|
|
178
260
|
display: 'flex',
|
|
179
261
|
alignItems: 'center',
|
|
180
|
-
gap: '4px'
|
|
181
|
-
},
|
|
262
|
+
gap: '4px'
|
|
263
|
+
},
|
|
264
|
+
children: !isLocked && warningMessage ? /*#__PURE__*/ _jsxs(_Fragment, {
|
|
265
|
+
children: [
|
|
266
|
+
/*#__PURE__*/ _jsx("span", {
|
|
267
|
+
style: {
|
|
268
|
+
color: 'var(--puck-color-rose-07)'
|
|
269
|
+
},
|
|
270
|
+
children: "⚠"
|
|
271
|
+
}),
|
|
272
|
+
warningMessage
|
|
273
|
+
]
|
|
274
|
+
}) : 'Auto-slugified on blur. Used in URL path.'
|
|
275
|
+
})
|
|
276
|
+
]
|
|
277
|
+
});
|
|
182
278
|
}
|
|
183
279
|
// =============================================================================
|
|
184
280
|
// Locked Field Configuration Factory
|
|
@@ -186,12 +282,18 @@ export function LockedPageSegmentField({ value, onChange, label = 'Page Segment'
|
|
|
186
282
|
/**
|
|
187
283
|
* Creates a Puck field configuration for a locked page segment field.
|
|
188
284
|
* Recommended for page-tree integration to prevent accidental URL changes.
|
|
189
|
-
*/
|
|
190
|
-
export function createLockedPageSegmentField(config) {
|
|
285
|
+
*/ export function createLockedPageSegmentField(config) {
|
|
191
286
|
return {
|
|
192
287
|
type: 'custom',
|
|
193
288
|
label: config?.label ?? 'Page Segment',
|
|
194
|
-
render: ({ value, onChange })
|
|
289
|
+
render: ({ value, onChange })=>/*#__PURE__*/ _jsx(LockedPageSegmentField, {
|
|
290
|
+
value: value || '',
|
|
291
|
+
onChange: onChange,
|
|
292
|
+
label: config?.label,
|
|
293
|
+
placeholder: config?.placeholder,
|
|
294
|
+
warningMessage: config?.warningMessage
|
|
295
|
+
})
|
|
195
296
|
};
|
|
196
297
|
}
|
|
298
|
+
|
|
197
299
|
//# sourceMappingURL=PageSegmentField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageSegmentField.js","sourceRoot":"","sources":["../../src/fields/PageSegmentField.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/fields/PageSegmentField.tsx"],"sourcesContent":["'use client'\n\n/**\n * PageSegmentField - Custom Puck field for page segment editing\n *\n * Provides an editable text field with automatic slugification.\n * Integrates with @delmaredigital/payload-page-tree plugin.\n *\n * Exports:\n * - PageSegmentField: Basic editable page segment field\n * - LockedPageSegmentField: Locked by default, requires clicking lock icon to edit\n * - createPageSegmentField: Factory for basic field\n * - createLockedPageSegmentField: Factory for locked field (recommended for page-tree)\n */\n\nimport React, { useState, useCallback, useEffect, useRef } from 'react'\nimport type { CustomField } from '@puckeditor/core'\nimport { Lock, Unlock } from 'lucide-react'\n\n// =============================================================================\n// Slugify Utility\n// =============================================================================\n\n/**\n * Converts a string to a URL-safe slug\n */\nfunction slugify(text: string): string {\n return text\n .toLowerCase()\n .trim()\n .replace(/[^\\w\\s-]/g, '') // Remove special characters\n .replace(/[\\s_]+/g, '-') // Replace spaces and underscores with hyphens\n .replace(/-+/g, '-') // Remove consecutive hyphens\n .replace(/^-+|-+$/g, '') // Remove leading/trailing hyphens\n}\n\n// =============================================================================\n// Types\n// =============================================================================\n\ninterface PageSegmentFieldProps {\n value: string\n onChange: (value: string) => void\n label?: string\n placeholder?: string\n}\n\ninterface LockedPageSegmentFieldProps extends PageSegmentFieldProps {\n warningMessage?: string\n}\n\n// =============================================================================\n// PageSegmentField Component\n// =============================================================================\n\nexport function PageSegmentField({\n value,\n onChange,\n label = 'Page Segment',\n placeholder = 'page-segment',\n}: PageSegmentFieldProps) {\n const [localValue, setLocalValue] = useState(value)\n const [isFocused, setIsFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n\n // Sync with external value changes\n useEffect(() => {\n if (!isFocused) {\n setLocalValue(value)\n }\n }, [value, isFocused])\n\n const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value\n setLocalValue(newValue)\n }, [])\n\n const handleBlur = useCallback(() => {\n setIsFocused(false)\n // Slugify on blur\n const slugified = slugify(localValue)\n setLocalValue(slugified)\n onChange(slugified)\n }, [localValue, onChange])\n\n const handleFocus = useCallback(() => {\n setIsFocused(true)\n }, [])\n\n const handleKeyDown = useCallback((e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n inputRef.current?.blur()\n }\n }, [])\n\n return (\n <div className=\"puck-field\">\n {/* Label */}\n <label\n style={{\n display: 'block',\n fontSize: '14px',\n fontWeight: 500,\n color: 'var(--puck-color-grey-04)',\n marginBottom: '8px',\n }}\n >\n {label}\n </label>\n\n {/* Input */}\n <input\n ref={inputRef}\n type=\"text\"\n value={localValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n style={{\n width: '100%',\n padding: '8px 12px',\n fontSize: '14px',\n border: `1px solid ${isFocused ? 'var(--puck-color-azure-06)' : 'var(--puck-color-grey-09)'}`,\n borderRadius: '6px',\n backgroundColor: 'var(--puck-color-white)',\n color: 'var(--puck-color-grey-04)',\n outline: 'none',\n transition: 'border-color 0.15s ease',\n }}\n />\n\n {/* Helper text */}\n <p\n style={{\n marginTop: '6px',\n fontSize: '12px',\n color: 'var(--puck-color-grey-06)',\n }}\n >\n Auto-slugified on blur. Used in URL path.\n </p>\n </div>\n )\n}\n\n// =============================================================================\n// Field Configuration Factory\n// =============================================================================\n\n/**\n * Creates a Puck field configuration for page segment editing\n */\nexport function createPageSegmentField(config?: {\n label?: string\n placeholder?: string\n}): CustomField<string> {\n return {\n type: 'custom',\n label: config?.label ?? 'Page Segment',\n render: ({ value, onChange }) => (\n <PageSegmentField\n value={value || ''}\n onChange={onChange}\n label={config?.label}\n placeholder={config?.placeholder}\n />\n ),\n }\n}\n\n// =============================================================================\n// LockedPageSegmentField Component\n// =============================================================================\n\n/**\n * PageSegmentField with lock/unlock functionality.\n * Starts locked to prevent accidental URL changes.\n */\nexport function LockedPageSegmentField({\n value,\n onChange,\n label = 'Page Segment',\n placeholder = 'page-segment',\n warningMessage = 'Changing may break existing links',\n}: LockedPageSegmentFieldProps) {\n const [isLocked, setIsLocked] = useState(true)\n const [localValue, setLocalValue] = useState(value)\n const [isFocused, setIsFocused] = useState(false)\n const inputRef = useRef<HTMLInputElement>(null)\n\n // Sync with external value changes\n useEffect(() => {\n if (!isFocused) {\n setLocalValue(value)\n }\n }, [value, isFocused])\n\n const handleChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value\n setLocalValue(newValue)\n }, [])\n\n const handleBlur = useCallback(() => {\n setIsFocused(false)\n // Slugify on blur\n const slugified = slugify(localValue)\n setLocalValue(slugified)\n onChange(slugified)\n }, [localValue, onChange])\n\n const handleFocus = useCallback(() => {\n setIsFocused(true)\n }, [])\n\n const handleKeyDown = useCallback((e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n inputRef.current?.blur()\n }\n }, [])\n\n return (\n <div className=\"puck-field\">\n {/* Field header with label and lock toggle */}\n <div\n className=\"puck-field-header\"\n style={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n marginBottom: '8px',\n }}\n >\n <label\n style={{\n fontSize: '14px',\n fontWeight: 500,\n color: 'var(--puck-color-grey-04)',\n }}\n >\n {label}\n </label>\n <button\n type=\"button\"\n onClick={() => setIsLocked(!isLocked)}\n style={{\n background: 'none',\n border: 'none',\n padding: '4px',\n cursor: 'pointer',\n color: isLocked ? 'var(--puck-color-grey-05)' : 'var(--puck-color-azure-04)',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '4px',\n transition: 'all 0.15s ease',\n }}\n title={isLocked ? 'Click to unlock' : 'Click to lock'}\n >\n {isLocked ? <Lock size={14} /> : <Unlock size={14} />}\n </button>\n </div>\n\n {/* Input field */}\n <div style={{ position: 'relative' }}>\n <input\n ref={inputRef}\n type=\"text\"\n value={localValue}\n onChange={handleChange}\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleKeyDown}\n disabled={isLocked}\n placeholder={placeholder}\n style={{\n width: '100%',\n padding: '8px 12px',\n paddingRight: isLocked ? '32px' : '12px',\n fontSize: '14px',\n border: `1px solid ${isFocused && !isLocked ? 'var(--puck-color-azure-06)' : 'var(--puck-color-grey-09)'}`,\n borderRadius: '6px',\n backgroundColor: isLocked ? 'var(--puck-color-grey-11)' : 'var(--puck-color-white)',\n color: isLocked ? 'var(--puck-color-grey-05)' : 'var(--puck-color-grey-04)',\n cursor: isLocked ? 'not-allowed' : 'text',\n outline: 'none',\n transition: 'all 0.15s ease',\n }}\n />\n {isLocked && (\n <Lock\n size={14}\n style={{\n position: 'absolute',\n right: '10px',\n top: '50%',\n transform: 'translateY(-50%)',\n color: 'var(--puck-color-grey-07)',\n }}\n />\n )}\n </div>\n\n {/* Helper text / Warning message */}\n <p\n style={{\n marginTop: '6px',\n fontSize: '12px',\n color: 'var(--puck-color-grey-06)',\n display: 'flex',\n alignItems: 'center',\n gap: '4px',\n }}\n >\n {!isLocked && warningMessage ? (\n <>\n <span style={{ color: 'var(--puck-color-rose-07)' }}>⚠</span>\n {warningMessage}\n </>\n ) : (\n 'Auto-slugified on blur. Used in URL path.'\n )}\n </p>\n </div>\n )\n}\n\n// =============================================================================\n// Locked Field Configuration Factory\n// =============================================================================\n\n/**\n * Creates a Puck field configuration for a locked page segment field.\n * Recommended for page-tree integration to prevent accidental URL changes.\n */\nexport function createLockedPageSegmentField(config?: {\n label?: string\n placeholder?: string\n warningMessage?: string\n}): CustomField<string> {\n return {\n type: 'custom',\n label: config?.label ?? 'Page Segment',\n render: ({ value, onChange }) => (\n <LockedPageSegmentField\n value={value || ''}\n onChange={onChange}\n label={config?.label}\n placeholder={config?.placeholder}\n warningMessage={config?.warningMessage}\n />\n ),\n }\n}\n"],"names":["React","useState","useCallback","useEffect","useRef","Lock","Unlock","slugify","text","toLowerCase","trim","replace","PageSegmentField","value","onChange","label","placeholder","localValue","setLocalValue","isFocused","setIsFocused","inputRef","handleChange","e","newValue","target","handleBlur","slugified","handleFocus","handleKeyDown","key","current","blur","div","className","style","display","fontSize","fontWeight","color","marginBottom","input","ref","type","onFocus","onBlur","onKeyDown","width","padding","border","borderRadius","backgroundColor","outline","transition","p","marginTop","createPageSegmentField","config","render","LockedPageSegmentField","warningMessage","isLocked","setIsLocked","alignItems","justifyContent","button","onClick","background","cursor","title","size","position","disabled","paddingRight","right","top","transform","gap","span","createLockedPageSegmentField"],"mappings":"AAAA;;AAEA;;;;;;;;;;;CAWC,GAED,OAAOA,SAASC,QAAQ,EAAEC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,QAAO;AAEvE,SAASC,IAAI,EAAEC,MAAM,QAAQ,eAAc;AAE3C,gFAAgF;AAChF,kBAAkB;AAClB,gFAAgF;AAEhF;;CAEC,GACD,SAASC,QAAQC,IAAY;IAC3B,OAAOA,KACJC,WAAW,GACXC,IAAI,GACJC,OAAO,CAAC,aAAa,IAAI,4BAA4B;KACrDA,OAAO,CAAC,WAAW,KAAK,8CAA8C;KACtEA,OAAO,CAAC,OAAO,KAAK,6BAA6B;KACjDA,OAAO,CAAC,YAAY,IAAI,kCAAkC;;AAC/D;AAiBA,gFAAgF;AAChF,6BAA6B;AAC7B,gFAAgF;AAEhF,OAAO,SAASC,iBAAiB,EAC/BC,KAAK,EACLC,QAAQ,EACRC,QAAQ,cAAc,EACtBC,cAAc,cAAc,EACN;IACtB,MAAM,CAACC,YAAYC,cAAc,GAAGjB,SAASY;IAC7C,MAAM,CAACM,WAAWC,aAAa,GAAGnB,SAAS;IAC3C,MAAMoB,WAAWjB,OAAyB;IAE1C,mCAAmC;IACnCD,UAAU;QACR,IAAI,CAACgB,WAAW;YACdD,cAAcL;QAChB;IACF,GAAG;QAACA;QAAOM;KAAU;IAErB,MAAMG,eAAepB,YAAY,CAACqB;QAChC,MAAMC,WAAWD,EAAEE,MAAM,CAACZ,KAAK;QAC/BK,cAAcM;IAChB,GAAG,EAAE;IAEL,MAAME,aAAaxB,YAAY;QAC7BkB,aAAa;QACb,kBAAkB;QAClB,MAAMO,YAAYpB,QAAQU;QAC1BC,cAAcS;QACdb,SAASa;IACX,GAAG;QAACV;QAAYH;KAAS;IAEzB,MAAMc,cAAc1B,YAAY;QAC9BkB,aAAa;IACf,GAAG,EAAE;IAEL,MAAMS,gBAAgB3B,YAAY,CAACqB;QACjC,IAAIA,EAAEO,GAAG,KAAK,SAAS;YACrBT,SAASU,OAAO,EAAEC;QACpB;IACF,GAAG,EAAE;IAEL,qBACE,MAACC;QAAIC,WAAU;;0BAEb,KAACnB;gBACCoB,OAAO;oBACLC,SAAS;oBACTC,UAAU;oBACVC,YAAY;oBACZC,OAAO;oBACPC,cAAc;gBAChB;0BAECzB;;0BAIH,KAAC0B;gBACCC,KAAKrB;gBACLsB,MAAK;gBACL9B,OAAOI;gBACPH,UAAUQ;gBACVsB,SAAShB;gBACTiB,QAAQnB;gBACRoB,WAAWjB;gBACXb,aAAaA;gBACbmB,OAAO;oBACLY,OAAO;oBACPC,SAAS;oBACTX,UAAU;oBACVY,QAAQ,CAAC,UAAU,EAAE9B,YAAY,+BAA+B,6BAA6B;oBAC7F+B,cAAc;oBACdC,iBAAiB;oBACjBZ,OAAO;oBACPa,SAAS;oBACTC,YAAY;gBACd;;0BAIF,KAACC;gBACCnB,OAAO;oBACLoB,WAAW;oBACXlB,UAAU;oBACVE,OAAO;gBACT;0BACD;;;;AAKP;AAEA,gFAAgF;AAChF,8BAA8B;AAC9B,gFAAgF;AAEhF;;CAEC,GACD,OAAO,SAASiB,uBAAuBC,MAGtC;IACC,OAAO;QACLd,MAAM;QACN5B,OAAO0C,QAAQ1C,SAAS;QACxB2C,QAAQ,CAAC,EAAE7C,KAAK,EAAEC,QAAQ,EAAE,iBAC1B,KAACF;gBACCC,OAAOA,SAAS;gBAChBC,UAAUA;gBACVC,OAAO0C,QAAQ1C;gBACfC,aAAayC,QAAQzC;;IAG3B;AACF;AAEA,gFAAgF;AAChF,mCAAmC;AACnC,gFAAgF;AAEhF;;;CAGC,GACD,OAAO,SAAS2C,uBAAuB,EACrC9C,KAAK,EACLC,QAAQ,EACRC,QAAQ,cAAc,EACtBC,cAAc,cAAc,EAC5B4C,iBAAiB,mCAAmC,EACxB;IAC5B,MAAM,CAACC,UAAUC,YAAY,GAAG7D,SAAS;IACzC,MAAM,CAACgB,YAAYC,cAAc,GAAGjB,SAASY;IAC7C,MAAM,CAACM,WAAWC,aAAa,GAAGnB,SAAS;IAC3C,MAAMoB,WAAWjB,OAAyB;IAE1C,mCAAmC;IACnCD,UAAU;QACR,IAAI,CAACgB,WAAW;YACdD,cAAcL;QAChB;IACF,GAAG;QAACA;QAAOM;KAAU;IAErB,MAAMG,eAAepB,YAAY,CAACqB;QAChC,MAAMC,WAAWD,EAAEE,MAAM,CAACZ,KAAK;QAC/BK,cAAcM;IAChB,GAAG,EAAE;IAEL,MAAME,aAAaxB,YAAY;QAC7BkB,aAAa;QACb,kBAAkB;QAClB,MAAMO,YAAYpB,QAAQU;QAC1BC,cAAcS;QACdb,SAASa;IACX,GAAG;QAACV;QAAYH;KAAS;IAEzB,MAAMc,cAAc1B,YAAY;QAC9BkB,aAAa;IACf,GAAG,EAAE;IAEL,MAAMS,gBAAgB3B,YAAY,CAACqB;QACjC,IAAIA,EAAEO,GAAG,KAAK,SAAS;YACrBT,SAASU,OAAO,EAAEC;QACpB;IACF,GAAG,EAAE;IAEL,qBACE,MAACC;QAAIC,WAAU;;0BAEb,MAACD;gBACCC,WAAU;gBACVC,OAAO;oBACLC,SAAS;oBACT2B,YAAY;oBACZC,gBAAgB;oBAChBxB,cAAc;gBAChB;;kCAEA,KAACzB;wBACCoB,OAAO;4BACLE,UAAU;4BACVC,YAAY;4BACZC,OAAO;wBACT;kCAECxB;;kCAEH,KAACkD;wBACCtB,MAAK;wBACLuB,SAAS,IAAMJ,YAAY,CAACD;wBAC5B1B,OAAO;4BACLgC,YAAY;4BACZlB,QAAQ;4BACRD,SAAS;4BACToB,QAAQ;4BACR7B,OAAOsB,WAAW,8BAA8B;4BAChDzB,SAAS;4BACT2B,YAAY;4BACZC,gBAAgB;4BAChBd,cAAc;4BACdG,YAAY;wBACd;wBACAgB,OAAOR,WAAW,oBAAoB;kCAErCA,yBAAW,KAACxD;4BAAKiE,MAAM;2CAAS,KAAChE;4BAAOgE,MAAM;;;;;0BAKnD,MAACrC;gBAAIE,OAAO;oBAAEoC,UAAU;gBAAW;;kCACjC,KAAC9B;wBACCC,KAAKrB;wBACLsB,MAAK;wBACL9B,OAAOI;wBACPH,UAAUQ;wBACVsB,SAAShB;wBACTiB,QAAQnB;wBACRoB,WAAWjB;wBACX2C,UAAUX;wBACV7C,aAAaA;wBACbmB,OAAO;4BACLY,OAAO;4BACPC,SAAS;4BACTyB,cAAcZ,WAAW,SAAS;4BAClCxB,UAAU;4BACVY,QAAQ,CAAC,UAAU,EAAE9B,aAAa,CAAC0C,WAAW,+BAA+B,6BAA6B;4BAC1GX,cAAc;4BACdC,iBAAiBU,WAAW,8BAA8B;4BAC1DtB,OAAOsB,WAAW,8BAA8B;4BAChDO,QAAQP,WAAW,gBAAgB;4BACnCT,SAAS;4BACTC,YAAY;wBACd;;oBAEDQ,0BACC,KAACxD;wBACCiE,MAAM;wBACNnC,OAAO;4BACLoC,UAAU;4BACVG,OAAO;4BACPC,KAAK;4BACLC,WAAW;4BACXrC,OAAO;wBACT;;;;0BAMN,KAACe;gBACCnB,OAAO;oBACLoB,WAAW;oBACXlB,UAAU;oBACVE,OAAO;oBACPH,SAAS;oBACT2B,YAAY;oBACZc,KAAK;gBACP;0BAEC,CAAChB,YAAYD,+BACZ;;sCACE,KAACkB;4BAAK3C,OAAO;gCAAEI,OAAO;4BAA4B;sCAAG;;wBACpDqB;;qBAGH;;;;AAKV;AAEA,gFAAgF;AAChF,qCAAqC;AACrC,gFAAgF;AAEhF;;;CAGC,GACD,OAAO,SAASmB,6BAA6BtB,MAI5C;IACC,OAAO;QACLd,MAAM;QACN5B,OAAO0C,QAAQ1C,SAAS;QACxB2C,QAAQ,CAAC,EAAE7C,KAAK,EAAEC,QAAQ,EAAE,iBAC1B,KAAC6C;gBACC9C,OAAOA,SAAS;gBAChBC,UAAUA;gBACVC,OAAO0C,QAAQ1C;gBACfC,aAAayC,QAAQzC;gBACrB4C,gBAAgBH,QAAQG;;IAG9B;AACF"}
|
|
@@ -13,7 +13,7 @@ interface ResetFieldProps {
|
|
|
13
13
|
label?: string;
|
|
14
14
|
disabled?: boolean;
|
|
15
15
|
}
|
|
16
|
-
declare function ResetFieldInner({ onClick, label, disabled, }: ResetFieldProps):
|
|
16
|
+
declare function ResetFieldInner({ onClick, label, disabled, }: ResetFieldProps): React.JSX.Element;
|
|
17
17
|
export declare const ResetField: React.MemoExoticComponent<typeof ResetFieldInner>;
|
|
18
18
|
interface CreateResetFieldConfig<T> {
|
|
19
19
|
label?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResetField.d.ts","sourceRoot":"","sources":["../../src/fields/ResetField.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAgD,MAAM,OAAO,CAAA;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAYnD,UAAU,eAAe;IACvB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAqCD,iBAAS,eAAe,CAAC,EACvB,OAAO,EACP,KAA2B,EAC3B,QAAQ,GACT,EAAE,eAAe,
|
|
1
|
+
{"version":3,"file":"ResetField.d.ts","sourceRoot":"","sources":["../../src/fields/ResetField.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAgD,MAAM,OAAO,CAAA;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAYnD,UAAU,eAAe;IACvB,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAqCD,iBAAS,eAAe,CAAC,EACvB,OAAO,EACP,KAA2B,EAC3B,QAAQ,GACT,EAAE,eAAe,qBA2BjB;AAED,eAAO,MAAM,UAAU,mDAAwB,CAAA;AA+C/C,UAAU,sBAAsB,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,EAAE,CAAC,CAAA;CAChB;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAC/C,MAAM,EAAE,sBAAsB,CAAC,CAAC,CAAC,GAChC,WAAW,CAAC,OAAO,CAAC,CAuCtB"}
|
|
@@ -7,8 +7,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
7
7
|
* and restores the component to its default state.
|
|
8
8
|
*
|
|
9
9
|
* Uses Puck's usePuck hook and dispatch to properly update component data.
|
|
10
|
-
*/
|
|
11
|
-
import { memo, useCallback } from 'react';
|
|
10
|
+
*/ import React, { memo, useCallback } from 'react';
|
|
12
11
|
import { createUsePuck } from '@puckeditor/core';
|
|
13
12
|
import { RefreshCw } from 'lucide-react';
|
|
14
13
|
// Create usePuck hook for accessing editor state
|
|
@@ -19,7 +18,7 @@ const usePuck = createUsePuck();
|
|
|
19
18
|
const styles = {
|
|
20
19
|
container: {
|
|
21
20
|
display: 'flex',
|
|
22
|
-
flexDirection: 'column'
|
|
21
|
+
flexDirection: 'column'
|
|
23
22
|
},
|
|
24
23
|
button: {
|
|
25
24
|
display: 'flex',
|
|
@@ -35,46 +34,65 @@ const styles = {
|
|
|
35
34
|
backgroundColor: 'transparent',
|
|
36
35
|
color: 'var(--theme-elevation-500)',
|
|
37
36
|
cursor: 'pointer',
|
|
38
|
-
transition: 'all 0.15s'
|
|
37
|
+
transition: 'all 0.15s'
|
|
39
38
|
},
|
|
40
39
|
buttonDisabled: {
|
|
41
40
|
opacity: 0.5,
|
|
42
|
-
cursor: 'not-allowed'
|
|
43
|
-
}
|
|
41
|
+
cursor: 'not-allowed'
|
|
42
|
+
}
|
|
44
43
|
};
|
|
45
44
|
// =============================================================================
|
|
46
45
|
// ResetField Component
|
|
47
46
|
// =============================================================================
|
|
48
|
-
function ResetFieldInner({ onClick, label = 'Reset to defaults', disabled
|
|
49
|
-
return
|
|
47
|
+
function ResetFieldInner({ onClick, label = 'Reset to defaults', disabled }) {
|
|
48
|
+
return /*#__PURE__*/ _jsx("div", {
|
|
49
|
+
className: "puck-field",
|
|
50
|
+
style: styles.container,
|
|
51
|
+
children: /*#__PURE__*/ _jsxs("button", {
|
|
52
|
+
type: "button",
|
|
53
|
+
onClick: onClick,
|
|
54
|
+
disabled: disabled,
|
|
55
|
+
style: {
|
|
50
56
|
...styles.button,
|
|
51
|
-
...
|
|
52
|
-
},
|
|
57
|
+
...disabled ? styles.buttonDisabled : {}
|
|
58
|
+
},
|
|
59
|
+
onMouseOver: (e)=>{
|
|
53
60
|
if (!disabled) {
|
|
54
61
|
e.currentTarget.style.color = 'var(--theme-error-500)';
|
|
55
62
|
e.currentTarget.style.backgroundColor = 'rgba(239, 68, 68, 0.1)';
|
|
56
63
|
}
|
|
57
|
-
},
|
|
64
|
+
},
|
|
65
|
+
onMouseOut: (e)=>{
|
|
58
66
|
e.currentTarget.style.color = 'var(--theme-elevation-500)';
|
|
59
67
|
e.currentTarget.style.backgroundColor = 'transparent';
|
|
60
|
-
},
|
|
68
|
+
},
|
|
69
|
+
children: [
|
|
70
|
+
/*#__PURE__*/ _jsx(RefreshCw, {
|
|
71
|
+
style: {
|
|
72
|
+
width: '14px',
|
|
73
|
+
height: '14px'
|
|
74
|
+
}
|
|
75
|
+
}),
|
|
76
|
+
label
|
|
77
|
+
]
|
|
78
|
+
})
|
|
79
|
+
});
|
|
61
80
|
}
|
|
62
|
-
export const ResetField = memo(ResetFieldInner);
|
|
81
|
+
export const ResetField = /*#__PURE__*/ memo(ResetFieldInner);
|
|
63
82
|
// =============================================================================
|
|
64
83
|
// Helper Functions
|
|
65
84
|
// =============================================================================
|
|
66
85
|
/**
|
|
67
86
|
* Recursively update a component's props in Puck data structure
|
|
68
|
-
*/
|
|
69
|
-
|
|
70
|
-
const updateItem = (item) => {
|
|
87
|
+
*/ function updateComponentInData(data, componentId, newProps) {
|
|
88
|
+
const updateItem = (item)=>{
|
|
71
89
|
if (item.props?.id === componentId) {
|
|
72
90
|
return {
|
|
73
91
|
...item,
|
|
74
92
|
props: {
|
|
75
93
|
...newProps,
|
|
76
|
-
id: componentId
|
|
77
|
-
}
|
|
94
|
+
id: componentId
|
|
95
|
+
}
|
|
78
96
|
};
|
|
79
97
|
}
|
|
80
98
|
return item;
|
|
@@ -82,25 +100,24 @@ function updateComponentInData(data, componentId, newProps) {
|
|
|
82
100
|
const updatedContent = data.content.map(updateItem);
|
|
83
101
|
const updatedZones = {};
|
|
84
102
|
if (data.zones) {
|
|
85
|
-
for (const [zoneName, zoneContent] of Object.entries(data.zones))
|
|
103
|
+
for (const [zoneName, zoneContent] of Object.entries(data.zones)){
|
|
86
104
|
updatedZones[zoneName] = zoneContent.map(updateItem);
|
|
87
105
|
}
|
|
88
106
|
}
|
|
89
107
|
return {
|
|
90
108
|
...data,
|
|
91
109
|
content: updatedContent,
|
|
92
|
-
zones: Object.keys(updatedZones).length > 0 ? updatedZones : data.zones
|
|
110
|
+
zones: Object.keys(updatedZones).length > 0 ? updatedZones : data.zones
|
|
93
111
|
};
|
|
94
112
|
}
|
|
95
113
|
/**
|
|
96
114
|
* Creates a Puck field configuration for a reset button
|
|
97
|
-
*/
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
const
|
|
101
|
-
const
|
|
102
|
-
const
|
|
103
|
-
const handleReset = useCallback(() => {
|
|
115
|
+
*/ export function createResetField(config) {
|
|
116
|
+
const ResetFieldWrapper = ({ readOnly })=>{
|
|
117
|
+
const appState = usePuck((s)=>s.appState);
|
|
118
|
+
const dispatch = usePuck((s)=>s.dispatch);
|
|
119
|
+
const selectedItem = usePuck((s)=>s.selectedItem);
|
|
120
|
+
const handleReset = useCallback(()=>{
|
|
104
121
|
if (!selectedItem?.props?.id) {
|
|
105
122
|
console.warn('ResetField: No selected item found');
|
|
106
123
|
return;
|
|
@@ -109,14 +126,25 @@ export function createResetField(config) {
|
|
|
109
126
|
const updatedData = updateComponentInData(appState.data, componentId, config.defaultProps);
|
|
110
127
|
dispatch({
|
|
111
128
|
type: 'setData',
|
|
112
|
-
data: updatedData
|
|
129
|
+
data: updatedData
|
|
113
130
|
});
|
|
114
|
-
}, [
|
|
115
|
-
|
|
131
|
+
}, [
|
|
132
|
+
appState.data,
|
|
133
|
+
dispatch,
|
|
134
|
+
selectedItem
|
|
135
|
+
]);
|
|
136
|
+
return /*#__PURE__*/ _jsx(ResetField, {
|
|
137
|
+
onClick: handleReset,
|
|
138
|
+
label: config.label,
|
|
139
|
+
disabled: readOnly
|
|
140
|
+
});
|
|
116
141
|
};
|
|
117
142
|
return {
|
|
118
143
|
type: 'custom',
|
|
119
|
-
render: ({ readOnly })
|
|
144
|
+
render: ({ readOnly })=>/*#__PURE__*/ _jsx(ResetFieldWrapper, {
|
|
145
|
+
readOnly: readOnly
|
|
146
|
+
})
|
|
120
147
|
};
|
|
121
148
|
}
|
|
149
|
+
|
|
122
150
|
//# sourceMappingURL=ResetField.js.map
|