@stonecrop/desktop 0.2.22 → 0.2.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/desktop.js +1468 -1479
- package/dist/desktop.js.map +1 -1
- package/dist/desktop.umd.cjs +15 -15
- package/dist/desktop.umd.cjs.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +5 -5
- package/src/components/ActionSet.vue +1 -1
- package/src/components/SheetNav.vue +11 -11
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
#chevron[data-v-
|
|
1
|
+
#chevron[data-v-f4328a22]{position:relative;transform:rotate(90deg)}.leftBar[data-v-f4328a22],.rightBar[data-v-f4328a22]{transition-duration:.225s;transition-property:transform}.leftBar[data-v-f4328a22],.action-set.collapse.hovered-and-closed:hover .leftBar[data-v-f4328a22]{transform-origin:33.4% 50%;transform:rotate(90deg)}.rightBar[data-v-f4328a22],.action-set.collapse.hovered-and-closed:hover .rightBar[data-v-f4328a22]{transform-origin:67% 50%;transform:rotate(-90deg)}.rightBar[data-v-f4328a22]{position:absolute;top:0;left:0}.action-set.collapse:hover .leftBar[data-v-f4328a22],.action-set.collapse:hover .rightBar[data-v-f4328a22]{transform:rotate(0)}.action-set[data-v-f4328a22]{position:fixed;top:10px;right:10px;padding:20px;box-shadow:0 1px 2px #1927340d,0 0 4px #1927341a;border-radius:10px;display:flex;flex-direction:row-reverse;background-color:#fff;overflow:hidden}.action-menu-icon[data-v-f4328a22]{position:absolute;top:6px;right:8px}.action-menu-icon svg[data-v-f4328a22]{fill:#333}.action-set.collapse[data-v-f4328a22],.action-set.collapse.hovered-and-closed[data-v-f4328a22]:hover{max-width:25px;overflow:hidden;-webkit-transition:max-width .5s ease-in-out;-moz-transition:max-width .5s ease-in-out;-o-transition:max-width .5s ease-in-out;transition:max-width .5s ease-in-out}.action-set.collapse .action-element[data-v-f4328a22],.action-set.collapse.hovered-and-closed:hover .action-element[data-v-f4328a22]{opacity:0;-webkit-transition:opacity .25s ease-in-out;-moz-transition:opacity .25s ease-in-out;-o-transition:opacity .25s ease-in-out;transition:opacity .25s ease-in-out;transition-delay:0s}.action-set.collapse[data-v-f4328a22]:hover{max-width:500px}.action-set.collapse.open-set[data-v-f4328a22]:hover{overflow:visible!important}.action-set.collapse.hovered-and-closed:hover .action-element[data-v-f4328a22]{opacity:0!important}.action-set.collapse:hover .action-element[data-v-f4328a22]{opacity:100!important}.action-element[data-v-f4328a22]{margin-left:5px;margin-right:5px}button.button-default[data-v-f4328a22]{background-color:#fff;padding:5px 12px;border-radius:3px;box-shadow:#0000000d 0 .5px,#00000014 0 0 0 1px,#0000000d 0 2px 4px;border:none;cursor:pointer;white-space:nowrap}button.button-default[data-v-f4328a22]:hover{background-color:#f2f2f2}.dropdown-container[data-v-f4328a22]{position:relative}.dropdown[data-v-f4328a22]{position:absolute;top:5px;right:0;min-width:200px;box-shadow:0 .5rem 1rem #0000002e;border-radius:10px;background-color:#fff;padding:10px}button.dropdown-item[data-v-f4328a22]{width:100%;padding:8px 5px;text-align:left;border:none;background-color:#fff;cursor:pointer;border-radius:5px}button.dropdown-item[data-v-f4328a22]:hover{background-color:#f2f2f2}footer[data-v-4f7a2d32]{position:fixed;bottom:0;width:100%;background-color:transparent;height:2rem;z-index:100;text-align:left;font-size:100%;display:flex;justify-content:right;padding-bottom:.2rem}ul[data-v-4f7a2d32]{display:flex;flex-direction:row-reverse}.tabs li[data-v-4f7a2d32]{float:left;list-style-type:none;position:relative;margin-left:-1px}.tabs a[data-v-4f7a2d32]{float:left;padding:1ch 4ch 4ch;text-decoration:none;color:#000;background:#aaa;outline:2px solid inherit;outline-offset:-2px;-webkit-border-top-left-radius:15px;-webkit-border-top-right-radius:15px;-moz-border-radius-topleft:15px;-moz-border-radius-topright:15px;border-top-left-radius:15px;border-top-right-radius:15px;border:1px solid #ccc}.tabs .router-link-active[data-v-4f7a2d32]{z-index:3}.router-link-active[data-v-4f7a2d32]{background:#827553;color:#000;box-shadow:#999}.tabs li[data-v-4f7a2d32]:before,.tabs li[data-v-4f7a2d32]:after,.tabs li a[data-v-4f7a2d32]:before,.tabs li a[data-v-4f7a2d32]:after{position:absolute;bottom:0}.tabs li[data-v-4f7a2d32]:last-child:after,.tabs li:last-child a[data-v-4f7a2d32]:after,.tabs li[data-v-4f7a2d32]:first-child:before,.tabs li:first-child a[data-v-4f7a2d32]:before,.tabs .router-link-active[data-v-4f7a2d32]:after,.tabs .router-link-active[data-v-4f7a2d32]:before,.tabs .router-link-active a[data-v-4f7a2d32]:after,.tabs .router-link-active a[data-v-4f7a2d32]:before{content:""}.tabs .router-link-active[data-v-4f7a2d32]:before,.tabs .router-link-active[data-v-4f7a2d32]:after{background:transparent;z-index:1}.tabs li[data-v-4f7a2d32]:before,.tabs li[data-v-4f7a2d32]:after{background:transparent;width:10px;height:10px}.tabs li[data-v-4f7a2d32]:before{left:-10px}.tabs li[data-v-4f7a2d32]:after{right:-10px}.tabs li a[data-v-4f7a2d32]:after,.tabs li a[data-v-4f7a2d32]:before{width:20px;height:20px;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;background:transparent;z-index:2}.tabs .router-link-active a[data-v-4f7a2d32]:after,.tabs .router-link-active a[data-v-4f7a2d32]:before{background:transparent}.tabs li:first-child.router-link-active a[data-v-4f7a2d32]:before,.tabs li:last-child.router-link-active a[data-v-4f7a2d32]:after{background:transparent}.tabs li a[data-v-4f7a2d32]:before{left:-20px}.tabs li a[data-v-4f7a2d32]:after{right:-20px}.hidebreadcrumbs a[data-v-4f7a2d32]{width:1ch;min-width:calc(66px - 4ch);background-color:#fff;padding-left:2ch;padding-right:2ch;padding-top:3px;font-size:150%;text-align:center}.rotated[data-v-4f7a2d32]{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transition:transform .25s}.unrotated[data-v-4f7a2d32]{transform:rotate(0);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transition:transform .25s}li[data-v-4f7a2d32]:active,li[data-v-4f7a2d32]:hover,li[data-v-4f7a2d32]:focus,li>a[data-v-4f7a2d32]:active,li>a[data-v-4f7a2d32]:hover,li>a[data-v-4f7a2d32]:focus{z-index:3}a[data-v-4f7a2d32]:active,a[data-v-4f7a2d32]:hover,a[data-v-4f7a2d32]:focus{outline:2px solid black;z-index:3}.hometab a[data-v-4f7a2d32]{width:1ch;min-width:calc(66px - 4ch);background-color:#fff;padding-left:2ch;padding-right:2ch;padding-top:6px;text-align:center}.hometab svg[data-v-4f7a2d32]{height:14pt;width:14pt}.searchtab a[data-v-4f7a2d32]{min-width:calc(66px - 4ch);background-color:#fff;padding-left:2ch;padding-right:2ch;padding-top:11px;font-size:150%;align-items:center}.searchtab svg[data-v-4f7a2d32]{padding-left:.25ch}.searchtab input[data-v-4f7a2d32]{margin-top:-4px;outline:none;border:none;border-bottom:1.5px solid black;background-color:transparent;text-align:right;font-size:11pt}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stonecrop/desktop",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.24",
|
|
4
4
|
"description": "Desktop-specific components for Stonecrop UI",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -35,10 +35,10 @@
|
|
|
35
35
|
"immutable": "^4.3.0",
|
|
36
36
|
"vue": "^3.4.23",
|
|
37
37
|
"xstate": "~4.37.2",
|
|
38
|
-
"@stonecrop/aform": "0.2.
|
|
39
|
-
"@stonecrop/atable": "0.2.
|
|
40
|
-
"@stonecrop/stonecrop": "0.2.
|
|
41
|
-
"@stonecrop/themes": "0.2.
|
|
38
|
+
"@stonecrop/aform": "0.2.24",
|
|
39
|
+
"@stonecrop/atable": "0.2.24",
|
|
40
|
+
"@stonecrop/stonecrop": "0.2.24",
|
|
41
|
+
"@stonecrop/themes": "0.2.24"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"@miragejs/graphql": "^0.1.13",
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
</div>
|
|
39
39
|
</div>
|
|
40
40
|
<div style="margin-right: 30px"></div>
|
|
41
|
-
<div class="action-element" v-for="(el, index) in _elements" :key="
|
|
41
|
+
<div class="action-element" v-for="(el, index) in _elements" :key="el.label">
|
|
42
42
|
<button v-if="el.elementType == 'button'" :onclick="el.action" class="button-default">{{ el.label }}</button>
|
|
43
43
|
<div v-if="el.elementType == 'dropdown'">
|
|
44
44
|
<button class="button-default" @click="toggleDropdown(index)">{{ el.label }}</button>
|
|
@@ -64,8 +64,8 @@
|
|
|
64
64
|
</a>
|
|
65
65
|
</li>
|
|
66
66
|
<li
|
|
67
|
-
v-for="
|
|
68
|
-
:key="
|
|
67
|
+
v-for="breadcrumb in breadcrumbs"
|
|
68
|
+
:key="breadcrumb.title"
|
|
69
69
|
:style="{ display: breadcrumbsVisibile ? 'block' : 'none' }">
|
|
70
70
|
<router-link tabindex="0" :to="breadcrumb.to"> {{ breadcrumb.title }} </router-link>
|
|
71
71
|
</li>
|
|
@@ -74,13 +74,17 @@
|
|
|
74
74
|
</template>
|
|
75
75
|
|
|
76
76
|
<script setup lang="ts">
|
|
77
|
-
import { computed, nextTick,
|
|
77
|
+
import { computed, nextTick, ref } from 'vue'
|
|
78
78
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
}
|
|
79
|
+
withDefaults(
|
|
80
|
+
defineProps<{
|
|
81
|
+
breadcrumbs?: { title: string; to: string }[]
|
|
82
|
+
}>(),
|
|
83
|
+
{
|
|
84
|
+
breadcrumbs: () => [],
|
|
85
|
+
}
|
|
86
|
+
)
|
|
82
87
|
|
|
83
|
-
const breadcrumbs = ref([])
|
|
84
88
|
const breadcrumbsVisibile = ref(true)
|
|
85
89
|
const searchVisibile = ref(false)
|
|
86
90
|
const searchText = ref('')
|
|
@@ -90,10 +94,6 @@ const rotateHideTabIcon = computed(() => {
|
|
|
90
94
|
return breadcrumbsVisibile.value ? 'unrotated' : 'rotated'
|
|
91
95
|
})
|
|
92
96
|
|
|
93
|
-
onMounted(() => {
|
|
94
|
-
breadcrumbs.value = props.breadcrumbs || []
|
|
95
|
-
})
|
|
96
|
-
|
|
97
97
|
const toggleBreadcrumbs = () => {
|
|
98
98
|
breadcrumbsVisibile.value = !breadcrumbsVisibile.value
|
|
99
99
|
}
|