Constants
1 day ago
Accordion.php
1 day ago
Alert.php
1 day ago
AttachmentCard.php
1 day ago
Avatar.php
1 day ago
Badge.php
1 day ago
BaseComponent.php
1 day ago
Button.php
1 day ago
ConfirmationModal.php
1 day ago
CourseFilter.php
1 day ago
DateFilter.php
1 day ago
DropdownFilter.php
1 day ago
EmptyState.php
1 day ago
FileUploader.php
1 day ago
InputField.php
1 day ago
Modal.php
1 day ago
Nav.php
1 day ago
Pagination.php
1 day ago
Popover.php
1 day ago
PreviewTrigger.php
1 day ago
Progress.php
1 day ago
SearchFilter.php
1 day ago
Sorting.php
1 day ago
StarRating.php
1 day ago
StarRatingInput.php
1 day ago
StatusSelect.php
1 day ago
SvgIcon.php
1 day ago
Table.php
1 day ago
Tabs.php
1 day ago
Tooltip.php
1 day ago
WPEditor.php
1 day ago
EmptyState.php
185 lines
| 1 | <?php |
| 2 | /** |
| 3 | * EmptyState Component Class. |
| 4 | * |
| 5 | * Responsible for rendering an empty state |
| 6 | * with an icon, title, and subtitle. |
| 7 | * |
| 8 | * @package Tutor\Components |
| 9 | * @author Themeum |
| 10 | * @link https://themeum.com |
| 11 | * @since 4.0.0 |
| 12 | */ |
| 13 | |
| 14 | namespace Tutor\Components; |
| 15 | |
| 16 | defined( 'ABSPATH' ) || exit; |
| 17 | |
| 18 | /** |
| 19 | * Class EmptyState |
| 20 | * |
| 21 | * Example Usage: |
| 22 | * ``` |
| 23 | * EmptyState::make() |
| 24 | * ->title( 'No Data' ) |
| 25 | * ->subtitle( 'Please check back later.' ) |
| 26 | * ->icon_path( 'path/to/icon.png' ) |
| 27 | * ->render(); |
| 28 | * ``` |
| 29 | * |
| 30 | * @since 4.0.0 |
| 31 | */ |
| 32 | class EmptyState extends BaseComponent { |
| 33 | |
| 34 | /** |
| 35 | * Title of the empty state |
| 36 | * |
| 37 | * @var string |
| 38 | */ |
| 39 | protected $title; |
| 40 | |
| 41 | /** |
| 42 | * Subtitle of the empty state |
| 43 | * |
| 44 | * @var string |
| 45 | */ |
| 46 | protected $subtitle; |
| 47 | |
| 48 | /** |
| 49 | * Icon markup |
| 50 | * |
| 51 | * @var string |
| 52 | */ |
| 53 | protected $icon; |
| 54 | |
| 55 | /** |
| 56 | * Icon path (URL) |
| 57 | * |
| 58 | * @var string |
| 59 | */ |
| 60 | protected $icon_path; |
| 61 | |
| 62 | /** |
| 63 | * Set title |
| 64 | * |
| 65 | * @param string $title title. |
| 66 | * |
| 67 | * @return self |
| 68 | */ |
| 69 | public function title( string $title ): self { |
| 70 | $this->title = $title; |
| 71 | return $this; |
| 72 | } |
| 73 | |
| 74 | /** |
| 75 | * Set subtitle |
| 76 | * |
| 77 | * @param string $subtitle subtitle. |
| 78 | * |
| 79 | * @return self |
| 80 | */ |
| 81 | public function subtitle( string $subtitle ): self { |
| 82 | $this->subtitle = $subtitle; |
| 83 | return $this; |
| 84 | } |
| 85 | |
| 86 | /** |
| 87 | * Set icon |
| 88 | * |
| 89 | * @param string $icon icon markup. |
| 90 | * |
| 91 | * @return self |
| 92 | */ |
| 93 | public function icon( string $icon ): self { |
| 94 | $this->icon = $icon; |
| 95 | return $this; |
| 96 | } |
| 97 | |
| 98 | /** |
| 99 | * Set icon path |
| 100 | * |
| 101 | * @param string $icon_path icon path (URL). |
| 102 | * |
| 103 | * @return self |
| 104 | */ |
| 105 | public function icon_path( string $icon_path ): self { |
| 106 | $this->icon_path = $icon_path; |
| 107 | return $this; |
| 108 | } |
| 109 | |
| 110 | /** |
| 111 | * Get default icon |
| 112 | * |
| 113 | * @return string |
| 114 | */ |
| 115 | protected function get_default_icon(): string { |
| 116 | return '<svg width="89" height="86" viewBox="0 0 89 86" fill="none" xmlns="http://www.w3.org/2000/svg"> |
| 117 | <path d="M50.8334 48.816C51.5258 49.1741 52.2514 49.4829 53.0087 49.7371C62.2001 52.824 72.5341 46.7433 76.0896 36.1556C79.6451 25.5679 75.0761 14.4821 65.8842 11.3955C63.1648 10.4822 60.3456 10.3717 57.6315 10.9426C55.0115 7.08849 51.3044 4.1083 46.7526 2.57982C35.0997 -1.33339 22.1186 5.67704 16.895 18.3554C10.2225 17.854 3.88275 21.7159 1.73297 28.1177C-0.827724 35.7433 3.5265 44.0843 11.4582 46.7479C14.6647 47.8246 17.9652 47.8078 20.9285 46.9027C23.3301 49.5662 26.353 51.6257 29.8842 52.8113" stroke="#E9E9E9" stroke-width="1.1786" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="2.36 2.36"/> |
| 118 | <path d="M60.1349 16.6914H32.6205C28.538 16.6914 25.2285 20.0009 25.2285 24.0833V60.2217C25.2285 64.3041 28.538 67.6136 32.6205 67.6136H60.1349C64.2173 67.6136 67.5268 64.3041 67.5268 60.2217V24.0833C67.5268 20.0009 64.2173 16.6914 60.1349 16.6914Z" fill="#E1E1E1"/> |
| 119 | <path d="M55.4506 66.3964L43.5171 83.4595C42.7192 84.5999 41.148 84.8779 40.0076 84.0804C38.8672 83.2825 38.5892 81.7113 39.3867 80.5709L51.3201 63.5078L55.4506 66.3964Z" fill="white" stroke="#9197A8" stroke-width="1.1786"/> |
| 120 | <path d="M49.7585 66.5389C54.7039 71.4843 62.7219 71.4843 67.6673 66.5389C72.6127 61.5936 72.6126 53.5755 67.6673 48.6302C62.7219 43.6848 54.7039 43.6848 49.7585 48.6302C44.8131 53.5755 44.8131 61.5936 49.7585 66.5389Z" fill="white" stroke="#9197A8" stroke-width="1.1786"/> |
| 121 | <path d="M50.3555 54.3836C51.0051 52.7155 52.3423 51.1135 54.2075 49.9789C56.0727 48.8446 58.1104 48.3945 59.8907 48.5855" stroke="#C3C6CB" stroke-linecap="round"/> |
| 122 | <rect x="31.9365" y="23.9062" width="26.8984" height="1.2" rx="0.6" fill="white"/> |
| 123 | <rect x="31.9365" y="26.5547" width="15.0088" height="1.2" rx="0.6" fill="white"/> |
| 124 | <rect x="47.7988" y="26.5547" width="8.68164" height="1.2" rx="0.6" fill="white"/> |
| 125 | <rect x="31.9365" y="34.7227" width="26.8984" height="1.2" rx="0.6" fill="white"/> |
| 126 | <rect x="31.9365" y="38.4766" width="15.0088" height="1.2" rx="0.6" fill="white"/> |
| 127 | </svg>'; |
| 128 | } |
| 129 | |
| 130 | /** |
| 131 | * Get component content |
| 132 | * |
| 133 | * @return string |
| 134 | */ |
| 135 | public function get(): string { |
| 136 | $title = $this->title ?? __( 'No Data Found.', 'tutor' ); |
| 137 | $subtitle = $this->subtitle; |
| 138 | |
| 139 | // Fallback to global empty state subtitle if not provided. |
| 140 | if ( empty( $subtitle ) ) { |
| 141 | $subtitle = tutor_utils()->get_list_empty_state_subtitle(); |
| 142 | } |
| 143 | |
| 144 | $icon = $this->icon; |
| 145 | |
| 146 | if ( ! empty( $this->icon_path ) ) { |
| 147 | $icon = '<img src="' . esc_url( $this->icon_path ) . '" alt="' . esc_attr( $title ) . '">'; |
| 148 | } |
| 149 | |
| 150 | if ( empty( $icon ) ) { |
| 151 | $icon = $this->get_default_icon(); |
| 152 | } |
| 153 | |
| 154 | $subtitle_html = ''; |
| 155 | if ( ! empty( $subtitle ) ) { |
| 156 | $subtitle_html = sprintf( |
| 157 | '<div class="tutor-tiny tutor-text-subdued tutor-mt-2 tutor-mb-0">%s</div>', |
| 158 | esc_html( $subtitle ) |
| 159 | ); |
| 160 | } |
| 161 | |
| 162 | // Merge custom classes. |
| 163 | $wrapper_classes = 'tutor-px-9 tutor-py-10 tutor-flex-center-col'; |
| 164 | if ( ! empty( $this->attributes['class'] ) ) { |
| 165 | $wrapper_classes .= ' ' . $this->attributes['class']; |
| 166 | unset( $this->attributes['class'] ); |
| 167 | } |
| 168 | $this->attributes['class'] = $wrapper_classes; |
| 169 | |
| 170 | $this->component_string = sprintf( |
| 171 | '<div %s> |
| 172 | %s |
| 173 | <div class="tutor-small tutor-text-subdued tutor-mt-4">%s</div> |
| 174 | %s |
| 175 | </div>', |
| 176 | $this->get_attributes_string(), |
| 177 | $icon, |
| 178 | esc_html( $title ), |
| 179 | $subtitle_html |
| 180 | ); |
| 181 | |
| 182 | return $this->component_string; |
| 183 | } |
| 184 | } |
| 185 |