Skip to content

Commit

Permalink
[pre-commit.ci] auto fixes from pre-commit.com hooks
Browse files Browse the repository at this point in the history
for more information, see https://pre-commit.ci
  • Loading branch information
pre-commit-ci[bot] committed May 30, 2024
1 parent ba7751a commit c265ced
Show file tree
Hide file tree
Showing 3 changed files with 202 additions and 202 deletions.
156 changes: 78 additions & 78 deletions src/electron/frontend/core/components/DateTimeSelector.js
Original file line number Diff line number Diff line change
@@ -1,78 +1,78 @@
import { LitElement, css } from "lit";

const convertToDateTimeLocalString = (date) => {
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, "0");
const day = date.getDate().toString().padStart(2, "0");
const hours = date.getHours().toString().padStart(2, "0");
const minutes = date.getMinutes().toString().padStart(2, "0");
return `${year}-${month}-${day}T${hours}:${minutes}`;
};

export class DateTimeSelector extends LitElement {
static get styles() {
return css`
:host {
display: inline-block;
position: relative;
}
`;
}

get value() {
return this.input.value;
}

set value(newValue) {
if (newValue) this.input.value = newValue;
else {
const d = new Date();
d.setHours(0, 0, 0, 0);
this.input.value = convertToDateTimeLocalString(d);
}
}
get min() {
return this.input.min;
}

set min(newValue) {
this.input.min = newValue;
}

get max() {
return this.input.max;
}

set max(newValue) {
this.input.max = newValue;
}

constructor({ value, min, max } = {}) {
super();
this.input = document.createElement("input");
this.input.type = "datetime-local";
this.input.min = min;
this.input.max = max;

this.addEventListener("click", () => {
this.input.focus();
this.input.showPicker();
});

this.value = value ? convertToDateTimeLocalString(value) : value;
}

focus() {
this.click();
}

blur() {
this.input.blur();
}

render() {
return this.input;
}
}

customElements.get("date-time-selector") || customElements.define("date-time-selector", DateTimeSelector);
import { LitElement, css } from "lit";

const convertToDateTimeLocalString = (date) => {
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, "0");
const day = date.getDate().toString().padStart(2, "0");
const hours = date.getHours().toString().padStart(2, "0");
const minutes = date.getMinutes().toString().padStart(2, "0");
return `${year}-${month}-${day}T${hours}:${minutes}`;
};

export class DateTimeSelector extends LitElement {
static get styles() {
return css`
:host {
display: inline-block;
position: relative;
}
`;
}

get value() {
return this.input.value;
}

set value(newValue) {
if (newValue) this.input.value = newValue;
else {
const d = new Date();
d.setHours(0, 0, 0, 0);
this.input.value = convertToDateTimeLocalString(d);
}
}
get min() {
return this.input.min;
}

set min(newValue) {
this.input.min = newValue;
}

get max() {
return this.input.max;
}

set max(newValue) {
this.input.max = newValue;
}

constructor({ value, min, max } = {}) {
super();
this.input = document.createElement("input");
this.input.type = "datetime-local";
this.input.min = min;
this.input.max = max;

this.addEventListener("click", () => {
this.input.focus();
this.input.showPicker();
});

this.value = value ? convertToDateTimeLocalString(value) : value;
}

focus() {
this.click();
}

blur() {
this.input.blur();
}

render() {
return this.input;
}
}

customElements.get("date-time-selector") || customElements.define("date-time-selector", DateTimeSelector);
28 changes: 14 additions & 14 deletions src/electron/frontend/core/components/DateTimeSelector.stories.js
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import { DateTimeSelector } from "./DateTimeSelector";

export default {
title: "Components/DateTime Selector",
};

const Template = (args) => new DateTimeSelector(args);

export const Default = Template.bind({});
export const Limited = Template.bind({});
Limited.args = {
min: "2024-01-01T00:00",
max: "2024-12-31T23:59",
};
import { DateTimeSelector } from "./DateTimeSelector";

export default {
title: "Components/DateTime Selector",
};

const Template = (args) => new DateTimeSelector(args);

export const Default = Template.bind({});
export const Limited = Template.bind({});
Limited.args = {
min: "2024-01-01T00:00",
max: "2024-12-31T23:59",
};
Loading

0 comments on commit c265ced

Please sign in to comment.