Statamic Peak Commands

https://github.com/studio1902/statamic-peak-commands
Admin
Statamic Peak Commands is a paid addon for Statamic Peak, providing various Peak CLI commands for...
Tokens:20,260
Snippets:110
Trust Score:7.8
Update:11 months ago
Show doc for...
Tokens:
Raw
### Execute Installable Operations with PHP

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Demonstrates how to create and execute installation operations using the Installable model. It processes a series of operations like copying files and updating page builder configurations. Dependencies include the Installable class from the package.

```php
<?php

use Studio1902PeakCommandsModels\Installable;

// Create an installable instance from config
$config = [
    'name' => 'Call to Action',
    'handle' => 'call_to_action',
    'base_path' => base_path('vendor/studio1902/statamic-peak-commands/resources/blocks/call_to_action'),
    'operations' => [
        [
            'type' => 'copy',
            'input' => '_call_to_action.antlers.html',
            'output' => 'resources/views/page_builder/_call_to_action.antlers.html',
        ],
        [
            'type' => 'copy',
            'input' => 'call_to_action.yaml',
            'output' => 'resources/fieldsets/call_to_action.yaml',
        ],
        [
            'type' => 'update_page_builder',
            'block' => [
                'name' => 'Call to Action',
                'instructions' => 'Show a call to action.',
                'icon' => 'alert-alarm-bell',
                'handle' => 'call_to_action',
            ],
        ],
    ],
];

$installable = app(Installable::class, ['config' => $config]);

// Execute all operations in sequence
$result = $installable->install();

// The install method:
// 1. Resolves each operation type through the registry
// 2. Hydrates operation with installable context
// 3. Executes operation run() method
// 4. Returns updated installable for chaining

// Handles directory structures in handles:
// 'utilities/card' becomes handle='card' with filepath='utilities/'

```

--------------------------------

### Install Feature Preset using Peak CLI

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Installs a collection of pre-configured features, including globals, collections, components, and blueprints, from available presets. The command offers an interactive selection of presets, automating the setup of common site functionalities and granting necessary permissions.

```bash
php please peak:install:preset

# Interactive multi-select menu shows available presets:
# - Availability: A global and availability component.
# - Banner: A global and banner component.
# - Breadcrumbs: A navigation breadcrumb component.
# - Business hours: A global and business hours component.
# - Clients: A clients collection and component.
# - Events: A events collection and component.
# - Default blocks: Default block configuration.

# Select preset(s) to install (use Space to select)

# Example: Installing 'Availability' preset
# - Copies resources/blueprints/globals/availability.yaml
# - Copies content/globals/availability.yaml
# - Copies resources/views/components/_availability.antlers.html
# - Grants 'edit availability globals' permission to editor role

# Output:
# [✓] Peak preset 'Availability' installed.
# Make sure to add `{{ partial:components/availability }}` where you want to render the component.
# Add this to your `lang/locale/strings.php` file:
# 'availability' => 'available from :month',
```

--------------------------------

### Install Pre-made Page Builder Blocks using Peak CLI

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Installs one or more pre-defined page builder blocks into your Statamic site. The command presents an interactive menu to select blocks, then copies their Antlers templates and fieldsets to the appropriate locations and updates the page builder configuration.

```bash
php please peak:install:block

# Interactive multi-select menu shows available blocks:
# - Call to action: Show a call to action.
# - Cards: Show a collection of cards.
# - Collection: Show entries from a collection.
# - Columns: Two responsive columns with optional content blocks.
# - Divider: Add spacing between blocks with a visual line.
# - Full width image: Add a fullscreen image with a caption.
# - Image and text: Image and text combo with offset and overlap.
# - Images grid: A grid of images.
# - Text columns: Multi-column text content.

# Select one or more blocks (use Space to select)

# For each selected block:
# - Copies Antlers template to resources/views/page_builder/
# - Copies YAML fieldset to resources/fieldsets/
# - Updates page_builder.yaml with new block configuration

# Output:
# [✓] Peak page builder block 'Call to action' installed.
# [✓] Peak page builder block 'Cards' installed.
```

--------------------------------

### Perform File Copy and Templating with PHP Copy Operation

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Details the `Copy` operation for copying files, including templating using provided replacements. It shows how to configure the operation with input/output paths, skippable options, and custom replacements. The operation requires an `Installable` context for execution and provides default templating variables.

```php
<?php

use Studio1902\PeakCommands\Operations\Copy;
use Studio1902\PeakCommands\Models\Installable;

// Define copy operation config
$copyConfig = [
    'type' => 'copy',
    'input' => 'stubs/collection.yaml.stub',
    'output' => 'content/collections/{{ handle }}.yaml',
    'skippable' => false,  // If true, prompts to skip if file exists
    'replacements' => [
        '{{ collection_name }}' => 'Blog Posts',
        '{{ route }}' => '/blog/{slug}',
        '{{ layout }}' => 'layout',
        '{{ revisions }}' => 'true',
        '{{ dated }}' => 'true',
        '{{ mount }}' => 'blog-index',
    ],
];

// Create installable context
$installable = new Installable([
    'name' => 'Blog Posts',
    'handle' => 'blog_posts',
    'base_path' => base_path('vendor/studio1902/statamic-peak-commands/resources'),
    'operations' => [],
]);

// Execute copy operation
$operation = new Copy($copyConfig);
$operation->hydrate($installable);
$result = $operation->run();

// Default replacements available:
// {{ handle }} -> installable handle
// {{ filename }} -> installable handle
// {{ name }} -> installable name
// {{ singular_handle }} -> singular handle
// {{ singular_name }} -> singular name
// {{ filepath }} -> directory path if handle contains /
// {{ filepath_dotted }} -> directory path with dots
// {{ multisite_handle }} -> site handle if multisite enabled

// Output:
// Installed file: 'content/collections/blog_posts.yaml'.

```

