renusify 2.5.1 → 3.0.0

package/components/bar/scss/bottomNav.scss

@@ -1,67 +0,0 @@
-@use "sass:map";
-@use "../../../style/variables/base";
-@use "../../../style/functions";
-@use "../../../style/mixins";
-
-$bottom-nav-btn-font-size: functions.map-metro-get(base.$headings, 'label-1', 'size') !default;
-
-.#{base.$prefix}bottom-navigation {
-  bottom: 0;
-  display: flex;
-  left: 0;
-  justify-content: center;
-  width: 100%;
-  height: base.$bottom-nav-height;
-  background-color: var(--color-sheet-container);
-  color: var(--color-on-sheet);
-  @include mixins.typography(base.$headings, 'body-3');
-
-  .router-link-exact-active {
-    color: var(--color-one)
-  }
-
-  .#{base.$prefix}btn {
-    border-radius: 0;
-    box-shadow: none;
-    flex: 0 1 auto;
-    font-size: $bottom-nav-btn-font-size;;
-    height: inherit !important;
-    max-width: base.$bottom-nav-btn-max-width;
-    min-width: base.$bottom-nav-btn-min-width;
-    position: relative;
-    text-transform: none;
-
-    &:after {
-      content: none
-    }
-
-    .btn-content {
-      flex-direction: column-reverse;
-      height: inherit;
-    }
-
-    .#{base.$prefix}icon {
-      margin-bottom: 4px
-    }
-
-    > *:not(.#{base.$prefix}icon) {
-      line-height: 1.2
-    }
-
-    &.router-link-exact-active {
-      color: inherit
-    }
-  }
-
-  &.bottom-navigation-fixed {
-    position: fixed;
-    z-index: map.get(base.$z-index, 'default')
-  }
-
-  &.bottom-navigation-grow {
-    .#{base.$prefix}btn {
-      width: 100%;
-      max-width: 100%;
-    }
-  }
-}

package/components/bar/scss/toolbar.scss

