Skip to content

Commit

Permalink
Merge pull request #5480 from filamentphp/feature/extract-block-picker
Browse files Browse the repository at this point in the history
  • Loading branch information
@danharrin
danharrin committed Jan 16, 2023
1 parent f638d38 commit cad9f0f
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 33 deletions.
46 changes: 24 additions & 22 deletions resources/views/components/builder.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,13 +94,18 @@ class="space-y-12"
])
>
@if ((! $isItemMovementDisabled) || $hasBlockLabels || (! $isItemDeletionDisabled) || $isCollapsible || $isCloneable)
<header @class([
'flex items-center h-10 overflow-hidden border-b bg-gray-50 rounded-t-xl',
'dark:bg-gray-800 dark:border-gray-700' => config('forms.dark_mode'),
])>
<header
@if ($isCollapsible) x-on:click.stop="isCollapsed = ! isCollapsed" @endif
@class([
'flex items-center h-10 overflow-hidden border-b bg-gray-50 rounded-t-xl',
'dark:bg-gray-800 dark:border-gray-700' => config('forms.dark_mode'),
'cursor-pointer' => $isCollapsible,
])
>
@unless ($isItemMovementDisabled)
<button
title="{{ __('forms::components.builder.buttons.move_item.label') }}"
x-on:click.stop
wire:sortable.handle
wire:keydown.prevent.arrow-up="dispatchFormEvent('builder::moveItemUp', '{{ $getStatePath() }}', '{{ $uuid }}')"
wire:keydown.prevent.arrow-down="dispatchFormEvent('builder::moveItemDown', '{{ $getStatePath() }}', '{{ $uuid }}')"
Expand Down Expand Up @@ -151,7 +156,7 @@ class="space-y-12"
<li>
<button
title="{{ __('forms::components.builder.buttons.clone_item.label') }}"
wire:click="dispatchFormEvent('builder::cloneItem', '{{ $getStatePath() }}', '{{ $uuid }}')"
wire:click.stop="dispatchFormEvent('builder::cloneItem', '{{ $getStatePath() }}', '{{ $uuid }}')"
type="button"
@class([
'flex items-center justify-center flex-none w-10 h-10 text-gray-400 transition hover:text-gray-500',
Expand All @@ -171,7 +176,7 @@ class="space-y-12"
<li>
<button
title="{{ __('forms::components.builder.buttons.delete_item.label') }}"
wire:click="dispatchFormEvent('builder::deleteItem', '{{ $getStatePath() }}', '{{ $uuid }}')"
wire:click.stop="dispatchFormEvent('builder::deleteItem', '{{ $getStatePath() }}', '{{ $uuid }}')"
type="button"
@class([
'flex items-center justify-center flex-none w-10 h-10 text-danger-600 transition hover:text-danger-500',
Expand All @@ -191,7 +196,7 @@ class="space-y-12"
<li>
<button
x-bind:title="(! isCollapsed) ? '{{ __('forms::components.builder.buttons.collapse_item.label') }}' : '{{ __('forms::components.builder.buttons.expand_item.label') }}'"
x-on:click="isCollapsed = ! isCollapsed"
x-on:click.stop="isCollapsed = ! isCollapsed"
type="button"
class="flex items-center justify-center flex-none w-10 h-10 text-gray-400 transition hover:text-gray-500"
>
Expand Down Expand Up @@ -227,20 +232,18 @@ class="flex items-center justify-center flex-none w-10 h-10 text-gray-400 transi
x-transition
class="absolute inset-x-0 bottom-0 flex items-center justify-center h-12 -mb-12"
>
<x-forms::dropdown>
<x-forms::builder.block-picker
:blocks="$getBlocks()"
:create-after-item="$uuid"
:state-path="$getStatePath()"
>
<x-slot name="trigger">
<x-forms::icon-button
:label="$getCreateItemBetweenButtonLabel()"
icon="heroicon-o-plus"
/>
</x-slot>

<x-forms::builder.block-picker
:blocks="$getBlocks()"
:create-after-item="$uuid"
:state-path="$getStatePath()"
/>
</x-forms::dropdown>
</x-forms::builder.block-picker>
</div>
@endif
</li>
Expand All @@ -249,18 +252,17 @@ class="absolute inset-x-0 bottom-0 flex items-center justify-center h-12 -mb-12"
@endif

@if (! $isItemCreationDisabled)
<x-forms::dropdown class="flex justify-center">
<x-forms::builder.block-picker
:blocks="$getBlocks()"
:state-path="$getStatePath()"
class="flex justify-center"
>
<x-slot name="trigger">
<x-forms::button size="sm">
{{ $getCreateItemButtonLabel() }}
</x-forms::button>
</x-slot>

<x-forms::builder.block-picker
:blocks="$getBlocks()"
:state-path="$getStatePath()"
/>
</x-forms::dropdown>
</x-forms::builder.block-picker>
@endif
</div>
</x-dynamic-component>
29 changes: 18 additions & 11 deletions resources/views/components/builder/block-picker.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,23 @@
'blocks',
'createAfterItem' => null,
'statePath',
'trigger',
])

<x-forms::dropdown.list {{ $attributes->class(['filament-forms-builder-component-block-picker']) }}>
@foreach ($blocks as $block)
<x-forms::dropdown.list.item
:wire:click="'dispatchFormEvent(\'builder::createItem\', \'' . $statePath . '\', \'' . $block->getName() . '\'' . ($createAfterItem ? ', \'' . $createAfterItem . '\'' : '') . ')'"
:icon="$block->getIcon()"
x-on:click="close"
>
{{ $block->getLabel() }}
</x-forms::dropdown.list.item>
@endforeach
</x-forms::dropdown.list>
<x-forms::dropdown {{ $attributes->class(['filament-forms-builder-component-block-picker']) }}>
<x-slot name="trigger">
{{ $trigger }}
</x-slot>

<x-forms::dropdown.list>
@foreach ($blocks as $block)
<x-forms::dropdown.list.item
:wire:click="'dispatchFormEvent(\'builder::createItem\', \'' . $statePath . '\', \'' . $block->getName() . '\'' . ($createAfterItem ? ', \'' . $createAfterItem . '\'' : '') . ')'"
:icon="$block->getIcon()"
x-on:click="close"
>
{{ $block->getLabel() }}
</x-forms::dropdown.list.item>
@endforeach
</x-forms::dropdown.list>
</x-forms::dropdown>

0 comments on commit cad9f0f

Please sign in to comment.