daisyui v5.0

backend/build.gradle

@@ -6,7 +6,7 @@ buildscript {
 
 plugins {
   id 'java'
-  id 'org.springframework.boot' version '3.3.9'
+  id 'org.springframework.boot' version '3.3.10'
   // Spotless for the code style
   id "com.diffplug.spotless" version "7.0.2"
 }

e2e_test/start/pageObjects/messageCenterPage.ts

@@ -10,9 +10,7 @@ export const assumeMessageCenterPage = () => {
       return this
     },
     expectMessageDisplayAtUserSide(message: string) {
-      cy.findByText(message)
-        .parents('.daisy\\:justify-end')
-        .should('be.visible')
+      cy.findByText(message).parents('.daisy-justify-end').should('be.visible')
       return this
     },
     expectMessageDisplayAtOtherSide(message: string) {

flake.nix

@@ -157,8 +157,8 @@
 
             # Configure pnpm and start Biome
             log "Setting up PNPM..."
-            corepack prepare [email protected].3 --activate
-            corepack use [email protected].3
+            corepack prepare [email protected].5 --activate
+            corepack use [email protected].5
             pnpm --frozen-lockfile recursive install
 
             # Restart biome daemon

frontend/package.json

@@ -5,7 +5,7 @@
   "type": "module",
   "engines": {
     "node": ">=23",
-    "pnpm": ">=10.6.3"
+    "pnpm": ">=10.6.5"
   },
   "scripts": {
     "preinstall": "npx only-allow pnpm",
@@ -33,23 +33,23 @@
   },
   "devDependencies": {
     "@biomejs/biome": "1.9.4",
-    "@tailwindcss/postcss": "^4.0.14",
+    "@tailwindcss/postcss": "^4.0.15",
     "@testing-library/user-event": "^14.6.1",
     "@testing-library/vue": "^8.1.0",
     "@types/node": "^22.13.10",
     "@types/turndown": "^5.0.5",
-    "@vitejs/plugin-vue": "^5.2.1",
-    "@vitejs/plugin-vue-jsx": "^4.1.1",
+    "@vitejs/plugin-vue": "^5.2.3",
+    "@vitejs/plugin-vue-jsx": "^4.1.2",
     "@vue/test-utils": "2.4.6",
     "autoprefixer": "^10.4.21",
-    "daisyui": "^5.0.4",
+    "daisyui": "^5.0.9",
     "es-toolkit": "^1.33.0",
     "jsdom": "^26.0.0",
     "optionator": "^0.9.4",
     "postcss": "^8.5.3",
     "postcss-load-config": "^6.0.1",
-    "sass-embedded": "^1.85.1",
-    "tailwindcss": "^4.0.14",
+    "sass-embedded": "^1.86.0",
+    "tailwindcss": "^4.0.15",
     "terser": "^5.39.0",
     "typescript": "5.8.2",
     "unplugin-auto-import": "^19.1.1",
@@ -58,7 +58,7 @@
     "unplugin-vue-router": "^0.12.0",
     "vite": "6.2.2",
     "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "3.0.8",
+    "vitest": "3.0.9",
     "vitest-dom": "^0.1.1",
     "vitest-fetch-mock": "^0.4.5",
     "vue-tsc": "2.2.8"

frontend/src/components/admin/ManageBazaar.vue

@@ -9,7 +9,7 @@
         </td>
         <td>
           <button
-            class="daisy:btn daisy-btn-danger"
+            class="daisy:btn daisy:btn-danger"
             @click="removeFromBazaar(bazaarNotebook)"
           >
             Remove

frontend/src/components/admin/SuggestedQuestionRow.vue

@@ -6,7 +6,7 @@
     <td>{{ suggestedQuestion.positiveFeedback ? "Positive" : "Negative" }}</td>
     <td>{{ suggestedQuestion.comment }}</td>
     <td>
-      <div class="daisy-btn-group" role="group">
+      <div class="daisy:btn-group" role="group">
         <button
           v-if="!suggestedQuestion.positiveFeedback"
           class="daisy:btn daisy:btn-sm"

frontend/src/components/assessment/Assessment.vue

@@ -20,7 +20,7 @@
           />
           <i v-else> (This is not a certifiable assessment.)</i>
         </div>
-        <div class="daisy:alert daisy-alert-danger" v-else="">You have not passed the assessment.</div>
+        <div class="daisy:alert daisy:alert-danger" v-else="">You have not passed the assessment.</div>
       </div>
     </div>
   </div>

frontend/src/components/assessment/AssessmentClaimCertificate.vue

@@ -1,6 +1,6 @@
 <template>
   <PopButton
-    btn-class="daisy:btn daisy-btn-light"
+    btn-class="daisy:btn daisy:btn-light"
     title="View Certificate"
   >
     <CertificatePopup

frontend/src/components/assessment/AssessmentQuestion.vue

@@ -8,10 +8,10 @@
     :key="localAssessmentQuestionInstance.id"
    />
   <div v-if="localAssessmentQuestionInstance.answer && !localAssessmentQuestionInstance.answer.correct">
-    <div class="daisy:alert daisy-alert-danger">
+    <div class="daisy:alert daisy:alert-danger">
       <strong>The answer is incorrect.</strong>
     </div>
-    <button class="daisy:btn daisy-btn-danger" @click="$emit('advance')">Continue</button>
+    <button class="daisy:btn daisy:btn-danger" @click="$emit('advance')">Continue</button>
     <PopButton title="Send feedback">
       <template #button_face>
         <button class="daisy:btn daisy:btn-secondary">Send feedback</button>

frontend/src/components/bazaar/BazaarNotebookButtons.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="daisy-btn-group daisy-btn-group-sm">
+  <div class="daisy:btn-group daisy:btn-group-sm">
     <PopButton
       v-if="!notebook.notebookSettings.skipMemoryTrackingEntirely"
       title="Add to my learning"

frontend/src/components/commons/AcceptRejectButtons.vue

@@ -16,7 +16,7 @@
         Accept
       </button>
       <button
-        class="daisy:btn daisy-btn-outline-secondary daisy:btn-sm"
+        class="daisy:btn daisy:btn-outline-secondary daisy:btn-sm"
         @click="$emit('skip')"
         :disabled="disabled"
       >

frontend/src/components/commons/TestMenu.vue

@@ -25,7 +25,7 @@
         />
       </PopButton>
       <div v-if="featureToggle" class="nav-item">
-        <em class="nav-link daisy-btn-danger">Feature Toggle is On </em>
+        <em class="nav-link daisy:btn-danger">Feature Toggle is On </em>
       </div>
     </div>
   </nav>

frontend/src/components/conversations/AiResponse.vue

@@ -27,8 +27,8 @@
   </div>
 
   <div v-if="aiStatus" class="daisy:flex daisy:align-items-center status-bar daisy:mb-3">
-    <div class="daisy-spinner-border daisy-spinner-border-sm daisy:me-2" role="status">
-      <span class="daisy-visually-hidden">Loading...</span>
+    <div class="daisy:spinner-border daisy:spinner-border-sm daisy:me-2" role="status">
+      <span class="daisy:visually-hidden">Loading...</span>
     </div>
     <small class="daisy:text-secondary">{{ aiStatus }}</small>
   </div>

frontend/src/components/conversations/ConversationInner.vue

@@ -16,12 +16,12 @@
       <div
         v-for="conversationMessage in currentConversationMessages"
         :key="conversationMessage.id"
-        class="daisy:flex daisy:mb-3"
-        :class="{ 'daisy:justify-end': isCurrentUser(conversationMessage.sender?.id || 0) }"
+        class="daisy-flex daisy-mb-3"
+        :class="{ 'daisy-justify-end': isCurrentUser(conversationMessage.sender?.id || 0) }"
       >
         <div
           v-if="!isCurrentUser(conversationMessage.sender?.id || 0)"
-          class="message-avatar daisy:me-2"
+          class="message-avatar daisy-me-2"
           :title="conversationMessage.sender?.name || 'AI Assistant'"
         >
           <template v-if="conversationMessage.sender?.id === undefined">
@@ -33,9 +33,9 @@
         </div>
 
         <div
-          class="daisy:card daisy:py-2 daisy:px-3"
+          class="daisy-card daisy-py-2 daisy-px-3"
           :class="[
-            isCurrentUser(conversationMessage.sender?.id || 0) ? 'daisy:text-bg-dark' : 'daisy:bg-light',
+            isCurrentUser(conversationMessage.sender?.id || 0) ? 'daisy-text-bg-dark' : 'daisy-bg-light',
             conversationMessage.sender?.id === undefined ? 'ai-chat' : '',
           ]"
         >

frontend/src/components/conversations/ConversationTemplate.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="dialog-bar daisy:bg-base-300">
-    <div class="daisy:flex daisy:align-items-center daisy:gap-2">
+  <div class="dialog-bar daisy-bg-base-300">
+    <div class="daisy-flex daisy-align-items-center daisy-gap-2">
       <select
         v-if="conversations?.length && conversations.length > 1"
         class="conversation-select"
@@ -17,15 +17,15 @@
       </select>
       <button
         v-if="allowNewConversation"
-        class="daisy:btn daisy:btn-sm daisy-btn-outline-primary"
+        class="daisy-btn daisy-btn-sm daisy-btn-outline-primary"
         @click="$emit('new-conversation')"
         aria-label="New Conversation"
       >
       +
       </button>
     </div>
     <div class="daisy-spacer"></div>
-    <div class="daisy:flex daisy:align-items-center daisy:gap-2">
+    <div class="daisy-flex daisy-align-items-center daisy-gap-2">
       <button
         class="maximize-button"
         @click="$emit('toggle-maximize')"
@@ -79,21 +79,21 @@
     <slot name="messages" />
   </div>
 
-  <div class="bottom-container daisy:bg-base-100">
+  <div class="bottom-container daisy-bg-base-100">
     <div v-if="defaultMessages" class="default-messages">
       <button
         v-for="(message, index) in defaultMessages"
         :key="index"
-        class="default-message-button daisy:bg-base-200 daisy:text-base-content"
+        class="default-message-button daisy-bg-base-200 daisy-text-base-content"
         @click="handleDefaultMessageClick(message)"
       >
         {{ message }}
       </button>
     </div>
 
-    <div class="chat-controls daisy:bg-base-100">
+    <div class="chat-controls daisy-bg-base-100">
       <form
-        class="chat-input-form daisy:bg-base-200"
+        class="chat-input-form daisy-bg-base-200"
         @submit.prevent="handleSendMessageWithAI()"
         :disabled="!trimmedMessage"
       >

frontend/src/components/form/InputWithType.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="daisy-form-control">
+  <div class="daisy:form-control">
     <div v-if="beforeLabel" class="daisy:flex daisy:items-center daisy:gap-2">
       <slot />
       <label v-if="!!field || !!title" :for="controlId" class="daisy:label">

frontend/src/components/form/Select.vue

@@ -1,7 +1,7 @@
 <template>
   <InputWithType v-bind="{ scopeName, field, errorMessage }">
     <select
-      :class="`daisy:select daisy-select-bordered ${!!errorMessage ? 'daisy:select-error' : ''}`"
+      :class="`daisy:select daisy:select-bordered ${!!errorMessage ? 'daisy:select-error' : ''}`"
       :id="`${scopeName}-${field}`"
       :name="scopeName"
       v-model="localValue"

frontend/src/components/form/TextArea.vue

@@ -1,7 +1,7 @@
 <template>
   <InputWithType v-bind="{ class: $attrs.class, scopeName, field, errorMessage }">
     <textarea
-      :class="`daisy:textarea daisy-textarea-bordered daisy:w-full ${!!errorMessage ? 'daisy:textarea-error' : ''}`"
+      :class="`daisy:textarea daisy:textarea-bordered daisy:w-full ${!!errorMessage ? 'daisy:textarea-error' : ''}`"
       :id="`${scopeName}-${field}`"
       :name="field"
       :value="modelValue"

frontend/src/components/form/TextInput.vue

@@ -4,7 +4,7 @@
       <slot name="input_prepend" />
     </template>
     <input
-      :class="`daisy:input daisy-input-bordered daisy:w-full ${!!errorMessage ? 'daisy:input-error' : ''}`"
+      :class="`daisy:input daisy:input-bordered daisy:w-full ${!!errorMessage ? 'daisy:input-error' : ''}`"
       :id="`${scopeName}-${field}`"
       :name="field"
       :value="modelValue"

frontend/src/components/notebook/NotebookButtons.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="daisy-btn-group daisy-btn-group-sm daisy:flex daisy:align-items-center daisy:flex-wrap">
+  <div class="daisy:btn-group daisy:btn-group-sm daisy:flex daisy:align-items-center daisy:flex-wrap">
     <BazaarNotebookButtons v-if="notebook.circle" :notebook="notebook" :logged-in="true" />
     <PopButton title="Edit notebook settings">
       <template #button_face>

frontend/src/components/notebook/NotebookMoveDialog.vue

@@ -3,7 +3,7 @@
   <div class="daisy:overflow-auto daisy:max-h-40" style="max-height: 200px">
     <ul class="daisy:menu">
       <li
-        class="daisy-menu-item"
+        class="daisy:menu-item"
         v-for="circle in circles"
         :key="circle.id"
         @click="move(circle)"

frontend/src/components/notes/NoteInfoComponent.vue

@@ -5,7 +5,7 @@
     @level-changed="$emit('levelChanged', $event)"
   />
   <h6 v-if="memoryTrackers.length">Memory Trackers</h6>
-  <table v-if="memoryTrackers.length" class="daisy:table daisy-table-bordered">
+  <table v-if="memoryTrackers.length" class="daisy:table daisy:table-bordered">
     <thead>
       <tr>
         <th>Type</th>

frontend/src/components/notes/NoteShow.vue

@@ -102,7 +102,7 @@
                 <ul class="daisy:menu daisy:rounded-lg daisy:shadow-sm">
                   <li v-for="link in noteRealm.inboundReferences"
                       :key="link.id"
-                      class="daisy-menu-item daisy-hover:daisy-bg-base-200 daisy:transition-colors daisy:py-2"
+                      class="daisy:menu-item daisy:hover:daisy:bg-base-200 daisy:transition-colors daisy:py-2"
                   >
                     <div class="daisy:flex daisy:items-center daisy:gap-2">
                       <span class="daisy:text-sm daisy:text-base-content/70">

frontend/src/components/notes/WikidataSearchByLabel.vue

@@ -16,7 +16,7 @@
         @change="onSelectSearchResult"
         @blur="removeSearchSuggestions"
         v-model="selectedOption"
-        class="popup-select daisy:select daisy-select-bordered"
+        class="popup-select daisy:select daisy:select-bordered"
       >
         <option disabled value="">- Choose Wikidata Search Result -</option>
         <option

frontend/src/components/notes/accessory/NoteAudioTools.vue

@@ -301,12 +301,12 @@ const tryFlushAudio = async () => {
   flex-shrink: 0;
 }
 
-.daisy-btn:hover:not(:disabled) {
+.daisy:btn:hover:not(:disabled) {
   background-color: #3182ce;
   transform: scale(1.05);
 }
 
-.daisy-btn:disabled {
+.daisy:btn:disabled {
   background-color: #a0aec0;
   cursor: not-allowed;
 }