@aquera/nile-elements 0.0.6-11 → 0.0.6-12
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/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle/nile-button-toggle.css.js +4 -0
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle/nile-button-toggle.css.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle/nile-button-toggle.d.ts +4 -2
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle/nile-button-toggle.js +12 -2
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle/nile-button-toggle.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle-group/nile-button-toggle-group.d.ts +6 -2
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle-group/nile-button-toggle-group.js +30 -7
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/src/nile-button-toggle-group/nile-button-toggle-group.js.map +1 -1
- package/.rollup.cache/opt/atlassian/pipelines/agent/build/packages/nile-elements/dist/tsconfig.tsbuildinfo +1 -1
- package/demo/index.html +1 -1
- package/dist/index.iife.js +6 -4
- package/dist/nile-button-toggle/index.cjs.js +1 -1
- package/dist/nile-button-toggle/index.esm.js +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.cjs.js +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.cjs.js.map +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.css.cjs.js +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.css.cjs.js.map +1 -1
- package/dist/nile-button-toggle/nile-button-toggle.css.esm.js +4 -0
- package/dist/nile-button-toggle/nile-button-toggle.esm.js +3 -3
- package/dist/nile-button-toggle-group/index.cjs.js +1 -1
- package/dist/nile-button-toggle-group/index.esm.js +1 -1
- package/dist/nile-button-toggle-group/nile-button-toggle-group.cjs.js +1 -1
- package/dist/nile-button-toggle-group/nile-button-toggle-group.cjs.js.map +1 -1
- package/dist/nile-button-toggle-group/nile-button-toggle-group.esm.js +1 -3
- package/dist/src/nile-button-toggle/nile-button-toggle.css.js +4 -0
- package/dist/src/nile-button-toggle/nile-button-toggle.css.js.map +1 -1
- package/dist/src/nile-button-toggle/nile-button-toggle.d.ts +4 -2
- package/dist/src/nile-button-toggle/nile-button-toggle.js +12 -2
- package/dist/src/nile-button-toggle/nile-button-toggle.js.map +1 -1
- package/dist/src/nile-button-toggle-group/nile-button-toggle-group.d.ts +6 -2
- package/dist/src/nile-button-toggle-group/nile-button-toggle-group.js +30 -7
- package/dist/src/nile-button-toggle-group/nile-button-toggle-group.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-button-toggle/nile-button-toggle.css.ts +4 -0
- package/src/nile-button-toggle/nile-button-toggle.ts +9 -2
- package/src/nile-button-toggle-group/nile-button-toggle-group.ts +51 -26
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"nile-button-toggle.css.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.css.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { css } from 'lit-element';\n\n/**\n * ButtonToggle CSS\n */\nexport const styles = css`\n :host {\n }\n\n .nile-button-toggle {\n display: flex;\n padding: 12px;\n border: 1px solid #ccc;\n cursor: pointer;\n border-radius: 4px;\n color: #000;\n text-align: center;\n font-family: Colfax-regular;\n font-size: 14px;\n line-height: 14px;\n letter-spacing: 0.2px;\n justify-content: center;\n align-items: center;\n gap: 10px;\n }\n\n .nile-button-toggle__initial {\n border-radius: 4px 0 0 4px;\n }\n\n .nile-button-toggle__end {\n border-radius: 0 4px 4px 0;\n }\n\n .nile-button-toggle__middle {\n border-width: 1px 0px;\n border-style: solid;\n border-color: #ccc;\n border-radius: 0;\n }\n\n .nile-button-toggle__active {\n background-color: #c7ced4;\n }\n\n .nile-button-toggle__disabled {\n cursor: not-allowed;\n }\n`;\n\nexport default [styles];\n"]}
|
|
@@ -4,14 +4,15 @@
|
|
|
4
4
|
* This source code is licensed under the BSD-3-Clause license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { CSSResultArray, TemplateResult } from 'lit-element';
|
|
8
|
+
import NileElement from '../internal/nile-element';
|
|
8
9
|
/**
|
|
9
10
|
* Nile icon component.
|
|
10
11
|
*
|
|
11
12
|
* @tag nile-button-toggle
|
|
12
13
|
*
|
|
13
14
|
*/
|
|
14
|
-
export declare class NileButtonToggle extends
|
|
15
|
+
export declare class NileButtonToggle extends NileElement {
|
|
15
16
|
/**
|
|
16
17
|
* The styles for ButtonToggle
|
|
17
18
|
* @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
|
|
@@ -21,6 +22,7 @@ export declare class NileButtonToggle extends LitElement {
|
|
|
21
22
|
initial: boolean;
|
|
22
23
|
middle: boolean;
|
|
23
24
|
end: boolean;
|
|
25
|
+
disabled: boolean;
|
|
24
26
|
value: string;
|
|
25
27
|
connectedCallback(): void;
|
|
26
28
|
disconnectedCallback(): void;
|
|
@@ -5,22 +5,24 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import { __decorate } from "tslib";
|
|
8
|
-
import {
|
|
8
|
+
import { html, property } from 'lit-element';
|
|
9
9
|
import { customElement } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './nile-button-toggle.css';
|
|
11
|
+
import NileElement from '../internal/nile-element';
|
|
11
12
|
/**
|
|
12
13
|
* Nile icon component.
|
|
13
14
|
*
|
|
14
15
|
* @tag nile-button-toggle
|
|
15
16
|
*
|
|
16
17
|
*/
|
|
17
|
-
let NileButtonToggle = class NileButtonToggle extends
|
|
18
|
+
let NileButtonToggle = class NileButtonToggle extends NileElement {
|
|
18
19
|
constructor() {
|
|
19
20
|
super(...arguments);
|
|
20
21
|
this.active = false;
|
|
21
22
|
this.initial = false;
|
|
22
23
|
this.middle = false;
|
|
23
24
|
this.end = false;
|
|
25
|
+
this.disabled = false;
|
|
24
26
|
this.value = '';
|
|
25
27
|
/* #endregion */
|
|
26
28
|
}
|
|
@@ -40,6 +42,8 @@ let NileButtonToggle = class NileButtonToggle extends LitElement {
|
|
|
40
42
|
super.disconnectedCallback();
|
|
41
43
|
}
|
|
42
44
|
toggle() {
|
|
45
|
+
if (this.disabled)
|
|
46
|
+
return;
|
|
43
47
|
this.active = true;
|
|
44
48
|
const eventData = { active: this.active, value: this.value };
|
|
45
49
|
this.dispatchEvent(new CustomEvent('nile-toggle-changed', { detail: eventData, bubbles: true }));
|
|
@@ -62,6 +66,9 @@ let NileButtonToggle = class NileButtonToggle extends LitElement {
|
|
|
62
66
|
if (this.end) {
|
|
63
67
|
classes.push('nile-button-toggle__end');
|
|
64
68
|
}
|
|
69
|
+
if (this.disabled) {
|
|
70
|
+
classes.push('nile-button-toggle__disabled');
|
|
71
|
+
}
|
|
65
72
|
const classString = classes.join(' ');
|
|
66
73
|
return html `
|
|
67
74
|
<div class="${classString}">
|
|
@@ -83,6 +90,9 @@ __decorate([
|
|
|
83
90
|
__decorate([
|
|
84
91
|
property({ type: Boolean, reflect: true })
|
|
85
92
|
], NileButtonToggle.prototype, "end", void 0);
|
|
93
|
+
__decorate([
|
|
94
|
+
property({ type: Boolean, reflect: true })
|
|
95
|
+
], NileButtonToggle.prototype, "disabled", void 0);
|
|
86
96
|
__decorate([
|
|
87
97
|
property({ type: String })
|
|
88
98
|
], NileButtonToggle.prototype, "value", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-button-toggle.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"nile-button-toggle.js","sourceRoot":"","sources":["../../../src/nile-button-toggle/nile-button-toggle.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, html, property, CSSResultArray, TemplateResult} from 'lit-element';\nimport { customElement } from 'lit/decorators.js';\nimport {styles} from './nile-button-toggle.css';\nimport NileElement from '../internal/nile-element';\n\n/**\n * Nile icon component.\n *\n * @tag nile-button-toggle\n *\n */\n@customElement('nile-button-toggle')\nexport class NileButtonToggle extends NileElement {\n\n\t/**\n\t * The styles for ButtonToggle\n\t * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n\t */\n\tpublic static get styles(): CSSResultArray {\n\t\treturn [styles];\n\t}\n\n @property({ type: Boolean, reflect: true })\n active = false;\n\n @property({ type: Boolean, reflect: true })\n initial = false;\n\n @property({ type: Boolean, reflect: true })\n middle = false;\n\n @property({ type: Boolean, reflect: true })\n end = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property({ type: String })\n value = '';\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.toggle);\n }\n\n disconnectedCallback() {\n this.removeEventListener('click', this.toggle);\n super.disconnectedCallback();\n }\n\n toggle() {\n if (this.disabled) return;\n this.active = true;\n const eventData = { active: this.active, value: this.value };\n this.dispatchEvent(new CustomEvent('nile-toggle-changed', { detail: eventData, bubbles: true }));\n }\n\n\t/**\n\t * Render method\n\t * @slot This is a slot test\n\t */\n public render(): TemplateResult {\n let classes = ['nile-button-toggle'];\n if (this.active) {\n classes.push('nile-button-toggle__active');\n }\n if (this.initial) {\n classes.push('nile-button-toggle__initial');\n }\n if (this.middle) {\n classes.push('nile-button-toggle__middle');\n }\n if (this.end) {\n classes.push('nile-button-toggle__end');\n }\n if (this.disabled) {\n classes.push('nile-button-toggle__disabled');\n }\n\n const classString = classes.join(' ');\n\n return html`\n <div class=\"${classString}\">\n <slot name=\"prefix\"></slot>\n <slot> </slot>\n </div>\n `;\n }\n\n\t/* #endregion */\n}\n\nexport default NileButtonToggle;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-button-toggle': NileButtonToggle;\n }\n}\n"]}
|
|
@@ -4,14 +4,15 @@
|
|
|
4
4
|
* This source code is licensed under the BSD-3-Clause license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { CSSResultArray, TemplateResult } from 'lit-element';
|
|
8
|
+
import NileElement from '../internal/nile-element';
|
|
8
9
|
/**
|
|
9
10
|
* Nile icon component.
|
|
10
11
|
*
|
|
11
12
|
* @tag nile-button-toggle-group
|
|
12
13
|
*
|
|
13
14
|
*/
|
|
14
|
-
export declare class NileButtonToggleGroup extends
|
|
15
|
+
export declare class NileButtonToggleGroup extends NileElement {
|
|
15
16
|
/**
|
|
16
17
|
* The styles for ButtonToggleGroup
|
|
17
18
|
* @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
|
|
@@ -19,8 +20,11 @@ export declare class NileButtonToggleGroup extends LitElement {
|
|
|
19
20
|
static get styles(): CSSResultArray;
|
|
20
21
|
private toggles;
|
|
21
22
|
private defaultSlot;
|
|
23
|
+
disabled: boolean;
|
|
22
24
|
connectedCallback(): void;
|
|
23
25
|
firstUpdated(): void;
|
|
26
|
+
updated(changedProperties: Map<string | number | symbol, unknown>): void;
|
|
27
|
+
private updateDisabledState;
|
|
24
28
|
updateTogglePositions(): void;
|
|
25
29
|
handleToggle(event: CustomEvent): void;
|
|
26
30
|
/**
|
|
@@ -5,17 +5,23 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import { __decorate } from "tslib";
|
|
8
|
-
import {
|
|
8
|
+
import { html, property } from 'lit-element';
|
|
9
9
|
import { customElement, query, queryAll } from 'lit/decorators.js';
|
|
10
10
|
import { styles } from './nile-button-toggle-group.css';
|
|
11
11
|
import NileButtonToggle from '../nile-button-toggle/nile-button-toggle';
|
|
12
|
+
import NileElement from '../internal/nile-element';
|
|
12
13
|
/**
|
|
13
14
|
* Nile icon component.
|
|
14
15
|
*
|
|
15
16
|
* @tag nile-button-toggle-group
|
|
16
17
|
*
|
|
17
18
|
*/
|
|
18
|
-
let NileButtonToggleGroup = class NileButtonToggleGroup extends
|
|
19
|
+
let NileButtonToggleGroup = class NileButtonToggleGroup extends NileElement {
|
|
20
|
+
constructor() {
|
|
21
|
+
super(...arguments);
|
|
22
|
+
this.disabled = false;
|
|
23
|
+
/* #endregion */
|
|
24
|
+
}
|
|
19
25
|
/**
|
|
20
26
|
* The styles for ButtonToggleGroup
|
|
21
27
|
* @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`
|
|
@@ -31,6 +37,21 @@ let NileButtonToggleGroup = class NileButtonToggleGroup extends LitElement {
|
|
|
31
37
|
this.addEventListener('nile-toggle-changed', this.handleToggle);
|
|
32
38
|
this.updateTogglePositions();
|
|
33
39
|
}
|
|
40
|
+
updated(changedProperties) {
|
|
41
|
+
super.updated(changedProperties);
|
|
42
|
+
if (changedProperties.has('disabled')) {
|
|
43
|
+
this.updateDisabledState();
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
updateDisabledState() {
|
|
47
|
+
const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });
|
|
48
|
+
const toggles = assignedNodes.filter(node => node instanceof NileButtonToggle);
|
|
49
|
+
toggles.forEach(toggle => {
|
|
50
|
+
if (!toggle.disabled) {
|
|
51
|
+
toggle.disabled = this.disabled;
|
|
52
|
+
}
|
|
53
|
+
});
|
|
54
|
+
}
|
|
34
55
|
updateTogglePositions() {
|
|
35
56
|
const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });
|
|
36
57
|
const toggles = assignedNodes.filter(node => node instanceof NileButtonToggle);
|
|
@@ -41,6 +62,8 @@ let NileButtonToggleGroup = class NileButtonToggleGroup extends LitElement {
|
|
|
41
62
|
});
|
|
42
63
|
}
|
|
43
64
|
handleToggle(event) {
|
|
65
|
+
if (this.disabled)
|
|
66
|
+
return;
|
|
44
67
|
const toggles = this.querySelectorAll('nile-button-toggle');
|
|
45
68
|
if (toggles && event.detail.active) {
|
|
46
69
|
toggles.forEach((toggle) => {
|
|
@@ -48,18 +71,15 @@ let NileButtonToggleGroup = class NileButtonToggleGroup extends LitElement {
|
|
|
48
71
|
toggle.active = false;
|
|
49
72
|
}
|
|
50
73
|
});
|
|
51
|
-
this.
|
|
74
|
+
this.emit('nile-change', { value: event.detail.value });
|
|
52
75
|
}
|
|
53
76
|
}
|
|
54
|
-
;
|
|
55
77
|
/**
|
|
56
78
|
* Render method
|
|
57
79
|
* @slot This is a slot test
|
|
58
80
|
*/
|
|
59
81
|
render() {
|
|
60
|
-
return html `
|
|
61
|
-
<slot> </slot>
|
|
62
|
-
`;
|
|
82
|
+
return html ` <slot> </slot> `;
|
|
63
83
|
}
|
|
64
84
|
};
|
|
65
85
|
__decorate([
|
|
@@ -68,6 +88,9 @@ __decorate([
|
|
|
68
88
|
__decorate([
|
|
69
89
|
query('slot:not([name])')
|
|
70
90
|
], NileButtonToggleGroup.prototype, "defaultSlot", void 0);
|
|
91
|
+
__decorate([
|
|
92
|
+
property({ type: Boolean, reflect: true })
|
|
93
|
+
], NileButtonToggleGroup.prototype, "disabled", void 0);
|
|
71
94
|
NileButtonToggleGroup = __decorate([
|
|
72
95
|
customElement('nile-button-toggle-group')
|
|
73
96
|
], NileButtonToggleGroup);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nile-button-toggle-group.js","sourceRoot":"","sources":["../../../src/nile-button-toggle-group/nile-button-toggle-group.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"nile-button-toggle-group.js","sourceRoot":"","sources":["../../../src/nile-button-toggle-group/nile-button-toggle-group.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright Aquera Inc 2023\n *\n * This source code is licensed under the BSD-3-Clause license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {LitElement, html, property, CSSResultArray, TemplateResult} from 'lit-element';\nimport { customElement, query, queryAll } from 'lit/decorators.js';\nimport {styles} from './nile-button-toggle-group.css';\nimport NileButtonToggle from '../nile-button-toggle/nile-button-toggle';\nimport NileElement from '../internal/nile-element';\n/**\n * Nile icon component.\n *\n * @tag nile-button-toggle-group\n *\n */\n@customElement('nile-button-toggle-group')\nexport class NileButtonToggleGroup extends NileElement {\n /**\n * The styles for ButtonToggleGroup\n * @remarks If you are extending this class you can extend the base styles with super. Eg `return [super(), myCustomStyles]`\n */\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @queryAll('nile-button-toggle')\n private toggles!: NodeListOf<NileButtonToggle>;\n\n @query('slot:not([name])')\n private defaultSlot!: HTMLSlotElement;\n\n @property({ type: Boolean, reflect: true })\n public disabled: boolean = false;\n\n connectedCallback() {\n super.connectedCallback();\n }\n\n firstUpdated() {\n this.defaultSlot.addEventListener('slotchange', () =>\n this.updateTogglePositions()\n );\n this.addEventListener('nile-toggle-changed', this.handleToggle);\n this.updateTogglePositions();\n }\n\n updated(changedProperties: Map<string | number | symbol, unknown>) {\n super.updated(changedProperties);\n if (changedProperties.has('disabled')) {\n this.updateDisabledState();\n }\n }\n\n private updateDisabledState() {\n const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });\n const toggles = assignedNodes.filter(\n node => node instanceof NileButtonToggle\n ) as NileButtonToggle[];\n\n toggles.forEach(toggle => {\n if (!toggle.disabled) {\n toggle.disabled = this.disabled;\n }\n });\n }\n\n updateTogglePositions() {\n const assignedNodes = this.defaultSlot.assignedNodes({ flatten: true });\n const toggles = assignedNodes.filter(\n node => node instanceof NileButtonToggle\n ) as NileButtonToggle[];\n\n toggles.forEach((toggle, index) => {\n toggle.initial = index === 0;\n toggle.middle = index > 0 && index < toggles.length - 1;\n toggle.end = index === toggles.length - 1;\n });\n }\n\n handleToggle(event: CustomEvent) {\n if (this.disabled) return;\n const toggles = this.querySelectorAll('nile-button-toggle');\n\n if (toggles && event.detail.active) {\n toggles.forEach((toggle: any) => {\n if (toggle !== event.target) {\n toggle.active = false;\n }\n });\n\n this.emit('nile-change', { value: event.detail.value });\n }\n }\n\n /**\n * Render method\n * @slot This is a slot test\n */\n public render(): TemplateResult {\n return html` <slot> </slot> `;\n }\n\n /* #endregion */\n}\n\nexport default NileButtonToggleGroup;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nile-button-toggle-group': NileButtonToggleGroup;\n }\n}\n"]}
|