Skip to content

Commit

Permalink
Run prettier and remove errant brace
Browse files Browse the repository at this point in the history
  • Loading branch information
@ayangster
ayangster committed Sep 19, 2023
1 parent 159b73c commit 7c160df
Show file tree
Hide file tree
Showing 3 changed files with 127 additions and 129 deletions.
248 changes: 123 additions & 125 deletions src/calculator-form.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,129 +85,127 @@ export const formTemplate = (
onSubmit: (e: SubmitEvent) => void,
gridClass: string = 'grid-3-2',
) => html`
<form @submit=${onSubmit}>
<div class="${gridClass}">
<div>
<label for="project">
Project you're most interested in
<sl-tooltip
content="Select the project you're most interested in."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${multiselect({
id: 'projects',
options: Object.entries(PROJECTS)
.map(([value, data]) => ({ value, label: data.label }))
.sort((a, b) => a.label.localeCompare(b.label)),
currentValues: projects,
maxOptionsVisible: 1,
})}
</label>
</div>
<div>
<label for="zip">
Zip
<sl-tooltip
content="Your zip code helps determine the amount of discounts and tax credits you qualify for."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
<input
tabindex="0"
id="zip"
placeholder="12345"
name="zip"
required
type="text"
value="${zip}"
minlength="5"
maxlength="5"
inputmode="numeric"
pattern="[0-9]{5}"
/>
</label>
</div>
<div>
<label for="owner_status">
Homeowners Status
<sl-tooltip
content="Homeowners and renters qualify for different incentives."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'owner_status',
required: true,
options: OWNER_STATUS_OPTIONS,
currentValue: ownerStatus,
tabIndex: 0,
})}
</label>
</div>
<div>
<label for="household_income">
Household Income
<sl-tooltip
content="Enter your gross income (income before taxes). Include wages and salary plus other forms of income, including pensions, interest, dividends, and rental income. If you are married and file jointly, include your spouse's income"
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
<ra-currency-input
id="household_income"
placeholder="$60,000"
name="household_income"
required
value=${householdIncome}
min="0"
max="100000000"
></ra-currency-input>
</label>
</div>
<div>
<label for="tax_filing">
Tax Filing
<sl-tooltip hoist
><div slot="content">
Select "Head of Household" if you have a child or relative
living with you, and you pay more than half the costs of your
home. Select "Joint" if you file your taxes as a married
couple."
</div>
${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'tax_filing',
required: true,
options: TAX_FILING_OPTIONS,
currentValue: taxFiling,
tabIndex: 0,
})}
</label>
</div>
<div>
<label for="household_size">
Household Size
<sl-tooltip
content="Include anyone you live with who you claim as a dependent on your taxes, and your spouse or partner if you file taxes together."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'household_size',
required: true,
options: HOUSEHOLD_SIZE_OPTIONS,
currentValue: householdSize,
tabIndex: 0,
})}
</label>
</div>
<div>
<button class="calculate" type="submit">
Calculate! ${downIcon(18, 18)}
</button>
</div>
<form @submit=${onSubmit}>
<div class="${gridClass}">
<div>
<label for="project">
Project you're most interested in
<sl-tooltip
content="Select the project you're most interested in."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${multiselect({
id: 'projects',
options: Object.entries(PROJECTS)
.map(([value, data]) => ({ value, label: data.label }))
.sort((a, b) => a.label.localeCompare(b.label)),
currentValues: projects,
maxOptionsVisible: 1,
})}
</label>
</div>
</form>
`;
};
<div>
<label for="zip">
Zip
<sl-tooltip
content="Your zip code helps determine the amount of discounts and tax credits you qualify for."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
<input
tabindex="0"
id="zip"
placeholder="12345"
name="zip"
required
type="text"
value="${zip}"
minlength="5"
maxlength="5"
inputmode="numeric"
pattern="[0-9]{5}"
/>
</label>
</div>
<div>
<label for="owner_status">
Homeowners Status
<sl-tooltip
content="Homeowners and renters qualify for different incentives."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'owner_status',
required: true,
options: OWNER_STATUS_OPTIONS,
currentValue: ownerStatus,
tabIndex: 0,
})}
</label>
</div>
<div>
<label for="household_income">
Household Income
<sl-tooltip
content="Enter your gross income (income before taxes). Include wages and salary plus other forms of income, including pensions, interest, dividends, and rental income. If you are married and file jointly, include your spouse's income"
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
<ra-currency-input
id="household_income"
placeholder="$60,000"
name="household_income"
required
value=${householdIncome}
min="0"
max="100000000"
></ra-currency-input>
</label>
</div>
<div>
<label for="tax_filing">
Tax Filing
<sl-tooltip hoist
><div slot="content">
Select "Head of Household" if you have a child or relative living
with you, and you pay more than half the costs of your home.
Select "Joint" if you file your taxes as a married couple."
</div>
${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'tax_filing',
required: true,
options: TAX_FILING_OPTIONS,
currentValue: taxFiling,
tabIndex: 0,
})}
</label>
</div>
<div>
<label for="household_size">
Household Size
<sl-tooltip
content="Include anyone you live with who you claim as a dependent on your taxes, and your spouse or partner if you file taxes together."
hoist
>${questionIcon(18, 18)}</sl-tooltip
><br />
${select({
id: 'household_size',
required: true,
options: HOUSEHOLD_SIZE_OPTIONS,
currentValue: householdSize,
tabIndex: 0,
})}
</label>
</div>
<div>
<button class="calculate" type="submit">
Calculate! ${downIcon(18, 18)}
</button>
</div>
</div>
</form>
`;
6 changes: 3 additions & 3 deletions src/calculator.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,8 +74,8 @@ export class RewiringAmericaCalculator extends LitElement {
@property({ type: String, attribute: 'owner-status' })
ownerStatus: OwnerStatus = 'homeowner';

@property({ type: Array, attribute: 'projects'})
projects: string[] = ['heating']
@property({ type: Array, attribute: 'projects' })
projects: string[] = ['heating'];

@property({ type: String, attribute: 'household-income' })
householdIncome: string = '0';
Expand All @@ -101,7 +101,7 @@ export class RewiringAmericaCalculator extends LitElement {
return !(
this.zip &&
this.ownerStatus &&
this.projects &&
this.projects &&
this.taxFiling &&
this.householdIncome &&
this.householdSize
Expand Down
2 changes: 1 addition & 1 deletion src/select.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const option = ({ label, value }: OptionParam, selected: boolean) =>
html` <option value="${value}" ?selected=${selected}>${label}</option> `;

export const multioption = ({ label, value }: OptionParam) =>
html` <sl-option value="${value}" >${label}</sl-option> `;
html` <sl-option value="${value}">${label}</sl-option> `;

export const select = ({
id,
Expand Down

0 comments on commit 7c160df

Please sign in to comment.