@decantr/content 3.8.0

package/patterns/producer-split-workbench.json

@@ -0,0 +1,57 @@
+{
+  "$schema": "https://decantr.ai/schemas/pattern.v2.json",
+  "id": "producer-split-workbench",
+  "version": "1.0.0",
+  "decantr_compat": ">=2.0.0",
+  "name": "Producer Split Workbench",
+  "description": "Royalty and credit split workbench for producers with contributor roles, master/publishing percentages, validation totals, signing status, and payout readiness.",
+  "category": "music",
+  "tags": ["2026", "music", "royalties", "splits", "credits", "collaboration", "workbench"],
+  "components": ["ContributorSplitRow", "SplitMeter", "RoleBreakdown", "ValidationBanner", "SignatureStatus", "PayoutReadiness"],
+  "default_preset": "workbench",
+  "presets": {
+    "workbench": {
+      "description": "Full split editor with validation meters, role breakdowns, signing status, and payout readiness",
+      "layout": { "layout": "stack", "atoms": "_flex _flex-col _gap-4 _w-full" }
+    },
+    "summary": {
+      "description": "Compact split summary for inspectors and track detail pages",
+      "layout": { "layout": "stack", "atoms": "_flex _flex-col _gap-2 _w-full" }
+    }
+  },
+  "visual_brief": "A label-ready royalty split surface. The top shows selected track, master split meter, publishing split meter, validation total, and release readiness. Contributor rows show avatar, role, master %, publishing %, songwriter credit, publisher, status, and signing action with table-like alignment. Invalid totals are visually obvious through text, icon, and color. Signed rows feel locked; pending rows show clear next actions. The workbench should feel operational, trustable, and audit-ready rather than decorative.",
+  "default_layout": {
+    "layout": "stack",
+    "atoms": "_flex _flex-col _gap-4 _w-full",
+    "slots": {
+      "split-meters": "Master and publishing totals with 100% validation and over/under warnings.",
+      "contributors": "Editable contributor rows with role, credits, percentages, status, and signature state.",
+      "readiness": "Payout routing, contract status, and export readiness summary."
+    }
+  },
+  "composition": {
+    "ProducerSplitWorkbench": "Root(stack) > [ValidationBanner + SplitMeter* + ContributorSplitRow* + PayoutReadiness]",
+    "ContributorSplitRow": "Grid > [Avatar + RoleBreakdown + MasterPercent + PublishingPercent + SignatureStatus + Actions]"
+  },
+  "motion": {
+    "micro": {
+      "percent-edit": "meter value animates to new total in 180ms",
+      "validation-change": "banner pulses once on invalid/valid transition"
+    }
+  },
+  "interactions": ["inline-edit", "status-pulse", "keyboard-navigation", "real-time-updates"],
+  "responsive": {
+    "mobile": "Contributor rows become stacked forms with split meters pinned above the list.",
+    "desktop": "Use a dense grid with meters and contributor rows visible together."
+  },
+  "accessibility": {
+    "role": "form",
+    "aria-label": "Royalty split workbench",
+    "keyboard": ["Tab: move through split fields", "Enter: commit edited percentage", "Esc: cancel edit"],
+    "announcements": ["Master split total {percent}%", "Publishing split total {percent}%", "Split validation {status}"]
+  },
+  "layout_hints": {
+    "trust": "Validation and signed/pending states must be impossible to miss.",
+    "density": "Use table-like alignment on desktop but switch to readable stacked forms on mobile."
+  }
+}

package/patterns/product-box-spec-panel.json

