@pequity/squirrel 8.3.3 → 8.3.4

package/dist/cjs/index.js

@@ -166,7 +166,9 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
         const file = filesToUpload[i];
         const fileName = file.name || file.url;
         if (res.length + files.value.length >= props.maxNumberOfFiles) {
-          toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+          if (!(props.multiple && props.maxNumberOfFiles === 1)) {
+            toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+          }
           break;
         }
         if (!fileName) {
@@ -870,7 +872,7 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                   ref: (el) => updateThsRefs(el, i),
                   key: col.id,
                   "data-col-id": col.id
-                }, col.thAttrs, {
+                }, { ref_for: true }, col.thAttrs, {
                   style: col.style,
                   class: "bg-surface"
                 }), [
@@ -886,9 +888,8 @@ const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
                         "show-filter-icon": col.filterable || col.sortable,
                         "tooltip-text": col.tooltip,
                         class: [{ "pl-2": i === 1 && _ctx.isFirstColFixed, "pr-2": i === _ctx.cols.length && _ctx.isLastColFixed }, "grow"],
-                        "text-color": headerCellTextColor(col),
-                        ref_for: true
-                      }, col.headerCellAttrs, {
+                        "text-color": headerCellTextColor(col)
+                      }, { ref_for: true }, col.headerCellAttrs, {
                         onClickFilterIcon: ($event) => _ctx.$emit("click-filter-icon", $event, col)
                       }), null, 16, ["text", "filter-active", "show-filter-icon", "tooltip-text", "class", "text-color", "onClickFilterIcon"])
                     ]),

package/dist/es/index.js

@@ -166,7 +166,9 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         const file = filesToUpload[i2];
         const fileName = file.name || file.url;
         if (res.length + files.value.length >= props.maxNumberOfFiles) {
-          toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+          if (!(props.multiple && props.maxNumberOfFiles === 1)) {
+            toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+          }
           break;
         }
         if (!fileName) {
@@ -870,7 +872,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   ref: (el) => updateThsRefs(el, i2),
                   key: col.id,
                   "data-col-id": col.id
-                }, col.thAttrs, {
+                }, { ref_for: true }, col.thAttrs, {
                   style: col.style,
                   class: "bg-surface"
                 }), [
@@ -886,9 +888,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                         "show-filter-icon": col.filterable || col.sortable,
                         "tooltip-text": col.tooltip,
                         class: [{ "pl-2": i2 === 1 && _ctx.isFirstColFixed, "pr-2": i2 === _ctx.cols.length && _ctx.isLastColFixed }, "grow"],
-                        "text-color": headerCellTextColor(col),
-                        ref_for: true
-                      }, col.headerCellAttrs, {
+                        "text-color": headerCellTextColor(col)
+                      }, { ref_for: true }, col.headerCellAttrs, {
                         onClickFilterIcon: ($event) => _ctx.$emit("click-filter-icon", $event, col)
                       }), null, 16, ["text", "filter-active", "show-filter-icon", "tooltip-text", "class", "text-color", "onClickFilterIcon"])
                     ]),

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pequity/squirrel",
   "description": "Squirrel component library",
-  "version": "8.3.3",
+  "version": "8.3.4",
   "packageManager": "pnpm@10.6.4",
   "type": "module",
   "scripts": {
@@ -71,7 +71,7 @@
     "@types/node": "^22.15.21",
     "@vitejs/plugin-vue": "^5.2.4",
     "@vitest/coverage-v8": "^3.1.4",
-    "@vue/compiler-sfc": "3.5.14",
+    "@vue/compiler-sfc": "3.5.15",
     "@vue/test-utils": "^2.4.6",
     "@vuepic/vue-datepicker": "11.0.2",
     "autoprefixer": "^10.4.21",
@@ -91,14 +91,14 @@
     "resolve-tspaths": "^0.8.23",
     "rimraf": "^6.0.1",
     "sass": "^1.89.0",
-    "semantic-release": "^24.2.4",
+    "semantic-release": "^24.2.5",
     "storybook": "^8.6.14",
     "svgo": "^3.3.2",
     "tailwindcss": "^3.4.17",
     "typescript": "5.8.3",
     "vite": "^6.3.5",
     "vitest": "^3.1.4",
-    "vue": "3.5.14",
+    "vue": "3.5.15",
     "vue-currency-input": "3.2.1",
     "vue-router": "4.5.1",
     "vue-toastification": "2.0.0-rc.5",

package/squirrel/components/p-file-upload/p-file-upload.spec.js

@@ -1,11 +1,26 @@
 import PFileUpload from '@squirrel/components/p-file-upload/p-file-upload.vue';
+import { expect } from '@storybook/test';
 import { createWrapperFor } from '@tests/vitest.helpers';
+import { vi } from 'vitest';
+
+// Mocking the toastification library
+const toastError = vi.fn();
+
+vi.mock('vue-toastification', () => {
+  return {
+    useToast: () => {
+      return {
+        error: toastError,
+      };
+    },
+  };
+});
 
-const createFile = () => {
-  const file = new File(['filename'], 'filename.txt', {
+const createFile = (fileName = 'filename') => {
+  const file = new File([fileName], `${fileName}.txt`, {
     type: 'text/plain',
-    name: 'filename.txt',
-    url: 'https://www.pequity.com/filename.txt',
+    name: `${fileName}.txt`,
+    url: `https://www.pequity.com/${fileName}.txt`,
   });
 
   return file;
@@ -131,4 +146,46 @@ describe('PFileUpload.vue', () => {
 
     expect(wrapper.findAll('div.truncate').length).toBe(3);
   });
+
+  it('shows a toast when maxNumberOfFiles is exceeded', async () => {
+    const file1 = createFile('file1');
+    const file2 = createFile('file2');
+
+    const wrapper = createWrapperFor({
+      components: { PFileUpload },
+      data() {
+        return {
+          files: [file1, file2],
+        };
+      },
+      template: `
+        <PFileUpload v-model="files" :multiple="true" :max-number-of-files="2" />
+      `,
+    });
+
+    expect(wrapper.find('div[title="file1.txt"]').exists()).toBe(true);
+    expect(wrapper.find('div[title="file2.txt"]').exists()).toBe(true);
+
+    expect(toastError).toHaveBeenCalledWith('You can only upload a maximum of 2 files.');
+  });
+
+  it('does not show a toast when multiple is true and maxNumberOfFiles is 1', async () => {
+    const file1 = createFile('file1');
+
+    const wrapper = createWrapperFor({
+      components: { PFileUpload },
+      data() {
+        return {
+          files: [file1],
+        };
+      },
+      template: `
+        <PFileUpload v-model="files" :multiple="true" :max-number-of-files="1" />
+      `,
+    });
+
+    expect(wrapper.find('div[title="file1.txt"]').exists()).toBe(true);
+
+    expect(toastError).not.toHaveBeenCalled();
+  });
 });

package/squirrel/components/p-file-upload/p-file-upload.vue

@@ -166,7 +166,11 @@ const validateFiles = (filesToUpload: FileUploadFile[]) => {
 
     // Bail if we reached the max number of files
     if (res.length + files.value.length >= props.maxNumberOfFiles) {
-      toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+      // Show a toast - except for the contradictory config (multiple: true with maxNumberOfFiles: 1)
+      if (!(props.multiple && props.maxNumberOfFiles === 1)) {
+        toast.error(`You can only upload a maximum of ${props.maxNumberOfFiles} ${fileWord.value}.`);
+      }
+
       break;
     }