--------------------------------

### Render Copyright Information

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet displays the copyright notice, including the starting year, the current year (if different), and the copyright name. It uses Statamic's configuration and date formatting capabilities.

```Statamic
© {{ configuration:copyright\_since }} {{ unless (now | format('Y')) == configuration:copyright\_since }} - {{ now | format('Y') }} {{ /unless }} {{ configuration:copyright\_name ?? config:app:name }}
```

--------------------------------

### Configure Custom Paths and Operation Namespaces - PHP

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

This PHP configuration snippet shows how to extend the Statamic Peak Commands addon by defining custom paths for blocks, presets, and sets, as well as custom namespaces for operations. This allows developers to organize their custom components and operations within their project. The example includes default paths and demonstrates how to add custom directories.

```php
<?php

// config/statamic-peak-commands.php (publish from vendor)
return [
    /**
     * Paths where the addon searches for blocks, presets, and sets.
     */
    'paths' => [
        'blocks' => [
            base_path('vendor/studio1902/statamic-peak-commands/resources/blocks'),
            base_path('app/Peak/Blocks'),  // Custom blocks
        ],
        'presets' => [
            base_path('vendor/studio1902/statamic-peak-commands/resources/presets'),
            base_path('app/Peak/Presets'),  // Custom presets
        ],
        'sets' => [
            base_path('vendor/studio1902/statamic-peak-commands/resources/sets'),
            base_path('app/Peak/Sets'),  // Custom sets
        ],
    ],

    /**
     * Namespaces where the addon searches for operations.
     */
    'namespaces' => [
        '\Studio1902\PeakCommands\Operations',
        '\App\Peak\Operations',  // Custom operations
    ],
];

// Custom block directory structure:
// app/Peak/Blocks/custom_hero/
//   ├── config.php
//   ├── _custom_hero.antlers.html
//   └── custom_hero.yaml

// app/Peak/Blocks/custom_hero/config.php
return [
    'handle' => 'custom_hero',
    'name' => 'Custom Hero',
    'description' => 'A custom hero block.',
    'operations' => [
        [
            'type' => 'copy',
            'input' => '_custom_hero.antlers.html',
            'output' => 'resources/views/page_builder/_custom_hero.antlers.html',
        ],
        [
            'type' => 'copy',
            'input' => 'custom_hero.yaml',
            'output' => 'resources/fieldsets/custom_hero.yaml',
        ],
        [
            'type' => 'update_page_builder',
            'block' => [
                'name' => 'Custom Hero',
                'instructions' => 'Custom hero implementation.',
                'icon' => 'content-writing',
                'handle' => 'custom_hero',
            ],
        ],
    ],
];

```

--------------------------------

### Display Copyright Information (Statamic)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/footer/resources/views/layout/_footer.antlers.html

This code snippet displays the website's copyright information. It dynamically includes the copyright year, starting from a configured year and extending to the current year if they differ. It also includes the copyright holder's name, falling back to the application name if not explicitly set. This ensures the copyright notice is always up-to-date. Dependencies include Statamic's `configuration` and `now` variables.

```statamic
© {{ configuration:copyright_since }} {{ unless (now | format('Y')) == configuration:copyright_since }} - {{ now | format('Y') }} {{ /unless }} {{ configuration:copyright_name ?? config:app:name }}
```

--------------------------------

### Register Page Builder Block with UpdatePageBuilder Operation - PHP

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

This snippet demonstrates how to register a new block to the Statamic page builder configuration using the UpdatePageBuilder operation. It involves defining the block's properties, creating an Installable context, and running the operation. Interactive prompts handle group selection for the new block. This process modifies the 'page_builder.yaml' fieldset.

```php
<?php

use Studio1902\PeakCommands\Operations\UpdatePageBuilder;
use Studio1902\PeakCommands\Models\Installable;

// Define update page builder operation
$updateConfig = [
    'type' => 'update_page_builder',
    'block' => [
        'name' => 'Hero Section',
        'instructions' => 'Display a hero section with title and CTA.',
        'icon' => 'content-image-landscape',
        'handle' => 'hero_section',
    ],
];

// Create installable context
$installable = new Installable([
    'name' => 'Hero Section',
    'handle' => 'hero_section',
    'base_path' => base_path('resources'),
    'operations' => [],
]);

// Execute operation
$operation = new UpdatePageBuilder($updateConfig);
$operation->hydrate($installable);
$result = $operation->run();

// Interactive prompts:
// 1. "Add to existing or new group?" -> Existing/New
// 2a. If existing: "Which group?" -> Select from existing groups
// 2b. If new: Prompts for group name, instructions, icon

// Modifies resources/fieldsets/page_builder.yaml:
// fields:
//   - field:
//       sets:
//         content_blocks:
//           display: Content Blocks
//           sets:
//             hero_section:
//               display: Hero Section
//               instructions: Display a hero section with title and CTA.
//               icon: content-image-landscape
//               fields:
//                 - import: hero_section

// Output:
// Installed page builder block: 'Hero Section'.

```

--------------------------------

### Fetch and Display Related Events (Twig)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/events/show.antlers.html

