@digital-realty/ix-date 1.0.3 → 1.0.5

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.
Files changed (4) hide show
  1. package/dist/IxDate.d.ts +2 -5
  2. package/dist/IxDate.js +29 -52
  3. package/dist/IxDate.js.map +1 -1
  4. package/package.json +3 -2
package/dist/IxDate.d.ts CHANGED
@@ -25,12 +25,10 @@ export declare class IxDate extends LitElement {
25
25
  * This error state overrides the error state controlled by
26
26
  * `reportValidity()`.
27
27
  */
28
- error: boolean;
28
+ get error(): boolean;
29
29
  errorText: string;
30
- errorTextBelowRange: string;
31
- errorTextAboveRange: string;
32
- private errorMsg;
33
30
  required: boolean;
31
+ hideError: boolean;
34
32
  /**
35
33
  * The associated form element with which this element's value will submit.
36
34
  */
@@ -76,7 +74,6 @@ export declare class IxDate extends LitElement {
76
74
  focus(): void;
77
75
  onChanged: any;
78
76
  private focused;
79
- private range;
80
77
  firstUpdated(): void;
81
78
  focusin: () => void;
82
79
  clear: () => void;
package/dist/IxDate.js CHANGED
@@ -15,25 +15,12 @@ export class IxDate extends LitElement {
15
15
  this.internals = this /* needed for closure */
16
16
  .attachInternals();
17
17
  this.disabled = false;
18
- /**
19
- * Gets or sets whether or not the text field is in a visually invalid state.
20
- *
21
- * This error state overrides the error state controlled by
22
- * `reportValidity()`.
23
- */
24
- this.error = false;
25
- this.errorText = 'Invalid date';
26
- this.errorTextBelowRange = 'Below range';
27
- this.errorTextAboveRange = 'Above range';
28
- this.errorMsg = 'Invalid date';
18
+ this.errorText = '';
29
19
  this.required = false;
20
+ this.hideError = false;
30
21
  // eslint-disable-next-line class-methods-use-this
31
22
  this.onChanged = () => { };
32
23
  this.focused = false;
33
- this.range = {
34
- min: undefined,
35
- max: undefined,
36
- };
37
24
  this.focusin = () => {
38
25
  this.focused = true;
39
26
  };
@@ -47,23 +34,11 @@ export class IxDate extends LitElement {
47
34
  this.onChanged(value);
48
35
  };
49
36
  this.validateDate = () => {
50
- const date = new Date(this.value);
51
- let errorType;
52
- if (!date) {
53
- errorType = 'errorText';
54
- }
55
- else if (this.range.min && date < this.range.min) {
56
- errorType = 'errorTextBelowRange';
57
- }
58
- else if (this.range.max && date > this.range.max) {
59
- errorType = 'errorTextAboveRange';
60
- }
61
- if (errorType) {
62
- this.error = true;
63
- this.errorMsg = this[errorType];
64
- }
65
- else {
66
- this.error = false;
37
+ if (this.value) {
38
+ const date = new Date(this.value);
39
+ if (!date || isNaN(date.valueOf())) {
40
+ this.errorText = "Invalid date format.";
41
+ }
67
42
  }
68
43
  };
69
44
  this.focusOut = () => {
@@ -73,6 +48,13 @@ export class IxDate extends LitElement {
73
48
  static get styles() {
74
49
  return [IxDateStyles];
75
50
  }
51
+ /**
52
+ * Gets or sets whether or not the text field is in a visually invalid state.
53
+ *
54
+ * This error state overrides the error state controlled by
55
+ * `reportValidity()`.
56
+ */
57
+ get error() { return !!this.errorText; }
76
58
  /**
77
59
  * The associated form element with which this element's value will submit.
78
60
  */
@@ -141,7 +123,7 @@ export class IxDate extends LitElement {
141
123
  }
142
124
  updated() {
143
125
  this.internals.setValidity({
144
- badInput: this.error,
126
+ badInput: this.error
145
127
  }, this.error ? this.errorText : '', this.dateInput);
146
128
  this.internals.setFormValue(this.value);
147
129
  }
@@ -149,8 +131,14 @@ export class IxDate extends LitElement {
149
131
  this.dateInput.focus();
150
132
  }
151
133
  firstUpdated() {
152
- this.range.min = new Date(this.min);
153
- this.range.max = new Date(this.max);
134
+ var minDate = new Date(this.min);
135
+ var maxDate = new Date(this.max);
136
+ if (minDate && !isNaN(minDate.valueOf())) {
137
+ this.min = minDate.toISOString().split("T")[0];
138
+ }
139
+ if (maxDate && !isNaN(maxDate.valueOf())) {
140
+ this.max = maxDate.toISOString().split("T")[0];
141
+ }
154
142
  this.validateDate();
155
143
  }
156
144
  render() {
@@ -162,10 +150,11 @@ export class IxDate extends LitElement {
162
150
  <ix-field
163
151
  class="${classMap(classes)}"
164
152
  ?focused=${this.focused}
153
+ ?populated=${this.value}
165
154
  ?disabled=${this.disabled}
166
155
  ?required=${this.required}
167
- ?error=${this.error}
168
- error-text=${this.errorMsg}
156
+ ?error=${this.error && !this.hideError}
157
+ error-text=${this.errorText}
169
158
  label=${this.label}
170
159
  @focusin=${this.focusin}
171
160
  @focusout=${this.focusOut}
@@ -212,31 +201,19 @@ __decorate([
212
201
  __decorate([
213
202
  property({ type: Boolean, reflect: true })
214
203
  ], IxDate.prototype, "disabled", void 0);
215
- __decorate([
216
- property({ type: Boolean, reflect: true })
217
- ], IxDate.prototype, "error", void 0);
218
204
  __decorate([
219
205
  property({ type: String, attribute: 'error-text' })
220
206
  ], IxDate.prototype, "errorText", void 0);
221
- __decorate([
222
- property({ type: String, attribute: 'error-text-below-range' })
223
- ], IxDate.prototype, "errorTextBelowRange", void 0);
224
- __decorate([
225
- property({ type: String, attribute: 'error-text-above-range' })
226
- ], IxDate.prototype, "errorTextAboveRange", void 0);
227
- __decorate([
228
- state()
229
- ], IxDate.prototype, "errorMsg", void 0);
230
207
  __decorate([
231
208
  property({ type: Boolean, reflect: true })
232
209
  ], IxDate.prototype, "required", void 0);
210
+ __decorate([
211
+ property({ type: Boolean, reflect: true })
212
+ ], IxDate.prototype, "hideError", void 0);
233
213
  __decorate([
234
214
  property({ type: Function })
235
215
  ], IxDate.prototype, "onChanged", void 0);
236
216
  __decorate([
237
217
  state()
238
218
  ], IxDate.prototype, "focused", void 0);
239
- __decorate([
240
- state()
241
- ], IxDate.prototype, "range", void 0);
242
219
  //# sourceMappingURL=IxDate.js.map
package/dist/IxDate.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IxDate.js","sourceRoot":"","sources":["../src/IxDate.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { IxDateStyles } from './ix-date-styles.js';\n\nexport class IxDate extends LitElement {\n static {\n requestUpdateOnAriaChange(IxDate);\n }\n\n static get styles() {\n return [IxDateStyles];\n }\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) value = '';\n\n @property({ type: String }) min = '';\n\n @property({ type: String }) max = '';\n\n // Form association\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n /** @nocollapse */\n static readonly formAssociated = true;\n\n private readonly internals = (this as HTMLElement) /* needed for closure */\n .attachInternals();\n\n @query('#date-input') dateInput!: HTMLInputElement;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /**\n * Gets or sets whether or not the text field is in a visually invalid state.\n *\n * This error state overrides the error state controlled by\n * `reportValidity()`.\n */\n @property({ type: Boolean, reflect: true }) error = false;\n\n @property({ type: String, attribute: 'error-text' }) errorText =\n 'Invalid date';\n\n @property({ type: String, attribute: 'error-text-below-range' })\n errorTextBelowRange = 'Below range';\n\n @property({ type: String, attribute: 'error-text-above-range' })\n errorTextAboveRange = 'Above range';\n\n @state() private errorMsg = 'Invalid date';\n\n @property({ type: Boolean, reflect: true }) required = false;\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.internals.form;\n }\n\n /**\n * The labels this element is associated with.\n */\n get labels() {\n return this.internals.labels;\n }\n\n /**\n * The HTML name to use in form submission.\n */\n get name() {\n return this.getAttribute('name') ?? '';\n }\n\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /**\n * Returns the text field's validation error message.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation\n */\n get validationMessage() {\n return this.internals.validationMessage;\n }\n\n /**\n * Returns a `ValidityState` object that represents the validity states of the\n * text field.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/ValidityState\n */\n get validity() {\n return this.internals.validity;\n }\n\n /**\n * Returns whether an element will successfully validate based on forms\n * validation rules and constraints.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate\n */\n get willValidate() {\n return this.internals.willValidate;\n }\n\n checkValidity() {\n return this.internals.checkValidity();\n }\n\n reportValidity() {\n return this.internals.reportValidity();\n }\n\n /** @private */\n formResetCallback() {\n this.reset();\n }\n\n /**\n * Reset the text field to its default value.\n */\n reset() {\n this.clear();\n this.value = this.getAttribute('value') ?? '';\n }\n\n protected override updated() {\n this.internals.setValidity(\n {\n badInput: this.error,\n },\n this.error ? this.errorText : '',\n this.dateInput\n );\n this.internals.setFormValue(this.value);\n }\n\n override focus() {\n this.dateInput.focus();\n }\n\n // eslint-disable-next-line class-methods-use-this\n @property({ type: Function }) onChanged: any = () => {};\n\n @state() private focused = false;\n\n @state() private range: { min: Date | undefined; max: Date | undefined } = {\n min: undefined,\n max: undefined,\n };\n\n firstUpdated() {\n this.range.min = new Date(this.min);\n this.range.max = new Date(this.max);\n this.validateDate();\n }\n\n focusin = () => {\n this.focused = true;\n };\n\n clear = () => {\n this.value = '';\n };\n\n handleChange = (e: InputEvent) => {\n const { value } = e.target as HTMLInputElement;\n this.value = value;\n this.validateDate();\n this.onChanged(value);\n };\n\n validateDate = () => {\n const date = new Date(this.value);\n let errorType:\n | 'errorText'\n | 'errorTextBelowRange'\n | 'errorTextAboveRange'\n | undefined;\n if (!date) {\n errorType = 'errorText';\n } else if (this.range.min && date < this.range.min) {\n errorType = 'errorTextBelowRange';\n } else if (this.range.max && date > this.range.max) {\n errorType = 'errorTextAboveRange';\n }\n if (errorType) {\n this.error = true;\n this.errorMsg = this[errorType];\n } else {\n this.error = false;\n }\n };\n\n focusOut = () => {\n this.focused = false;\n };\n\n render() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.error,\n };\n\n return html`\n <ix-field\n class=\"${classMap(classes)}\"\n ?focused=${this.focused}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?error=${this.error}\n error-text=${this.errorMsg}\n label=${this.label}\n @focusin=${this.focusin}\n @focusout=${this.focusOut}\n >\n <input\n id=\"date-input\"\n @change=${this.handleChange}\n .value=${this.value}\n class=\"flex-fill\"\n type=\"date\"\n min=${this.min}\n max=${this.max}\n />\n </ix-field>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"IxDate.js","sourceRoot":"","sources":["../src/IxDate.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '@digital-realty/ix-field/ix-field.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { IxDateStyles } from './ix-date-styles.js';\n\nexport class IxDate extends LitElement {\n static {\n requestUpdateOnAriaChange(IxDate);\n }\n\n static get styles() {\n return [IxDateStyles];\n }\n\n @property({ type: String }) label = '';\n\n @property({ type: String }) value = '';\n\n @property({ type: String }) min = '';\n\n @property({ type: String }) max = '';\n\n // Form association\n\n /** @nocollapse */\n static override shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n /** @nocollapse */\n static readonly formAssociated = true;\n\n private readonly internals = (this as HTMLElement) /* needed for closure */\n .attachInternals();\n\n @query('#date-input') dateInput!: HTMLInputElement;\n\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /**\n * Gets or sets whether or not the text field is in a visually invalid state.\n *\n * This error state overrides the error state controlled by\n * `reportValidity()`.\n */\n get error() { return !!this.errorText; }\n\n @property({ type: String, attribute: 'error-text' }) errorText = '';\n\n @property({ type: Boolean, reflect: true }) required = false;\n\n @property({ type: Boolean, reflect: true }) hideError = false;\n\n /**\n * The associated form element with which this element's value will submit.\n */\n get form() {\n return this.internals.form;\n }\n\n /**\n * The labels this element is associated with.\n */\n get labels() {\n return this.internals.labels;\n }\n\n /**\n * The HTML name to use in form submission.\n */\n get name() {\n return this.getAttribute('name') ?? '';\n }\n\n set name(name: string) {\n this.setAttribute('name', name);\n }\n\n /**\n * Returns the text field's validation error message.\n *\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Constraint_validation\n */\n get validationMessage() {\n return this.internals.validationMessage;\n }\n\n /**\n * Returns a `ValidityState` object that represents the validity states of the\n * text field.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/ValidityState\n */\n get validity() {\n return this.internals.validity;\n }\n\n /**\n * Returns whether an element will successfully validate based on forms\n * validation rules and constraints.\n *\n * https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals/willValidate\n */\n get willValidate() {\n return this.internals.willValidate;\n }\n\n checkValidity() {\n return this.internals.checkValidity();\n }\n\n reportValidity() {\n return this.internals.reportValidity();\n }\n\n /** @private */\n formResetCallback() {\n this.reset();\n }\n\n /**\n * Reset the text field to its default value.\n */\n reset() {\n this.clear();\n this.value = this.getAttribute('value') ?? '';\n }\n\n protected override updated() {\n this.internals.setValidity(\n {\n badInput: this.error\n },\n this.error ? this.errorText : '',\n this.dateInput\n );\n this.internals.setFormValue(this.value);\n }\n\n override focus() {\n this.dateInput.focus();\n }\n\n // eslint-disable-next-line class-methods-use-this\n @property({ type: Function }) onChanged: any = () => {};\n\n @state() private focused = false;\n\n firstUpdated() {\n var minDate = new Date(this.min);\n var maxDate = new Date(this.max);\n\n if (minDate && !isNaN(minDate.valueOf())){\n this.min = minDate.toISOString().split(\"T\")[0];\n }\n\n if(maxDate && !isNaN(maxDate.valueOf())){\n this.max = maxDate.toISOString().split(\"T\")[0];\n }\n\n this.validateDate();\n }\n\n focusin = () => {\n this.focused = true;\n };\n\n clear = () => {\n this.value = '';\n };\n\n\n handleChange = (e: InputEvent) => {\n const { value } = e.target as HTMLInputElement;\n this.value = value;\n this.validateDate();\n this.onChanged(value);\n };\n\n validateDate = () => { \n if(this.value){\n const date = new Date(this.value);\n\n if (!date || isNaN(date.valueOf()) ) {\n this.errorText = \"Invalid date format.\"\n }\n }\n };\n\n focusOut = () => {\n this.focused = false;\n };\n\n render() {\n const classes = {\n disabled: this.disabled,\n error: !this.disabled && this.error,\n };\n\n return html`\n <ix-field\n class=\"${classMap(classes)}\"\n ?focused=${this.focused}\n ?populated=${this.value}\n ?disabled=${this.disabled}\n ?required=${this.required}\n ?error=${this.error && !this.hideError}\n error-text=${this.errorText}\n label=${this.label}\n @focusin=${this.focusin}\n @focusout=${this.focusOut}\n >\n <input\n id=\"date-input\"\n @change=${this.handleChange}\n .value=${this.value}\n class=\"flex-fill\"\n type=\"date\"\n min=${this.min}\n max=${this.max}\n />\n </ix-field>\n `;\n }\n}\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-date following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "Digital Realty",
6
- "version": "1.0.3",
6
+ "version": "1.0.5",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -35,6 +35,7 @@
35
35
  "@custom-elements-manifest/analyzer": "^0.4.17",
36
36
  "@open-wc/eslint-config": "^9.2.1",
37
37
  "@open-wc/testing": "^3.1.6",
38
+ "@types/glob": "^8.1.0",
38
39
  "@typescript-eslint/eslint-plugin": "^5.48.0",
39
40
  "@typescript-eslint/parser": "^5.48.0",
40
41
  "@web/dev-server": "^0.1.34",
@@ -95,5 +96,5 @@
95
96
  "README.md",
96
97
  "LICENSE"
97
98
  ],
98
- "gitHead": "1aab5eef9aa782fa1be5a79b34c90f48719b0447"
99
+ "gitHead": "2cb2757c95df9570672b39b8506c31642d683a45"
99
100
  }