@@ -1,174 +0,0 @@
-@use "sass:map";
-@use "../../../style/variables/base";
-@use "../../../style/mixins";
-
-.#{base.$prefix}toolbar {
-  flex: 1 1 auto;
-  background-color: var(--color-sheet-container);
-  color: var(--color-on-sheet);
-
-  .toolbar-mobile {
-    .toolbar-close {
-      width: 40px;
-      height: 40px;
-      position: absolute;
-      transition: 0.5s all map.get(base.$transition, 'swing');
-      @include mixins.rtl() {
-        right: -40px;
-      }
-      @include mixins.ltr() {
-        left: -40px;
-      }
-    }
-    .toolbar-side{
-      width: 300px;
-      height: 100%;
-      overflow: auto;
-      position: absolute;
-      transition: .3s all map.get(base.$transition, 'swing');
-      background-color: var(--color-sheet);
-      color: var(--color-on-sheet);
-      @include mixins.rtl() {
-        right: -300px;
-      }
-      @include mixins.ltr() {
-        left: -300px;
-      }
-    }
-    .shadow {
-      position: fixed;
-      top: 0;
-      width: 0;
-      height: 100vh;
-      z-index: map.get(base.$z-index, 'important');
-      background-color: var(--color-overlay);
-      transition: .1s width map.get(base.$transition, 'swing');
-      overflow: hidden;
-      @include mixins.rtl() {
-        right: 0;
-      }
-      @include mixins.ltr() {
-        left: 0;
-      }
-    }
-    &.toolbar-open{
-      .shadow {
-        width: 100vw;
-      }
-      .toolbar-side {
-        transition: 0.3s all map.get(base.$transition, 'swing');
-        @include mixins.rtl() {
-          right: 0;
-        }
-        @include mixins.ltr() {
-          left: 0;
-        }
-      }
-      .toolbar-close{
-        @include mixins.rtl() {
-          right: 300px;
-        }
-        @include mixins.ltr() {
-          left: 300px;
-        }
-      }
-    }
-  }
-
-  .toolbar-content {
-    height: base.$toolbar-height;
-    padding: base.$toolbar-content-padding-y base.$toolbar-content-padding-x;
-    align-items: center;
-    display: flex;
-    position: relative;
-    z-index: map.get(base.$z-index, 'medium');
-  }
-
-  .toolbar-items {
-    display: flex;
-    height: inherit;
-    align-items: center;
-  }
-
-  .menu-title {
-    position: relative;
-
-    &:before {
-      content: '-';
-      position: absolute;
-      @include mixins.rtl() {
-        right: -8px;
-      }
-      @include mixins.ltr() {
-        left: -8px;
-      }
-    }
-  }
-
-  .menu-list {
-    transition: 0.3s map.get(base.$transition, 'swing');
-    min-width: 200px;
-    max-height: 500px;
-    overflow-y: auto;
-    @include mixins.rtl() {
-      border-right: 1px solid;
-    }
-    @include mixins.ltr() {
-      border-left: 1px solid;
-    }
-  }
-
-  .menu-hide {
-    max-height: 0;
-    overflow: hidden;
-  }
-
-  .toolbar-item {
-    padding: 20px 5px;
-    font-size: 1.125rem;
-    position: relative;
-
-    .toolbar-childs {
-      transition: 0.3s map.get(base.$transition, 'swing');
-      position: absolute;
-      top: 40px;
-      max-height: 0;
-      overflow: hidden;
-      z-index: map.get(base.$z-index, 'important');
-    }
-
-    &:before {
-      transition: base.$primary-transition;
-      content: '';
-      width: 0;
-      position: absolute;
-      bottom: 0;
-      color: var(--color-one);
-      border-bottom: 4px solid;
-    }
-
-    &:hover {
-      .toolbar-childs {
-        overflow: auto;
-        max-height: 500px;
-      }
-
-      &:before {
-        width: 90%;
-      }
-    }
-  }
-
-  &.toolbar-fixed {
-    position: fixed;
-    top: 0;
-    width: 100%;
-    z-index: map.get(base.$z-index, 'medium');
-  }
-
-  &.toolbar-sticky {
-    position: sticky;
-    top: 0;
-    z-index: map.get(base.$z-index, 'medium');
-  }
-}

package/components/bar/toolbar/index.js

@@ -1,8 +0,0 @@
-export * as rToolbar from './index.vue'
-export * as l_container from '../../container/index.js'
-export * as l_spacer from '../../container/spacer.js'
-export * as l_divider from '../../container/divider.js'
-export * as l_search from '../../searchBox/index.js'
-export * as l_img from '../../img/index.js'
-export * as l_btn from '../../button/index.js'
-export * as l_icon from '../../icon/index.js'

package/components/bar/toolbar/index.vue

@@ -1,35 +0,0 @@
-<template>
-  <laptop v-if="!$r.breakpoint.mdAndDown">
-    <template #search="{item}">
-      <slot name="search" :item="item"></slot>
-    </template>
-    <template #logo>
-      <slot name="logo"></slot>
-    </template>
-  </laptop>
-  <mobile v-else>
-    <template #search="{item}">
-      <slot name="search" :item="item"></slot>
-    </template>
-    <template #logo>
-      <slot name="logo"></slot>
-    </template>
-  </mobile>
-</template>
-
-<script>
-import '../scss/toolbar.scss'
-import {defineAsyncComponent} from 'vue'
-
-export default {
-  name: 'r-toolbar',
-  components: {
-    Laptop: defineAsyncComponent(() =>
-        import('./laptop.vue')
-    ),
-    Mobile: defineAsyncComponent(() =>
-        import('./mobile.vue')
-    )
-  }
-}
-</script>

package/components/bar/toolbar/laptop.vue