@@ -0,0 +1,126 @@
+{
+  "$schema": "https://decantr.ai/schemas/pattern.v2.json",
+  "id": "product-box-spec-panel",
+  "version": "1.0.0",
+  "decantr_compat": ">=2.0.0",
+  "name": "Product Box Spec Panel",
+  "description": "Back-of-box product explanation panel with contents, specs, compatibility, proof, shipping notes, and campaign caveats.",
+  "category": "campaign",
+  "tags": [
+    "campaign",
+    "product",
+    "specs",
+    "features",
+    "launch",
+    "proof"
+  ],
+  "components": [
+    "Badge",
+    "Accordion",
+    "icon",
+    "KPI"
+  ],
+  "contained": false,
+  "default_preset": "box-back",
+  "presets": {
+    "box-back": {
+      "description": "Back-of-package grid with feature callouts, contents list, compatibility, shipping status, and support notes.",
+      "components": [
+        "Badge",
+        "Accordion",
+        "icon",
+        "KPI"
+      ],
+      "layout": {
+        "layout": "grid",
+        "atoms": "_grid _gap6 _wfull _maxw[76rem] _mx[auto]",
+        "slots": {
+          "feature-burst": "Two to four high-impact product benefits in bold manual panels.",
+          "contents-list": "What is included in the pledge or launch package.",
+          "compatibility-strip": "Works with, integrations, sizing, OS, or audience fit.",
+          "proof-stamps": "Prototype status, guarantee, press proof, or maker credibility.",
+          "shipping-note": "Delivery window, beta wave, manufacturing status, or digital access timing."
+        }
+      }
+    },
+    "manual-foldout": {
+      "description": "Instruction-manual style foldout with numbered specs, diagrams, and usage scenarios.",
+      "components": [
+        "Badge",
+        "Accordion",
+        "icon"
+      ],
+      "layout": {
+        "layout": "grid",
+        "atoms": "_grid _gap5 _wfull _maxw[70rem] _mx[auto]",
+        "slots": {
+          "numbered-spec": "Repeated numbered feature or spec row.",
+          "diagram-slot": "Product diagram, screenshot, or simplified flow.",
+          "usage-scenario": "Short scenario copy showing why the product matters."
+        }
+      }
+    }
+  },
+  "default_layout": {
+    "layout": "grid",
+    "atoms": "_grid _gap6 _wfull _maxw[76rem] _mx[auto]",
+    "slots": {
+      "feature-burst": "Primary product benefits",
+      "contents-list": "Included items or access",
+      "compatibility-strip": "Works-with and fit details",
+      "proof-stamps": "Prototype, trust, and maker proof",
+      "shipping-note": "Delivery or access timing"
+    }
+  },
+  "visual_brief": "A back-of-box product panel, like the rear of a toy or gadget package. It should explain the offer with practical detail while keeping a playful launch tone. Use structured zones, thick separators, sticker-like labels, and readable body text. Do not turn each feature into a floating card.",
+  "responsive": {
+    "mobile": "Stack feature bursts, contents, compatibility, and notes. Use accordions for secondary details.",
+    "tablet": "Two-column manual layout with specs and proof beside a diagram.",
+    "desktop": "Asymmetric package-back layout with a large contents/spec column and smaller proof/shipping panels."
+  },
+  "layout_hints": {
+    "content_order": "Explain what it is, what is included, who it is for, and when/how backers receive it.",
+    "trust": "Campaign caveats should be visible and plain, not hidden in tiny legal copy.",
+    "visual_language": "Use package/manual framing rather than SaaS feature grids."
+  },
+  "motion": {
+    "micro": {
+      "stamp-hover": "proof stamp tilts or brightens slightly",
+      "accordion-open": "manual panel expands instantly with no bouncy motion"
+    }
+  },
+  "interactions": [
+    "click-select",
+    "hover-reveal",
+    "keyboard-navigation"
+  ],
+  "composition": {
+    "ProductBoxSpecPanel": "Panel(arcade-manual-panel) > [FeatureBurst + ContentsList + CompatibilityStrip + ProofStamps + ShippingNote]",
+    "FeatureBurst": "Grid > BenefitBlock[]",
+    "ProofStamps": "Rail > StampBadge[]"
+  },
+  "accessibility": {
+    "role": "region",
+    "aria-label": "Product launch specifications",
+    "keyboard": [
+      "Accordion sections must use button semantics and expose expanded state.",
+      "Proof stamps should have text labels, not only icons."
+    ],
+    "announcements": [
+      "Specification section expanded: {section}."
+    ]
+  },
+  "io": {
+    "consumes": [
+      "product-specs",
+      "campaign-fulfillment"
+    ],
+    "produces": [
+      "product-understanding"
+    ],
+    "actions": [
+      "spec-expand",
+      "compatibility-check"
+    ]
+  }
+}

package/patterns/product-card.json

