@awes-io/ui 2.42.0 → 2.42.1

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.42.1](https://github.com/awes-io/client/compare/@awes-io/ui@2.42.0...@awes-io/ui@2.42.1) (2022-02-10)
+
+
+### Bug Fixes
+
+* locked prop for fixed button ([9e2067a](https://github.com/awes-io/client/commit/9e2067ae0abbbfe766f6ea63d9c2cc26940c90b1))
+
+
+
+
+
 # [2.42.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.41.0...@awes-io/ui@2.42.0) (2022-02-01)
 
 

package/assets/css/components/button-fixed.css

@@ -12,7 +12,7 @@
     letter-spacing: 0.09375rem;
     text-transform: uppercase;
 
-    background-color: rgba(var(--btn-bg), 1);
+    background-color: rgba(var(--btn-bg), var(--btn-bg-opacity, 1));
     color: rgba(var(--btn-fg), 1);
 
     box-shadow: 0px 0.25rem 0.5rem rgba(var(--btn-bg), 0.2);
@@ -35,6 +35,32 @@
         }
     }
 
+    &__lock {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        position: absolute;
+        inset: 0;
+
+        span {
+            background-color: var(--c-surface);
+            color: var(--c-on-surface);
+
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: 50%;
+
+            padding: 0.32em;
+            font-size: 1.2em;
+        }
+    }
+
+    &--locked {
+        position: relative;
+    }
+
     &:hover {
         background-image: linear-gradient(rgba(var(--btn-fg), 0.15), rgba(var(--btn-fg), 0.15));
     }
@@ -46,4 +72,10 @@
     &:focus-visible {
         outline: theme('focusOutline');
     }
+
+    &[disabled] {
+        --btn-bg-opacity: 0.5 !important;
+        cursor: not-allowed !important;
+        user-select: none !important;
+    }
 }

package/components/4_pages/_AwButtonFixed.vue

@@ -3,6 +3,8 @@
         :is="_linkComponent"
         v-bind="_linkAttrs"
         :style="buttonStyle"
+        :disabled="_linkAttrs.disabled || locked"
+        :class="{ 'aw-button-fixed--locked': locked }"
         class="aw-button-fixed"
         v-on="$listeners"
     >
@@ -16,6 +18,15 @@
         <slot name="icon">
             <AwIcon :name="icon" size="24" class="flex-shrink-0" />
         </slot>
+        <span
+            v-if="locked"
+            class="aw-button-fixed__lock"
+            v-tooltip="lockedTooltip"
+        >
+            <span>
+                <AwIconSystemMono name="lock" />
+            </span>
+        </span>
     </Component>
 </template>
 

package/mixins/button.js

@@ -3,6 +3,15 @@ export default {
         color: {
             type: String,
             default: 'accent'
+        },
+
+        // Show lock icon and disable button
+        locked: Boolean,
+
+        // Tooltip when button is locked
+        lockedTooltip: {
+            type: String,
+            default: ''
         }
     },
 

package/nuxt/templates/lang.plugin.js

@@ -56,7 +56,7 @@ i18nOptions.messages = mergeDeepRight(messages, i18nOptions.messages || {})
 const beforeListeners = new Map()
 const afterListeners = new Map()
 
-export default async ({ app }) => {
+export default async ({ app, $axios }) => {
     const locales = langOptions.locales.slice().map(locale => {
         if (isType('String', locale)) {
             return { code: locale }
@@ -157,6 +157,9 @@ export default async ({ app }) => {
     app.i18n.setLocale = async locale => {
         const oldLocale = app.i18n.locale
 
+        // Update Accept-Language header
+        $axios.defaults.headers.common['Accept-Language'] = locale
+
         for (const beforeListener of beforeListeners.keys()) {
             await beforeListener(locale, oldLocale)
         }
@@ -179,6 +182,11 @@ export default async ({ app }) => {
         }
     }
 
+    /**
+     * Set Accept-Language header
+     */
+    $axios.defaults.headers.common['Accept-Language'] = app.i18n.locale
+
     /**
      * Set language on init
      */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@awes-io/ui",
-    "version": "2.42.0",
+    "version": "2.42.1",
     "description": "User Interface (UI) components",
     "keywords": [
         "ui",
@@ -124,5 +124,5 @@
         "vue-template-compiler": "^2.6.10",
         "webfonts-generator": "^0.4.0"
     },
-    "gitHead": "0e090b4bf9900be85106e5edc3940299809e5971"
+    "gitHead": "a996a162c0bc3e471c6f021c861329d3ae2552eb"
 }