-
Notifications
You must be signed in to change notification settings - Fork 100
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
18 changed files
with
509 additions
and
291 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,139 +1,96 @@ | ||
| {{#if this.docIsBeingCreated}} | ||
| <div | ||
| data-test-creating-new-doc | ||
| class="hds-typography-display-400 mt-3 text-center" | ||
| <New::Form | ||
| @taskIsRunning={{this.docIsBeingCreated}} | ||
| @icon={{get-doctype-icon @docType}} | ||
| @headline="Create your {{@docType}}" | ||
| @buttonIsActive={{this.buttonIsActive}} | ||
| @taskIsRunningHeadline="Creating draft in Google Drive..." | ||
| @taskIsRunningDescription="This usually takes 10-20 seconds." | ||
| @buttonText="Create draft in Google Drive" | ||
| {{did-insert this.registerForm}} | ||
| {{on "submit" this.submit}} | ||
| data-test-new-doc-form | ||
| > | ||
| {{! Title }} | ||
| <Hds::Form::Textarea::Field | ||
| {{auto-height-textarea}} | ||
| {{autofocus}} | ||
| data-test-title-input | ||
| @value={{this.title}} | ||
| class="px-2.5" | ||
| placeholder="Enter a title" | ||
| name="title" | ||
| {{on "keydown" this.onKeydown}} | ||
| as |F| | ||
| > | ||
| <FlightIcon @name="loading" @size="24" /> | ||
| <div class="mt-8 text-display-200 font-semibold"> | ||
| Creating draft in Google Drive... | ||
| <F.Label @isRequired={{true}}>Title</F.Label> | ||
| {{#if this.formErrors.title}} | ||
| <F.Error data-test-title-error> | ||
| {{this.formErrors.title}} | ||
| </F.Error> | ||
| {{/if}} | ||
| </Hds::Form::Textarea::Field> | ||
|
|
||
| {{! Summary }} | ||
| <div> | ||
| <div class="flex gap-2.5"> | ||
| <Hds::Form::Label>Summary</Hds::Form::Label> | ||
| {{#if this.summaryIsLong}} | ||
| <span | ||
| data-test-summary-warning | ||
| class="mt-px text-body-100 text-color-foreground-warning" | ||
| > | ||
| Limit this to 1 or 2 sentences if possible. | ||
| </span> | ||
| {{/if}} | ||
| </div> | ||
| <div class="text-body-200 text-color-foreground-faint">This usually takes | ||
| 10-20 seconds.</div> | ||
| <Hds::Form::Textarea::Field | ||
| data-test-summary-input | ||
| @value={{this.summary}} | ||
| rows="3" | ||
| name="summary" | ||
| class="mt-2 px-2.5 py-2 placeholder-color-palette-neutral-400" | ||
| placeholder="One or two sentences outlining your doc." | ||
| {{on "keydown" this.onKeydown}} | ||
| /> | ||
| </div> | ||
| {{else}} | ||
| <form | ||
| data-test-new-doc-form | ||
| class="grid grid-cols-[1fr_250px] grid-rows-1 gap-10" | ||
| {{on "submit" this.submit}} | ||
| {{did-insert this.registerForm}} | ||
| > | ||
| <div> | ||
| <div class="space-y-4"> | ||
| <h1>Create your | ||
| {{@docType}}</h1> | ||
| </div> | ||
| <div class="space-y-7 pt-10"> | ||
| <Hds::Form::TextInput::Field | ||
| data-test-title-input | ||
| @type="text" | ||
| @isRequired={{true}} | ||
| @value={{this.title}} | ||
| name="title" | ||
| placeholder="Enter a document title" | ||
| {{on "input" this.updateForm}} | ||
| as |F| | ||
| > | ||
| <F.Label>Title</F.Label> | ||
| <F.HelperText> | ||
| A succinct outline of the idea youʼre proposing. | ||
| </F.HelperText> | ||
| </Hds::Form::TextInput::Field> | ||
|
|
||
| <div class="relative"> | ||
| <Hds::Form::Textarea::Field | ||
| data-test-summary-input | ||
| @value={{this.summary}} | ||
| rows="3" | ||
| name="summary" | ||
| {{on "input" this.updateForm}} | ||
| as |F| | ||
| > | ||
| <F.Label>Summary</F.Label> | ||
| <F.HelperText> | ||
| <span | ||
| class={{if | ||
| this.summaryIsLong | ||
| "bg-color-surface-warning text-color-foreground-warning-on-surface transition-colors" | ||
| }} | ||
| >One or two sentences</span> | ||
| outlining your doc. | ||
| {{if this.summaryIsLong "(Just a recommendation)"}} | ||
| </F.HelperText> | ||
| </Hds::Form::Textarea::Field> | ||
| </div> | ||
|
|
||
| <div> | ||
| <div class="mb-2"> | ||
| <span class="hermes-form-label"> | ||
| Product/Area | ||
| <Hds::Badge @size="small" @text="Required" /> | ||
| </span> | ||
| <span class="hermes-form-helper-text hds-form-helper-text"> | ||
| Where your doc should be categorized. | ||
| </span> | ||
| </div> | ||
| <div class="w-[300px]"> | ||
| <Inputs::ProductSelect | ||
| @selected={{this.productArea}} | ||
| @onChange={{this.onProductSelect}} | ||
| class="max-h-[240px]" | ||
| /> | ||
| </div> | ||
| </div> | ||
| {{! Product/area }} | ||
| <div> | ||
| <Hds::Form::Label | ||
| class="mb-2 flex" | ||
| @controlId="product-select" | ||
| @isRequired={{true}} | ||
| > | ||
| Product/Area | ||
| </Hds::Form::Label> | ||
| <Inputs::ProductSelect | ||
| @selected={{this.productArea}} | ||
| @onChange={{this.onProductSelect}} | ||
| @offset={{(hash mainAxis=0 crossAxis=-3)}} | ||
| @matchAnchorWidth={{hash enabled=true additionalWidth=6}} | ||
| class="max-h-[240px]" | ||
| /> | ||
| {{#if this.formErrors.productAbbreviation}} | ||
| <Hds::Form::Error data-test-product-error class="mt-2"> | ||
| {{this.formErrors.productAbbreviation}} | ||
| </Hds::Form::Error> | ||
| {{/if}} | ||
| </div> | ||
|
|
||
| <Hds::Form::Field @layout="vertical" as |F|> | ||
| {{yield | ||
| (hash | ||
| Error=F.Error | ||
| HelperText=F.HelperText | ||
| Label=F.Label | ||
| isRequired=F.isRequired | ||
| isOptional=F.isOptional | ||
| ) | ||
| }} | ||
| <F.Control> | ||
| <Inputs::PeopleSelect | ||
| class="multiselect mt-2 w-auto" | ||
| @selected={{this.contributors}} | ||
| @onChange={{this.updateContributors}} | ||
| /> | ||
| </F.Control> | ||
| <F.Label> | ||
| <FlightIcon @name="users" /> | ||
| Contributors | ||
| </F.Label> | ||
| {{#if this.formErrors.contributors}} | ||
| <F.Error as |E|> | ||
| <E.Message>{{this.formErrors.contributors}}</E.Message> | ||
| </F.Error> | ||
| {{/if}} | ||
| <F.HelperText> | ||
| People to share your doc with. You can always add more later. | ||
| </F.HelperText> | ||
| </Hds::Form::Field> | ||
| </div> | ||
| <div class="h-24"></div> | ||
| </div> | ||
| <div> | ||
| <div class="preview-card"> | ||
| <h3> | ||
| <FlightIcon @name="eye" /> | ||
| Preview | ||
| </h3> | ||
| <Doc::Tile | ||
| @productArea={{this.productArea}} | ||
| @status="draft" | ||
| @title={{this.title}} | ||
| @owner={{this.authenticatedUser.info.email}} | ||
| /> | ||
| <Hds::Button | ||
| data-test-create-button | ||
| @text="Create draft in Google Drive" | ||
| type="submit" | ||
| disabled={{not this.formRequirementsMet}} | ||
| class="w-full" | ||
| /> | ||
| </div> | ||
| </div> | ||
| </form> | ||
| {{/if}} | ||
| {{! Contributors }} | ||
| <Hds::Form::Field @layout="vertical" as |F|> | ||
| <F.Control> | ||
| <Inputs::PeopleSelect | ||
| class="multiselect w-full" | ||
| @selected={{this.contributors}} | ||
| @onChange={{this.updateContributors}} | ||
| /> | ||
| </F.Control> | ||
| <F.Label class="flex items-center gap-1.5"> | ||
| Contributors | ||
| <TooltipIcon | ||
| @text="People to share your doc with. You can always add more later." | ||
| /> | ||
| </F.Label> | ||
| </Hds::Form::Field> | ||
| </New::Form> |
Oops, something went wrong.