@awes-io/ui 2.48.0 → 2.50.0

package/CHANGELOG.md

@@ -3,6 +3,39 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.50.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.49.1...@awes-io/ui@2.50.0) (2022-06-13)
+
+
+### Features
+
+* calendar day slots added ([b9b0897](https://github.com/awes-io/client/commit/b9b0897806fe2f86aa51bc1b472482fab017ce91))
+
+
+
+
+
+## [2.49.1](https://github.com/awes-io/client/compare/@awes-io/ui@2.49.0...@awes-io/ui@2.49.1) (2022-05-31)
+
+
+### Bug Fixes
+
+* multiline translations updated ([3b072f8](https://github.com/awes-io/client/commit/3b072f84be4bfb4327cfa80d23531b80c73e1eda))
+
+
+
+
+
+# [2.49.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.48.0...@awes-io/ui@2.49.0) (2022-05-26)
+
+
+### Features
+
+* translation system updated ([2827c0e](https://github.com/awes-io/client/commit/2827c0e6108523aa26e3f5af10478be23cace54f))
+
+
+
+
+
 # [2.48.0](https://github.com/awes-io/client/compare/@awes-io/ui@2.47.3...@awes-io/ui@2.48.0) (2022-05-16)
 
 

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

@@ -20,7 +20,7 @@
     &__text {
         flex-shrink: 1;
         max-width: 1px;
-        margin-right: -1px;
+        margin-left: -1px;
 
         opacity: 0.1;
         transition-property: max-width, margin, opacity;
@@ -28,10 +28,10 @@
 
         &--expanded {
             max-width: 16rem;
-            margin-right: 0.75em;
+            margin-left: 0.75em;
             opacity: 1;
             transition-timing-function: ease-out;
-            transition-duration: 240ms;
+            transition-duration: 210ms;
         }
     }
 

package/components/1_atoms/AwDropdown.vue

@@ -55,7 +55,7 @@
             <slot v-if="isMobile" name="close">
                 <AwButton
                     theme="ghost"
-                    :text="$t('AwDropdown.close')"
+                    :text="$t('aw.dropdown.close')"
                     color="surface"
                     size="lg"
                     class="aw-dropdown__close"

package/components/2_molecules/AwButton.vue

@@ -168,7 +168,7 @@ export default {
         // loadingText() {
         //     return (
         //         (isType('String', this.loading) && this.loading) ||
-        //         this.$t('AwButton.loading')
+        //         this.$t('aw.button.loading')
         //     )
         // },
 

package/components/2_molecules/AwIsland/AwIslandBuilder.vue

@@ -16,7 +16,7 @@ export default {
         confirmText: {
             type: String,
             default() {
-                return this.$t('AwIslandBuilder.cancel_all_changes')
+                return this.$t('aw.island_builder.cancel_all_changes')
             }
         }
     },

package/components/2_molecules/AwSelect.vue

@@ -235,7 +235,7 @@
                     data-arrow-focus
                 >
                     <slot name="not-found" :searchPhrase="searchPhrase">
-                        {{ $t('AwSelect.notFound') }}
+                        {{ $t('aw.select.not_found') }}
                     </slot>
                 </AwDropdownButton>
             </slot>
@@ -344,7 +344,7 @@ export default {
         createConfirmText: {
             type: String,
             default() {
-                return this.$t('AwSelect.newOne')
+                return this.$t('aw.select.new_one')
             }
         },
 

package/components/2_molecules/AwSelectObject.vue

@@ -163,7 +163,7 @@
                 <!-- not found -->
                 <div v-if="_showNotFound" class="aw-select__notify">
                     <slot name="not-found" :searchPhrase="searchPhrase">
-                        {{ $t('AwSelect.empty') }}
+                        {{ $t('aw.select.empty') }}
                     </slot>
                 </div>
 
@@ -173,7 +173,7 @@
                     class="aw-select__notify aw-select__notify--loading"
                 >
                     <slot name="loading">
-                        {{ $t('AwSelect.loading') }}
+                        {{ $t('aw.select.loading') }}
                     </slot>
                 </div>
 

package/components/3_organisms/AwAddressBlock.vue

@@ -4,7 +4,7 @@
             <AwAddress
                 ref="address"
                 :gm-language="$i18n.locale || 'en'"
-                :label="$t('AwAddressBlock.address')"
+                :label="$t('aw.address_block.address')"
                 :error="addressError"
                 :gm-key="gmKey"
                 :timezone="timezone"
@@ -24,62 +24,62 @@
                 </div>
 
                 <AwGrid :col="{ md: 2 }">
-                    <AwInfo :label="$t('AwAddressBlock.street')">
+                    <AwInfo :label="$t('aw.address_block.street')">
                         <span v-if="model.address.address_1">
                             {{ model.address.address_1 }}
                         </span>
                         <AwLink
                             v-else
-                            :text="$t('AwAddressBlock.add')"
+                            :text="$t('aw.address_block.add')"
                             @click="openModal('address_1')"
                         />
                     </AwInfo>
 
-                    <AwInfo :label="$t('AwAddressBlock.apt')">
+                    <AwInfo :label="$t('aw.address_block.apt')">
                         <span v-if="model.address.apt">
                             {{ model.address.apt }}
                         </span>
                         <AwLink
                             v-else
-                            :text="$t('AwAddressBlock.add')"
+                            :text="$t('aw.address_block.add')"
                             @click="openModal('apt')"
                         />
                     </AwInfo>
 
-                    <AwInfo :label="$t('AwAddressBlock.city')">
+                    <AwInfo :label="$t('aw.address_block.city')">
                         <span v-if="model.address.city">
                             {{ model.address.city }}
                         </span>
                         <AwLink
                             v-else
-                            :text="$t('AwAddressBlock.add')"
+                            :text="$t('aw.address_block.add')"
                             @click="openModal('city')"
                         />
                     </AwInfo>
 
-                    <AwInfo :label="$t('AwAddressBlock.region')">
+                    <AwInfo :label="$t('aw.address_block.region')">
                         <span v-if="model.address.region">
                             {{ model.address.region }}
                         </span>
                         <AwLink
                             v-else
-                            :text="$t('AwAddressBlock.add')"
+                            :text="$t('aw.address_block.add')"
                             @click="openModal('region')"
                         />
                     </AwInfo>
 
-                    <AwInfo :label="$t('AwAddressBlock.postal_code')">
+                    <AwInfo :label="$t('aw.address_block.postal_code')">
                         <span v-if="model.address.postal_code">
                             {{ model.address.postal_code }}
                         </span>
                         <AwLink
                             v-else
-                            :text="$t('AwAddressBlock.add')"
+                            :text="$t('aw.address_block.add')"
                             @click="openModal('postal_code')"
                         />
                     </AwInfo>
 
-                    <AwInfo :label="$t('AwAddressBlock.country')">
+                    <AwInfo :label="$t('aw.address_block.country')">
                         <span>
                             {{ model.address.meta.google_country_name }}
                         </span>
@@ -118,7 +118,7 @@
             :key="_uid"
             :param="false"
             :name="modalName"
-            :title="$t('AwAddressBlock.modal.title')"
+            :title="$t('aw.address_block.modal.title')"
             @opened="onModalOpen"
             @closed="onModalClose"
         >
@@ -126,42 +126,42 @@
                 <AwInput
                     ref="address_1"
                     v-model="address.address_1"
-                    :label="$t('AwAddressBlock.street')"
+                    :label="$t('aw.address_block.street')"
                     :error="model.errors['address.address_1']"
                 />
 
                 <AwInput
                     ref="apt"
                     v-model="address.apt"
-                    :label="$t('AwAddressBlock.apt')"
+                    :label="$t('aw.address_block.apt')"
                     :error="model.errors['address.apt']"
                 />
 
                 <AwInput
                     ref="city"
                     v-model="address.city"
-                    :label="$t('AwAddressBlock.city')"
+                    :label="$t('aw.address_block.city')"
                     :error="model.errors['address.city']"
                 />
 
                 <AwInput
                     ref="region"
                     v-model="address.region"
-                    :label="$t('AwAddressBlock.region')"
+                    :label="$t('aw.address_block.region')"
                     :error="model.errors['address.region']"
                 />
 
                 <AwInput
                     ref="postal_code"
                     v-model="address.postal_code"
-                    :label="$t('AwAddressBlock.postal_code')"
+                    :label="$t('aw.address_block.postal_code')"
                     :error="model.errors['address.postal_code']"
                 />
 
                 <AwInput
                     ref="country"
                     :value="model.address.meta.google_country_name"
-                    :label="$t('AwAddressBlock.country')"
+                    :label="$t('aw.address_block.country')"
                     :error="model.errors['address.meta.google_country_name']"
                     disabled
                 />
@@ -170,7 +170,7 @@
             <template #buttons>
                 <div class="flex items-center border-t w-full p-4">
                     <AwButton
-                        :text="$t('AwAddressBlock.modal.save')"
+                        :text="$t('aw.address_block.modal.save')"
                         style="margin-right: 1rem"
                         @click="saveAddress"
                     />
@@ -181,7 +181,7 @@
                         @click="resetAddress"
                     >
                         <span class="text-dark-blue">
-                            {{ $t('AwAddressBlock.modal.cancel') }}
+                            {{ $t('aw.address_block.modal.cancel') }}
                         </span>
                     </AwButton>
                 </div>

package/components/3_organisms/AwBirthdayPicker.vue

@@ -98,7 +98,7 @@ export default {
         label: {
             type: String,
             default() {
-                return this.$t('AwBirthdayPicker.birthday')
+                return this.$t('aw.birthday_picker.birthday')
             }
         },
 
@@ -166,7 +166,7 @@ export default {
                 key,
                 [KEY_ATTR]: key,
                 name: this._inputNames[i].name,
-                placeholder: this.$t('AwBirthdayPicker.' + key),
+                placeholder: this.$t('aw.birthday_picker.' + key),
                 pattern: MASK_MAP[key],
                 maxlength: PLACEHOLDER_MAP[key].length,
                 inputmode: 'numeric'

package/components/3_organisms/AwBottomBar.vue

@@ -12,7 +12,7 @@
 
         <slot name="bottom-bar-toggler">
             <AwMenuItemIcon
-                :text="$t('AwBottomBar.menu')"
+                :text="$t('aw.bottom_bar.menu')"
                 icon="menu"
                 @click="$store.commit('awesIo/TOGGLE_MOBILE_MENU')"
             >

package/components/3_organisms/AwCalendar/AwCalendar.vue

@@ -22,7 +22,7 @@
 
         <AwCalendarWeekdays
             :first-day="firstDay"
-            :weekday-names="$t('AwCalendar.weekdaysShort')"
+            :weekday-names="$t('aw.calendar.weekdays_short')"
         />
 
         <AwCalendarDays
@@ -32,7 +32,11 @@
             :day-class="_getDayClass"
             :day-disabled="_isDisabled"
             :show-today="showToday"
-        />
+        >
+            <template v-for="name in _proxiedDaySlots" #[name]="slotData">
+                <slot :name="name" v-bind="slotData"></slot>
+            </template>
+        </AwCalendarDays>
 
         <slot name="footer" />
     </div>

package/components/3_organisms/AwCalendar/AwCalendarView.vue

@@ -2,7 +2,7 @@
     <div class="aw-calendar" @click="onClick">
         <AwCalendarWeekdays
             :first-day="firstDay"
-            :weekday-names="$t('AwCalendar.weekdaysShort')"
+            :weekday-names="$t('aw.calendar.weekdays_short')"
         />
 
         <AwCalendarDays
@@ -11,7 +11,14 @@
             :year="year"
             :day-class="dayClass"
             :day-disabled="dayDisabled"
-        />
+        >
+            <template
+                v-for="name in $options.PROXIED_DAY_SLOTS"
+                #[name]="slotData"
+            >
+                <slot :name="name" v-bind="slotData"></slot>
+            </template>
+        </AwCalendarDays>
     </div>
 </template>
 
@@ -21,7 +28,7 @@ import { AwCalendar as _config } from '@AwConfig'
 import { CONFIG_VAR } from '@AwUtils/component'
 import AwCalendarWeekdays from '@AwOrganisms/AwCalendar/_AwCalendarWeekdays.vue'
 import AwCalendarDays from '@AwOrganisms/AwCalendar/_AwCalendarDays.vue'
-import { getDateFromEvent } from '@AwMixins/calendar'
+import { PROXIED_DAY_SLOTS, getDateFromEvent } from '@AwMixins/calendar'
 
 export default {
     name: '',
@@ -31,6 +38,8 @@ export default {
         AwCalendarDays
     },
 
+    PROXIED_DAY_SLOTS,
+
     props: {
         ...AwCalendarDays.props,
 

package/components/3_organisms/AwCalendar/_AwCalendarDay.vue

@@ -7,7 +7,14 @@
         tabindex="-1"
         class="aw-calendar__day"
     >
-        <span> {{ props.day }} </span>
+        <slot name="day" v-bind="props">
+            <slot v-if="props.isOutside" v-bind="props" name="day-outside">
+                <span> {{ props.day }} </span>
+            </slot>
+            <slot v-else v-bind="props" name="day-inside">
+                <span> {{ props.day }} </span>
+            </slot>
+        </slot>
     </button>
 </template>
 
@@ -24,7 +31,16 @@ export default {
         timestamp: {
             type: Number,
             required: true
-        }
+        },
+
+        month: {
+            type: Number,
+            required: true
+        },
+
+        isOutside: Boolean,
+
+        isToday: Boolean
     }
 }
 </script>

package/components/3_organisms/AwCalendar/_AwCalendarDays.vue

@@ -78,7 +78,7 @@ export default {
         }
     },
 
-    render(h, { props, parent }) {
+    render(h, { props, parent, scopedSlots }) {
         const {
             year,
             month,
@@ -101,24 +101,29 @@ export default {
 
         return dates.map((date) => {
             const timestamp = date.setHours(0, 0, 0, 0)
+            const isOutside = date.getMonth() !== month
+            const isToday = showToday && timestamp === today
 
             return h(AwCalendarDay, {
                 key: timestamp,
                 props: {
                     timestamp,
-                    day: date.getDate()
+                    day: date.getDate(),
+                    month,
+                    isOutside,
+                    isToday
                 },
                 class: [
                     {
-                        'aw-calendar__day_outside': date.getMonth() !== month,
-                        'aw-calendar__day_today':
-                            showToday && timestamp === today
+                        'aw-calendar__day_outside': isOutside,
+                        'aw-calendar__day_today': isToday
                     },
                     dayClass(date)
                 ],
                 attrs: {
                     disabled: dayDisabled(date)
-                }
+                },
+                scopedSlots
             })
         })
     }

package/components/3_organisms/AwCalendar/_AwCalendarNav.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import { AwCalendar as lang } from '../../../lang/en'
+import { AwCalendar as _config } from '@AwConfig'
 
 export default {
     name: 'AwCalendarNav',
@@ -52,7 +52,7 @@ export default {
         months: {
             type: Array,
             default() {
-                return this.$t('AwCalendar.months')
+                return this.$t('aw.calendar.months')
             }
         },
 
@@ -63,7 +63,7 @@ export default {
 
     computed: {
         _months() {
-            return Array.isArray(this.months) ? this.months : lang.months
+            return Array.isArray(this.months) ? this.months : _config.months
         }
     }
 }

package/components/3_organisms/AwCalendar/_AwCalendarWeekdays.vue

@@ -1,6 +1,5 @@
 <script>
 import { pathOr } from 'rambdax'
-import { AwCalendar as lang } from '../../../lang/en'
 import { AwCalendar as _config } from '@AwConfig'
 import { CONFIG_VAR } from '@AwUtils/component'
 
@@ -34,7 +33,7 @@ export default {
 
         const namesArray = Array.isArray(weekdayNames)
             ? weekdayNames
-            : lang.weekdaysShort
+            : _config.weekdaysShort
 
         const sortedNames = namesArray
             .slice(firstDay)

package/components/3_organisms/AwCodeSnippet.vue

@@ -52,7 +52,7 @@ export default {
                             click: () => copyFn(props.code)
                         }
                     },
-                    [parent.$t('AwCodeSnippet.copy')]
+                    [parent.$t('aw.code_snippet.copy')]
                 ),
                 h(
                     'pre',

package/components/3_organisms/AwCropper.vue

@@ -12,7 +12,7 @@
                 class="aw-cropper__rotate"
                 content-class="px-2"
                 theme="icon"
-                :text="$t('AwCropper.rotate')"
+                :text="$t('aw.cropper.rotate')"
                 color="default"
                 @click="rotate"
             >
@@ -32,7 +32,7 @@
 
         <slot name="buttons" :rotate="rotate" :save="save">
             <!-- save -->
-            <AwButton :text="$t('AwCropper.save')" @click="save" />
+            <AwButton :text="$t('aw.cropper.save')" @click="save" />
         </slot>
     </div>
 </template>

package/components/3_organisms/AwDate.vue

@@ -52,7 +52,7 @@
                 />
                 <AwCalendarWeekdays
                     :first-day="firstDay"
-                    :weekday-names="$t('AwCalendar.weekdaysShort')"
+                    :weekday-names="$t('aw.calendar.weekdays_short')"
                 />
                 <AwCalendarDays
                     :first-day="firstDay"

package/components/3_organisms/AwDisplayDate.vue

@@ -60,7 +60,7 @@ export default {
             }
 
             return age
-                ? `${str} (${age} ${this.$t('AwBirthdayDate.years')})`
+                ? `${str} (${age} ${this.$t('aw.birthday_date.years')})`
                 : str
         }
     }

package/components/3_organisms/AwDownloadLink.vue

@@ -109,7 +109,7 @@ export default {
             type: String,
             /* Translatable word "Download" */
             default() {
-                return this.$t('AwDownloadLink.download')
+                return this.$t('aw.download_link.download')
             }
         },
         /**
@@ -119,7 +119,7 @@ export default {
             type: String,
             /* Translatable word "Download" */
             default() {
-                return this.$t('AwDownloadLink.download')
+                return this.$t('aw.download_link.download')
             }
         },
         /**

package/components/3_organisms/AwFetchData.vue

@@ -18,7 +18,7 @@
                         slot="left"
                         class="h-5 w-5"
                     />
-                    {{ $t('AwTableBuilder.loading') }}
+                    {{ $t('aw.table_builder.loading') }}
                 </AwChip>
             </slot>
         </div>

package/components/3_organisms/AwIslandAvatar.vue

@@ -58,7 +58,7 @@
 
                     <AwDropdownButton
                         v-if="zoomable && src"
-                        :text="$t('AwPageUser.zoom')"
+                        :text="$t('aw.page_user.zoom')"
                         @click="openZoomModal"
                     />
                     <label
@@ -66,7 +66,7 @@
                         class="aw-dropdown-button aw-dropdown-button_default"
                     >
                         <span tabindex="-1">
-                            {{ $t('AwPageUser.upload') }}
+                            {{ $t('aw.page_user.upload') }}
                         </span>
                         <input
                             class="sr-only"
@@ -77,7 +77,7 @@
                     </label>
                     <AwDropdownButton
                         v-if="editable && src"
-                        :text="$t('AwPageUser.remove')"
+                        :text="$t('aw.page_user.remove')"
                         color="error"
                         @click="removeAvatar"
                     />
@@ -144,7 +144,7 @@
                 v-if="editable"
                 ref="cropModal"
                 :param="null"
-                :title="$t('AwPageUser.modalTitle')"
+                :title="$t('aw.page_user.modal_title')"
                 theme="fullscreen"
             >
                 <AwCropper :src="uploadedAvatar" @save="saveAvatar" />

package/components/3_organisms/AwModal.vue

@@ -29,8 +29,8 @@
 
                         <AwButton
                             :class="elClasses.close"
-                            :title="$t('AwModal.close')"
-                            :aria-label="$t('AwModal.close')"
+                            :title="$t('aw.modal.close')"
+                            :aria-label="$t('aw.modal.close')"
                             @click.prevent="close()"
                             theme="ghost"
                             color="default"