wave-ui 3.14.1 → 3.14.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wave-ui",
-  "version": "3.14.1",
+  "version": "3.14.3",
   "description": "A UI framework for Vue.js 3 (and 2) with only the bright side. :sunny:",
   "author": "Antoni Andre <antoniandre.web@gmail.com>",
   "homepage": "https://antoniandre.github.io/wave-ui",
@@ -42,15 +42,6 @@
     "vue framework",
     "ui"
   ],
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build --base /wave-ui/",
-    "build-types": "tsc -p ./tsconfig.json",
-    "build-bundle": "BUNDLE=true vite build && npm run build-types && mv ./dist/style.css ./dist/wave-ui.css",
-    "serve": "vite preview --base /wave-ui/",
-    "lint": "vite lint",
-    "publish-doc": "npm run build && npm run build-bundle && git add . && git commit -m 'Publish documentation on Github.' && git push && git push --tag"
-  },
   "devDependencies": {
     "@eslint/js": "^9.8.0",
     "@faker-js/faker": "^8.4.1",
@@ -77,7 +68,7 @@
     "pug": "^3.0.3",
     "rollup-plugin-delete": "^2.0.0",
     "sass": "^1.77.6",
-    "simple-syntax-highlighter": "^3.0.3",
+    "simple-syntax-highlighter": "^3.0.5",
     "splitpanes": "^3.1.5",
     "typescript": "^5.5.2",
     "typescript-eslint": "^8.0.0",
@@ -90,5 +81,14 @@
   },
   "peerDependencies": {
     "vue": "^3.2.0"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build --base /wave-ui/",
+    "build-types": "tsc -p ./tsconfig.json",
+    "build-bundle": "BUNDLE=true vite build && npm run build-types && mv ./dist/style.css ./dist/wave-ui.css",
+    "serve": "vite preview --base /wave-ui/",
+    "lint": "vite lint",
+    "publish-doc": "npm run build && npm run build-bundle && git add . && git commit -m 'Publish documentation on Github.' && git push && git push --tag"
   }
-}
+}

package/src/wave-ui/components/w-textarea.vue

@@ -116,7 +116,6 @@ export default {
     attrs () {
       // Remove class and style which are meant to stay on the wrapper.
       // Note: in Vue 3 $attrs may contain both HTML attributes AND JS events (onClick, onFocus, etc.).
-      // eslint-disable-next-line no-unused-vars
       const { class: classes, style, ...attrs } = this.$attrs
       return attrs
     },

package/src/wave-ui/components/w-toolbar.vue

@@ -67,7 +67,7 @@ export default {
 .w-toolbar {
   position: relative;
   display: flex;
-  flex: 0 1 auto; // No grow, so it doesn't stretch vertically in flex column.
+  flex: 1 1 auto;
   align-items: center;
   padding: (2 * $base-increment) (3 * $base-increment);
   background-color: $toolbar-bg-color;
@@ -94,6 +94,7 @@ export default {
   &--vertical {
     padding: (2 * $base-increment);
     flex-direction: column;
+    flex-grow: 0;
     flex-shrink: 0;
   }
 

package/src/wave-ui/scss/_layout.scss

@@ -14,6 +14,8 @@
     .fill-width {width: 100%;}
     .fill-height {height: 100%;}
     .basis-zero {flex-basis: 0;}
+    .wrap {flex-wrap: wrap;}
+    .no-wrap {flex-wrap: nowrap;}
 
     .align-start {align-items: flex-start;}
     .align-center {align-items: center;}

package/src/wave-ui/scss/_variables.scss

@@ -14,7 +14,7 @@ $theme-light: (
   base-color-rgb: (0, 0, 0), // #000.
   contrast-bg-color-rgb: (0, 0, 0), // #000.
   contrast-color-rgb: (255, 255, 255), // #fff.
-  caption-color-rgb: (80, 80, 80, 0.7), // #505050.
+  caption-color-rgb: (160, 160, 160), // #a0a0a0.
   disabled-color-rgb: (204, 204, 204), // #ccc.
 ) !default;
 
@@ -23,7 +23,7 @@ $theme-dark: (
   base-color-rgb: (255, 255, 255), // #fff.
   contrast-bg-color-rgb: (255, 255, 255), // #fff.
   contrast-color-rgb: (0, 0, 0), // #000.
-  caption-color-rgb: (175, 175, 175, 0.7), // #afafaf.
+  caption-color-rgb: (110, 110, 110), // #6e6e6e.
   disabled-color-rgb: (74, 74, 74), // #4a4a4a.
 ) !default;
 
@@ -116,7 +116,7 @@ $slider-step-label-color: rgba(var(--w-base-color-rgb), 0.5) !default;
 // w-switch.
 // --------------------------------------------------------
 $switch-inactive-color: rgba(var(--w-contrast-bg-color-rgb), 0.25) !default;
-$switch-thumb-color: #fff !default;
+$switch-thumb-color: $base-bg-color !default;
 // --------------------------------------------------------
 
 // w-table.

package/src/wave-ui/utils/colors.js

@@ -15,10 +15,11 @@ export const generateColorShades = config => {
     for (const label in themeOfColors) {
       if (label === 'shades') continue // Skip if item is the `shades` container.
 
-      // Account for string colors and the fine tuned shaded colors
+      // Account for string colors and the fine tuned shaded colors.
       const colorInfo = themeOfColors[label]
-      const color = { label, color: (themeOfColors[label]?.color ?? themeOfColors[label]).replace('#', '') }
+      const color = { label, color: (themeOfColors[label]?.color ?? themeOfColors[label])?.replace?.('#', '') }
       const col = color.color
+      if (!col) continue // Don't break if a color is only set for one of the themes.
       if (col.length === 3) color.color = col[0] + '' + col[0] + col[1] + col[1] + col[2] + col[2]
 
       for (let i = 1; i <= 6; i++) {

package/src/wave-ui/utils/dynamic-css.js

@@ -167,6 +167,8 @@ const genBreakpointLayoutClasses = breakpoints => {
     'no-grow{flex-grow:0}',
     'shrink{flex-shrink:1;margin-left:auto;margin-right:auto}',
     'no-shrink{flex-shrink:0}',
+    'wrap{flex-wrap: wrap}',
+    'no-wrap{flex-wrap: nowrap}',
     'fill-width{width:100%}',
     'fill-height{height:100%}',
     'basis-zero{flex-basis:0}',