Fetches a limited number of upcoming events from a collection, sorted by start date in ascending order. It then iterates through the results to display a 'More Events' heading and individual event items using a specified partial component.

```twig
{{ collection:{{ handle }} sort="{{ singular_handle }}_date_start:asc" {{ singular_handle }}_date_end:is_after="{ today }" :id:isnt="id" limit="3" as="items" }}
  {{ unless no_results }}
    {{ partial:typography/h1 as="h2" content="{ trans:strings.{{ handle }}_more }" class="md:col-span-12" }}
    {{ items }}
      {{ partial:components/{{ handle }}_item class="md:col-span-4" }}
    {{ /items }}
  {{ /unless }}
{{ /collection:{{ handle }} }}
```

--------------------------------

### Clear Default Statamic Site Content

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

The `peak:clear-site` command removes all default content and configurations from a Statamic project. This includes assets, pages (except home and 404), navigation, global set data, and cached files. It's useful for starting a project with a clean slate.

```bash
php please peak:clear-site
```

--------------------------------

### Statamic Typography - Date and Time Display

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/components/_events_item.antlers.html

Partials for displaying date and time information. They allow for specific formatting and conditional rendering based on date ranges, supporting start and end times.

```Antlers
{{ partial:typography/time as="span" :content="{{ singular_handle }}_date_start" }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_start" format="h:mm" }} - {{ if { {{ singular_handle }}_date_start | iso_format('D MMMM') } !== { {{ singular_handle }}_date_end | iso_format('D MMMM') } }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_end" }} {{ /if }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_end" format="h:mm" }}
```

--------------------------------

### Manage Operation Paths and Namespaces with PHP Registry

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Illustrates how to configure paths for blocks, presets, and sets, as well as manage operation namespaces using the Registry facade. This is typically done within the `AppServiceProvider`'s `boot` method. It allows for customization of where the system looks for these resources.

```php
<?php

use Studio1902\PeakCommands\Facades\Registry;

// Add custom paths in AppServiceProvider boot method
public function boot(): void
{
    // Add custom blocks path
    Registry::addBlocksPath(base_path('app/Peak/Blocks'));

    // Add custom presets path
    Registry::addPresetsPath(base_path('app/Peak/Presets'));

    // Add custom sets path
    Registry::addSetsPath(base_path('app/Peak/Sets'));

    // Remove default paths if needed
    Registry::removeBlocksPath(base_path('vendor/studio1902/statamic-peak-commands/resources/blocks'));

    // Add custom operation namespace
    Registry::appendNamespace('\App\Peak\Operations');

    // Or prepend to prioritize custom operations
    Registry::prependNamespace('\App\Peak\Operations');
}

// Get all registered paths
$paths = Registry::getPaths();
// Returns:
// [
//     'blocks' => [...paths],
//     'presets' => [...paths],
//     'sets' => [...paths],
// ]

// Get registered operation namespaces
$namespaces = Registry::getNamespaces();
// Returns: ['\Studio1902\PeakCommands\Operations', ...]

// Resolve operation by type
$operation = Registry::resolveOperation('copy', [
    'input' => 'stub.html',
    'output' => 'resources/views/output.html',
]);
// Searches namespaces for '\Studio1902\PeakCommands\Operations\Copy'
// Returns instantiated operation ready to run

```

--------------------------------

### Render Introduction Prose Conditionally

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet renders introductory text using a 'prose' partial. It takes 'when' and 'content' parameters and is rendered only if the 'introduction' variable is truthy.

```Statamic
{{ partial:typography/prose :when="introduction" }}
 {{ introduction }}
{{ /partial:typography/prose }}
```

--------------------------------

### Collection Display with Filtering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/page_builder/_events.antlers.html

Fetches and displays items from a collection based on a dynamic handle. It sorts items by a start date in ascending order and filters for items ending after the current day. Limited to 3 items.

```statamic
{{ collection:{{ handle }} sort="{{ singular_handle }}_date_start:asc" {{ singular_handle }}_date_end:is_after="{ today | modify_date('+1 day') }" limit="3" as="items" }}
```

--------------------------------

### Create New Statamic Taxonomy

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Generate a new taxonomy with `peak:make:taxonomy`. This command sets up the taxonomy blueprint, handles content for the taxonomy itself, and optionally creates a listing page. It also attaches the taxonomy to specified collections and configures editor permissions. User input is required for the taxonomy's name, handle, collections, and listing page creation.

```bash
php please peak:make:taxonomy
```

--------------------------------

### Statamic Collection and Partial Rendering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/events/index.antlers.html

Shows how to define a content section, query a collection based on a handle, sort and filter items, and render partials for each item. Includes pagination.

```statamic
{{ section:index_content }}

{{ partial:typography/h1 as="h2" :content="title" class="md:col-span-12" }} {{ collection:{{ handle }} sort="{{ singular_handle }}_date_start:asc" {{ singular_handle }}_date_end:is_after="{ today }" paginate="true" limit="12" as="items" }}
  {{ unless no_results }}
    {{ items }}
      {{ partial:components/{{ handle }}_item class="md:col-span-4" }}
    {{ /items }}
  {{ else }}
    {{ trans:strings.no_results }}
  {{ /unless }}
  {{ partial:statamic-peak-tools::components/pagination class="md:col-span-12" }}
{{ /collection:{{ handle }} }}

{{ /section:index_content }}
```

--------------------------------

