@delmaredigital/payload-puck 0.2.0 → 0.3.0

package/dist/components/index.css

@@ -1,339 +0,0 @@
-/* src/fields/tiptap-styles.css */
-.tiptap-editor {
-  min-height: 200px;
-  outline: none;
-}
-.tiptap-editor:focus {
-  outline: none;
-}
-.tiptap-editor p {
-  margin: 0 0 1em 0;
-}
-.tiptap-editor p:last-child {
-  margin-bottom: 0;
-}
-.tiptap-editor h1 {
-  font-size: 2em !important;
-  font-weight: 700 !important;
-  margin: 1em 0 0.5em 0;
-}
-.tiptap-editor h1:first-child {
-  margin-top: 0;
-}
-.tiptap-editor h2 {
-  font-size: 1.5em !important;
-  font-weight: 700 !important;
-  margin: 1em 0 0.5em 0;
-}
-.tiptap-editor h2:first-child {
-  margin-top: 0;
-}
-.tiptap-editor h3 {
-  font-size: 1.25em !important;
-  font-weight: 600 !important;
-  margin: 1em 0 0.5em 0;
-}
-.tiptap-editor h3:first-child {
-  margin-top: 0;
-}
-.tiptap-editor h4 {
-  font-size: 1.1em !important;
-  font-weight: 600 !important;
-  margin: 1em 0 0.5em 0;
-}
-.tiptap-editor h4:first-child {
-  margin-top: 0;
-}
-.tiptap-editor h5 {
-  font-size: 1em !important;
-  font-weight: 600 !important;
-  margin: 1em 0 0.5em 0;
-}
-.tiptap-editor h5:first-child {
-  margin-top: 0;
-}
-.tiptap-editor h6 {
-  font-size: 0.9em !important;
-  font-weight: 600 !important;
-  margin: 1em 0 0.5em 0;
-  color: hsl(var(--muted-foreground, 220 9% 46%));
-}
-.tiptap-editor h6:first-child {
-  margin-top: 0;
-}
-.tiptap-editor ul,
-.tiptap-editor ol {
-  padding-left: 1.5em !important;
-  margin: 0 0 1em 0;
-}
-.tiptap-editor ul:last-child,
-.tiptap-editor ol:last-child {
-  margin-bottom: 0;
-}
-.tiptap-editor ul {
-  list-style-type: disc !important;
-}
-.tiptap-editor ol {
-  list-style-type: decimal !important;
-}
-.tiptap-editor li {
-  margin: 0.25em 0;
-}
-.tiptap-editor li p {
-  margin: 0;
-}
-.tiptap-editor blockquote {
-  border-left: 4px solid hsl(var(--border, 220 13% 91%)) !important;
-  padding-left: 1em !important;
-  margin: 1em 0 !important;
-  font-style: italic !important;
-  color: hsl(var(--muted-foreground, 220 9% 46%));
-}
-.tiptap-editor a {
-  color: hsl(var(--primary, 221 83% 53%));
-  text-decoration: underline;
-  cursor: pointer;
-}
-.tiptap-editor a:hover {
-  color: hsl(var(--primary, 221 83% 53%) / 0.8);
-}
-.tiptap-editor code {
-  background-color: hsl(var(--muted, 220 14% 96%));
-  padding: 0.125em 0.25em;
-  border-radius: 0.25em;
-  font-family: monospace;
-  font-size: 0.9em;
-}
-.tiptap-editor p.is-editor-empty:first-child::before {
-  content: attr(data-placeholder);
-  float: left;
-  color: hsl(var(--muted-foreground, 220 9% 46%));
-  pointer-events: none;
-  height: 0;
-}
-.ProseMirror:focus {
-  outline: none;
-}
-.tiptap-editor ::selection {
-  background-color: #b4d5fe;
-}
-.tiptap-editor [style*="text-align: center"] {
-  text-align: center;
-}
-.tiptap-editor [style*="text-align: right"] {
-  text-align: right;
-}
-.tiptap-editor [style*="text-align: left"] {
-  text-align: left;
-}
-.tiptap-editor u {
-  text-decoration: underline;
-}
-.tiptap-editor s {
-  text-decoration: line-through;
-}
-.tiptap-editor mark {
-  background-color: #fef08a;
-  padding: 0.125rem 0.25rem;
-  border-radius: 0.125rem;
-}
-.tiptap-editor sup {
-  vertical-align: super;
-  font-size: 0.75em;
-}
-.tiptap-editor sub {
-  vertical-align: sub;
-  font-size: 0.75em;
-}
-.tiptap-editor hr {
-  border: none;
-  border-top: 2px solid hsl(var(--border, 220 13% 91%));
-  margin: 1.5em 0;
-}
-.tiptap-editor [style*="text-align: justify"] {
-  text-align: justify;
-}
-.richtext-inline-editor {
-  position: relative;
-}
-.richtext-inline-editor .tiptap-editor {
-  cursor: text;
-}
-.richtext-inline-editor:focus-within {
-  outline: none;
-}
-.richtext-inline-editor .ProseMirror {
-  min-height: 40px;
-  outline: none;
-}
-.richtext-inline-editor .ProseMirror p.is-editor-empty:first-child::before {
-  content: "Click to start editing...";
-  color: hsl(var(--muted-foreground, 220 9% 46%));
-  pointer-events: none;
-  float: left;
-  height: 0;
-}
-
-/* src/fields/richtext-output.css */
-.richtext-output {
-  font-size: 1.125rem;
-  line-height: 1.75;
-  color: inherit;
-}
-.richtext-output h1 {
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  font-weight: 700;
-  font-size: 2.25rem;
-  line-height: 1.2;
-}
-.richtext-output h1:first-child {
-  margin-top: 0;
-}
-.richtext-output h2 {
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  font-weight: 700;
-  font-size: 1.875rem;
-  line-height: 1.25;
-}
-.richtext-output h2:first-child {
-  margin-top: 0;
-}
-.richtext-output h3 {
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  font-weight: 700;
-  font-size: 1.5rem;
-  line-height: 1.3;
-}
-.richtext-output h3:first-child {
-  margin-top: 0;
-}
-.richtext-output h4 {
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  font-weight: 700;
-  font-size: 1.25rem;
-  line-height: 1.35;
-}
-.richtext-output h4:first-child {
-  margin-top: 0;
-}
-.richtext-output h5,
-.richtext-output h6 {
-  margin-top: 2rem;
-  margin-bottom: 1rem;
-  font-weight: 700;
-}
-.richtext-output h5:first-child,
-.richtext-output h6:first-child {
-  margin-top: 0;
-}
-.richtext-output p {
-  margin-bottom: 1.25rem;
-}
-.richtext-output p:last-child {
-  margin-bottom: 0;
-}
-.richtext-output ul {
-  margin-bottom: 1.25rem;
-  padding-left: 2rem;
-  list-style-type: disc !important;
-}
-.richtext-output ol {
-  margin-bottom: 1.25rem;
-  padding-left: 2rem;
-  list-style-type: decimal !important;
-}
-.richtext-output li {
-  margin-bottom: 0.5rem;
-}
-.richtext-output li::marker {
-  color: currentColor;
-}
-.richtext-output ul ul,
-.richtext-output ol ul {
-  list-style-type: circle !important;
-  margin-top: 0.5rem;
-  margin-bottom: 0;
-}
-.richtext-output ul ul ul,
-.richtext-output ol ul ul {
-  list-style-type: square !important;
-}
-.richtext-output ol ol,
-.richtext-output ul ol {
-  list-style-type: lower-alpha !important;
-  margin-top: 0.5rem;
-  margin-bottom: 0;
-}
-.richtext-output blockquote {
-  margin: 1.5rem 0;
-  padding-left: 1.5rem;
-  border-left: 4px solid hsl(var(--border, 220 13% 91%));
-  font-style: italic;
-}
-.richtext-output a {
-  color: hsl(var(--primary, 221 83% 53%));
-  text-decoration: underline;
-}
-.richtext-output a:hover {
-  opacity: 0.8;
-}
-.richtext-output code {
-  background-color: hsl(var(--muted, 220 14% 96%));
-  padding: 0.125rem 0.25rem;
-  border-radius: 0.25rem;
-  font-size: 0.875rem;
-}
-.richtext-output mark {
-  background-color: #fef08a;
-  padding: 0.125rem 0.25rem;
-  border-radius: 0.125rem;
-}
-.richtext-output s,
-.richtext-output strike {
-  text-decoration: line-through;
-}
-.richtext-output .text-left {
-  text-align: left;
-}
-.richtext-output .text-center {
-  text-align: center;
-}
-.richtext-output .text-right {
-  text-align: right;
-}
-.richtext-output .text-justify,
-.richtext-output [style*="text-align: justify"] {
-  text-align: justify;
-}
-.richtext-output sup {
-  vertical-align: super;
-  font-size: 0.75em;
-}
-.richtext-output sub {
-  vertical-align: sub;
-  font-size: 0.75em;
-}
-.richtext-output hr {
-  border: none;
-  border-top: 2px solid hsl(var(--border, 220 13% 91%));
-  margin: 2rem 0;
-}
-@media (max-width: 768px) {
-  .richtext-output {
-    font-size: 1rem;
-  }
-  .richtext-output h1 {
-    font-size: 1.875rem;
-  }
-  .richtext-output h2 {
-    font-size: 1.5rem;
-  }
-  .richtext-output h3 {
-    font-size: 1.25rem;
-  }
-}
-/*# sourceMappingURL=index.css.map */

