@digital-realty/ix-time 1.0.28 → 1.0.31-alpha.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/dist/IxTime.d.ts +87 -87
- package/dist/IxTime.js +201 -201
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/ix-time-styles.d.ts +1 -1
- package/dist/ix-time-styles.js +2 -2
- package/dist/ix-time.d.ts +1 -1
- package/dist/ix-time.js +2 -2
- package/dist/ix-time.min.js +1 -1
- package/package.json +4 -4
package/dist/IxTime.d.ts
CHANGED
|
@@ -1,87 +1,87 @@
|
|
|
1
|
-
import { LitElement } from 'lit';
|
|
2
|
-
import '@digital-realty/ix-field/ix-field.js';
|
|
3
|
-
export declare class IxTime extends LitElement {
|
|
4
|
-
static get styles(): import("lit").CSSResult[];
|
|
5
|
-
label: string;
|
|
6
|
-
value: string;
|
|
7
|
-
min: string;
|
|
8
|
-
max: string;
|
|
9
|
-
/** @nocollapse */
|
|
10
|
-
static shadowRootOptions: {
|
|
11
|
-
delegatesFocus: boolean;
|
|
12
|
-
mode: ShadowRootMode;
|
|
13
|
-
slotAssignment?: SlotAssignmentMode | undefined;
|
|
14
|
-
customElements?: CustomElementRegistry | undefined;
|
|
15
|
-
registry?: CustomElementRegistry | undefined;
|
|
16
|
-
};
|
|
17
|
-
/** @nocollapse */
|
|
18
|
-
static readonly formAssociated = true;
|
|
19
|
-
private readonly internals;
|
|
20
|
-
timeInput: HTMLInputElement;
|
|
21
|
-
disabled: boolean;
|
|
22
|
-
/**
|
|
23
|
-
* Gets the error message to display.
|
|
24
|
-
*/
|
|
25
|
-
get error(): string;
|
|
26
|
-
/**
|
|
27
|
-
* Gets whether or not the text field is in a visually invalid state.
|
|
28
|
-
* This error state overrides the error state controlled by `reportValidity()`.
|
|
29
|
-
*/
|
|
30
|
-
get hasError(): boolean;
|
|
31
|
-
internalErrorText: string;
|
|
32
|
-
errorText: string;
|
|
33
|
-
required: boolean;
|
|
34
|
-
hideError: boolean;
|
|
35
|
-
/**
|
|
36
|
-
* The associated form element with which this element's value will submit.
|
|
37
|
-
*/
|
|
38
|
-
get form(): HTMLFormElement | null;
|
|
39
|
-
/**
|
|
40
|
-
* The labels this element is associated with.
|
|
41
|
-
*/
|
|
42
|
-
get labels(): NodeList;
|
|
43
|
-
/**
|
|
44
|
-
* The HTML name to use in form submission.
|
|
45
|
-
*/
|
|
46
|
-
get name(): string;
|
|
47
|
-
set name(name: string);
|
|
48
|
-
/**
|
|
49
|
-
* Returns the text field's validation error message.
|
|
50
|
-
*
|
|
51
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation
|
|
52
|
-
*/
|
|
53
|
-
get validationMessage(): string;
|
|
54
|
-
/**
|
|
55
|
-
* Returns a `ValidityState` object that represents the validity states of the
|
|
56
|
-
* text field.
|
|
57
|
-
*
|
|
58
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
|
|
59
|
-
*/
|
|
60
|
-
get validity(): ValidityState;
|
|
61
|
-
/**
|
|
62
|
-
* Returns whether an element will successfully validate based on forms
|
|
63
|
-
* validation rules and constraints.
|
|
64
|
-
*
|
|
65
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
|
|
66
|
-
*/
|
|
67
|
-
get willValidate(): boolean;
|
|
68
|
-
checkValidity(): boolean;
|
|
69
|
-
reportValidity(): boolean;
|
|
70
|
-
/** @private */
|
|
71
|
-
formResetCallback(): void;
|
|
72
|
-
/**
|
|
73
|
-
* Reset the text field to its default value.
|
|
74
|
-
*/
|
|
75
|
-
reset(): void;
|
|
76
|
-
protected updated(): void;
|
|
77
|
-
focus(): void;
|
|
78
|
-
onChanged: any;
|
|
79
|
-
private focused;
|
|
80
|
-
firstUpdated(): void;
|
|
81
|
-
focusin: () => void;
|
|
82
|
-
clear: () => void;
|
|
83
|
-
handleChange: (e: InputEvent) => void;
|
|
84
|
-
validateDate: () => void;
|
|
85
|
-
focusOut: () => void;
|
|
86
|
-
render(): import("lit").TemplateResult<1>;
|
|
87
|
-
}
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
import '@digital-realty/ix-field/ix-field.js';
|
|
3
|
+
export declare class IxTime extends LitElement {
|
|
4
|
+
static get styles(): import("lit").CSSResult[];
|
|
5
|
+
label: string;
|
|
6
|
+
value: string;
|
|
7
|
+
min: string;
|
|
8
|
+
max: string;
|
|
9
|
+
/** @nocollapse */
|
|
10
|
+
static shadowRootOptions: {
|
|
11
|
+
delegatesFocus: boolean;
|
|
12
|
+
mode: ShadowRootMode;
|
|
13
|
+
slotAssignment?: SlotAssignmentMode | undefined;
|
|
14
|
+
customElements?: CustomElementRegistry | undefined;
|
|
15
|
+
registry?: CustomElementRegistry | undefined;
|
|
16
|
+
};
|
|
17
|
+
/** @nocollapse */
|
|
18
|
+
static readonly formAssociated = true;
|
|
19
|
+
private readonly internals;
|
|
20
|
+
timeInput: HTMLInputElement;
|
|
21
|
+
disabled: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Gets the error message to display.
|
|
24
|
+
*/
|
|
25
|
+
get error(): string;
|
|
26
|
+
/**
|
|
27
|
+
* Gets whether or not the text field is in a visually invalid state.
|
|
28
|
+
* This error state overrides the error state controlled by `reportValidity()`.
|
|
29
|
+
*/
|
|
30
|
+
get hasError(): boolean;
|
|
31
|
+
internalErrorText: string;
|
|
32
|
+
errorText: string;
|
|
33
|
+
required: boolean;
|
|
34
|
+
hideError: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* The associated form element with which this element's value will submit.
|
|
37
|
+
*/
|
|
38
|
+
get form(): HTMLFormElement | null;
|
|
39
|
+
/**
|
|
40
|
+
* The labels this element is associated with.
|
|
41
|
+
*/
|
|
42
|
+
get labels(): NodeList;
|
|
43
|
+
/**
|
|
44
|
+
* The HTML name to use in form submission.
|
|
45
|
+
*/
|
|
46
|
+
get name(): string;
|
|
47
|
+
set name(name: string);
|
|
48
|
+
/**
|
|
49
|
+
* Returns the text field's validation error message.
|
|
50
|
+
*
|
|
51
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation
|
|
52
|
+
*/
|
|
53
|
+
get validationMessage(): string;
|
|
54
|
+
/**
|
|
55
|
+
* Returns a `ValidityState` object that represents the validity states of the
|
|
56
|
+
* text field.
|
|
57
|
+
*
|
|
58
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
|
|
59
|
+
*/
|
|
60
|
+
get validity(): ValidityState;
|
|
61
|
+
/**
|
|
62
|
+
* Returns whether an element will successfully validate based on forms
|
|
63
|
+
* validation rules and constraints.
|
|
64
|
+
*
|
|
65
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
|
|
66
|
+
*/
|
|
67
|
+
get willValidate(): boolean;
|
|
68
|
+
checkValidity(): boolean;
|
|
69
|
+
reportValidity(): boolean;
|
|
70
|
+
/** @private */
|
|
71
|
+
formResetCallback(): void;
|
|
72
|
+
/**
|
|
73
|
+
* Reset the text field to its default value.
|
|
74
|
+
*/
|
|
75
|
+
reset(): void;
|
|
76
|
+
protected updated(): void;
|
|
77
|
+
focus(): void;
|
|
78
|
+
onChanged: any;
|
|
79
|
+
private focused;
|
|
80
|
+
firstUpdated(): void;
|
|
81
|
+
focusin: () => void;
|
|
82
|
+
clear: () => void;
|
|
83
|
+
handleChange: (e: InputEvent) => void;
|
|
84
|
+
validateDate: () => void;
|
|
85
|
+
focusOut: () => void;
|
|
86
|
+
render(): import("lit").TemplateResult<1>;
|
|
87
|
+
}
|
package/dist/IxTime.js
CHANGED
|
@@ -1,154 +1,154 @@
|
|
|
1
|
-
import { __decorate } from "tslib";
|
|
2
|
-
import { html, LitElement } from 'lit';
|
|
3
|
-
import { property, query, state } from 'lit/decorators.js';
|
|
4
|
-
import { classMap } from 'lit/directives/class-map.js';
|
|
5
|
-
import '@digital-realty/ix-field/ix-field.js';
|
|
6
|
-
import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';
|
|
7
|
-
import { IxTimeStyles } from './ix-time-styles.js';
|
|
8
|
-
export class IxTime extends LitElement {
|
|
9
|
-
constructor() {
|
|
10
|
-
super(...arguments);
|
|
11
|
-
this.label = '';
|
|
12
|
-
this.value = '';
|
|
13
|
-
this.min = '';
|
|
14
|
-
this.max = '';
|
|
15
|
-
this.internals = this /* needed for closure */
|
|
16
|
-
.attachInternals();
|
|
17
|
-
this.disabled = false;
|
|
18
|
-
this.internalErrorText = '';
|
|
19
|
-
this.errorText = '';
|
|
20
|
-
this.required = false;
|
|
21
|
-
this.hideError = false;
|
|
22
|
-
// eslint-disable-next-line class-methods-use-this
|
|
23
|
-
this.onChanged = () => { };
|
|
24
|
-
this.focused = false;
|
|
25
|
-
this.focusin = () => {
|
|
26
|
-
this.focused = true;
|
|
27
|
-
};
|
|
28
|
-
this.clear = () => {
|
|
29
|
-
this.value = '';
|
|
30
|
-
};
|
|
31
|
-
this.handleChange = (e) => {
|
|
32
|
-
const { value } = e.target;
|
|
33
|
-
this.value = value;
|
|
34
|
-
this.validateDate();
|
|
35
|
-
this.onChanged(value);
|
|
36
|
-
};
|
|
37
|
-
this.validateDate = () => {
|
|
38
|
-
if (this.value && this.timeInput.validity.valid) {
|
|
39
|
-
this.internalErrorText = '';
|
|
40
|
-
}
|
|
41
|
-
else if (this.timeInput.validity.rangeUnderflow ||
|
|
42
|
-
this.timeInput.validity.rangeOverflow) {
|
|
43
|
-
this.internalErrorText = `The value must be between ${this.min} and ${this.max}.`;
|
|
44
|
-
}
|
|
45
|
-
else if (this.required && !this.timeInput.validity.valid) {
|
|
46
|
-
this.internalErrorText = `Time is not valid.`;
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
this.focusOut = () => {
|
|
50
|
-
this.focused = false;
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
static get styles() {
|
|
54
|
-
return [IxTimeStyles];
|
|
55
|
-
}
|
|
56
|
-
/**
|
|
57
|
-
* Gets the error message to display.
|
|
58
|
-
*/
|
|
59
|
-
get error() {
|
|
60
|
-
return this.internalErrorText || this.errorText || '';
|
|
61
|
-
}
|
|
62
|
-
/**
|
|
63
|
-
* Gets whether or not the text field is in a visually invalid state.
|
|
64
|
-
* This error state overrides the error state controlled by `reportValidity()`.
|
|
65
|
-
*/
|
|
66
|
-
get hasError() {
|
|
67
|
-
return !!this.error;
|
|
68
|
-
}
|
|
69
|
-
/**
|
|
70
|
-
* The associated form element with which this element's value will submit.
|
|
71
|
-
*/
|
|
72
|
-
get form() {
|
|
73
|
-
return this.internals.form;
|
|
74
|
-
}
|
|
75
|
-
/**
|
|
76
|
-
* The labels this element is associated with.
|
|
77
|
-
*/
|
|
78
|
-
get labels() {
|
|
79
|
-
return this.internals.labels;
|
|
80
|
-
}
|
|
81
|
-
/**
|
|
82
|
-
* The HTML name to use in form submission.
|
|
83
|
-
*/
|
|
84
|
-
get name() {
|
|
85
|
-
var _a;
|
|
86
|
-
return (_a = this.getAttribute('name')) !== null && _a !== void 0 ? _a : '';
|
|
87
|
-
}
|
|
88
|
-
set name(name) {
|
|
89
|
-
this.setAttribute('name', name);
|
|
90
|
-
}
|
|
91
|
-
/**
|
|
92
|
-
* Returns the text field's validation error message.
|
|
93
|
-
*
|
|
94
|
-
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation
|
|
95
|
-
*/
|
|
96
|
-
get validationMessage() {
|
|
97
|
-
return this.internals.validationMessage;
|
|
98
|
-
}
|
|
99
|
-
/**
|
|
100
|
-
* Returns a `ValidityState` object that represents the validity states of the
|
|
101
|
-
* text field.
|
|
102
|
-
*
|
|
103
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
|
|
104
|
-
*/
|
|
105
|
-
get validity() {
|
|
106
|
-
return this.internals.validity;
|
|
107
|
-
}
|
|
108
|
-
/**
|
|
109
|
-
* Returns whether an element will successfully validate based on forms
|
|
110
|
-
* validation rules and constraints.
|
|
111
|
-
*
|
|
112
|
-
* https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
|
|
113
|
-
*/
|
|
114
|
-
get willValidate() {
|
|
115
|
-
return this.internals.willValidate;
|
|
116
|
-
}
|
|
117
|
-
checkValidity() {
|
|
118
|
-
return this.internals.checkValidity();
|
|
119
|
-
}
|
|
120
|
-
reportValidity() {
|
|
121
|
-
return this.internals.reportValidity();
|
|
122
|
-
}
|
|
123
|
-
/** @private */
|
|
124
|
-
formResetCallback() {
|
|
125
|
-
this.reset();
|
|
126
|
-
}
|
|
127
|
-
/**
|
|
128
|
-
* Reset the text field to its default value.
|
|
129
|
-
*/
|
|
130
|
-
reset() {
|
|
131
|
-
var _a;
|
|
132
|
-
this.clear();
|
|
133
|
-
this.value = (_a = this.getAttribute('value')) !== null && _a !== void 0 ? _a : '';
|
|
134
|
-
}
|
|
135
|
-
updated() {
|
|
136
|
-
this.internals.setValidity({
|
|
137
|
-
badInput: this.hasError,
|
|
138
|
-
}, this.error, this.timeInput);
|
|
139
|
-
this.internals.setFormValue(this.value);
|
|
140
|
-
}
|
|
141
|
-
focus() {
|
|
142
|
-
this.timeInput.focus();
|
|
143
|
-
}
|
|
144
|
-
firstUpdated() {
|
|
145
|
-
this.validateDate();
|
|
146
|
-
}
|
|
147
|
-
render() {
|
|
148
|
-
const classes = {
|
|
149
|
-
disabled: this.disabled,
|
|
150
|
-
error: !this.disabled && this.hasError,
|
|
151
|
-
};
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import { html, LitElement } from 'lit';
|
|
3
|
+
import { property, query, state } from 'lit/decorators.js';
|
|
4
|
+
import { classMap } from 'lit/directives/class-map.js';
|
|
5
|
+
import '@digital-realty/ix-field/ix-field.js';
|
|
6
|
+
import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';
|
|
7
|
+
import { IxTimeStyles } from './ix-time-styles.js';
|
|
8
|
+
export class IxTime extends LitElement {
|
|
9
|
+
constructor() {
|
|
10
|
+
super(...arguments);
|
|
11
|
+
this.label = '';
|
|
12
|
+
this.value = '';
|
|
13
|
+
this.min = '';
|
|
14
|
+
this.max = '';
|
|
15
|
+
this.internals = this /* needed for closure */
|
|
16
|
+
.attachInternals();
|
|
17
|
+
this.disabled = false;
|
|
18
|
+
this.internalErrorText = '';
|
|
19
|
+
this.errorText = '';
|
|
20
|
+
this.required = false;
|
|
21
|
+
this.hideError = false;
|
|
22
|
+
// eslint-disable-next-line class-methods-use-this
|
|
23
|
+
this.onChanged = () => { };
|
|
24
|
+
this.focused = false;
|
|
25
|
+
this.focusin = () => {
|
|
26
|
+
this.focused = true;
|
|
27
|
+
};
|
|
28
|
+
this.clear = () => {
|
|
29
|
+
this.value = '';
|
|
30
|
+
};
|
|
31
|
+
this.handleChange = (e) => {
|
|
32
|
+
const { value } = e.target;
|
|
33
|
+
this.value = value;
|
|
34
|
+
this.validateDate();
|
|
35
|
+
this.onChanged(value);
|
|
36
|
+
};
|
|
37
|
+
this.validateDate = () => {
|
|
38
|
+
if (this.value && this.timeInput.validity.valid) {
|
|
39
|
+
this.internalErrorText = '';
|
|
40
|
+
}
|
|
41
|
+
else if (this.timeInput.validity.rangeUnderflow ||
|
|
42
|
+
this.timeInput.validity.rangeOverflow) {
|
|
43
|
+
this.internalErrorText = `The value must be between ${this.min} and ${this.max}.`;
|
|
44
|
+
}
|
|
45
|
+
else if (this.required && !this.timeInput.validity.valid) {
|
|
46
|
+
this.internalErrorText = `Time is not valid.`;
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
this.focusOut = () => {
|
|
50
|
+
this.focused = false;
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
static get styles() {
|
|
54
|
+
return [IxTimeStyles];
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Gets the error message to display.
|
|
58
|
+
*/
|
|
59
|
+
get error() {
|
|
60
|
+
return this.internalErrorText || this.errorText || '';
|
|
61
|
+
}
|
|
62
|
+
/**
|
|
63
|
+
* Gets whether or not the text field is in a visually invalid state.
|
|
64
|
+
* This error state overrides the error state controlled by `reportValidity()`.
|
|
65
|
+
*/
|
|
66
|
+
get hasError() {
|
|
67
|
+
return !!this.error;
|
|
68
|
+
}
|
|
69
|
+
/**
|
|
70
|
+
* The associated form element with which this element's value will submit.
|
|
71
|
+
*/
|
|
72
|
+
get form() {
|
|
73
|
+
return this.internals.form;
|
|
74
|
+
}
|
|
75
|
+
/**
|
|
76
|
+
* The labels this element is associated with.
|
|
77
|
+
*/
|
|
78
|
+
get labels() {
|
|
79
|
+
return this.internals.labels;
|
|
80
|
+
}
|
|
81
|
+
/**
|
|
82
|
+
* The HTML name to use in form submission.
|
|
83
|
+
*/
|
|
84
|
+
get name() {
|
|
85
|
+
var _a;
|
|
86
|
+
return (_a = this.getAttribute('name')) !== null && _a !== void 0 ? _a : '';
|
|
87
|
+
}
|
|
88
|
+
set name(name) {
|
|
89
|
+
this.setAttribute('name', name);
|
|
90
|
+
}
|
|
91
|
+
/**
|
|
92
|
+
* Returns the text field's validation error message.
|
|
93
|
+
*
|
|
94
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation
|
|
95
|
+
*/
|
|
96
|
+
get validationMessage() {
|
|
97
|
+
return this.internals.validationMessage;
|
|
98
|
+
}
|
|
99
|
+
/**
|
|
100
|
+
* Returns a `ValidityState` object that represents the validity states of the
|
|
101
|
+
* text field.
|
|
102
|
+
*
|
|
103
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
|
|
104
|
+
*/
|
|
105
|
+
get validity() {
|
|
106
|
+
return this.internals.validity;
|
|
107
|
+
}
|
|
108
|
+
/**
|
|
109
|
+
* Returns whether an element will successfully validate based on forms
|
|
110
|
+
* validation rules and constraints.
|
|
111
|
+
*
|
|
112
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate
|
|
113
|
+
*/
|
|
114
|
+
get willValidate() {
|
|
115
|
+
return this.internals.willValidate;
|
|
116
|
+
}
|
|
117
|
+
checkValidity() {
|
|
118
|
+
return this.internals.checkValidity();
|
|
119
|
+
}
|
|
120
|
+
reportValidity() {
|
|
121
|
+
return this.internals.reportValidity();
|
|
122
|
+
}
|
|
123
|
+
/** @private */
|
|
124
|
+
formResetCallback() {
|
|
125
|
+
this.reset();
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Reset the text field to its default value.
|
|
129
|
+
*/
|
|
130
|
+
reset() {
|
|
131
|
+
var _a;
|
|
132
|
+
this.clear();
|
|
133
|
+
this.value = (_a = this.getAttribute('value')) !== null && _a !== void 0 ? _a : '';
|
|
134
|
+
}
|
|
135
|
+
updated() {
|
|
136
|
+
this.internals.setValidity({
|
|
137
|
+
badInput: this.hasError,
|
|
138
|
+
}, this.error, this.timeInput);
|
|
139
|
+
this.internals.setFormValue(this.value);
|
|
140
|
+
}
|
|
141
|
+
focus() {
|
|
142
|
+
this.timeInput.focus();
|
|
143
|
+
}
|
|
144
|
+
firstUpdated() {
|
|
145
|
+
this.validateDate();
|
|
146
|
+
}
|
|
147
|
+
render() {
|
|
148
|
+
const classes = {
|
|
149
|
+
disabled: this.disabled,
|
|
150
|
+
error: !this.disabled && this.hasError,
|
|
151
|
+
};
|
|
152
152
|
return html `
|
|
153
153
|
<ix-field
|
|
154
154
|
class="${classMap(classes)}"
|
|
@@ -172,54 +172,54 @@ export class IxTime extends LitElement {
|
|
|
172
172
|
max=${this.max}
|
|
173
173
|
/>
|
|
174
174
|
</ix-field>
|
|
175
|
-
`;
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
(() => {
|
|
179
|
-
requestUpdateOnAriaChange(IxTime);
|
|
180
|
-
})();
|
|
181
|
-
// Form association
|
|
182
|
-
/** @nocollapse */
|
|
183
|
-
IxTime.shadowRootOptions = {
|
|
184
|
-
...LitElement.shadowRootOptions,
|
|
185
|
-
delegatesFocus: true,
|
|
186
|
-
};
|
|
187
|
-
/** @nocollapse */
|
|
188
|
-
IxTime.formAssociated = true;
|
|
189
|
-
__decorate([
|
|
190
|
-
property({ type: String })
|
|
191
|
-
], IxTime.prototype, "label", void 0);
|
|
192
|
-
__decorate([
|
|
193
|
-
property({ type: String })
|
|
194
|
-
], IxTime.prototype, "value", void 0);
|
|
195
|
-
__decorate([
|
|
196
|
-
property({ type: String })
|
|
197
|
-
], IxTime.prototype, "min", void 0);
|
|
198
|
-
__decorate([
|
|
199
|
-
property({ type: String })
|
|
200
|
-
], IxTime.prototype, "max", void 0);
|
|
201
|
-
__decorate([
|
|
202
|
-
query('#time-input')
|
|
203
|
-
], IxTime.prototype, "timeInput", void 0);
|
|
204
|
-
__decorate([
|
|
205
|
-
property({ type: Boolean, reflect: true })
|
|
206
|
-
], IxTime.prototype, "disabled", void 0);
|
|
207
|
-
__decorate([
|
|
208
|
-
state()
|
|
209
|
-
], IxTime.prototype, "internalErrorText", void 0);
|
|
210
|
-
__decorate([
|
|
211
|
-
property({ type: String })
|
|
212
|
-
], IxTime.prototype, "errorText", void 0);
|
|
213
|
-
__decorate([
|
|
214
|
-
property({ type: Boolean, reflect: true })
|
|
215
|
-
], IxTime.prototype, "required", void 0);
|
|
216
|
-
__decorate([
|
|
217
|
-
property({ type: Boolean, reflect: true })
|
|
218
|
-
], IxTime.prototype, "hideError", void 0);
|
|
219
|
-
__decorate([
|
|
220
|
-
property({ type: Function })
|
|
221
|
-
], IxTime.prototype, "onChanged", void 0);
|
|
222
|
-
__decorate([
|
|
223
|
-
state()
|
|
224
|
-
], IxTime.prototype, "focused", void 0);
|
|
175
|
+
`;
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
(() => {
|
|
179
|
+
requestUpdateOnAriaChange(IxTime);
|
|
180
|
+
})();
|
|
181
|
+
// Form association
|
|
182
|
+
/** @nocollapse */
|
|
183
|
+
IxTime.shadowRootOptions = {
|
|
184
|
+
...LitElement.shadowRootOptions,
|
|
185
|
+
delegatesFocus: true,
|
|
186
|
+
};
|
|
187
|
+
/** @nocollapse */
|
|
188
|
+
IxTime.formAssociated = true;
|
|
189
|
+
__decorate([
|
|
190
|
+
property({ type: String })
|
|
191
|
+
], IxTime.prototype, "label", void 0);
|
|
192
|
+
__decorate([
|
|
193
|
+
property({ type: String })
|
|
194
|
+
], IxTime.prototype, "value", void 0);
|
|
195
|
+
__decorate([
|
|
196
|
+
property({ type: String })
|
|
197
|
+
], IxTime.prototype, "min", void 0);
|
|
198
|
+
__decorate([
|
|
199
|
+
property({ type: String })
|
|
200
|
+
], IxTime.prototype, "max", void 0);
|
|
201
|
+
__decorate([
|
|
202
|
+
query('#time-input')
|
|
203
|
+
], IxTime.prototype, "timeInput", void 0);
|
|
204
|
+
__decorate([
|
|
205
|
+
property({ type: Boolean, reflect: true })
|
|
206
|
+
], IxTime.prototype, "disabled", void 0);
|
|
207
|
+
__decorate([
|
|
208
|
+
state()
|
|
209
|
+
], IxTime.prototype, "internalErrorText", void 0);
|
|
210
|
+
__decorate([
|
|
211
|
+
property({ type: String })
|
|
212
|
+
], IxTime.prototype, "errorText", void 0);
|
|
213
|
+
__decorate([
|
|
214
|
+
property({ type: Boolean, reflect: true })
|
|
215
|
+
], IxTime.prototype, "required", void 0);
|
|
216
|
+
__decorate([
|
|
217
|
+
property({ type: Boolean, reflect: true })
|
|
218
|
+
], IxTime.prototype, "hideError", void 0);
|
|
219
|
+
__decorate([
|
|
220
|
+
property({ type: Function })
|
|
221
|
+
], IxTime.prototype, "onChanged", void 0);
|
|
222
|
+
__decorate([
|
|
223
|
+
state()
|
|
224
|
+
], IxTime.prototype, "focused", void 0);
|
|
225
225
|
//# sourceMappingURL=IxTime.js.map
|
package/dist/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { IxTime } from './IxTime.js';
|
|
1
|
+
export { IxTime } from './IxTime.js';
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { IxTime } from './IxTime.js';
|
|
1
|
+
export { IxTime } from './IxTime.js';
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/ix-time-styles.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const IxTimeStyles: import("lit").CSSResult;
|
|
1
|
+
export declare const IxTimeStyles: import("lit").CSSResult;
|
package/dist/ix-time-styles.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { css } from 'lit';
|
|
1
|
+
import { css } from 'lit';
|
|
2
2
|
export const IxTimeStyles = css `
|
|
3
3
|
:host {
|
|
4
4
|
display: block;
|
|
@@ -19,5 +19,5 @@ export const IxTimeStyles = css `
|
|
|
19
19
|
.time {
|
|
20
20
|
position: relative;
|
|
21
21
|
}
|
|
22
|
-
`;
|
|
22
|
+
`;
|
|
23
23
|
//# sourceMappingURL=ix-time-styles.js.map
|
package/dist/ix-time.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
package/dist/ix-time.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { IxTime } from './IxTime.js';
|
|
2
|
-
window.customElements.define('ix-time', IxTime);
|
|
1
|
+
import { IxTime } from './IxTime.js';
|
|
2
|
+
window.customElements.define('ix-time', IxTime);
|
|
3
3
|
//# sourceMappingURL=ix-time.js.map
|
package/dist/ix-time.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__decorate}from"tslib";import{css,LitElement,html}from"lit";import{property,query,state}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-field/ix-field.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";
|
|
1
|
+
import{__decorate}from"tslib";import{css,LitElement,html}from"lit";import{property,query,state}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import"@digital-realty/ix-field/ix-field.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";let IxTimeStyles=css`:host{display:block}ix-field{display:block}.flex-fill{flex:1;align-items:center}input{border:none;background:0 0;outline:0;min-width:3rem}.time{position:relative}`;class IxTime extends LitElement{constructor(){super(...arguments),this.label="",this.value="",this.min="",this.max="",this.internals=this.attachInternals(),this.disabled=!1,this.internalErrorText="",this.errorText="",this.required=!1,this.hideError=!1,this.onChanged=()=>{},this.focused=!1,this.focusin=()=>{this.focused=!0},this.clear=()=>{this.value=""},this.handleChange=t=>{t=t.target.value;this.value=t,this.validateDate(),this.onChanged(t)},this.validateDate=()=>{this.value&&this.timeInput.validity.valid?this.internalErrorText="":this.timeInput.validity.rangeUnderflow||this.timeInput.validity.rangeOverflow?this.internalErrorText=`The value must be between ${this.min} and ${this.max}.`:this.required&&!this.timeInput.validity.valid&&(this.internalErrorText="Time is not valid.")},this.focusOut=()=>{this.focused=!1}}static get styles(){return[IxTimeStyles]}get error(){return this.internalErrorText||this.errorText||""}get hasError(){return!!this.error}get form(){return this.internals.form}get labels(){return this.internals.labels}get name(){var t;return null!=(t=this.getAttribute("name"))?t:""}set name(t){this.setAttribute("name",t)}get validationMessage(){return this.internals.validationMessage}get validity(){return this.internals.validity}get willValidate(){return this.internals.willValidate}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.internals.reportValidity()}formResetCallback(){this.reset()}reset(){var t;this.clear(),this.value=null!=(t=this.getAttribute("value"))?t:""}updated(){this.internals.setValidity({badInput:this.hasError},this.error,this.timeInput),this.internals.setFormValue(this.value)}focus(){this.timeInput.focus()}firstUpdated(){this.validateDate()}render(){var t={disabled:this.disabled,error:!this.disabled&&this.hasError};return html`<ix-field class="${classMap(t)}" ?focused="${this.focused}" ?populated="${this.value}" ?disabled="${this.disabled}" ?required="${this.required}" ?error="${this.hasError&&!this.hideError}" error-text="${this.error}" label="${this.label}" @focusin="${this.focusin}" @focusout="${this.focusOut}"><input id="time-input" @change="${this.handleChange}" .value="${this.value}" class="flex-fill" type="time" min="${this.min}" max="${this.max}"></ix-field>`}}requestUpdateOnAriaChange(IxTime),IxTime.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},IxTime.formAssociated=!0,__decorate([property({type:String})],IxTime.prototype,"label",void 0),__decorate([property({type:String})],IxTime.prototype,"value",void 0),__decorate([property({type:String})],IxTime.prototype,"min",void 0),__decorate([property({type:String})],IxTime.prototype,"max",void 0),__decorate([query("#time-input")],IxTime.prototype,"timeInput",void 0),__decorate([property({type:Boolean,reflect:!0})],IxTime.prototype,"disabled",void 0),__decorate([state()],IxTime.prototype,"internalErrorText",void 0),__decorate([property({type:String})],IxTime.prototype,"errorText",void 0),__decorate([property({type:Boolean,reflect:!0})],IxTime.prototype,"required",void 0),__decorate([property({type:Boolean,reflect:!0})],IxTime.prototype,"hideError",void 0),__decorate([property({type:Function})],IxTime.prototype,"onChanged",void 0),__decorate([state()],IxTime.prototype,"focused",void 0),window.customElements.define("ix-time",IxTime);
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Webcomponent ix-time following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "Digital Realty",
|
|
6
|
-
"version": "1.0.
|
|
6
|
+
"version": "1.0.31-alpha.0",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"main": "dist/index.js",
|
|
9
9
|
"module": "dist/index.js",
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@digital-realty/ix-field": "^1.0.
|
|
30
|
-
"@digital-realty/theme": "^1.0.
|
|
29
|
+
"@digital-realty/ix-field": "^1.0.7-alpha.0",
|
|
30
|
+
"@digital-realty/theme": "^1.0.32-alpha.0",
|
|
31
31
|
"@material/web": "1.2.0",
|
|
32
32
|
"@web/test-runner-commands": "^0.9.0",
|
|
33
33
|
"lit": "^2.0.2"
|
|
@@ -99,5 +99,5 @@
|
|
|
99
99
|
"README.md",
|
|
100
100
|
"LICENSE"
|
|
101
101
|
],
|
|
102
|
-
"gitHead": "
|
|
102
|
+
"gitHead": "020de6dab25bbe6058e9a71b2c56681822403481"
|
|
103
103
|
}
|