### Create Collection using Peak CLI

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Scaffolds a complete Statamic collection, including its content YAML file, blueprint, index and show templates, and automatically configures permissions for the editor role. It prompts for various collection settings such as name, handle, public/private status, dated entries, pagination, and revision enablement.

```bash
php please peak:make:collection

# Prompts for collection configuration:
# - Name: "Blog Posts"
# - Handle: "blog_posts"
# - Public/Private
# - Dated entries (yes/no)
# - Index page (yes/no)
# - Show page (yes/no)
# - Mount to page (optional)
# - Enable revisions (yes/no)

# Generated files:
# - content/collections/blog_posts.yaml
# - resources/blueprints/collections/blog_posts/blog_posts.yaml
# - resources/views/blog_posts/index.antlers.html
# - resources/views/blog_posts/show.antlers.html

# Automatically grants editor role permissions:
# - view, edit, create, delete, publish blog_posts entries
# - reorder entries
# - manage other authors' entries

# Output:
# [✓] Collection 'Blog Posts' created.
```

--------------------------------

### Render Site Footer Navigation (Statamic)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/footer/resources/views/layout/_footer.antlers.html

This snippet renders the site's footer navigation dynamically. It uses the `nav:footer` tag to fetch navigation items up to a specified depth and displays them as a list. It includes handling for external links with icons and provides fallbacks for when no navigation results are found. Dependencies include the Statamic templating engine and its `nav` tag.

```statamic
{{ nav:footer max_depth="2" select="title|url" }} {{ unless no_results }}
### {{ title }}
{{ children }}*   [{{ title }} {{ if url | is_external_url }} {{ trans:strings.external_link }} {{ svg:external attr:class="w-2 h-2 fill-current" attr:aria-hidden="true" attr:alt="" }} {{ /if }}]({{ url }})
{{ /children }}
{{ /unless }} {{ /nav:footer }}
```

--------------------------------

### Page Builder and Section Rendering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/vacancies/resources/views/vacancies/index.antlers.html

This snippet demonstrates the use of Statamic's page builder and section rendering capabilities. It allows for dynamic content loading based on defined types and scopes.

```statamic
{{ page_builder scope="block" }} {{ partial src="page_builder/{type}" }} {{ /page_builder }}

{{ section:index_content }}
```

--------------------------------

### Statamic Templating Directives

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/events/index.antlers.html

Demonstrates the use of Statamic templating directives for defining named sections, rendering partials, and managing page builder content.

```statamic
{{# @name {{ name }} index @desc The {{ name }} index template. #}}

{{ page_builder scope="block" }} {{ partial src="page_builder/{type}" }} {{ /page_builder }}
```

--------------------------------

### Render Legal Navigation (Statamic)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/footer/resources/views/layout/_footer.antlers.html

This snippet renders the legal navigation links in the footer. It uses the `nav:legal` tag to fetch legal links up to a specified depth and displays them as a list. It includes a check to ensure results are found before rendering the list. Dependencies include the Statamic templating engine and its `nav` tag.

```statamic
{{ nav:legal max_depth="1" select="title|url" }} {{ unless no_results }}
*   [{{ title }}]({{ url }})
{{ /unless }}
{{ /nav:legal }}
```

--------------------------------

### Statamic Peak Commands Page Builder Block

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/clients/resources/views/page_builder/_clients.antlers.html

This snippet defines a Statamic page builder block. It includes logic for rendering a title using a partial, dynamically fetching content from a collection based on a handle, and displaying a list of clients with associated logos and website links.

```statamic
{{# @name {{ name }} @desc The {{ name }} page builder block. @set page.page_builder.{{ handle }} #}}
{{ partial:page_builder/block }}

{{ block:title ?= { partial:typography/h2 :content="block:title" class="col-span-2 md:col-span-10" } }}
{{ {{ handle }} = block:{{ handle }} ? block:{{ handle }} : { collection:{{ handle }} sort="order" } }}

{{ trans:strings.clients_sr }}: {{ {{ handle }} | pluck('title') | sentence_list }}.

{{ {{ handle }} }} [{{ partial:statamic-peak-tools::components/picture :image="logo" class="grayscale group-focus-visible:grayscale-0 group-hover:grayscale-0 motion-safe:transition" }}]({{ website }})
{{ /{{ handle }} }}

{{ /partial:page_builder/block }}
```

--------------------------------

### Create Reusable Antlers Partial Template

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Use `peak:make:partial` to generate a new Antlers partial file. This command facilitates the creation of reusable template components. It prompts for the partial's name, handle, and an optional subdirectory for organization. The generated file is placed in `resources/views` and can be included using the `partial:` tag.

```bash
php please peak:make:partial
```

--------------------------------

### Include Live Preview Snippet

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet embeds a partial for live preview functionality, allowing users to see changes in real-time, commonly used in content management systems.

```Statamic
{{ partial:statamic-peak-tools::snippets/live\_preview }}
```

--------------------------------

### Render Section Headings and Content

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet iterates through sections, rendering an H2 heading and introductory prose for each. It uses 'when' and 'content' parameters for the heading and introduction.

```Statamic
{{ sections }}

{{ partial:typography/h2 :when="heading" :content="heading" }}
 {{ partial:typography/prose :when="introduction" }}
  {{ introduction }}
 {{ /partial:typography/prose }}

{{ /sections }}
```

--------------------------------

### Define and Render Page Builder Block

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/team_members/resources/views/page_builder/_team_members.antlers.html

This snippet demonstrates how to define a page builder block in Statamic using the Peak Commands syntax. It shows how to set block attributes, render partials for text and images, and conditionally load data from collections.