@@ -1,33 +0,0 @@
-<template>
-  <div :class="classes">
-    <header>
-      <r-container class="pa-0">
-        <div class="toolbar-content">
-          <menu-laptop :menu="menu"></menu-laptop>
-          <r-spacer></r-spacer>
-          <div v-if="search" class="mt-n5">
-            <r-search-box autofocus closable :label="searchLabel" :url="search">
-              <template v-slot="{item}">
-                <slot name="search" :item="item"></slot>
-              </template>
-            </r-search-box>
-          </div>
-          <slot name="logo">
-            <div v-if="logo">
-              <r-img :src="logo" alt="logo" :width="logoW" :height="logoH"></r-img>
-            </div>
-          </slot>
-        </div>
-      </r-container>
-    </header>
-  </div>
-</template>
-<script>
-import {defineAsyncComponent} from 'vue'
-import {toolbar} from './mixin.js'
-
-export default {
-  components: {MenuLaptop: defineAsyncComponent(() => import('./menuLaptop.vue'))},
-  mixins: [toolbar]
-}
-</script>

package/components/bar/toolbar/menuChilds.vue

@@ -1,41 +0,0 @@
-<template>
-    <div class="ms-1 ps-2 menu-list">
-        <div v-for="(item,i) in menu" :key="i">
-            <div class="d-flex h-space-between">
-                <component class="menu-title py-1 cursor-pointer"
-                           :is="item.to?'router-link':'span'"
-                           @click.prevent="item.hash&&go(item.hash)"
-                           :to="item.to">{{item.title}}</component>
-            <r-icon class="me-1" v-if="item.childs" v-html="open===i?$r.icons.minus:$r.icons.plus"
-                    @click.prevent.stop="open===i?open=null:open=i"></r-icon>
-                </div>
-            <menu-childs v-if="item.childs" :class="{'menu-hide':open!==i}" :menu="item.childs"></menu-childs>
-        </div>
-    </div>
-</template>
-<script>
-    export default {
-        name:'menu-childs',
-        props:{
-            menu:Array
-        },
-        data(){
-            return{
-                open:null
-            }
-        },
-        methods:{
-            go(hash){
-                if(this.$route.name!==hash.to.name){
-                this.$router.push(hash.to)
-                }
-                setTimeout(()=>{
-                    const el=document.getElementById(hash.id)
-                    if(el!==null){
-                    el.scrollIntoView()
-                    }
-                },500)
-            }
-        }
-    }
-</script>

package/components/bar/toolbar/menuLaptop.vue

@@ -1,41 +0,0 @@
-<template>
-    <div class="toolbar-items">
-        <component :is="item.to?'router-link':'span'"
-                   class="toolbar-item me-2 cursor-pointer"
-                   v-for="(item,i) in menu"
-                   :key="i"
-                   @click.prevent="item.hash&&go(item.hash)"
-                   :to="item.to">
-            {{item.title}}
-            <r-icon v-if="item.childs" v-html="$r.icons.chevron_down"></r-icon>
-          <div v-if="item.childs" class="toolbar-childs mt-7">
-            <menu-childs class="pa-2" :menu="item.childs"></menu-childs>
-          </div>
-        </component>
-    </div>
-</template>
-<script>
-import {defineAsyncComponent} from 'vue'
-
-export default {
-  name: 'menu-laptop',
-  components: {MenuChilds:defineAsyncComponent(()=>import('./menuChilds.vue'))},
-  props: {menu: Array},
-  data() {
-    return {}
-  },
-  methods: {
-    go(hash) {
-      if (this.$route.name !== hash.to.name) {
-        this.$router.push(hash.to)
-                }
-                setTimeout(()=>{
-                    const el=document.getElementById(hash.id)
-                    if(el!==null){
-                    el.scrollIntoView()
-                    }
-                },500)
-            }
-        }
-    }
-</script>

package/components/bar/toolbar/menuMob.vue

