Skip to content

Commit a4f1830

Browse files
ManukMinasyanManukMinasyan
committed
Card attribute colors, icons
1 parent 75ef0e2 commit a4f1830

File tree

7 files changed

+6642
-35
lines changed

7 files changed

+6642
-35
lines changed

‎resources/dist/flowforge.css‎

Lines changed: 6482 additions & 1 deletion
Large diffs are not rendered by default.

‎resources/dist/flowforge.js‎

Lines changed: 64 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/views/livewire/card-badge.blade.php‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,14 @@
11
@props(['label', 'value', 'color' => 'gray', 'icon' => null])
22

3-
<div class="inline-flex items-center rounded-full bg-{{ $color }}-100 dark:bg-{{ $color }}-900 px-2 py-1 text-xs font-medium text-{{ $color }}-700 dark:text-{{ $color }}-300 ring-1 ring-inset ring-{{ $color }}-400/20 dark:ring-{{ $color }}-800/50">
3+
<div
4+
class="inline-flex items-center rounded-md px-2 py-0.5 text-xs font-medium border group kanban-color-{{ $color }} transition-colors duration-150">
45
@if($icon)
5-
<x-dynamic-component :component="$icon" class="w-3 h-3 mr-1" />
6+
<x-dynamic-component :component="$icon"
7+
class="w-3 h-3 mr-1 text-{{ $color }}-500 dark:text-{{ $color }}-400 group-hover:text-{{ $color }}-600 dark:group-hover:text-{{ $color }}-300"/>
68
@endif
7-
<span>{{ $label }}: {{ $value }}</span>
9+
10+
@if($label)
11+
<span class="font-medium text-{{ $color }}-600 dark:text-{{ $color }}-300 mr-0.5 ">{{ $label }}:</span>
12+
@endif
13+
<span class="text-{{ $color }}-800 dark:text-{{ $color }}-200">{{ $value }}</span>
814
</div>

‎resources/views/livewire/card.blade.php‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,14 +20,14 @@
2020
@endif
2121

2222
@if(!empty($record['attributes']))
23-
<div class="mt-2 flex flex-wrap gap-2">
23+
<div class="mt-3 flex flex-wrap gap-1.5">
2424
@foreach($record['attributes'] as $attribute => $label)
2525
@if(isset($record['attributes'][$attribute]) && !empty($record['attributes'][$attribute]['value']))
2626
<x-flowforge::card-badge
2727
:label="$record['attributes'][$attribute]['label']"
2828
:value="$record['attributes'][$attribute]['value']"
29-
:color="$config->cardAttributeColors[$attribute] ?? 'gray'"
30-
:icon="$config->cardAttributeIcons[$attribute] ?? null"
29+
:color="$record['attributes'][$attribute]['color']"
30+
:icon="$record['attributes'][$attribute]['icon']"
3131
/>
3232
@endif
3333
@endforeach

‎src/Concerns/CardFormattingTrait.php‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,9 @@ protected function formatCardForDisplay(Model $model): array
2222
{
2323
$titleField = $this->config->getTitleField();
2424
$descriptionField = $this->config->getDescriptionField();
25-
$cardAttributes = $this->config->getcardAttributes();
25+
$cardAttributes = $this->config->getCardAttributes();
26+
$cardAttributeColors = $this->config->getCardAttributeColors();
27+
$cardAttributeIcons = $this->config->getCardAttributeIcons();
2628
$columnField = $this->config->getColumnField();
2729

2830
$card = [
@@ -40,6 +42,8 @@ protected function formatCardForDisplay(Model $model): array
4042
$card['attributes'][$field] = [
4143
'label' => is_string($key) ? $label : $field,
4244
'value' => data_get($model, $field),
45+
'color' => $cardAttributeColors[$field] ?? null,
46+
'icon' => $cardAttributeIcons[$field] ?? null,
4347
];
4448
}
4549

‎src/Config/KanbanConfig.php‎

Lines changed: 55 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -30,16 +30,20 @@
3030
final readonly class KanbanConfig implements Wireable
3131
{
3232
public function __construct(
33-
private string $columnField = 'status',
34-
private array $columnValues = [],
35-
private array | bool | null $columnColors = null,
36-
private string $titleField = 'title',
37-
private ?string $descriptionField = null,
38-
private array $cardAttributes = [],
39-
private ?string $orderField = null,
40-
private ?string $cardLabel = null,
41-
private ?string $pluralCardLabel = null,
42-
) {}
33+
private string $columnField = 'status',
34+
private array $columnValues = [],
35+
private array|bool|null $columnColors = null,
36+
private string $titleField = 'title',
37+
private ?string $descriptionField = null,
38+
private array $cardAttributes = [],
39+
private ?array $cardAttributeColors = [],
40+
private ?array $cardAttributeIcons = [],
41+
private ?string $orderField = null,
42+
private ?string $cardLabel = null,
43+
private ?string $pluralCardLabel = null,
44+
)
45+
{
46+
}
4347

4448
/**
4549
* Get the field that stores the column value.
@@ -66,7 +70,7 @@ public function getColumnValues(): array
6670
*
6771
* @return array|bool|null Map of column values to color codes, or null if not set
6872
*/
69-
public function getColumnColors(): array | bool | null
73+
public function getColumnColors(): array|bool|null
7074
{
7175
return $this->columnColors;
7276
}
@@ -101,6 +105,26 @@ public function getCardAttributes(): array
101105
return $this->cardAttributes;
102106
}
103107