```statamic
{{# @name {{ name }} @desc The {{ name }} page builder block. @set page.page\_builder.{{ handle }} #}} {{ partial:page\_builder/block class="gap-y-8" }}
{{ if block:title or block:text }}

{{ block:title ?= { partial:typography/h2 :content="block:title" } }} {{ block:text ?= { partial:typography/p :content="block:text" } }}

{{ /if }}

{{ {{ handle }} = block:{{ handle }} ? block:{{ handle }} : { collection:{{ handle }} sort="order" } }} {{ {{ handle }} scope="{{ singular\_handle }}" }}

{{ partial src="statamic-peak-tools::components/picture" :image="{{ singular\_handle }}:image:url" aspect\_ratio="4/3" sizes="(min-width: 1280px) 430px, (min-width: 768px) 33vw, 90vw" cover="true" lazy="true" }}

{{ {{ singular\_handle }}:function }} {{ {{ singular\_handle }}:title }}

{{ /{{ handle }} }}

{{ /partial:page\_builder/block }}
```

--------------------------------

### Create Statamic Fieldset for Bard Fields

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

The `peak:make:set` command creates a reusable fieldset, often used for Bard field types. It generates a YAML file in `resources/fieldsets` and prompts for the set's name, handle, and an icon. This fieldset can then be imported into Bard fields for consistent content structures.

```bash
php please peak:make:set
```

--------------------------------

### Displaying Paginated Collections with Partials

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/vacancies/resources/views/vacancies/index.antlers.html

This snippet iterates through a collection, displays items using specific partials, and includes pagination. It supports conditional display based on whether results exist and handles pagination UI.

```statamic
{{ collection:{{ handle }} sort="date:desc" paginate="true" limit="12" as="items" expires:is_after="{today}" }}
  {{ unless no_results }}
    {{ items }}
      {{ partial:components/{{ handle }}_item class="md:col-span-6" }}
    {{ /items }}
  {{ else }}
    {{ trans:strings.no_results }}
  {{ /unless }}
  {{ partial:statamic-peak-tools::components/pagination class="md:col-span-12" }}
{{ /collection:{{ handle }} }}
```

--------------------------------

### Render CSS and JS with Vite

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet uses Vite to manage the rendering of CSS and JavaScript assets for the site. It takes a pipe-separated string of file paths as input.

```Statamic
{{ vite src="resources/css/site.css|resources/js/site.js" }}
```

--------------------------------

### Create Page Builder Block using Peak CLI

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

Generates a new page builder block, including its Antlers template, fieldset YAML, and automatic registration within the page builder configuration. It prompts for the block's name, handle, and icon. This command streamlines the process of adding reusable components to Statamic's page builder.

```bash
php please peak:make:block

# The command will prompt you for:
# - Block name (e.g., "Hero Section")
# - Block handle (e.g., "hero_section")
# - Block icon (from available Statamic icons)

# Generated files:
# - resources/views/page_builder/_hero_section.antlers.html
# - resources/fieldsets/hero_section.yaml
# - Updates resources/fieldsets/page_builder.yaml

# Output:
# [✓] Peak page builder block 'Hero Section' added.
```

--------------------------------

### Create New Statamic Navigation Structure

Source: https://context7.com/studio1902/statamic-peak-commands/llms.txt

The `peak:make:nav` command assists in creating a new navigation structure for Statamic. It generates the navigation tree file and sets up permissions for editors. The command prompts for the navigation's name, handle, maximum depth, and which collections to include.

```bash
php please peak:make:nav
```

--------------------------------

### Displaying Collection Items with Partials

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/news/resources/views/page_builder/_news.antlers.html

This code segment fetches items from a collection, sorts them by date in descending order, and limits the results to three. It then iterates over these items, rendering a specific partial for each item based on its handle. If no results are found, it displays a localized 'no results' message.

```statamic
{{ collection:{{ handle }} sort="date:desc" limit="3" as="items" }}
  {{ unless no_results }}
    {{ items }}
      {{ partial:components/{{ handle }}_item class="md:col-span-4" }}
    {{ /items }}
  {{ else }}
    {{ trans:strings.no_results }}
  {{ /if }}
{{ /collection:{{ handle }} }}
```

--------------------------------

### Linking to URLs with Dynamic Text and Styling

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/vacancies/resources/views/components/_vacancies_item.antlers.html

Creates a link to a URL using Antlers templating. The link text is dynamically generated from localized strings and variables, and the link itself is styled with specific classes for visual presentation.

```antlers
({{ partial:typography/h3 content="{ title } - { hours } { trans:strings.{{ handle }}_hours }" class="mb-4 underline decoration-primary decoration-2 underline-offset-2 group-hover:text-primary motion-safe:transition-colors" }})({{ url }})
```

--------------------------------

### Image and Text Page Builder Block - Statamic

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/blocks/image_and_text/_image_and_text.antlers.html

This snippet shows the Statamic templating code for the 'Image and text' page builder block. It demonstrates how to include text content, typography, buttons, and an image using partials. The `partial:statamic-peak-tools::components/picture` is used for image rendering with cover and sizes attributes.

```statamic
{{# @name Image and text @desc The Image and text page builder block. @set page.page\_builder.image\_and\_text #}} {{ partial:page\_builder/block class="gap-y-8 items-center grid-flow-col" }}

{{ block:title ?= { partial:typography/h2 :content="block:title" } }} {{ partial:typography/prose }} {{ block:text }} {{ /partial:typography/prose }} {{ partial:components/buttons }}

{{ partial:statamic-peak-tools::components/picture :image="block:image" cover="true" sizes="(min-width: 1280px) 640px, (min-width: 768px) 50vw, 90vw" }}

{{ /partial:page\_builder/block }}
```

