@neovici/cosmoz-bottom-bar 7.4.0 → 7.5.0
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/cosmoz-bottom-bar.js +28 -1
- package/package.json +2 -2
package/cosmoz-bottom-bar.js
CHANGED
|
@@ -7,13 +7,40 @@ import { FlattenedNodesObserver } from '@polymer/polymer/lib/utils/flattened-nod
|
|
|
7
7
|
import { Debouncer } from '@polymer/polymer/lib/utils/debounce.js';
|
|
8
8
|
import { timeOut } from '@polymer/polymer/lib/utils/async';
|
|
9
9
|
import { html } from 'lit-html';
|
|
10
|
+
import { useActivity } from '@neovici/cosmoz-utils/keybindings/use-activity';
|
|
10
11
|
import { defaultPlacement } from '@neovici/cosmoz-dropdown';
|
|
11
12
|
import template from './cosmoz-bottom-bar.html.js';
|
|
13
|
+
import { hauntedPolymer } from '@neovici/cosmoz-utils';
|
|
12
14
|
|
|
13
15
|
const BOTTOM_BAR_TOOLBAR_SLOT = 'bottom-bar-toolbar',
|
|
14
16
|
BOTTOM_BAR_MENU_SLOT = 'bottom-bar-menu',
|
|
15
17
|
rendered = Symbol('rendered');
|
|
16
18
|
|
|
19
|
+
export const openMenu = Symbol('openMenu');
|
|
20
|
+
|
|
21
|
+
const openActionsMenu = (host) => {
|
|
22
|
+
const dropdown = host.$.dropdown;
|
|
23
|
+
|
|
24
|
+
if (dropdown.hasAttribute('hidden')) return;
|
|
25
|
+
|
|
26
|
+
//TODO: Clean up when open function is implemented for cosmoz-dropdown-menu
|
|
27
|
+
dropdown.shadowRoot
|
|
28
|
+
.querySelector('cosmoz-dropdown')
|
|
29
|
+
.shadowRoot.getElementById('dropdownButton')
|
|
30
|
+
.click();
|
|
31
|
+
},
|
|
32
|
+
useBottomBar = (host) => {
|
|
33
|
+
useActivity(
|
|
34
|
+
{
|
|
35
|
+
activity: openMenu,
|
|
36
|
+
callback: () => openActionsMenu(host),
|
|
37
|
+
check: () => host.active && !host.hasAttribute('hide-actions'),
|
|
38
|
+
element: () => host.$.dropdown,
|
|
39
|
+
},
|
|
40
|
+
[host.active],
|
|
41
|
+
);
|
|
42
|
+
};
|
|
43
|
+
|
|
17
44
|
/**
|
|
18
45
|
* `<cosmoz-bottom-bar>` is a horizontal responsive bottom toolbar containing items that
|
|
19
46
|
* can be used for actions.
|
|
@@ -34,7 +61,7 @@ const BOTTOM_BAR_TOOLBAR_SLOT = 'bottom-bar-toolbar',
|
|
|
34
61
|
* @demo demo/bottom-bar.html Basic Demo
|
|
35
62
|
* @demo demo/bottom-bar-match-parent.html match parent Demo
|
|
36
63
|
*/
|
|
37
|
-
class CosmozBottomBar extends PolymerElement {
|
|
64
|
+
class CosmozBottomBar extends hauntedPolymer(useBottomBar)(PolymerElement) {
|
|
38
65
|
static get template() {
|
|
39
66
|
// eslint-disable-line max-lines-per-function
|
|
40
67
|
return template;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neovici/cosmoz-bottom-bar",
|
|
3
|
-
"version": "7.
|
|
3
|
+
"version": "7.5.0",
|
|
4
4
|
"description": "A responsive bottom-bar that can house buttons/actions and a menu for the buttons that won't fit the available width.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"polymer",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"dependencies": {
|
|
62
62
|
"@neovici/cosmoz-collapse": "^1.5.0",
|
|
63
63
|
"@neovici/cosmoz-dropdown": "^4.0.0",
|
|
64
|
-
"@neovici/cosmoz-utils": "^6.
|
|
64
|
+
"@neovici/cosmoz-utils": "^6.13.1",
|
|
65
65
|
"@pionjs/pion": "^2.5.2",
|
|
66
66
|
"@polymer/polymer": "^3.3.0",
|
|
67
67
|
"lit-html": "^2.0.0 || ^3.0.0"
|