@@ -0,0 +1,120 @@
+{
+  "$schema": "https://decantr.ai/schemas/pattern.v2.json",
+  "id": "product-card",
+  "version": "1.0.0",
+  "decantr_compat": ">=2.0.0",
+  "name": "Product Card",
+  "description": "Single product/post display card with thumbnail, price, type indicator, and actions. Used within product grids.",
+  "dependencies": {
+    "patterns": {},
+    "styles": {},
+    "requires_core": {
+      "components": [
+        "Button",
+        "Card",
+        "Badge",
+        "icon"
+      ],
+      "charts": []
+    }
+  },
+  "components": [
+    "Button",
+    "Card",
+    "Badge",
+    "icon"
+  ],
+  "default_preset": "grid",
+  "presets": {
+    "grid": {
+      "description": "Square thumbnail card for grids",
+      "components": [
+        "Card",
+        "Badge",
+        "icon"
+      ],
+      "layout": {
+        "layout": "card",
+        "atoms": "studio-card _overflow[hidden]",
+        "slots": {
+          "thumbnail": "Preview image/video",
+          "title": "Product name",
+          "price": "Price or tier indicator",
+          "meta": "Date, type, likes",
+          "lock-indicator": "Locked badge for gated content"
+        }
+      }
+    },
+    "list": {
+      "description": "Horizontal list row item with small thumbnail on the left and title, description, and price on the right",
+      "components": [
+        "Card",
+        "Badge",
+        "icon"
+      ],
+      "layout": {
+        "layout": "inline",
+        "atoms": "studio-card _p4 _flex _gap4",
+        "slots": {
+          "thumbnail": "Small thumbnail",
+          "content": "Title, description",
+          "meta": "Price, actions"
+        }
+      }
+    },
+    "featured": {
+      "description": "Large featured card with more details",
+      "components": [
+        "Button",
+        "Card",
+        "Badge",
+        "icon"
+      ],
+      "layout": {
+        "layout": "card",
+        "atoms": "studio-card _overflow[hidden] _lg:flex _lg:row",
+        "slots": {
+          "media": "Large preview area",
+          "content": "Full title, description, meta",
+          "actions": "Buy, like, share buttons"
+        }
+      }
+    }
+  },
+  "default_layout": {
+    "layout": "card",
+    "atoms": "studio-card _overflow[hidden]",
+    "slots": {
+      "thumbnail": "Preview image",
+      "title": "Product name",
+      "price": "Price display",
+      "actions": "Card actions"
+    }
+  },
+  "io": {
+    "produces": [
+      "product-click",
+      "buy-click"
+    ],
+    "consumes": [
+      "product-data"
+    ]
+  },
+  "visual_brief": "Bordered card displaying a single product or content item. A thumbnail image fills the top portion of the card. Below the image, the product title in medium-weight text, a price displayed prominently (or 'Free' badge), and a type indicator badge (video, audio, image, document). Action buttons in the card footer allow quick purchase or preview. The list preset renders as a horizontal row with a small thumbnail on the left. The featured preset enlarges the card with a gradient overlay on the image and a 'Featured' badge. Hover state lifts the card with a subtle shadow increase.",
+  "responsive": {
+    "mobile": "Cards take full width in single column. Thumbnail height reduces. Price and title prominent. Action buttons full-width.",
+    "tablet": "Two-column card grid. Standard card proportions.",
+    "desktop": "Three or four column grid. Cards at comfortable size with hover effects."
+  },
+  "interactions": [
+    "lift-hover",
+    "click-select",
+    "animate-on-mount",
+    "stagger-children"
+  ],
+  "composition": {
+    "ProductCard": "Card(d-surface, hoverable, lift-on-hover) > [Thumbnail(aspect-ratio) + Title(font-medium) + Price(heading4) | FreeBadge(d-annotation) + TypeBadge(d-annotation) + ActionButtons?(d-interactive)]",
+    "FeaturedCard": "Card(d-surface, large, gradient-overlay) > [Media + Content > [Title + Description + Meta] + Actions(d-interactive)]",
+    "ListItem": "Row(d-surface) > [SmallThumbnail + Content > [Title + Description] + Meta > [Price + Actions(d-interactive)]]"
+  }
+}

package/patterns/product-grid.json