--------------------------------

### Render Main Desktop Navigation (Statamic)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/mega_menu/resources/views/navigation/_main_desktop.antlers.html

This Statamic tag renders the main desktop navigation. It supports a maximum depth of 3 levels and selects specific fields for display (title, url, description, action_link). It uses AlpineJS for interactive dropdowns when there are child items. If no results are found, it displays nothing.

```statamic
{{ nav:main max_depth="3" select="title|url|description|action_link" }}
{{ unless no_results }}
*   [{{ title }} {{ if children }}
    
    {{ svg:chevron_down attr:class="w-2 ml-1 overflow-visible stroke-current" attr:aria-hidden="true" }}
    
    {{ /if }}](#)
    {{ if children }}
    {{ children }}
    
    {{ title }}
    -----------
    
    {{ _total = children | count }}
    
    {{ children }}
    
    [
    
    ### {{ title }}
    
    {{ description }}
    
    ]({{ url }})
    
    {{ /children }}
    
    {{ if next }}
    
    {{ /if }}
    
    {{ /children }}
{{ /unless }}
{{ /nav:main }}
```

--------------------------------

### Render Responsive Image Grid with Statamic

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/blocks/images_grid/_images_grid.antlers.html

This snippet demonstrates how to render a responsive image grid using Statamic's templating engine. It leverages the 'picture' partial to handle image display, with dynamic 'sizes' and 'aspect_ratio' attributes based on the total number of results. Lazy loading is enabled by default.

```statamic
{{ partial src="statamic-peak-tools::components/picture" :image="url" sizes=" { switch( (total_results == 1) => '(min-width: 1280px) 1150px, 90vw', (total_results == 2) => '(min-width: 1280px) 640px, (min-width: 768px) 50vw, 90vw', (total_results == 3) => '(min-width: 1280px) 430px, (min-width: 768px) 33vw, 90vw', )} " aspect_ratio="{ total_results > 1 ?= 'large:4/3' }" cover="{ total_results == 1 ? false : true }" lazy="true" }}
```

--------------------------------

### Include SEO Snippet

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet includes a partial for SEO-related functionalities, likely for managing meta tags and other SEO best practices within the Statamic templates.

```Statamic
{{ partial:statamic-peak-seo::snippets/seo }}
```

--------------------------------

### Statamic Typography - Heading and Paragraph Display

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/components/_events_item.antlers.html

Partials for rendering headings and paragraphs with custom styling. The heading partial supports links and hover effects, while the paragraph partial displays teaser text.

```Antlers
[{{ partial:typography/h3 :content="title" class="underline decoration-primary decoration-2 underline-offset-2 group-hover:text-primary motion-safe:transition-colors" }}]({{ url }}) {{ partial:typography/p :content="teaser" }}
```

--------------------------------

### Display Event Details and Navigation (Twig)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/events/show.antlers.html

Renders various components for displaying event details, including headings, images, dates, times, locations, and organizer information. It also includes conditional logic for displaying online or offline event details and a button for sign-ups.

```twig
{{ partial:typography/h1 :content="title" class="mt-4 text-center" }}

{{ partial:statamic-peak-tools::components/picture :image="image" sizes="(min-width: 1280px) 1150px, (min-width: 768px) 90vw" aspect_ratio="3/1" lazy="true" cover="true" class="aspect-[3/1]" }}

{{ partial:typography/h3 content="{trans:strings.{{ handle }}_when}" }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_start" }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_start" format="h:mm" }} - {{ if { {{ singular_handle }}_date_start | iso_format('D MMMM') } !== { {{ singular_handle }}_date_end | iso_format('D MMMM') } }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_end" }} {{ /if }} {{ partial:typography/time as="span" :content="{{ singular_handle }}_date_end" format="h:mm" }} {{ partial:typography/h3 content="{trans:strings.{{ handle }}_where}" }}

{{ if {{ singular_handle }}_type.value === 'offline' }} {{ location_name }}  
{{ location_address }}  
{{ location_locality }} {{ else }} [Online]({{ {{ singular_handle }}_url }}) {{ /if }}

{{ partial:typography/h3 content="{trans:strings.{{ handle }}_organizer}" }}

[{{ organizer_name }}]({{ organizer_url }})

{{ if sign_up_label }} {{ partial:typography/h3 content="{trans:strings.{{ handle }}_tickets}" }}

{{ partial:components/button :label="sign_up_label" :link_type="sign_up_link_type" :target_blank="sign_up_target_blank" :entry="sign_up_entry" :url="sign_up_url" :email="sign_up_email" :tel="sign_up_tel" :asset="sign_up_asset" :button_type="sign_up_button_type" :attr_title="sign_up_attr_title" :attr_aria="sign_up_attr_aria" }}

{{ /if }}

{{ page_builder scope="block" }} {{ partial src="page_builder/{type}" }} {{ /page_builder }}
```

--------------------------------

### Statamic Picture Partial for Responsive Images

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/components/_events_item.antlers.html

This partial displays an image with responsive sizes and aspect ratio settings. It supports lazy loading and cover effects, with options for custom CSS classes.

