book cases added

resources/views/vendor/comments/components/avatar.blade.php

@@ -0,0 +1,15 @@
+@php
+    $defaultImage = Spatie\Comments\Support\Config::getGravatarDefaultImage();
+    $defaultAvatar = "https://www.gravatar.com/avatar/unknown?d={$defaultImage}";
+
+    if ($user = auth()->user()) {
+        $segment = md5(strtolower($user->email));
+        $defaultAvatar = "https://www.gravatar.com/avatar/{$segment}?d={$defaultImage}";
+    }
+@endphp
+
+<img
+    class="comments-avatar"
+    src="{{ isset($comment) &&  $comment->commentatorProperties() ? $comment->commentatorProperties()->avatar : $defaultAvatar }}"
+    alt="avatar"
+>

resources/views/vendor/comments/components/button.blade.php

@@ -0,0 +1,12 @@
+<button
+    type="{{ isset($submit) && $submit ? 'submit' : 'button' }}"
+    @class([
+        'comments-button',
+        'is-small' => isset($small) && $small,
+        'is-danger' => isset($danger) && $danger,
+        'is-link' => isset($link) && $link,
+    ])
+    {{ $attributes->except('type', 'size', 'submit') }}
+>
+    {{ $slot }}
+</button>

resources/views/vendor/comments/components/date.blade.php

@@ -0,0 +1,7 @@
+<time datetime="$date->format('Y-m-d H:i:s')" class="comments-date">
+    @if($date->diffInMinutes() < 1)
+        {{ __('comments::comments.just_now') }}
+    @else
+        {{ $date->diffForHumans() }}
+    @endif
+</time>

resources/views/vendor/comments/components/editors/easymde.blade.php

@@ -0,0 +1,104 @@
+<div
+    x-data="compose({ text: @entangle($model), autofocus: @json($autofocus ?? false) })"
+    x-init="
+        $wire.on('comment', clear);
+        @isset($comment)
+            $wire.on('reply-{{ $comment->id }}', () => {
+                clear();
+            });
+        @endisset
+    "
+>
+    <div wire:ignore>
+        <textarea placeholder="{{ $placeholder ?? '' }}"></textarea>
+    </div>
+    
+    <div class="comments-form-editor-tip">
+        You can use <a href="https://spatie.be/markdown" target="_blank" rel="nofollow noopener noreferrer">Markdown</a>
+    </div>
+</div>
+
+@push('comments-scripts')
+    <script>
+        document.addEventListener("alpine:init", () => {
+            window.Alpine.data("compose", ({ text, autofocus = false } = {}) => {
+                // Store the editor as a non-reactive instance property
+                let editor;
+
+                return {
+                    text,
+
+                    init() {
+                        if (editor) {
+                            return;
+                        }
+
+                        const textarea = this.$el.querySelector("textarea");
+
+                        if (!textarea) {
+                            return;
+                        }
+
+                        this.loadEasyMDE().then(() => {
+                            editor = new window.EasyMDE({
+                                element: textarea,
+                                hideIcons: [
+                                    "heading",
+                                    "image",
+                                    "preview",
+                                    "side-by-side",
+                                    "fullscreen",
+                                    "guide",
+                                ],
+                                spellChecker: false,
+                                status: false,
+                                insertTexts: {
+                                    link: ["[",  "](https://)"],
+                                },
+                            });
+
+                            editor.value(this.text);
+
+                            if (autofocus) {
+                                editor.codemirror.focus();
+                                editor.codemirror.setCursor(editor.codemirror.lineCount(), 0);
+                            }
+
+                            editor.codemirror.on("change", () => {
+                                this.text = editor.value();
+                            });
+                        });
+                    },
+
+                    clear() {
+                        editor.value("");
+                    },
+
+                    loadEasyMDE() {
+                        if (window.EasyMDE) {
+                            return Promise.resolve();
+                        }
+
+                        const loadScript = new Promise((resolve) => {
+                            const script = document.createElement("script");
+                            script.src = "https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js";
+                            script.addEventListener("load", resolve);
+                            document.getElementsByTagName("head")[0].appendChild(script);
+                        });
+
+                        const loadCss = new Promise((resolve) => {
+                            const link = document.createElement("link");
+                            link.type = "text/css";
+                            link.rel = "stylesheet";
+                            link.href = "https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.css";
+                            link.addEventListener("load", resolve);
+                            document.getElementsByTagName("head")[0].appendChild(link);
+                        });
+
+                        return Promise.all([loadScript, loadCss]);
+                    },
+                };
+            });
+        });
+    </script>
+@endpush

resources/views/vendor/comments/components/editors/textarea.blade.php

@@ -0,0 +1 @@
+<textarea wire:model.lazy="{{ $model }}" @isset($autofocus) autofocus @endisset class="comments-textarea"></textarea>

resources/views/vendor/comments/components/icons/close.blade.php

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="comments-icon"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>

resources/views/vendor/comments/components/icons/copy.blade.php

@@ -0,0 +1 @@
+<svg role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="comments-icon"><path stroke-width="0" d="M433.941 65.941l-51.882-51.882A48 48 0 0 0 348.118 0H176c-26.51 0-48 21.49-48 48v48H48c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48h224c26.51 0 48-21.49 48-48v-48h80c26.51 0 48-21.49 48-48V99.882a48 48 0 0 0-14.059-33.941zM266 464H54a6 6 0 0 1-6-6V150a6 6 0 0 1 6-6h74v224c0 26.51 21.49 48 48 48h96v42a6 6 0 0 1-6 6zm128-96H182a6 6 0 0 1-6-6V54a6 6 0 0 1 6-6h106v88c0 13.255 10.745 24 24 24h88v202a6 6 0 0 1-6 6zm6-256h-64V48h9.632c1.591 0 3.117.632 4.243 1.757l48.368 48.368a6 6 0 0 1 1.757 4.243V112z"></path></svg>

resources/views/vendor/comments/components/icons/delete.blade.php

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="comments-icon"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>

resources/views/vendor/comments/components/icons/edit.blade.php

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="comments-icon"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>

resources/views/vendor/comments/components/icons/menu.blade.php

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="comments-icon"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"/></svg>

resources/views/vendor/comments/components/icons/smile.blade.php

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="comments-icon"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.828 14.828a4 4 0 01-5.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>

resources/views/vendor/comments/components/modal.blade.php

@@ -0,0 +1,14 @@
+<div
+    x-cloak
+    @class(['comments-modal', 'is-compact' => $compact ?? false, 'is-left' => $left ?? false, 'is-bottom' => $bottom ?? false])
+    {{ $attributes }}
+>
+    @isset($title)
+        <p class="comments-modal-title">
+            {{ $title }}
+        </p>
+    @endisset
+    <div class="comments-modal-contents">
+        {{ $slot }}
+    </div>
+</div>

resources/views/vendor/comments/components/scripts.blade.php

@@ -0,0 +1,9 @@
+<script>
+    if (window.Alpine) {
+        console.warn(
+            'Laravel Comments scripts were loaded after Alpine. ' +
+            'Please ensure Alpine is loaded last so Laravel Comments can initialize first.'
+        );
+    }
+</script>
+@stack('comments-scripts')

resources/views/vendor/comments/components/styles.blade.php

@@ -0,0 +1,3 @@
+<style>
+    {{ $stylesheet }}
+</style>