package/dist/components/index.d.mts

@@ -1,219 +0,0 @@
-import { ComponentConfig } from '@measured/puck';
-import { R as ResponsiveValue, D as DimensionsValue, P as PaddingValue, V as VisibilityValue } from '../shared-X9UpCJKW.mjs';
-export { AnimatedWrapper, AnimatedWrapperProps } from '../AnimatedWrapper.mjs';
-import 'react/jsx-runtime';
-import 'react';
-
-/**
- * Container Component - Puck Configuration
- *
- * Simple organizational wrapper for grouping content.
- * Uses Puck's slot system for nesting other components.
- *
- * For two-layer layouts (full-bleed background with constrained content),
- * use the Section component instead.
- *
- * Responsive Controls:
- * - dimensions: Different max-width/min-height at different breakpoints
- * - padding: Different padding at different breakpoints
- * - margin: Different margins at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const ContainerConfig: ComponentConfig;
-
-/**
- * Flex Component - Puck Configuration
- *
- * Flexbox layout following official Puck demo patterns.
- * Uses Tailwind classes for layout, inline styles for dynamic user values.
- *
- * Supports both preset options and advanced custom styling:
- * - Background: unified BackgroundField (solid, gradient, or image)
- * - Advanced: customPadding, customWidth, border
- *
- * Responsive Controls:
- * - dimensions: Different dimensions at different breakpoints
- * - customPadding: Different padding at different breakpoints
- * - margin: Different margins at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const FlexConfig: ComponentConfig;
-
-/**
- * Grid Component - Puck Configuration
- *
- * CSS Grid layout following official Puck demo patterns.
- * Responsive: stacks on mobile (flex column), grid on desktop (md+).
- * Uses Tailwind classes for layout, inline styles for dynamic user values.
- *
- * Supports both preset options and advanced custom styling:
- * - Background: unified BackgroundField (solid, gradient, or image)
- * - Advanced: customPadding, customWidth, border
- *
- * Responsive Controls:
- * - gap: Different gap at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const GridConfig: ComponentConfig;
-
-/**
- * Section Component - Puck Configuration
- *
- * Full-width section with two-layer architecture:
- * - Section layer (outer): Full-bleed background, border, padding, margin
- * - Content layer (inner): Constrained content area with max-width, background, border, padding
- *
- * This design enables common patterns like hero sections with full-bleed backgrounds
- * but centered content.
- *
- * Responsive Controls:
- * - contentDimensions: Different max-width/min-height at different breakpoints
- * - sectionPadding: Different section padding at different breakpoints
- * - contentPadding: Different content padding at different breakpoints
- * - sectionMargin: Different margins at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const SectionConfig: ComponentConfig;
-
-/**
- * Spacer Component - Puck Configuration
- *
- * Simple spacing component for adding vertical or horizontal space.
- * Uses Tailwind classes for layout and sizing from predefined options.
- *
- * Responsive Controls:
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const SpacerConfig: ComponentConfig;
-
-/**
- * Template Component - Puck Configuration
- *
- * A reusable template container that allows saving and loading
- * pre-configured component arrangements from the Payload CMS.
- *
- * Use this component to:
- * - Create reusable page sections
- * - Save common component patterns as templates
- * - Quickly load pre-built layouts
- *
- * Responsive Controls:
- * - dimensions: Different dimensions at different breakpoints
- * - customPadding: Different padding at different breakpoints
- * - margin: Different margins at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-interface TemplateProps {
-    /** Slot for nested components */
-    content: unknown;
-    /** ID of the currently loaded template (or null if none) */
-    templateId: string | null;
-    /** Responsive dimensions */
-    dimensions: ResponsiveValue<DimensionsValue> | DimensionsValue | null;
-    /** Responsive padding */
-    customPadding: ResponsiveValue<PaddingValue> | PaddingValue | null;
-    /** Responsive margin */
-    margin: ResponsiveValue<PaddingValue> | PaddingValue | null;
-    /** Responsive visibility */
-    visibility: VisibilityValue | null;
-}
-declare const TemplateConfig: ComponentConfig;
-
-/**
- * Template Component - Server-safe Configuration
- *
- * A reusable template container for rendering nested components.
- * This server-safe version excludes the TemplateField (which requires client-side APIs).
- *
- * For the full editor experience with template loading, use Template.tsx
- *
- * Responsive Controls:
- * - dimensions: Different dimensions at different breakpoints
- * - customPadding: Different padding at different breakpoints
- * - margin: Different margins at different breakpoints
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const TemplateServerConfig: ComponentConfig;
-
-/**
- * Heading Component - Puck Configuration
- *
- * H1-H6 headings with customizable styling.
- * Supports custom margin for spacing control.
- */
-
-declare const HeadingConfig: ComponentConfig;
-
-/**
- * Text Component - Puck Configuration
- *
- * Simple paragraph text with customizable styling.
- */
-
-declare const TextConfig: ComponentConfig;
-
-/**
- * RichText Component - Puck Server Configuration
- *
- * Server-safe config for rendering. Uses a simple textarea for the field.
- * The editor config (RichText.editor.tsx) uses Tiptap for the visual editor.
- */
-
-declare const RichTextConfig: ComponentConfig;
-
-declare const RichTextEditorConfig: ComponentConfig;
-
-/**
- * Image Component - Puck Configuration
- *
- * Standalone image block with optional link wrapper.
- * Server-safe version using standard HTML img element.
- *
- * Responsive Controls:
- * - visibility: Show/hide at different breakpoints
- */
-
-declare const ImageConfig: ComponentConfig;
-
-/**
- * Button Component - Puck Configuration
- *
- * CTA button with customizable styling and link support.
- */
-
-declare const ButtonConfig: ComponentConfig;
-
-/**
- * Card Component - Puck Configuration
- *
- * Content card with image, heading, and text.
- */
-
-declare const CardConfig: ComponentConfig;
-
-/**
- * Divider Component - Puck Configuration
- *
- * Horizontal line separator with customizable style.
- */
-
-declare const DividerConfig: ComponentConfig;
-
-/**
- * Accordion Component - Puck Configuration
- *
- * Expandable sections with collapsible content.
- * Uses plain HTML/CSS for the accordion behavior.
- * Supports custom margin for spacing control.
- */
-
-declare const AccordionConfig: ComponentConfig;
-
-export { AccordionConfig, ButtonConfig, CardConfig, ContainerConfig, DividerConfig, FlexConfig, GridConfig, HeadingConfig, ImageConfig, RichTextConfig, RichTextEditorConfig, SectionConfig, SpacerConfig, TemplateConfig, type TemplateProps, TemplateServerConfig, TextConfig };