108+
/**
109+
* Get the colors for card attributes.
110+
*
111+
* @return array<string, string> Map of attribute names to color codes
112+
*/
113+
public function getCardAttributeColors(): array
114+
{
115+
return $this->cardAttributeColors ?? [];
116+
}
117+
118+
/**
119+
* Get the icons for card attributes.
120+
*
121+
* @return array<string, string> Map of attribute names to icon names
122+
*/
123+
public function getCardAttributeIcons(): array
124+
{
125+
return $this->cardAttributeIcons ?? [];
126+
}
127+
104128
/**
105129
* Get the field used for maintaining card order.
106130
*
@@ -130,8 +154,8 @@ public function getPluralCardLabel(): string
130154
/**
131155
* Get the default form schema for creating cards.
132156
*
133-
* @param string $titleField The field name used for card titles
134-
* @param string|null $descriptionField Optional field name for card descriptions
157+
* @param string $titleField The field name used for card titles
158+
* @param string|null $descriptionField Optional field name for card descriptions
135159
* @return array<Component> The default form schema
136160
*/
137161
public static function getDefaultCreateFormSchema(string $titleField, ?string $descriptionField): array
@@ -154,18 +178,19 @@ public static function getDefaultCreateFormSchema(string $titleField, ?string $d
154178
/**
155179
* Get the default form schema for editing cards.
156180
*
157-
* @param string $titleField The field name used for card titles
158-
* @param string|null $descriptionField Optional field name for card descriptions
159-
* @param string $columnField The field name that determines which column a card belongs to
160-
* @param array<string, string> $columnValues Available column values with their labels
181+
* @param string $titleField The field name used for card titles
182+
* @param string|null $descriptionField Optional field name for card descriptions
183+
* @param string $columnField The field name that determines which column a card belongs to
184+
* @param array<string, string> $columnValues Available column values with their labels
161185
* @return array<Component> The default form schema
162186
*/
163187
public static function getDefaultEditFormSchema(
164-
string $titleField,
188+
string $titleField,
165189
?string $descriptionField,
166-
string $columnField,
167-
array $columnValues
168-
): array {
190+
string $columnField,
191+
array $columnValues
192+
): array
193+
{
169194
$schema = [
170195
TextInput::make($titleField)
171196
->required()
@@ -192,21 +217,21 @@ public static function getDefaultEditFormSchema(
192217
* For example, `withColumnField('status')` will create a new configuration
193218
* with the columnField property set to 'status'.
194219
*
195-
* @param string $method The method name
196-
* @param array $arguments The method arguments
220+
* @param string $method The method name
221+
* @param array $arguments The method arguments
197222
* @return self A new instance with the updated property
198223
*
199224
* @throws \BadMethodCallException If the method is not a valid with* method or targets a non-existent property
200225
*/
201226
public function __call(string $method, array $arguments): self
202227
{
203-
if (! Str::startsWith($method, 'with')) {
228+
if (!Str::startsWith($method, 'with')) {
204229
throw new \BadMethodCallException("Method {$method} not found");
205230
}
206231

207232
$property = lcfirst(Str::after($method, 'with'));
208233

209-
if (! property_exists($this, $property)) {
234+
if (!property_exists($this, $property)) {
210235
throw new \BadMethodCallException("Property {$property} not found");
211236
}
212237

@@ -216,7 +241,7 @@ public function __call(string $method, array $arguments): self
216241
/**
217242
* Create a new configuration with the specified properties updated.
218243
*
219-
* @param array<string, mixed> $properties The properties to update
244+
* @param array<string, mixed> $properties The properties to update
220245
* @return self A new instance with the updated properties
221246
*/
222247
public function with(array $properties): self
@@ -239,6 +264,8 @@ public function toLivewire(): array
239264
'titleField' => $this->titleField,
240265
'descriptionField' => $this->descriptionField,
241266
'cardAttributes' => $this->cardAttributes,
267+
'cardAttributeColors' => $this->cardAttributeColors,
268+
'cardAttributeIcons' => $this->cardAttributeIcons,
242269
'orderField' => $this->orderField,
243270
'cardLabel' => $this->cardLabel,
244271
'pluralCardLabel' => $this->pluralCardLabel,
@@ -254,6 +281,8 @@ public static function fromLivewire($value): KanbanConfig
254281
$value['titleField'],
255282
$value['descriptionField'],
256283
$value['cardAttributes'],
284+
$value['cardAttributeColors'],
285+
$value['cardAttributeIcons'],
257286
$value['orderField'],
258287
$value['cardLabel'],
259288
$value['pluralCardLabel']

‎src/Filament/Pages/KanbanBoardPage.php‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,30 @@ public function cardAttributes(array $attributes): static
8888
return $this;
8989
}
9090

91+
/**
92+
* Set the colors for the card attributes.
93+
*
94+
* @param array<string, string> $colors
95+
*/
96+
public function cardAttributeColors(array $colors): static
97+
{
98+
$this->config = $this->config->withCardAttributeColors($colors);
99+
100+
return $this;
101+
}
102+
103+
/**
104+
* Set the icons for the card attributes.
105+
*
106+
* @param array<string, string> $icons
107+
*/
108+
public function cardAttributeIcons(array $icons): static
109+
{
110+
$this->config = $this->config->withCardAttributeIcons($icons);
111+
112+
return $this;
113+
}
114+
91115
/**
92116
* Set the column colors for the Kanban board.
93117
*

0 commit comments

Comments
 (0)