Skip to content

Commit 0c3c77e

Browse files
committed
update icons and allow custom icons
1 parent 5d2a98b commit 0c3c77e

File tree

1 file changed

+21
-329
lines changed

1 file changed

+21
-329
lines changed
Lines changed: 21 additions & 329 deletions
Original file line numberDiff line numberDiff line change
@@ -1,338 +1,30 @@
11
@php
2-
use Filament\Support\Enums\Alignment;
3-
use Filament\Support\Enums\FontFamily;
4-
use Filament\Support\Enums\FontWeight;
5-
use Filament\Support\Enums\IconPosition;
6-
use Filament\Tables\Columns\TextColumn\TextColumnSize;
7-
8-
$alignment = $getAlignment();
9-
$canWrap = $canWrap();
10-
$descriptionAbove = $getDescriptionAbove();
11-
$descriptionBelow = $getDescriptionBelow();
12-
$iconPosition = $getIconPosition();
13-
$isBadge = true;
14-
$isBulleted = $isBulleted();
15-
$isListWithLineBreaks = $isListWithLineBreaks();
16-
$isLimitedListExpandable = $isLimitedListExpandable();
17-
$url = $getUrl();
18-
19-
if (! $alignment instanceof Alignment) {
20-
$alignment = filled($alignment) ? (Alignment::tryFrom($alignment) ?? $alignment) : null;
21-
}
22-
23-
$arrayState = $getState();
24-
25-
if ($arrayState instanceof \Illuminate\Support\Collection) {
26-
$arrayState = $arrayState->all();
27-
}
28-
29-
$listLimit = 1;
30-
31-
if (is_array($arrayState)) {
32-
if ($listLimit = $getListLimit()) {
33-
$limitedArrayStateCount = (count($arrayState) > $listLimit) ? (count($arrayState) - $listLimit) : 0;
34-
35-
if (! $isListWithLineBreaks) {
36-
$arrayState = array_slice($arrayState, 0, $listLimit);
37-
}
38-
}
39-
40-
$listLimit ??= count($arrayState);
41-
42-
if ((! $isListWithLineBreaks) && (! $isBadge)) {
43-
$arrayState = implode(
44-
', ',
45-
array_map(
46-
fn ($value) => $value instanceof \Filament\Support\Contracts\HasLabel ? $value->getLabel() : $value,
47-
$arrayState,
48-
),
49-
);
50-
}
51-
}
52-
53-
$arrayState = \Illuminate\Support\Arr::wrap($arrayState);
54-
if(count($arrayState)){
55-
$type = \TomatoPHP\FilamentTypes\Models\Type::where('key', $arrayState[0])->first();
56-
if($type){
57-
$arrayState[0] = $type->name;
58-
59-
$hex = $type->color;
60-
list($r, $g, $b) = sscanf($hex, "#%02x%02x%02x");
61-
$colorRGB= array($r, $g, $b);
62-
}
63-
else {
64-
$arrayState[0] = $arrayState[0];
65-
$colorRGB = [0,0,0];
66-
}
2+
$type = \TomatoPHP\FilamentTypes\Models\Type::where('key', $getState())->first();
3+
if($type){
4+
$value = $type->name;
5+
$hex = $type->color;
6+
$icon = $type->icon;
7+
list($r, $g, $b) = sscanf($hex, "#%02x%02x%02x");
8+
$colorRGB= array($r, $g, $b);
679
}
6810
else {
69-
$arrayState[0] = trans('filament-types::messages.empty');
11+
$value = $getState();
7012
$colorRGB = [0,0,0];
13+
$icon = null;
7114
}
72-
73-
7415
@endphp
75-
76-
<div
77-
{{
78-
$attributes
79-
->merge($getExtraAttributes(), escape: false)
80-
->class([
81-
'fi-ta-text grid w-full gap-y-1',
82-
'px-3 py-4' => ! $isInline(),
83-
])
84-
}}
85-
>
86-
@if (count($arrayState))
87-
@if (filled($descriptionAbove))
88-
<p
89-
@class([
90-
'text-sm text-gray-500 dark:text-gray-400',
91-
'whitespace-normal' => $canWrap,
92-
])
93-
>
94-
{{ $descriptionAbove }}
95-
</p>
96-
@endif
97-
98-
<{{ $isListWithLineBreaks ? 'ul' : 'div' }}
99-
@class([
100-
'flex' => ! $isBulleted,
101-
'flex-col' => (! $isBulleted) && $isListWithLineBreaks,
102-
'list-inside list-disc' => $isBulleted,
103-
'gap-1.5' => $isBadge,
104-
'flex-wrap' => $isBadge && (! $isListWithLineBreaks),
105-
'whitespace-normal' => $canWrap,
106-
match ($alignment) {
107-
Alignment::Start => 'text-start',
108-
Alignment::Center => 'text-center',
109-
Alignment::End => 'text-end',
110-
Alignment::Left => 'text-left',
111-
Alignment::Right => 'text-right',
112-
Alignment::Justify, Alignment::Between => 'text-justify',
113-
default => $alignment,
114-
},
115-
match ($alignment) {
116-
Alignment::Start, Alignment::Left => 'justify-start',
117-
Alignment::Center => 'justify-center',
118-
Alignment::End, Alignment::Right => 'justify-end',
119-
Alignment::Between, Alignment::Justify => 'justify-between',
120-
default => null,
121-
} => $isBulleted || (! $isListWithLineBreaks),
122-
match ($alignment) {
123-
Alignment::Start, Alignment::Left => 'items-start',
124-
Alignment::Center => 'items-center',
125-
Alignment::End, Alignment::Right => 'items-end',
126-
Alignment::Between, Alignment::Justify => 'items-stretch',
127-
default => null,
128-
} => $isListWithLineBreaks && (! $isBulleted),
129-
])
130-
@if ($isListWithLineBreaks && $isLimitedListExpandable)
131-
x-data="{ isLimited: true }"
16+
<span style="{{ implode([
17+
"background-color: rgba(".$colorRGB[0].", ".$colorRGB[1].", ".$colorRGB[2].", 0.2);",
18+
"color: rgba(".$colorRGB[0].", ".$colorRGB[1].", ".$colorRGB[2].", 1);"
19+
]) }}" class="fi-badge flex items-center justify-center gap-x-1 rounded-md text-xs font-medium ring-1 ring-inset px-2 min-w-[theme(spacing.6)] py-1 fi-color-custom bg-custom-50 text-custom-600 ring-custom-600/10 dark:bg-custom-400/10 dark:text-custom-400 dark:ring-custom-400/30 fi-color-primary">
20+
21+
@if($icon)
22+
<div>
23+
<x-filament-icon :icon="$icon" size="h-4 w-4" />
24+
</div>
13225
@endif
133-
>
134-
@foreach ($arrayState as $state)
135-
@if (filled($formattedState = $formatState($state)) &&
136-
(! ($isListWithLineBreaks && (! $isLimitedListExpandable) && ($loop->iteration > $listLimit))))
137-
@php
138-
$color = $type->color ?? null;
139-
$copyableState = $getCopyableState($state) ?? $state;
140-
$copyMessage = $getCopyMessage($state);
141-
$copyMessageDuration = $getCopyMessageDuration($state);
142-
$fontFamily = $getFontFamily($state);
143-
$icon = $type->icon ?? null;
144-
$iconColor = $getIconColor($state) ?? $color;
145-
$itemIsCopyable = $isCopyable($state);
146-
$lineClamp = $getLineClamp($state);
147-
$size = $getSize($state);
148-
$weight = $getWeight($state);
149-
150-
$iconClasses = \Illuminate\Support\Arr::toCssClasses([
151-
'fi-ta-text-item-icon h-5 w-5',
152-
match ($iconColor) {
153-
'gray', null => 'text-gray-400 dark:text-gray-500',
154-
default => 'text-custom-500',
155-
},
156-
]);
157-
158-
$iconStyles = \Illuminate\Support\Arr::toCssStyles([
159-
\Filament\Support\get_color_css_variables(
160-
$iconColor,
161-
shades: [500],
162-
alias: 'tables::columns.text-column.item.icon',
163-
) => $iconColor !== 'gray',
164-
]);
165-
@endphp
166-
167-
<{{ $isListWithLineBreaks ? 'li' : 'div' }}
168-
@if ($itemIsCopyable)
169-
x-on:click="
170-
window.navigator.clipboard.writeText(@js($copyableState))
171-
$tooltip(@js($copyMessage), {
172-
theme: $store.theme,
173-
timeout: @js($copyMessageDuration),
174-
})
175-
"
176-
@endif
177-
@if ($isListWithLineBreaks && ($loop->iteration > $listLimit))
178-
x-cloak
179-
x-show="! isLimited"
180-
x-transition
181-
@endif
182-
@class([
183-
'flex' => ! $isBulleted,
184-
'max-w-max' => ! ($isBulleted || $isBadge),
185-
'w-max' => $isBadge,
186-
'cursor-pointer' => $itemIsCopyable,
187-
match ($color) {
188-
null => 'text-gray-950 dark:text-white',
189-
'gray' => 'text-gray-500 dark:text-gray-400',
190-
default => 'text-custom-600 dark:text-custom-400',
191-
} => $isBulleted,
192-
])
193-
@style([
194-
\Filament\Support\get_color_css_variables(
195-
$color,
196-
shades: [400, 600],
197-
alias: 'tables::columns.text-column.item.container',
198-
) => $isBulleted && (! in_array($color, [null, 'gray'])),
199-
])
200-
>
201-
@if ($isBadge)
202-
<x-filament::badge
203-
style="
204-
background-color: rgba({{$colorRGB[0]}}, {{$colorRGB[1]}}, {{$colorRGB[2]}}, 0.2);
205-
color: rgba({{$colorRGB[0]}}, {{$colorRGB[1]}}, {{$colorRGB[2]}}, 1);
206-
"
207-
:color="$color"
208-
:icon="$icon"
209-
:icon-position="$iconPosition"
210-
>
211-
{{ $formattedState }}
212-
</x-filament::badge>
213-
@else
214-
<div
215-
@class([
216-
'fi-ta-text-item inline-flex items-center gap-1.5',
217-
'group/item' => $url,
218-
match ($color) {
219-
null, 'gray' => null,
220-
default => 'fi-color-custom',
221-
},
222-
is_string($color) ? "fi-color-{$color}" : null,
223-
])
224-
>
225-
@if ($icon && in_array($iconPosition, [IconPosition::Before, 'before']))
226-
<x-filament::icon
227-
:icon="$icon"
228-
:class="$iconClasses"
229-
:style="$iconStyles"
230-
/>
231-
@endif
23226

