@shoper/phoenix_design_system 0.9.0 → 0.10.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/build/cjs/packages/phoenix/src/components/accordion/accordion.js +47 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion.js.map +1 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_constants.js +15 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_constants.js.map +1 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js +65 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_content.js.map +1 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_group.js +118 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_group.js.map +1 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_toggler.js +46 -0
- package/build/cjs/packages/phoenix/src/components/accordion/accordion_toggler.js.map +1 -0
- package/build/cjs/packages/phoenix/src/components/form_controls/control.js +2 -2
- package/build/cjs/packages/phoenix/src/components/form_controls/control_additional_content.js +2 -1
- package/build/cjs/packages/phoenix/src/components/form_controls/control_additional_content.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form_controls/control_content.js +2 -1
- package/build/cjs/packages/phoenix/src/components/form_controls/control_content.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/form_controls/control_element.js +2 -2
- package/build/cjs/packages/phoenix/src/components/form_controls/control_label.js +2 -2
- package/build/cjs/packages/phoenix/src/controllers/transition_controller/transition_controller.js +40 -0
- package/build/cjs/packages/phoenix/src/controllers/transition_controller/transition_controller.js.map +1 -0
- package/build/cjs/packages/phoenix/src/controllers/transition_controller/transition_controller_constants.js +11 -0
- package/build/cjs/packages/phoenix/src/controllers/transition_controller/transition_controller_constants.js.map +1 -0
- package/build/cjs/packages/phoenix/src/core/context/context_provider_controller.js +1 -1
- package/build/cjs/packages/phoenix/src/core/observer/observable.js +24 -0
- package/build/cjs/packages/phoenix/src/core/observer/observable.js.map +1 -0
- package/build/cjs/packages/phoenix/src/core/observer/observer.js +15 -0
- package/build/cjs/packages/phoenix/src/core/observer/observer.js.map +1 -0
- package/build/cjs/packages/phoenix/src/index.js +31 -0
- package/build/cjs/packages/phoenix/src/index.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/accordion/accordion.d.ts +13 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion.js +45 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.d.ts +7 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.js +10 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_constants.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_content.d.ts +18 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js +63 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_content.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_group.d.ts +26 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_group.js +116 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_group.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_toggler.d.ts +12 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_toggler.js +44 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_toggler.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_types.d.ts +31 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_types.js +5 -0
- package/build/esm/packages/phoenix/src/components/accordion/accordion_types.js.map +1 -0
- package/build/esm/packages/phoenix/src/components/form_controls/control.js +2 -2
- package/build/esm/packages/phoenix/src/components/form_controls/control_additional_content.js +3 -2
- package/build/esm/packages/phoenix/src/components/form_controls/control_additional_content.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form_controls/control_content.js +3 -2
- package/build/esm/packages/phoenix/src/components/form_controls/control_content.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form_controls/control_element.js +2 -2
- package/build/esm/packages/phoenix/src/components/form_controls/control_errors.js +2 -2
- package/build/esm/packages/phoenix/src/components/form_controls/control_errors.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/form_controls/control_label.js +2 -2
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller.d.ts +11 -0
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller.js +36 -0
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller.js.map +1 -0
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller_constants.d.ts +4 -0
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller_constants.js +7 -0
- package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller_constants.js.map +1 -0
- package/build/esm/packages/phoenix/src/core/context/context_provider_controller.d.ts +1 -1
- package/build/esm/packages/phoenix/src/core/context/context_provider_controller.js +1 -1
- package/build/esm/packages/phoenix/src/core/observer/observable.d.ts +9 -0
- package/build/esm/packages/phoenix/src/core/observer/observable.js +20 -0
- package/build/esm/packages/phoenix/src/core/observer/observable.js.map +1 -0
- package/build/esm/packages/phoenix/src/core/observer/observer.d.ts +6 -0
- package/build/esm/packages/phoenix/src/core/observer/observer.js +11 -0
- package/build/esm/packages/phoenix/src/core/observer/observer.js.map +1 -0
- package/build/esm/packages/phoenix/src/core/observer/observer_types.d.ts +8 -0
- package/build/esm/packages/phoenix/src/core/observer/observer_types.js +2 -0
- package/build/esm/packages/phoenix/src/core/observer/observer_types.js.map +1 -0
- package/build/esm/packages/phoenix/src/index.d.ts +5 -0
- package/build/esm/packages/phoenix/src/index.js +5 -0
- package/build/esm/packages/phoenix/src/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
+
import { ContextProviderController } from '../../core/context/context_provider_controller.js';
|
|
3
|
+
import { property } from 'lit/decorators';
|
|
4
|
+
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
5
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
6
|
+
import { ACCORDION_CONTEXTS } from './accordion_constants.js';
|
|
7
|
+
import { Subject } from '../../core/observer/observable.js';
|
|
8
|
+
|
|
9
|
+
let HAccordion = class HAccordion extends PhoenixLightLitElement {
|
|
10
|
+
constructor() {
|
|
11
|
+
super();
|
|
12
|
+
this.disabled = false;
|
|
13
|
+
this._accordionSubject = new Subject();
|
|
14
|
+
this._accordionContext = new ContextProviderController(this);
|
|
15
|
+
this._accordionContext.provide(ACCORDION_CONTEXTS.accordionProps, this._accordionSubject);
|
|
16
|
+
}
|
|
17
|
+
enable() {
|
|
18
|
+
this.disabled = false;
|
|
19
|
+
}
|
|
20
|
+
disable() {
|
|
21
|
+
this.disabled = true;
|
|
22
|
+
}
|
|
23
|
+
updated() {
|
|
24
|
+
this.notify();
|
|
25
|
+
}
|
|
26
|
+
notify() {
|
|
27
|
+
this._accordionSubject.notify(this._getProps());
|
|
28
|
+
}
|
|
29
|
+
_getProps() {
|
|
30
|
+
return {
|
|
31
|
+
disabled: this.disabled
|
|
32
|
+
};
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
__decorate([
|
|
36
|
+
property({ type: Boolean, reflect: true }),
|
|
37
|
+
__metadata("design:type", Object)
|
|
38
|
+
], HAccordion.prototype, "disabled", void 0);
|
|
39
|
+
HAccordion = __decorate([
|
|
40
|
+
phoenixCustomElement('h-accordion'),
|
|
41
|
+
__metadata("design:paramtypes", [])
|
|
42
|
+
], HAccordion);
|
|
43
|
+
|
|
44
|
+
export { HAccordion };
|
|
45
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
const ACCORDION_EVENTS = {
|
|
2
|
+
toggle: 'toggle'
|
|
3
|
+
};
|
|
4
|
+
const ACCORDION_CONTEXTS = {
|
|
5
|
+
accordionProps: 'accordionPropsSubject',
|
|
6
|
+
accordionGroupProps: 'accordionGroupPropsSubject'
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
export { ACCORDION_CONTEXTS, ACCORDION_EVENTS };
|
|
10
|
+
//# sourceMappingURL=accordion_constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element";
|
|
2
|
+
export declare class HAccordionContent extends PhoenixLightLitElement {
|
|
3
|
+
transitionName: string;
|
|
4
|
+
private _transitionController;
|
|
5
|
+
private _contextConsumer;
|
|
6
|
+
private _accordionGroupProps;
|
|
7
|
+
private _accordionGroupPropsObserver;
|
|
8
|
+
private _originalHeight;
|
|
9
|
+
constructor();
|
|
10
|
+
connectedCallback(): void;
|
|
11
|
+
private _setStylingOptions;
|
|
12
|
+
private _subscribeObserver;
|
|
13
|
+
private _expand;
|
|
14
|
+
private _collapse;
|
|
15
|
+
private _setHeight;
|
|
16
|
+
private _setAttributes;
|
|
17
|
+
disconnectedCallback(): void;
|
|
18
|
+
}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
+
import { ContextConsumerController } from '../../core/context/context_consumer_controller.js';
|
|
3
|
+
import { property } from 'lit/decorators';
|
|
4
|
+
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
5
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
6
|
+
import { ACCORDION_CONTEXTS } from './accordion_constants.js';
|
|
7
|
+
import { Observer } from '../../core/observer/observer.js';
|
|
8
|
+
import { TransitionController } from '../../controllers/transition_controller/transition_controller.js';
|
|
9
|
+
|
|
10
|
+
let HAccordionContent = class HAccordionContent extends PhoenixLightLitElement {
|
|
11
|
+
constructor() {
|
|
12
|
+
super();
|
|
13
|
+
this.transitionName = 'accordion-toggle';
|
|
14
|
+
this._expand = () => {
|
|
15
|
+
this._setHeight(this._originalHeight);
|
|
16
|
+
};
|
|
17
|
+
this._collapse = () => {
|
|
18
|
+
this._setHeight('0px');
|
|
19
|
+
};
|
|
20
|
+
this.setAttribute('role', 'region');
|
|
21
|
+
}
|
|
22
|
+
connectedCallback() {
|
|
23
|
+
super.connectedCallback();
|
|
24
|
+
this._contextConsumer = new ContextConsumerController(this);
|
|
25
|
+
this._transitionController = new TransitionController(this, this.transitionName);
|
|
26
|
+
this._setStylingOptions();
|
|
27
|
+
this._subscribeObserver();
|
|
28
|
+
}
|
|
29
|
+
_setStylingOptions() {
|
|
30
|
+
this._originalHeight = `${this.getBoundingClientRect().height}px`;
|
|
31
|
+
this.style.height = this._originalHeight;
|
|
32
|
+
}
|
|
33
|
+
_subscribeObserver() {
|
|
34
|
+
this._accordionGroupProps = this._contextConsumer.consume(ACCORDION_CONTEXTS.accordionGroupProps);
|
|
35
|
+
this._accordionGroupPropsObserver = new Observer((accordionProps) => {
|
|
36
|
+
this._setAttributes(accordionProps);
|
|
37
|
+
accordionProps.opened ? this._transitionController.show(this._expand) : this._transitionController.hide(this._collapse);
|
|
38
|
+
});
|
|
39
|
+
this._accordionGroupProps.subscribe(this._accordionGroupPropsObserver);
|
|
40
|
+
}
|
|
41
|
+
_setHeight(height) {
|
|
42
|
+
this.style.height = height;
|
|
43
|
+
}
|
|
44
|
+
_setAttributes({ regionId, controlsId }) {
|
|
45
|
+
this.setAttribute('id', controlsId);
|
|
46
|
+
this.setAttribute('labelledby', regionId);
|
|
47
|
+
}
|
|
48
|
+
disconnectedCallback() {
|
|
49
|
+
super.disconnectedCallback();
|
|
50
|
+
this._accordionGroupProps.unsubscribe(this._accordionGroupPropsObserver);
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
__decorate([
|
|
54
|
+
property(),
|
|
55
|
+
__metadata("design:type", Object)
|
|
56
|
+
], HAccordionContent.prototype, "transitionName", void 0);
|
|
57
|
+
HAccordionContent = __decorate([
|
|
58
|
+
phoenixCustomElement('h-accordion-content'),
|
|
59
|
+
__metadata("design:paramtypes", [])
|
|
60
|
+
], HAccordionContent);
|
|
61
|
+
|
|
62
|
+
export { HAccordionContent };
|
|
63
|
+
//# sourceMappingURL=accordion_content.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { IAccordion, IAccordionGroup } from './accordion_types';
|
|
2
|
+
import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element";
|
|
3
|
+
export declare class HAccordionGroup extends PhoenixLightLitElement implements IAccordionGroup, IAccordion {
|
|
4
|
+
opened: boolean;
|
|
5
|
+
private _isDisabled;
|
|
6
|
+
private _regionId;
|
|
7
|
+
private _controlsId;
|
|
8
|
+
private _accordionGroupPropsSubject;
|
|
9
|
+
private _accordionGroupContext;
|
|
10
|
+
private _accordionContextConsumer;
|
|
11
|
+
private _accordionProps;
|
|
12
|
+
private _accordionPropsObserver;
|
|
13
|
+
constructor();
|
|
14
|
+
connectedCallback(): void;
|
|
15
|
+
private _subscribeObserver;
|
|
16
|
+
disconnectedCallback(): void;
|
|
17
|
+
show(): void;
|
|
18
|
+
hide(): void;
|
|
19
|
+
toggle(): void;
|
|
20
|
+
enable(): void;
|
|
21
|
+
disable(): void;
|
|
22
|
+
private _accordionToggle;
|
|
23
|
+
notify(): void;
|
|
24
|
+
protected updated(_changedProperties: Map<string, unknown>): void;
|
|
25
|
+
private _getProps;
|
|
26
|
+
}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
+
import { ContextProviderController } from '../../core/context/context_provider_controller.js';
|
|
3
|
+
import { ContextConsumerController } from '../../core/context/context_consumer_controller.js';
|
|
4
|
+
import { property, state } from 'lit/decorators';
|
|
5
|
+
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
6
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
7
|
+
import { ACCORDION_CONTEXTS, ACCORDION_EVENTS } from './accordion_constants.js';
|
|
8
|
+
import { Observer } from '../../core/observer/observer.js';
|
|
9
|
+
import { Subject } from '../../core/observer/observable.js';
|
|
10
|
+
|
|
11
|
+
let HAccordionGroup = class HAccordionGroup extends PhoenixLightLitElement {
|
|
12
|
+
constructor() {
|
|
13
|
+
super();
|
|
14
|
+
this.opened = false;
|
|
15
|
+
this._isDisabled = false;
|
|
16
|
+
this._regionId = self.crypto.randomUUID();
|
|
17
|
+
this._controlsId = self.crypto.randomUUID();
|
|
18
|
+
this._accordionToggle = () => {
|
|
19
|
+
this.toggle();
|
|
20
|
+
};
|
|
21
|
+
this._accordionGroupPropsSubject = new Subject();
|
|
22
|
+
this._accordionGroupContext = new ContextProviderController(this);
|
|
23
|
+
this._accordionGroupContext.provide(ACCORDION_CONTEXTS.accordionGroupProps, this._accordionGroupPropsSubject);
|
|
24
|
+
}
|
|
25
|
+
connectedCallback() {
|
|
26
|
+
super.connectedCallback();
|
|
27
|
+
this._accordionContextConsumer = new ContextConsumerController(this);
|
|
28
|
+
this._subscribeObserver();
|
|
29
|
+
this.addEventListener(ACCORDION_EVENTS.toggle, this._accordionToggle);
|
|
30
|
+
}
|
|
31
|
+
_subscribeObserver() {
|
|
32
|
+
this._accordionProps = this._accordionContextConsumer.consume(ACCORDION_CONTEXTS.accordionProps);
|
|
33
|
+
this._accordionPropsObserver = new Observer((accordionProps) => {
|
|
34
|
+
const hasAccordionBeenDisabled = accordionProps.disabled;
|
|
35
|
+
if (hasAccordionBeenDisabled) {
|
|
36
|
+
this.disable();
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
const hasAccordionBeenEnabled = accordionProps.disabled === false;
|
|
40
|
+
if (hasAccordionBeenEnabled) {
|
|
41
|
+
this.enable();
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
this._accordionProps.subscribe(this._accordionPropsObserver);
|
|
46
|
+
}
|
|
47
|
+
disconnectedCallback() {
|
|
48
|
+
this._accordionProps.unsubscribe(this._accordionPropsObserver);
|
|
49
|
+
this.removeEventListener(ACCORDION_EVENTS.toggle, this._accordionToggle);
|
|
50
|
+
}
|
|
51
|
+
show() {
|
|
52
|
+
this.opened = true;
|
|
53
|
+
}
|
|
54
|
+
hide() {
|
|
55
|
+
this.opened = false;
|
|
56
|
+
}
|
|
57
|
+
toggle() {
|
|
58
|
+
this.opened = !this.opened;
|
|
59
|
+
}
|
|
60
|
+
enable() {
|
|
61
|
+
if (this._isDisabled) {
|
|
62
|
+
this.addEventListener(ACCORDION_EVENTS.toggle, this._accordionToggle);
|
|
63
|
+
this.hide();
|
|
64
|
+
this._isDisabled = false;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
disable() {
|
|
68
|
+
if (!this._isDisabled) {
|
|
69
|
+
this.removeEventListener(ACCORDION_EVENTS.toggle, this._accordionToggle);
|
|
70
|
+
this.show();
|
|
71
|
+
this._isDisabled = true;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
notify() {
|
|
75
|
+
this._accordionGroupPropsSubject.notify(this._getProps());
|
|
76
|
+
}
|
|
77
|
+
updated(_changedProperties) {
|
|
78
|
+
if (_changedProperties.has('opened') ||
|
|
79
|
+
_changedProperties.has('_isDisabled') ||
|
|
80
|
+
_changedProperties.has('_regionId') ||
|
|
81
|
+
_changedProperties.has('_controlsId')) {
|
|
82
|
+
this.notify();
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
_getProps() {
|
|
86
|
+
return {
|
|
87
|
+
opened: this.opened,
|
|
88
|
+
disabled: this._isDisabled,
|
|
89
|
+
regionId: this._regionId,
|
|
90
|
+
controlsId: this._controlsId
|
|
91
|
+
};
|
|
92
|
+
}
|
|
93
|
+
};
|
|
94
|
+
__decorate([
|
|
95
|
+
property({ type: Boolean, reflect: true }),
|
|
96
|
+
__metadata("design:type", Object)
|
|
97
|
+
], HAccordionGroup.prototype, "opened", void 0);
|
|
98
|
+
__decorate([
|
|
99
|
+
state(),
|
|
100
|
+
__metadata("design:type", Object)
|
|
101
|
+
], HAccordionGroup.prototype, "_isDisabled", void 0);
|
|
102
|
+
__decorate([
|
|
103
|
+
state(),
|
|
104
|
+
__metadata("design:type", Object)
|
|
105
|
+
], HAccordionGroup.prototype, "_regionId", void 0);
|
|
106
|
+
__decorate([
|
|
107
|
+
state(),
|
|
108
|
+
__metadata("design:type", Object)
|
|
109
|
+
], HAccordionGroup.prototype, "_controlsId", void 0);
|
|
110
|
+
HAccordionGroup = __decorate([
|
|
111
|
+
phoenixCustomElement('h-accordion-group'),
|
|
112
|
+
__metadata("design:paramtypes", [])
|
|
113
|
+
], HAccordionGroup);
|
|
114
|
+
|
|
115
|
+
export { HAccordionGroup };
|
|
116
|
+
//# sourceMappingURL=accordion_group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element";
|
|
2
|
+
export declare class HAccordionToggler extends PhoenixLightLitElement {
|
|
3
|
+
private _btnController;
|
|
4
|
+
private _contextConsumer;
|
|
5
|
+
private _accordionGroupProps;
|
|
6
|
+
private _accordionGroupPropsObserver;
|
|
7
|
+
constructor();
|
|
8
|
+
connectedCallback(): void;
|
|
9
|
+
private _setAttributes;
|
|
10
|
+
private _emitTogglerClicked;
|
|
11
|
+
disconnectedCallback(): void;
|
|
12
|
+
}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
+
import { ContextConsumerController } from '../../core/context/context_consumer_controller.js';
|
|
3
|
+
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
4
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
5
|
+
import { ACCORDION_EVENTS, ACCORDION_CONTEXTS } from './accordion_constants.js';
|
|
6
|
+
import { Observer } from '../../core/observer/observer.js';
|
|
7
|
+
import { BtnController } from '../../controllers/btn_controller.js';
|
|
8
|
+
|
|
9
|
+
let HAccordionToggler = class HAccordionToggler extends PhoenixLightLitElement {
|
|
10
|
+
constructor() {
|
|
11
|
+
super();
|
|
12
|
+
this._emitTogglerClicked = () => {
|
|
13
|
+
const togglerClickedEvent = new CustomEvent(ACCORDION_EVENTS.toggle, {
|
|
14
|
+
bubbles: true
|
|
15
|
+
});
|
|
16
|
+
this.dispatchEvent(togglerClickedEvent);
|
|
17
|
+
};
|
|
18
|
+
this._btnController = new BtnController(this, this._emitTogglerClicked);
|
|
19
|
+
this._contextConsumer = new ContextConsumerController(this);
|
|
20
|
+
}
|
|
21
|
+
connectedCallback() {
|
|
22
|
+
super.connectedCallback();
|
|
23
|
+
this._accordionGroupProps = this._contextConsumer.consume(ACCORDION_CONTEXTS.accordionGroupProps);
|
|
24
|
+
this._accordionGroupPropsObserver = new Observer((accordionProps) => this._setAttributes(accordionProps));
|
|
25
|
+
this._accordionGroupProps.subscribe(this._accordionGroupPropsObserver);
|
|
26
|
+
this.addEventListener('click', this._emitTogglerClicked);
|
|
27
|
+
}
|
|
28
|
+
_setAttributes({ regionId, opened, controlsId, disabled }) {
|
|
29
|
+
this.setAttribute('id', regionId);
|
|
30
|
+
this.setAttribute('aria-expanded', opened ? 'true' : 'false');
|
|
31
|
+
this.setAttribute('aria-controls', controlsId);
|
|
32
|
+
this.setAttribute('aria-disabled', disabled ? 'true' : 'false');
|
|
33
|
+
}
|
|
34
|
+
disconnectedCallback() {
|
|
35
|
+
this._accordionGroupProps.unsubscribe(this._accordionGroupPropsObserver);
|
|
36
|
+
}
|
|
37
|
+
};
|
|
38
|
+
HAccordionToggler = __decorate([
|
|
39
|
+
phoenixCustomElement('h-accordion-toggler'),
|
|
40
|
+
__metadata("design:paramtypes", [])
|
|
41
|
+
], HAccordionToggler);
|
|
42
|
+
|
|
43
|
+
export { HAccordionToggler };
|
|
44
|
+
//# sourceMappingURL=accordion_toggler.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { HAccordion } from './accordion';
|
|
2
|
+
import { HAccordionContent } from "./accordion_content";
|
|
3
|
+
import { HAccordionGroup } from "./accordion_group";
|
|
4
|
+
import { HAccordionToggler } from "./accordion_toggler";
|
|
5
|
+
export interface IAccordion {
|
|
6
|
+
enable(): void;
|
|
7
|
+
disable(): void;
|
|
8
|
+
notify(): void;
|
|
9
|
+
}
|
|
10
|
+
export interface IAccordionGroup {
|
|
11
|
+
show(): void;
|
|
12
|
+
hide(): void;
|
|
13
|
+
toggle(): void;
|
|
14
|
+
}
|
|
15
|
+
export declare type TAccordionProps = {
|
|
16
|
+
disabled: boolean;
|
|
17
|
+
};
|
|
18
|
+
export declare type TAccordionGroupProps = {
|
|
19
|
+
opened: boolean;
|
|
20
|
+
disabled: boolean;
|
|
21
|
+
regionId: string;
|
|
22
|
+
controlsId: string;
|
|
23
|
+
};
|
|
24
|
+
declare global {
|
|
25
|
+
interface HTMLElementTagNameMap {
|
|
26
|
+
'h-accordion': HAccordion;
|
|
27
|
+
'h-accordion-group': HAccordionGroup;
|
|
28
|
+
'h-accordion-toggler': HAccordionToggler;
|
|
29
|
+
'h-accordion-content': HAccordionContent;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion_types.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion/accordion_types.ts"],"names":[],"mappings":"AAAA,OAA2B,aAAa,CAAC;AACzC,OAAkC,qDAAqD,CAAC;AACxF,OAAgC,mDAAmD,CAAC;AACpF,OAAkC,qDAAqD,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __decorate } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
-
import { customElement } from 'lit/decorators';
|
|
3
2
|
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
3
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
4
4
|
import { FORM_CONTROLS_CSS_CLASSES } from './form_controls_constatns.js';
|
|
5
5
|
|
|
6
6
|
let HControl = class HControl extends PhoenixLightLitElement {
|
|
@@ -10,7 +10,7 @@ let HControl = class HControl extends PhoenixLightLitElement {
|
|
|
10
10
|
}
|
|
11
11
|
};
|
|
12
12
|
HControl = __decorate([
|
|
13
|
-
|
|
13
|
+
phoenixCustomElement('h-control')
|
|
14
14
|
], HControl);
|
|
15
15
|
|
|
16
16
|
export { HControl };
|
package/build/esm/packages/phoenix/src/components/form_controls/control_additional_content.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
-
import { property
|
|
2
|
+
import { property } from 'lit/decorators';
|
|
3
3
|
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
4
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
4
5
|
import { CONTROL_ADDITIONAL_CONTENT_TYPES, FORM_CONTROLS_CSS_CLASSES, ADDITIONAL_CONTENT_TYPE_TO_CSS_CLASSES_MAP } from './form_controls_constatns.js';
|
|
5
6
|
|
|
6
7
|
let HControlAdditionalContent = class HControlAdditionalContent extends PhoenixLightLitElement {
|
|
@@ -18,7 +19,7 @@ __decorate([
|
|
|
18
19
|
__metadata("design:type", String)
|
|
19
20
|
], HControlAdditionalContent.prototype, "type", void 0);
|
|
20
21
|
HControlAdditionalContent = __decorate([
|
|
21
|
-
|
|
22
|
+
phoenixCustomElement('h-control-additional-content')
|
|
22
23
|
], HControlAdditionalContent);
|
|
23
24
|
|
|
24
25
|
export { HControlAdditionalContent };
|
package/build/esm/packages/phoenix/src/components/form_controls/control_additional_content.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { __decorate, __metadata } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
-
import { property
|
|
2
|
+
import { property } from 'lit/decorators';
|
|
3
3
|
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
4
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
4
5
|
import { CONTROL_CONTENT_SIZES, FORM_CONTROLS_CSS_CLASSES } from './form_controls_constatns.js';
|
|
5
6
|
|
|
6
7
|
let HControlContent = class HControlContent extends PhoenixLightLitElement {
|
|
@@ -18,7 +19,7 @@ __decorate([
|
|
|
18
19
|
__metadata("design:type", String)
|
|
19
20
|
], HControlContent.prototype, "size", void 0);
|
|
20
21
|
HControlContent = __decorate([
|
|
21
|
-
|
|
22
|
+
phoenixCustomElement('h-control-content')
|
|
22
23
|
], HControlContent);
|
|
23
24
|
|
|
24
25
|
export { HControlContent };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __decorate } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
-
import { customElement } from 'lit/decorators';
|
|
3
2
|
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
3
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
4
4
|
import { FORM_CONTROLS_CSS_CLASSES } from './form_controls_constatns.js';
|
|
5
5
|
|
|
6
6
|
let HControlElement = class HControlElement extends PhoenixLightLitElement {
|
|
@@ -10,7 +10,7 @@ let HControlElement = class HControlElement extends PhoenixLightLitElement {
|
|
|
10
10
|
}
|
|
11
11
|
};
|
|
12
12
|
HControlElement = __decorate([
|
|
13
|
-
|
|
13
|
+
phoenixCustomElement('h-control-element')
|
|
14
14
|
], HControlElement);
|
|
15
15
|
|
|
16
16
|
export { HControlElement };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __decorate } from "tslib";
|
|
2
|
-
import { customElement } from 'lit/decorators';
|
|
3
2
|
import { PhoenixLightLitElement } from '@phoenixRoot/core/phoenix_light_lit_element';
|
|
4
3
|
import { FORM_CONTROLS_CSS_CLASSES } from '@phoenixRoot/components/form_controls/form_controls_constatns';
|
|
4
|
+
import { phoenixCustomElement } from '@phoenixRoot/core/decorators/phoenix_custom_element';
|
|
5
5
|
let HControlErrors = class HControlErrors extends PhoenixLightLitElement {
|
|
6
6
|
connectedCallback() {
|
|
7
7
|
super.connectedCallback();
|
|
@@ -9,7 +9,7 @@ let HControlErrors = class HControlErrors extends PhoenixLightLitElement {
|
|
|
9
9
|
}
|
|
10
10
|
};
|
|
11
11
|
HControlErrors = __decorate([
|
|
12
|
-
|
|
12
|
+
phoenixCustomElement('h-control-errors')
|
|
13
13
|
], HControlErrors);
|
|
14
14
|
export { HControlErrors };
|
|
15
15
|
//# sourceMappingURL=control_errors.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"control_errors.js","sourceRoot":"","sources":["../../../../../../../src/components/form_controls/control_errors.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"control_errors.js","sourceRoot":"","sources":["../../../../../../../src/components/form_controls/control_errors.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAC;AACrF,OAAO,EAAE,yBAAyB,EAAE,MAAM,+DAA+D,CAAC;AAC1G,OAAO,EAAE,oBAAoB,EAAE,MAAM,qDAAqD,CAAC;AAG3F,IAAa,cAAc,GAA3B,MAAa,cAAe,SAAQ,sBAAsB;IAC/C,iBAAiB;QACpB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,yBAAyB,CAAC,aAAa,CAAC,CAAC;IAChE,CAAC;CACJ,CAAA;AANY,cAAc;IAD1B,oBAAoB,CAAC,kBAAkB,CAAC;GAC5B,cAAc,CAM1B;SANY,cAAc"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __decorate } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
|
-
import { customElement } from 'lit/decorators';
|
|
3
2
|
import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element.js';
|
|
3
|
+
import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
|
|
4
4
|
import { FORM_CONTROLS_CSS_CLASSES } from './form_controls_constatns.js';
|
|
5
5
|
|
|
6
6
|
let HControlLabel = class HControlLabel extends PhoenixLightLitElement {
|
|
@@ -10,7 +10,7 @@ let HControlLabel = class HControlLabel extends PhoenixLightLitElement {
|
|
|
10
10
|
}
|
|
11
11
|
};
|
|
12
12
|
HControlLabel = __decorate([
|
|
13
|
-
|
|
13
|
+
phoenixCustomElement('h-control-label')
|
|
14
14
|
], HControlLabel);
|
|
15
15
|
|
|
16
16
|
export { HControlLabel };
|
package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ReactiveController, ReactiveControllerHost } from 'lit';
|
|
2
|
+
export declare class TransitionController implements ReactiveController {
|
|
3
|
+
private host;
|
|
4
|
+
private _transitionDuration;
|
|
5
|
+
private _transitionName;
|
|
6
|
+
constructor(host: ReactiveControllerHost & HTMLElement, transitionName: string);
|
|
7
|
+
hostConnected(): void;
|
|
8
|
+
hostDisconnected(): void;
|
|
9
|
+
show(callback?: () => void): void;
|
|
10
|
+
hide(callback?: () => void): void;
|
|
11
|
+
}
|
package/build/esm/packages/phoenix/src/controllers/transition_controller/transition_controller.js
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import 'lit';
|
|
2
|
+
import { TRANSITION_CSS_CLASSES } from './transition_controller_constants.js';
|
|
3
|
+
|
|
4
|
+
class TransitionController {
|
|
5
|
+
constructor(host, transitionName) {
|
|
6
|
+
(this.host = host).addController(this);
|
|
7
|
+
this._transitionName = transitionName;
|
|
8
|
+
}
|
|
9
|
+
hostConnected() {
|
|
10
|
+
this._transitionDuration = parseFloat(getComputedStyle(this.host).transitionDuration) * 1000;
|
|
11
|
+
}
|
|
12
|
+
hostDisconnected() { }
|
|
13
|
+
show(callback) {
|
|
14
|
+
this.host.hidden = false;
|
|
15
|
+
this.host.classList.add(`${this._transitionName}-${TRANSITION_CSS_CLASSES.transitionEnd}`);
|
|
16
|
+
requestAnimationFrame(() => {
|
|
17
|
+
this.host.classList.remove(`${this._transitionName}-${TRANSITION_CSS_CLASSES.transitionStart}`);
|
|
18
|
+
if (typeof callback === 'function')
|
|
19
|
+
callback();
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
hide(callback) {
|
|
23
|
+
requestAnimationFrame(() => {
|
|
24
|
+
if (typeof callback === 'function')
|
|
25
|
+
callback();
|
|
26
|
+
this.host.classList.add(`${this._transitionName}-${TRANSITION_CSS_CLASSES.transitionStart}`);
|
|
27
|
+
this.host.classList.remove(`${this._transitionName}-${TRANSITION_CSS_CLASSES.transitionEnd}`);
|
|
28
|
+
setTimeout(() => {
|
|
29
|
+
this.host.hidden = true;
|
|
30
|
+
}, this._transitionDuration);
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
export { TransitionController };
|
|
36
|
+
//# sourceMappingURL=transition_controller.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { ReactiveController } from 'lit';
|
|
2
1
|
import { TContextValueKey, TWebComponentsContextControllerHost } from "./context_controller_types";
|
|
2
|
+
import { ReactiveController } from 'lit';
|
|
3
3
|
export declare class ContextProviderController<TValue> implements ReactiveController {
|
|
4
4
|
#private;
|
|
5
5
|
constructor(host: TWebComponentsContextControllerHost);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __classPrivateFieldGet, __classPrivateFieldSet } from '../../../../../external/tslib/tslib.es6.js';
|
|
2
2
|
import 'lit';
|
|
3
|
-
import { WEB_COMPONENT_CONTEXT_EVENTS } from './context_consumer_messages_names.js';
|
|
4
3
|
import { ValuesContainer } from '../../../../star_core/build/esm/packages/star_core/src/classes/values_container/values_container.js';
|
|
4
|
+
import { WEB_COMPONENT_CONTEXT_EVENTS } from './context_consumer_messages_names.js';
|
|
5
5
|
|
|
6
6
|
var _ContextProviderController_host, _ContextProviderController_contextValues, _ContextProviderController_handleRequestedValue;
|
|
7
7
|
class ContextProviderController {
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { ISubject } from './observer_types';
|
|
2
|
+
import { Observer } from './observer';
|
|
3
|
+
export declare class Subject<T> implements ISubject<T> {
|
|
4
|
+
private _observers;
|
|
5
|
+
get size(): number;
|
|
6
|
+
subscribe(observer: Observer<T>): void;
|
|
7
|
+
unsubscribe(observer: Observer<T>): void;
|
|
8
|
+
notify(data: T): void;
|
|
9
|
+
}
|