@pequity/squirrel 1.0.26-beta.2 → 1.0.27

package/README.md

@@ -2,14 +2,21 @@
 
 The [Squirrel component library](https://getpequity.github.io/squirrel) is a comprehensive suite of feature-rich UI components that encapsulate the styling of the Pequity Squirrel Design System.
 
-The library is built using Vue 3 and Vite.
+The library is built using [Vue 3](https://vuejs.org/) and [Tailwind CSS](https://tailwindcss.com/) and is designed to be used in Vue 3 projects.
+[Vite](https://vitejs.dev/) is used as the build tool for the library and [Storybook](https://storybook.js.org/) is used for component development and documentation.
 
 ## Installation and Usage
 
-Install the package and its dependencies using pnpm:
+Install the package and its dependencies using `pnpm`:
 
 ```bash
-pnpm i @pequity/squirrel @popperjs/core @tanstack/vue-virtual dayjs floating-vue lodash-es v-calendar vue-currency-input ue-toastification@2.0.0-rc.5
+pnpm i vue vue-router @pequity/squirrel @popperjs/core @tanstack/vue-virtual dayjs floating-vue lodash-es v-calendar vue-currency-input vue-toastification@2.0.0-rc.5
+```
+
+Install Tailwind CSS:
+
+```bash
+pnpm i -D tailwindcss
 ```
 
 Import the Squirrel CSS to your project's `main.css` file:

package/dist/cjs/chunks/p-tabs.js

@@ -27,7 +27,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }, [
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.tabs, (tabData) => {
           return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(tabData.to ? "RouterLink" : "div"), vue.mergeProps({
-            key: `tab-${tabData.name}`
+            key: `tab-${tabData.name}`,
+            ref_for: true
           }, tabData.to ? { to: tabData.to } : {}, {
             class: [[__props.activeTab === tabData.name ? "border-primary text-primary" : "border-transparent text-p-gray-40"], "group cursor-pointer border-b-2 pb-3 hover:border-primary hover:text-primary"],
             onClick: ($event) => _ctx.$emit("click:tab", tabData.name)

package/dist/cjs/index.js

@@ -802,7 +802,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)
+                        "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/chunks/p-tabs.js

@@ -26,7 +26,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(__props.tabs, (tabData) => {
           return openBlock(), createBlock(resolveDynamicComponent(tabData.to ? "RouterLink" : "div"), mergeProps({
-            key: `tab-${tabData.name}`
+            key: `tab-${tabData.name}`,
+            ref_for: true
           }, tabData.to ? { to: tabData.to } : {}, {
             class: [[__props.activeTab === tabData.name ? "border-primary text-primary" : "border-transparent text-p-gray-40"], "group cursor-pointer border-b-2 pb-3 hover:border-primary hover:text-primary"],
             onClick: ($event) => _ctx.$emit("click:tab", tabData.name)

package/dist/es/index.js

@@ -802,7 +802,8 @@ const _sfc_main$1 = /* @__PURE__ */ 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)
+                        "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": "1.0.26-beta.2",
+  "version": "1.0.27",
   "packageManager": "pnpm@8.9.2",
   "type": "module",
   "scripts": {
@@ -39,12 +39,12 @@
   "module": "./dist/es/index.js",
   "dependencies": {
     "@popperjs/core": "2.11.8",
-    "@tanstack/vue-virtual": "3.3.0",
+    "@tanstack/vue-virtual": "3.4.0",
     "dayjs": "1.11.10",
     "floating-vue": "5.2.2",
     "lodash-es": "4.17.21",
     "v-calendar": "3.1.2",
-    "vue": "3.4.23",
+    "vue": "3.4.24",
     "vue-currency-input": "3.1.0",
     "vue-router": "4.3.0",
     "vue-toastification": "2.0.0-rc.5"
@@ -64,30 +64,30 @@
   "devDependencies": {
     "@babel/core": "^7.24.4",
     "@babel/preset-env": "^7.24.4",
-    "@commitlint/cli": "^19.2.2",
+    "@commitlint/cli": "^19.3.0",
     "@commitlint/config-conventional": "^19.2.2",
     "@pequity/eslint-config": "^0.0.12",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
-    "@storybook/addon-a11y": "^8.0.8",
-    "@storybook/addon-actions": "^8.0.8",
-    "@storybook/addon-essentials": "^8.0.8",
-    "@storybook/addon-interactions": "^8.0.8",
-    "@storybook/addon-links": "^8.0.8",
-    "@storybook/blocks": "^8.0.8",
+    "@storybook/addon-a11y": "^8.0.9",
+    "@storybook/addon-actions": "^8.0.9",
+    "@storybook/addon-essentials": "^8.0.9",
+    "@storybook/addon-interactions": "^8.0.9",
+    "@storybook/addon-links": "^8.0.9",
+    "@storybook/blocks": "^8.0.9",
     "@storybook/jest": "^0.2.3",
-    "@storybook/manager-api": "^8.0.8",
+    "@storybook/manager-api": "^8.0.9",
     "@storybook/test-runner": "^0.17.0",
     "@storybook/testing-library": "^0.2.2",
-    "@storybook/theming": "^8.0.8",
-    "@storybook/vue3": "^8.0.8",
-    "@storybook/vue3-vite": "^8.0.8",
+    "@storybook/theming": "^8.0.9",
+    "@storybook/vue3": "^8.0.9",
+    "@storybook/vue3-vite": "^8.0.9",
     "@types/jest": "^29.5.12",
     "@types/jsdom": "^21.1.6",
     "@types/lodash-es": "^4.17.12",
     "@types/node": "^20.12.7",
     "@vitejs/plugin-vue": "^5.0.4",
-    "@vue/compiler-sfc": "3.4.23",
+    "@vue/compiler-sfc": "3.4.24",
     "@vue/test-utils": "^2.4.5",
     "@vue/vue3-jest": "^29.2.6",
     "autoprefixer": "^10.4.19",
@@ -107,13 +107,13 @@
     "rimraf": "^5.0.5",
     "sass": "^1.75.0",
     "semantic-release": "^23.0.8",
-    "storybook": "^8.0.8",
+    "storybook": "^8.0.9",
     "svgo": "^3.2.0",
     "tailwindcss": "^3.4.3",
     "ts-jest": "^29.1.2",
     "typescript": "5.4.5",
-    "vite": "^5.2.9",
-    "vue-router": "^4.3.0",
-    "vue-tsc": "2.0.13"
+    "vite": "^5.2.10",
+    "vue-router": "^4.3.2",
+    "vue-tsc": "2.0.14"
   }
 }