@@ -1,39 +0,0 @@
-<template>
-    <div class="toolbar-mobile" :class="{'toolbar-open':modelValue}">
-        <div class="shadow" @click.prevent="close">
-            <aside class="toolbar-side pt-5">
-                <div v-if="logo" class="text-center">
-                    <r-img :src="logo" alt="logo" :width="logoW" :height="logoH"></r-img>
-                    <r-divider class="my-5"></r-divider>
-                </div>
-                <menu-childs :menu="menu"></menu-childs>
-            </aside>
-            <div class="toolbar-close pa-2" @click.prevent="close">
-                <r-icon v-html="$r.icons.close"></r-icon>
-            </div>
-        </div>
-    </div>
-</template>
-<script>
-import {defineAsyncComponent} from 'vue'
-
-export default {
-    name: 'menu-mobile',
-    components: {MenuChilds: defineAsyncComponent(() => import('./menuChilds.vue'))},
-    props: {
-        logo: String,
-        logoW: Number,
-        logoH: Number,
-        menu: Array,
-        modelValue: Boolean
-    },
-    data() {
-        return {}
-    },
-    methods: {
-        close() {
-            this.$emit('update:modelValue', false)
-        }
-    }
-}
-</script>

package/components/bar/toolbar/mixin.js

@@ -1,43 +0,0 @@
-export const toolbar= {
-    props: {
-            menu: {
-                type: Array,
-                default: () => {
-                    return []
-                }
-            },
-            logo: String,
-            logoW: {type: Number, default: 180},
-            logoH: {type: Number, default: 60},
-            search: String,
-            searchLabel: {type:String,default:'search'},
-            fixed: Boolean,
-            flat: Boolean,
-            sticky: Boolean,
-            tile: {
-                type: Boolean,
-                default: true
-            }
-        },
-        data() {
-            return {
-                open: false
-            }
-        },
-        watch: {
-            '$route': function () {
-                this.open = false
-            }
-        },
-        computed: {
-            classes() {
-                let a = {
-                    'toolbar-fixed': this.fixed,
-                    'toolbar-sticky': this.sticky,
-                    'elevation-md': !this.flat
-                }
-                a[this.$r.prefix + 'toolbar'] = true
-                return a
-            }
-        }
-}

package/components/bar/toolbar/mobile.vue

@@ -1,34 +0,0 @@
-<template>
-  <div :class="classes">
-    <header>
-      <r-container class="pa-0">
-        <div class="toolbar-content">
-          <r-btn icon text @click.prevent="open=!open">
-            <r-icon v-html="$r.icons.menu"></r-icon>
-          </r-btn>
-          <r-spacer></r-spacer>
-          <div v-if="search" class="mt-n5">
-            <r-search-box closable autofocus
-                          :label="searchLabel" :url="search">
-              <template v-slot="{item}">
-                <slot name="search" :item="item"></slot>
-              </template>
-            </r-search-box>
-          </div>
-          <slot name="logo"></slot>
-        </div>
-      </r-container>
-    </header>
-    <menu-mobile :menu="menu" v-model="open" :logo="logo"
-                 :logoW="logoW" :logoH="logoH"></menu-mobile>
-  </div>
-</template>
-<script>
-import {defineAsyncComponent} from 'vue'
-import {toolbar} from './mixin.js'
-
-export default {
-  components: {MenuMobile: defineAsyncComponent(() => import('./menuMob.vue'))},
-  mixins: [toolbar]
-}
-</script>

package/components/breadcrumb/bredcrumbItem.vue