```Antlers
{{ partial:statamic-peak-tools::components/picture :image="image" sizes="(min-width: 1280px) 430px, (min-width: 768px) 30vw, 90vw" aspect_ratio="3/2" lazy="true" cover="true" class="aspect-[3/2]" }}
```

--------------------------------

### Dynamic Button Rendering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/page_builder/_events.antlers.html

Renders a button with a label, type, link type, and URL. The label is translated based on a string key, and the URL is dynamically generated using the 'mount_url' tag.

```statamic
{{ partial:components/button label="{trans:strings.{{ handle }}_all}" button_type="inline" link_type="url" url="{mount_url:{{ handle }}}" }}
```

--------------------------------

### Statamic Partial for Paragraph Component

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/news/resources/views/components/_news_item.antlers.html

Renders a paragraph using the 'typography/p' partial, intended for displaying teaser text. It accepts a 'content' parameter for the text to be displayed.

```antlers
{{ partial:typography/p :content="teaser" }}
```

--------------------------------

### Include Browser Appearance Snippet

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet integrates a partial responsible for browser appearance settings, potentially controlling how the site is displayed or behaves in different browsers.

```Statamic
{{ partial:statamic-peak-browser-appearance::snippets/browser\_appearance }}
```

--------------------------------

### Include Toolbar Component

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/links/resources/views/links.antlers.html

This snippet includes a toolbar component, likely providing administrative or user-facing tools within the interface. It's part of the Statamic Peak Tools collection.

```Statamic
{{ partial:statamic-peak-tools::components/toolbar }}
```

--------------------------------

### Rendering an Image Component with Picture Partial

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/vacancies/resources/views/components/_vacancies_item.antlers.html

Utilizes the 'picture' partial from the 'statamic-peak-tools' addon to render an image. It supports responsive image sizes, aspect ratio, lazy loading, and cover effects, providing flexibility for image display.

```antlers
{{ partial:statamic-peak-tools::components/picture :image="image" sizes="(min-width: 1280px) 430px, (min-width: 768px) 30vw, 90vw" aspect_ratio="3/2" lazy="true" cover="true" }}
```

--------------------------------

### Render Lottie Animation with Alpine.js and Lottie Player

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/lottie_player/resources/views/components/_animation.antlers.html

This component renders a Lottie animation using Alpine.js for interactivity and the Lottie player library. It supports autoplay, looping, and automatically pauses animations when the user prefers reduced motion. The animation path and loop count are configurable.

```html
<{{ as or 'figure' }} x-data="{ animation: '' , reducedMotion: false }" x-init=" reducedMotion = window.matchMedia(`(prefers-reduced-motion: reduce)`) === true || window.matchMedia(`(prefers-reduced-motion: reduce)`).matches === true, animation = lottie.loadAnimation({ container: $root, autoplay: false, loop: {{ loop ?? '1' }}, renderer: 'svg', path: '{{ animation }}' }) " x-intersect:enter="!reducedMotion && animation.play()" x-intersect:leave.treshold.1="animation.stop()" class="{{ class }}" aria-hidden="true" >
```

--------------------------------

### Statamic Page Builder Template

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/news/resources/views/news/index.antlers.html

Renders content blocks defined by the page builder. It iterates through different block types and renders corresponding partials.

```antlers
{{ page_builder scope="block" }} {{ partial src="page_builder/{type}" }} {{ /page_builder }}
```

--------------------------------

### Render Social Media Links (Statamic)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/footer/resources/views/layout/_footer.antlers.html

This snippet renders social media links for the website footer. It checks if social media data is available and then iterates through each social media item. For each item, it displays an SVG icon based on the social media type and a link to the corresponding profile. Dependencies include the Statamic templating engine and its `social_media` tag.

```statamic
{{ if social_media:social_media }} {{ social_media:social_media }} [{{ svg :src="type" class="w-4 h-4 md:w-3 md:h-3 overflow-visible fill-current" alt="" aria-hidden="true" }}]({{ prefix }}{{ handle }}) {{ /social_media:social_media }} {{ /if }}
```

--------------------------------

### Statamic Page Builder Block

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/testimonials/resources/views/page_builder/_testimonials.antlers.html

A Statamic tag to render a page builder block. It supports custom classes, headings, and dynamic content rendering based on a handle. It can fetch data from collections randomly or use a predefined structure. Dependencies include Statamic's partial system and potentially custom tools.

```statamic-tag
{{# @name {{ name }} @desc The {{ name }} page builder block. @set page.page\_builder.{{ handle }} #}} {{ partial:page\_builder/block class="gap-y-8" }}
{{ if block:heading }}
  {{ partial:typography/h2 :content="block:heading" }}
{{ /if }}
{{ {{ handle }} = block:{{ handle }} ? block:{{ handle }} : { collection:{{ handle }} sort="random" limit="3" } }}

{{ {{ handle }} }}*   > {{ testimonial | widont | nl2br }}
    
    {{ if image }}
    
    {{ partial:statamic-peak-tools::components/picture :image="image" sizes="44px" aspect\_ratio="1/1" lazy="true" cover="true" }}
    
    {{ /if }}
    {{ author }}
    {{ if function || company }}
      {{ function }}
      {{ company ?= ', '}}
      {{ company }}
    {{ /if }}
    
{{ /{{ handle }} }}

{{ /partial:page\_builder/block }}
```

--------------------------------

### Page Builder Block Definition and Usage

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/news/resources/views/page_builder/_news.antlers.html

This snippet defines and utilizes a page builder block within Statamic. It demonstrates how to set block properties like name and description, and how to render a partial for block content. It also conditionally renders an H1 tag based on a title variable.

