@nuxt/ui 2.21.1 → 2.22.0

package/README.md

@@ -1,4 +1,4 @@
-[![nuxt-ui.png](https://volta.s3.fr-par.scw.cloud/nuxt_ui_social_card_531d133fa2.png)](https://ui.nuxt.com)
+[![nuxt-ui.png](https://volta.s3.fr-par.scw.cloud/nuxt_ui_social_card_531d133fa2.png)](https://ui2.nuxt.com)
 
 # Nuxt UI
 
@@ -22,17 +22,32 @@ Its goal is to provide everything related to UI when building a Nuxt app. This i
 - Fully typed
 - [Figma Kit](https://www.figma.com/community/file/1436401057300493073)
 
-Read more on [ui.nuxt.com](https://ui.nuxt.com)
+Read more on [ui2.nuxt.com](https://ui2.nuxt.com)
 
 ## Installation
 
 ```bash
-npx nuxi@latest module add ui
+# npm
+npm install @nuxt/ui@2
+# yarn
+yarn add @nuxt/ui@2
+# pnpm
+pnpm add @nuxt/ui@2
+# bun
+bun add @nuxt/ui@2
+```
+
+Next, register the `@nuxt/ui` module in your `nuxt.config.ts`:
+
+```ts
+export default defineNuxtConfig({
+  modules: ['@nuxt/ui']
+})
 ```
 
 ## Documentation
 
-Visit https://ui.nuxt.com to explore the documentation.
+Visit https://ui2.nuxt.com to explore the documentation.
 
 ## Credits
 
@@ -49,15 +64,15 @@ Visit https://ui.nuxt.com to explore the documentation.
 Thank you for considering contributing to Nuxt UI. Here are a few ways you can get involved:
 
 - Reporting Bugs: If you come across any bugs or issues, please check out the reporting bugs guide to learn how to submit a bug report.
-- Suggestions: Have any thoughts to enhance Nuxt UI? We'd love to hear them! Check out the [contribution guide](https://ui.nuxt.com/getting-started/contributing) to share your suggestions.
+- Suggestions: Have any thoughts to enhance Nuxt UI? We'd love to hear them! Check out the [contribution guide](https://ui2.nuxt.com/getting-started/contributing) to share your suggestions.
 
 ## Local Development
 
-Follow the docs to [Set up your local development environment](https://ui.nuxt.com/getting-started/contributing#_2-local-development-setup) and contribute.
+Follow the docs to [Set up your local development environment](https://ui2.nuxt.com/getting-started/contributing#_2-local-development-setup) and contribute.
 
 ## License
 
-Licensed under the [MIT license](https://github.com/nuxt/ui/blob/dev/LICENSE.md).
+Licensed under the [MIT license](https://github.com/nuxt/ui/blob/v2/LICENSE.md).
 
 <!-- Badges -->
 [npm-version-src]: https://img.shields.io/npm/v/@nuxt/ui/latest.svg?style=flat&colorA=18181B&colorB=28CF8D

package/dist/module.d.mts

@@ -37,4 +37,5 @@ interface ModuleOptions {
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -1,12 +1,12 @@
 {
   "name": "@nuxt/ui",
-  "version": "2.21.1",
+  "version": "2.22.0",
   "configKey": "ui",
   "compatibility": {
     "nuxt": ">=3.10.0"
   },
   "builder": {
-    "@nuxt/module-builder": "0.8.4",
-    "unbuild": "2.0.0"
+    "@nuxt/module-builder": "1.0.1",
+    "unbuild": "3.5.0"
   }
 }

package/dist/module.mjs

@@ -1,20 +1,11 @@
 import { createRequire } from 'node:module';
-import { addTemplate, useNuxt, installModule, createResolver, defineNuxtModule, addPlugin, addComponentsDir, addImportsDir } from '@nuxt/kit';
+import { useNuxt, addTemplate, createResolver, installModule, defineNuxtModule, addPlugin, addComponentsDir, addImportsDir } from '@nuxt/kit';
 import { join } from 'pathe';
 import { defu } from 'defu';
 import { setGlobalColors } from '../dist/runtime/utils/colors.js';
 
-
-
-// -- Unbuild CommonJS Shims --
-import __cjs_url__ from 'url';
-import __cjs_path__ from 'path';
-import __cjs_mod__ from 'module';
-const __filename = __cjs_url__.fileURLToPath(import.meta.url);
-const __dirname = __cjs_path__.dirname(__filename);
-const require = __cjs_mod__.createRequire(import.meta.url);
 const name = "@nuxt/ui";
-const version = "2.21.1";
+const version = "2.22.0";
 
 function createTemplates(nuxt = useNuxt()) {
   const template = addTemplate({

package/dist/runtime/components/data/Table.vue

@@ -31,8 +31,8 @@
             <slot v-else :name="`${column.key}-header`" :column="column" :sort="sort" :on-sort="onSort">
               <UButton
                 v-if="column.sortable"
-                v-bind="{ ...(ui.default.sortButton || {}), ...sortButton }"
-                :icon="(!sort.column || sort.column !== column.key) ? (sortButton.icon || ui.default.sortButton.icon) : sort.direction === 'asc' ? sortAscIcon : sortDescIcon"
+                v-bind="{ ...ui.default.sortButton || {}, ...sortButton }"
+                :icon="!sort.column || sort.column !== column.key ? sortButton.icon || ui.default.sortButton.icon : sort.direction === 'asc' ? sortAscIcon : sortDescIcon"
                 :label="column[columnAttribute]"
                 @click="onSort(column)"
               />
@@ -43,7 +43,7 @@
 
         <tr v-if="loading && progress">
           <td :colspan="0" :class="ui.progress.wrapper">
-            <UProgress v-bind="{ ...(ui.default.progress || {}), ...progress }" size="2xs" />
+            <UProgress v-bind="{ ...ui.default.progress || {}, ...progress }" size="2xs" />
           </td>
         </tr>
       </thead>
@@ -87,21 +87,24 @@
                 <UButton
                   v-else
                   :disabled="row.disabledExpand"
-                  v-bind="{ ...(ui.default.expandButton || {}), ...expandButton }"
+                  v-bind="{ ...ui.default.expandButton || {}, ...expandButton }"
                   :ui="{ icon: { base: [ui.expand.icon, isExpanded(row) && 'rotate-180'].join(' ') } }"
                   @click.capture.stop="toggleOpened(row)"
                 />
               </td>
               <td v-for="(column, subIndex) in columns" :key="subIndex" :class="[ui.td.base, ui.td.padding, ui.td.color, ui.td.font, ui.td.size, column?.rowClass, row[column.key]?.class, column.key === 'select' && ui.checkbox.padding]">
-                <slot v-if="modelValue && column.key === 'select' " name="select-data" :checked="isSelected(row)" :change="(ev: boolean) => onChangeCheckbox(ev, row)">
-                  <UCheckbox
-                    :model-value="isSelected(row)"
-                    v-bind="ui.default.checkbox"
-                    aria-label="Select row"
-                    @change="onChangeCheckbox($event, row)"
-                  />
-                </slot>
-
+                <!-- This is a workaround: Since the @change event doesn't bubble up naturally, we need to wrap it in another element and use @click.capture.stop to simulate event bubbling behavior -->
+                <span v-if="modelValue && column.key === 'select'" @click.capture.stop="() => {
+}">
+                  <slot name="select-data" :checked="isSelected(row)" :change="(ev) => onChangeCheckbox(ev, row)">
+                    <UCheckbox
+                      :model-value="isSelected(row)"
+                      v-bind="ui.default.checkbox"
+                      aria-label="Select row"
+                      @change="onChangeCheckbox($event, row)"
+                    />
+                  </slot>
+                </span>
                 <slot
                   v-else
                   :name="`${column.key}-data`"