@@ -1,39 +0,0 @@
-<template>
-    <component
-            :class="`${item.type==='item'?'breadcrumb-item':'breadcrumb-divider'} ${item.disabled?'breadcrumb-item-disabled':''}`"
-            v-bind="att"
-            :is="route.tag"
-    >
-        <r-icon v-if="item.type==='divider'" v-html="item.name"></r-icon>
-        <div class="breadcrumbs-title" v-else>{{item.name}}</div>
-    </component>
-</template>
-
-<script>
-import {roots} from '../../tools/rootable.js'
-
-export default {
-      name: 'rBreadcrumbItem',
-      mixins: [roots],
-      props: {
-        item: Object
-      },
-      computed: {
-        att() {
-          let res = {}
-          if (this.href) {
-            res['href'] = this.route.data.attrs.href
-          }
-
-                if (this.target) {
-                    res['rel'] = 'noreferrer'
-                    res['target'] = this.route.data.attrs.target
-                }
-                if (this.to) {
-                    res['to'] = this.route.data.props.to
-                }
-                return res
-            },
-        }
-    }
-</script>

package/components/breadcrumb/index.js

@@ -1,3 +0,0 @@
-export * as rBreadcrumbs from './index.vue'
-export * as rBreadcrumbItem from './bredcrumbItem.vue'
-export * as l_icon from '../icon/index.js'

package/components/breadcrumb/index.vue

@@ -1,71 +0,0 @@
-<template>
-  <transition name="slide-up">
-    <ul :class="classes" v-if="genItems.length>0">
-      <li
-        :key="key"
-        v-for="(item,key) in genItems">
-
-        <r-breadcrumb-item :href="item.href"
-                           :item="item"
-                           :to="item.to"
-                           @click.prevent="go(item)"></r-breadcrumb-item>
-      </li>
-    </ul>
-  </transition>
-</template>
-
-<script>
-import './style.scss'
-
-export default {
-  name: 'r-breadcrumbs',
-  props: {
-    sheet: {
-      type: Boolean,
-      default: true
-    },
-    divider: {
-      type: String
-    },
-    items: {
-      type: Array,
-      default: () => []
-    }
-  },
-  emits:['click'],
-  computed: {
-    classes() {
-      let a = {}
-      a[`breadcrumbs-sheet`] = this.sheet
-      a[`${this.$r.prefix}breadcrumbs`] = true
-      return a
-    },
-    genItems () {
-      const lists = []
-      const lng=this.items.length
-      for (let i = 0; i < lng; i++) {
-        if (i !== 0) {
-          lists.push({ name: this.divider||this.$r.icons.chevron_right, type: 'divider' })
-        }
-        let c = {}
-        c = this.items[i]
-        c.type = 'item'
-
-        if (i === (this.items.length - 1)) {
-          c.disabled = true
-        } else {
-          c.disabled = false
-        }
-        lists.push(c)
-      }
-
-      return lists
-    }
-  },
-  methods: {
-    go (key) {
-      this.$emit('click', key)
-    }
-  }
-}
-</script>

package/components/breadcrumb/style.scss

@@ -1,51 +0,0 @@
-@use "../../style/variables/base";
-@use "../../style/mixins/container" as mixins;
-
-.#{base.$prefix}breadcrumbs {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  flex: 0 1 auto;
-  list-style-type: none;
-  margin: 0 !important;
-  padding: 0 14px;
-
-  &.breadcrumbs-sheet {
-    background-color: var(--color-sheet-container);
-    color: var(--color-on-sheet);
-  }
-
-  .breadcrumb-divider, .breadcrumb-item-disabled, .#{base.$prefix}icon {
-    color: var(--color-border)
-  }
-
-
-  li {
-    align-items: center;
-    display: inline-flex;
-    font-size: 1rem;
-
-    &:nth-child(even) {
-      padding: 0 12px
-    }
-
-    @include mixins.media-breakpoint-down('md') {
-      &:nth-child(even) {
-        padding: 0 4px
-      }
-    }
-
-  }
-
-  .breadcrumb-item {
-    align-items: center;
-    display: inline-flex;
-    text-decoration: none;
-    transition: 0.3s base.$primary-transition;
-    cursor: pointer;
-
-    &-disabled {
-      pointer-events: none
-    }
-  }
-}