@@ -0,0 +1,140 @@
+{
+  "$schema": "https://decantr.ai/schemas/pattern.v2.json",
+  "id": "product-grid",
+  "version": "1.0.0",
+  "decantr_compat": ">=2.0.0",
+  "name": "Product Grid",
+  "description": "Purchasable items/posts grid with filtering, sorting, and multiple view modes. Used for creator content libraries.",
+  "dependencies": {
+    "patterns": {
+      "product-card": "^1.0.0"
+    },
+    "styles": {},
+    "requires_core": {
+      "components": [
+        "Button",
+        "Card",
+        "Select",
+        "Badge",
+        "icon"
+      ],
+      "charts": []
+    }
+  },
+  "components": [
+    "Button",
+    "Card",
+    "Select",
+    "Badge",
+    "icon"
+  ],
+  "default_preset": "standard",
+  "presets": {
+    "standard": {
+      "description": "Card grid with filters and sorting",
+      "components": [
+        "Button",
+        "Card",
+        "Select",
+        "Badge",
+        "icon"
+      ],
+      "layout": {
+        "layout": "stack",
+        "atoms": "_flex _col _gap6",
+        "slots": {
+          "filters": "Category, price, type filters",
+          "sort": "Sort controls",
+          "view-toggle": "Grid/list view toggle",
+          "items": "Product cards grid",
+          "load-more": "Pagination/infinite scroll"
+        }
+      }
+    },
+    "list": {
+      "description": "Stacked horizontal list view with product rows for a single-column browsing experience",
+      "components": [
+        "Card",
+        "Badge",
+        "icon"
+      ],
+      "layout": {
+        "layout": "stack",
+        "atoms": "_flex _col _gap3",
+        "slots": {
+          "items": "Product list items"
+        }
+      }
+    },
+    "masonry": {
+      "description": "Pinterest-style masonry layout",
+      "components": [
+        "Card",
+        "icon"
+      ],
+      "layout": {
+        "layout": "masonry",
+        "atoms": "_columns2 _md:columns3 _gap4",
+        "slots": {
+          "items": "Variable-height product cards"
+        }
+      }
+    }
+  },
+  "default_layout": {
+    "layout": "stack",
+    "atoms": "_flex _col _gap6",
+    "slots": {
+      "filters": "Filter controls",
+      "items": "Product grid",
+      "pagination": "Load more"
+    }
+  },
+  "io": {
+    "produces": [
+      "product-click",
+      "filter-changed"
+    ],
+    "consumes": [
+      "product-data",
+      "category-data"
+    ]
+  },
+  "visual_brief": "Grid of product cards with a toolbar header containing filter dropdowns (category, price range, type), a sort selector (newest, popular, price), and view mode toggles (grid/list). Cards are arranged in a responsive CSS grid. The list preset stacks items as horizontal rows. The masonry preset uses a masonry layout for varied card heights. A 'Load More' button or infinite scroll pagination sits at the bottom. Empty state shows a 'No products found' message when filters return nothing.",
+  "responsive": {
+    "mobile": "Single-column card list. Filters collapse into a filter drawer button. Sort is a simple dropdown. Load more as a button.",
+    "tablet": "Two-column grid. Filters visible in a row. Sort inline.",
+    "desktop": "Three to four column grid. All filter and sort controls visible in the toolbar. Masonry layout effective at this width."
+  },
+  "layout_hints": {
+    "catalog_priority": "Lead with discovery controls first, then the products themselves. The toolbar should support browsing without visually overpowering the merchandise.",
+    "view_consistency": "Grid, list, and masonry variants should preserve the same product identity and pricing hierarchy so mode switching changes density, not meaning.",
+    "empty_state_role": "No-results states should feel like browsing guidance, not a dead end. Keep them in the same rhythm as the catalog rather than replacing the whole surface with a different layout."
+  },
+  "motion": {
+    "micro": "Cards, filters, and load-more affordances may sharpen or lift subtly on hover and focus.",
+    "transitions": "Sorting, filtering, and view changes should preserve catalog continuity and avoid noisy reshuffles that break scanability."
+  },
+  "interactions": [
+    "lift-hover",
+    "click-select",
+    "animate-on-mount",
+    "stagger-children"
+  ],
+  "accessibility": {
+    "role": "region",
+    "aria-label": "Product catalog",
+    "keyboard": [
+      "Toolbar controls should precede products, and each product should expose one clear primary interaction target."
+    ],
+    "announcements": [
+      "Product identity, pricing, availability, and active filters should be exposed semantically so the catalog remains understandable beyond grid layout alone."
+    ]
+  },
+  "composition": {
+    "ProductGrid": "Container(d-section, flex-col, gap-6) > [Toolbar + ItemGrid + LoadMore?]",
+    "Toolbar": "Row(d-control) > [FilterDropdowns > Select(d-control)[] + SortSelect(d-control) + ViewToggle(d-interactive)]",
+    "ItemGrid": "Grid(d-data, responsive: 1/2/3/4-col) > ProductCard[]",
+    "LoadMore": "Button(d-interactive, full-width, variant: ghost)"
+  }
+}