```statamic
{{# @name {{ name }} @desc The {{ name }} page builder block. @set page.page_builder.{{ handle }} #}}
{{ partial:page_builder/block }}

{{ title ?= { partial:typography/h1 as="h2" :content="title" class="md:col-span-12" } }}
```

--------------------------------

### Statamic Collection Index Rendering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/news/resources/views/news/index.antlers.html

Fetches and displays items from a collection with pagination. It iterates through the collection items and renders a specific partial for each item, along with pagination controls.

```antlers
{{ collection:{{ handle }} sort="date:desc" paginate="true" limit="12" as="items" }}
  {{ unless no_results }}
    {{ items }}
      {{ partial:components/{{ handle }}_item class="md:col-span-4" }}
    {{ /items }}
  {{ else }}
    {{ trans:strings.no_results }}
  {{ /unless }}
  {{ partial:statamic-peak-tools::components/pagination class="md:col-span-12" }}
{{ /collection:{{ handle }} }}
```

--------------------------------

### Statamic Tiers Block Rendering

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/pricing/resources/views/page_builder/_tiers.antlers.html

This snippet shows the Statamic templating code for rendering the Tiers block. It handles conditional display of pricing (fixed vs. custom), titles, details, and benefit lists based on variables like 'pricing', 'price', 'custom', and 'benefits_title'. It also includes partials for buttons and typography.

```statamic
{{# @name Tiers @desc The Tiers page builder block. @set page.page_builder.tiers #}}
{{ partial:page_builder/block }}

{{ block:tiers }}

{{ title }}
-----------

{{ if pricing === 'fixed' }} €{{ price ?? custom }} {{ else }} {{ custom }} {{ /if }}

{{ detail }} {{ partial:components/buttons }} {{ if benefits_title }}

### {{ benefits_title }}

{{ /if }} {{ partial:typography/prose :if="benefits" class="stack-space-2 prose-sm" }} {{ if benefits }}

{{ benefits }}
*   {{ benefit }}
    
{{ /benefits }}

{{ /if }} {{ /partial:typography/prose }}

{{ /block:tiers }}

{{ /partial:page_builder/block }}
```

--------------------------------

### Render Full Width Image Block (Statamic/Antlers)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/blocks/full_width_image/_full_width_image.antlers.html

This snippet demonstrates how to render the 'Full width image' page builder block using Statamic's Antlers templating language. It utilizes a partial to display an image with specified aspect ratios, cover settings, lazy loading, and responsive sizes. Conditional logic is included for displaying a title, text, and buttons.

```Antlers
{{# @name Full width image @desc The Full width image page builder block. @set page.page\_builder.full\_width\_image #}}
{{ partial:page\_builder/block class="min-h-\[14rem\]" }}

{{ partial:statamic-peak-tools::components/picture :image="block:image" aspect\_ratio="2/1 large:3/1" cover="true" lazy="true" sizes="100vw" }}

{{ if block:title || block:text || block:buttons }}

{{ /if }}

{{ title ?= { partial:typography/h2 :content="block:title" color="text-white" class="text-center" } }} {{ text ?= { partial:typography/p :content="block:text" color="text-white" class="text-center" } }} {{ partial:components/buttons inverted="true" class="justify-center" }}

{{ /partial:page\_builder/block }}
```

--------------------------------

### Image Credits Block Rendering (Statamic Antlers)

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/image_credits/resources/views/page_builder/_image_credits.antlers.html

This snippet demonstrates how to render the Image Credits block. It checks for the presence of a title or text, displays them using heading and paragraph partials, and then iterates through assets to display images with copyright information.

```antlers
{{# @name Image credits @desc The Image credits page builder block. @set page.page\_builder.image\_credits #}}
{{ partial:page\_builder/block }}
  {{ if block:title || block:text }}
    {{ block:title ?= { partial:typography/h2 :content="block:title" } }}
    {{ block:text ?= { partial:typography/p :content="block:text" } }}
  {{ /if }}

  {{ assets container="images" as="images" }}
    {{ images where (copyright.name !== null) orderby (copyright.name 'asc') }}
      {{ partial:statamic-peak-tools::components/picture :image="url" sizes="(min-width: 1280px) 1280px, (min-width: 768px) 20vw, 50vw" aspect\_ratio="1/1" cover="true" }}

      {{ if copyright:url }}
        {{ partial:components/button :label="copyright:name" button\_type="inline" link\_type="url" :url="copyright:url" target\_blank="true" }}
      {{ else }}
        {{ copyright:name }}
      {{ /if }}
    {{ /images }}
  {{ /assets }}
{{ /partial:page\_builder/block }}
```

--------------------------------

### Displaying Page Builder Blocks

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/page_builder/_events.antlers.html

Renders a page builder block using a partial. This tag is typically used to include predefined content sections on a page.

```statamic
{{ partial:page_builder/block }}
```

--------------------------------

### Rendering Collection Items

Source: https://github.com/studio1902/statamic-peak-commands/blob/main/resources/presets/events/resources/views/page_builder/_events.antlers.html

Iterates through a collection of 'items' and renders a specific partial for each item, applying CSS classes. If no items are found, it displays a 'no results' message.

```statamic
{{ unless no_results }}
  {{ items }}
    {{ partial:components/{{ handle }}_item class="md:col-span-4" }}
  {{ /items }}
{{ else }}
  {{ trans:strings.no_results }}
{{ /unless }}
```
Tokens:
Raw