233-
<span
234-
@class([
235-
'fi-ta-text-item-label',
236-
'group-hover/item:underline group-focus-visible/item:underline' => $url,
237-
'line-clamp-[--line-clamp]' => $lineClamp,
238-
match ($size) {
239-
TextColumnSize::ExtraSmall, 'xs' => 'text-xs',
240-
TextColumnSize::Small, 'sm', null => 'text-sm leading-6',
241-
TextColumnSize::Medium, 'base', 'md' => 'text-base',
242-
TextColumnSize::Large, 'lg' => 'text-lg',
243-
default => $size,
244-
},
245-
match ($color) {
246-
null => 'text-gray-950 dark:text-white',
247-
'gray' => 'text-gray-500 dark:text-gray-400',
248-
default => 'text-custom-600 dark:text-custom-400',
249-
},
250-
match ($weight) {
251-
FontWeight::Thin, 'thin' => 'font-thin',
252-
FontWeight::ExtraLight, 'extralight' => 'font-extralight',
253-
FontWeight::Light, 'light' => 'font-light',
254-
FontWeight::Medium, 'medium' => 'font-medium',
255-
FontWeight::SemiBold, 'semibold' => 'font-semibold',
256-
FontWeight::Bold, 'bold' => 'font-bold',
257-
FontWeight::ExtraBold, 'extrabold' => 'font-extrabold',
258-
FontWeight::Black, 'black' => 'font-black',
259-
default => $weight,
260-
},
261-
match ($fontFamily) {
262-
FontFamily::Sans, 'sans' => 'font-sans',
263-
FontFamily::Serif, 'serif' => 'font-serif',
264-
FontFamily::Mono, 'mono' => 'font-mono',
265-
default => $fontFamily,
266-
},
267-
])
268-
@style([
269-
\Filament\Support\get_color_css_variables(
270-
$color,
271-
shades: [400, 600],
272-
alias: 'tables::columns.text-column.item.label',
273-
) => ! in_array($color, [null, 'gray']),
274-
"--line-clamp: {$lineClamp}" => $lineClamp,
275-
])
276-
>
277-
{{ $formattedState }}
278-
</span>
279-
280-
@if ($icon && in_array($iconPosition, [IconPosition::After, 'after']))
281-
<x-filament::icon
282-
:icon="$icon"
283-
:class="$iconClasses"
284-
:style="$iconStyles"
285-
/>
286-
@endif
287-
</div>
288-
@endif
289-
</{{ $isListWithLineBreaks ? 'li' : 'div' }}>
290-
@endif
291-
@endforeach
292-
293-
@if ($limitedArrayStateCount ?? 0)
294-
<{{ $isListWithLineBreaks ? 'li' : 'div' }}>
295-
@if ($isLimitedListExpandable)
296-
<x-filament::link
297-
color="gray"
298-
tag="button"
299-
x-on:click.prevent="isLimited = false"
300-
x-show="isLimited"
301-
>
302-
{{ trans_choice('filament-tables::table.columns.text.actions.expand_list', $limitedArrayStateCount) }}
303-
</x-filament::link>
304-
305-
<x-filament::link
306-
color="gray"
307-
tag="button"
308-
x-cloak
309-
x-on:click.prevent="isLimited = true"
310-
x-show="! isLimited"
311-
>
312-
{{ trans_choice('filament-tables::table.columns.text.actions.collapse_list', $limitedArrayStateCount) }}
313-
</x-filament::link>
314-
@else
315-
<span class="text-sm text-gray-500 dark:text-gray-400">
316-
{{ trans_choice('filament-tables::table.columns.text.more_list_items', $limitedArrayStateCount) }}
317-
</span>
318-
@endif
319-
</{{ $isListWithLineBreaks ? 'li' : 'div' }}>
320-
@endif
321-
</{{ $isListWithLineBreaks ? 'ul' : 'div' }}>
322-
323-
@if (filled($descriptionBelow))
324-
<p
325-
@class([
326-
'text-sm text-gray-500 dark:text-gray-400',
327-
'whitespace-normal' => $canWrap,
328-
])
329-
>
330-
{{ $descriptionBelow }}
331-
</p>
332-
@endif
333-
@elseif (($placeholder = $getPlaceholder()) !== null)
334-
<x-filament-tables::columns.placeholder>
335-
{{ $placeholder }}
336-
</x-filament-tables::columns.placeholder>
337-
@endif
27+
<div>
28+
{{ $value }}
33829
</div>
30+
</span>

0 commit comments

Comments
 (0)