package/patterns/progress-bar.json

@@ -0,0 +1,124 @@
+{
+  "$schema": "https://decantr.ai/schemas/pattern.v2.json",
+  "id": "progress-bar",
+  "version": "1.0.0",
+  "decantr_compat": ">=2.0.0",
+  "name": "Progress Bar",
+  "description": "ASCII progress indicators with bar, spinner, and dot animations for terminal-style feedback.",
+  "dependencies": {
+    "patterns": {},
+    "styles": {
+      "terminal": "^1.0.0"
+    },
+    "requires_core": {
+      "components": [],
+      "charts": []
+    }
+  },
+  "components": ["Text", "Container"],
+  "default_preset": "bar",
+  "presets": {
+    "bar": {
+      "description": "ASCII bar progress [████░░░░░░] 42%",
+      "components": [],
+      "layout": {
+        "layout": "flex",
+        "atoms": "_flex _aic _gap2 _mono _fggreen",
+        "slots": {
+          "label": "Progress label",
+          "bar": "ASCII progress visualization",
+          "percentage": "Numeric percentage"
+        }
+      }
+    },
+    "spinner": {
+      "description": "Animated braille spinner ⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏",
+      "components": [],
+      "layout": {
+        "layout": "flex",
+        "atoms": "_flex _aic _gap2 _mono _fggreen",
+        "slots": {
+          "spinner": "Animated spinner character",
+          "label": "Status text"
+        }
+      }
+    },
+    "dots": {
+      "description": "Animated trailing dots progression indicator for indeterminate loading status feedback",
+      "components": [],
+      "layout": {
+        "layout": "flex",
+        "atoms": "_flex _aic _mono _fggreen",
+        "slots": {
+          "label": "Status text",
+          "dots": "Animated dots"
+        }
+      }
+    },
+    "blocks": {
+      "description": "Block character progression ▏▎▍▌▋▊▉█",
+      "components": [],
+      "layout": {
+        "layout": "flex",
+        "atoms": "_flex _aic _gap2 _mono _fggreen",
+        "slots": {
+          "label": "Progress label",
+          "bar": "Block character visualization"
+        }
+      }
+    }
+  },
+  "default_layout": {
+    "layout": "flex",
+    "atoms": "_flex _aic _gap2 _mono _fggreen",
+    "slots": {
+      "label": "Progress label",
+      "bar": "Progress visualization",
+      "percentage": "Numeric value"
+    }
+  },
+  "features": [
+    "indeterminate-mode",
+    "success-error-states",
+    "stacked-progress",
+    "rate-display",
+    "eta-calculation"
+  ],
+  "character_sets": {
+    "bar": {
+      "filled": "█",
+      "empty": "░",
+      "partial": "▓",
+      "bracket_left": "[",
+      "bracket_right": "]"
+    },
+    "spinner": [
+      "⠋",
+      "⠙",
+      "⠹",
+      "⠸",
+      "⠼",
+      "⠴",
+      "⠦",
+      "⠧",
+      "⠇",
+      "⠏"
+    ],
+    "blocks": [
+      "▏",
+      "▎",
+      "▍",
+      "▌",
+      "▋",
+      "▊",
+      "▉",
+      "█"
+    ]
+  },
+  "visual_brief": "Terminal-style progress indicators rendered in monospace type. The bar preset shows a label, a horizontal bar made of block characters (filled blocks for progress, empty/light blocks for remaining), and a percentage value. The spinner preset shows a cycling ASCII spinner character (|, /, -, \\) with a label. The dots preset shows animated trailing dots (...) with a label. The blocks preset uses Unicode block elements for a higher-resolution bar with eighth-block gradations at the fill edge. All variants use green or primary color on a dark/terminal background.",
+  "responsive": {
+    "mobile": "Bar width scales to container. Label may truncate. Percentage stays visible.",
+    "tablet": "Standard bar width. Full label visible.",
+    "desktop": "Full-width bar with generous spacing. All text and labels comfortably visible."
+  }
+}