Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prefer else over inverse #175

Merged
merged 2 commits into from
Apr 20, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ While GlimmerX components accept `Args` as a type parameter, the Glint version a
The `Element` field declares what type of element(s), if any, the component applies its passed `...attributes` to. This is often the component's root element. Tracking this type ensures any modifiers used on your component will be compatible with the DOM element(s) they're ultimately attached to. If no `Element` is specified, it will be a type error to set any HTML attributes when invoking your component.

The `Yields` field specifies the names of any blocks the component yields to, as well as the type of any parameter(s) they'll receive. See the [Yieldable Named Blocks RFC] for further details.
(Note that the `inverse` block is an alias for `else`. These should be defined in `Yields` as `else`, though `{{yield to="inverse"}}` will continue to work.)

```ts
import Component from '@glint/environment-glimmerx/component';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,6 @@ import { AcceptsBlocks, DirectInvokable, EmptyObject } from '@glint/template/-pr
export type EachInKeyword = DirectInvokable<{
<T>(args: EmptyObject, object: T): AcceptsBlocks<{
default: [key: keyof NonNullable<T>, value: NonNullable<T>[keyof NonNullable<T>]];
inverse?: [];
else?: [];
}>;
}>;
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,6 @@ type ArrayLike<T> = ReadonlyArray<T> | Iterable<T> | EmberArray<T>;
export type EachKeyword = DirectInvokable<{
<T = any>(args: { key?: string }, items: ArrayLike<T> | null | undefined): AcceptsBlocks<{
default: [T, number];
inverse: [];
else: [];
}>;
}>;
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ import { expectTypeOf } from 'expect-type';
};
Yields: {
default: [number];
inverse?: [];
else?: [];
};
}

Expand Down Expand Up @@ -79,7 +79,7 @@ import { expectTypeOf } from 'expect-type';
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ expectTypeOf(Component.extend).toEqualTypeOf(UpstreamEmberComponent.extend);
};
Yields: {
default: [T];
inverse?: [];
else?: [];
};
}

Expand All @@ -79,7 +79,7 @@ expectTypeOf(Component.extend).toEqualTypeOf(UpstreamEmberComponent.extend);
if (𝚪.args.values.length) {
yieldToBlock(𝚪, 'default', 𝚪.args.values[0]);
} else {
yieldToBlock(𝚪, 'inverse');
yieldToBlock(𝚪, 'else');
}
});
}
Expand Down Expand Up @@ -116,7 +116,7 @@ expectTypeOf(Component.extend).toEqualTypeOf(UpstreamEmberComponent.extend);
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ import { expectTypeOf } from 'expect-type';
};
Yields: {
default: [T];
inverse?: [];
else?: [];
};
}

Expand All @@ -70,7 +70,7 @@ import { expectTypeOf } from 'expect-type';
if (𝚪.args.values.length) {
yieldToBlock(𝚪, 'default', 𝚪.args.values[0]);
} else {
yieldToBlock(𝚪, 'inverse');
yieldToBlock(𝚪, 'else');
}
});
}
Expand Down Expand Up @@ -107,7 +107,7 @@ import { expectTypeOf } from 'expect-type';
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -27,12 +27,12 @@ declare const maybeVal: { a: number; b: number } | undefined;
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}

// Can render inverse when undefined, null, or empty.
// Can render else when undefined, null, or empty.

{
const component = emitComponent(eachIn({}, undefined));
Expand All @@ -45,7 +45,7 @@ declare const maybeVal: { a: number; b: number } | undefined;
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand All @@ -61,7 +61,7 @@ declare const maybeVal: { a: number; b: number } | undefined;
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand All @@ -77,7 +77,7 @@ declare const maybeVal: { a: number; b: number } | undefined;
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ let each = resolve(Globals['each']);
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand Down
6 changes: 3 additions & 3 deletions packages/environment-glimmerx/__tests__/component.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ import { EmptyObject } from '@glint/template/-private/integration';
};
Yields: {
default: [T];
inverse?: [];
else?: [];
};
}

Expand All @@ -72,7 +72,7 @@ import { EmptyObject } from '@glint/template/-private/integration';
if (𝚪.args.values.length) {
yieldToBlock(𝚪, 'default', 𝚪.args.values[0]);
} else {
yieldToBlock(𝚪, 'inverse');
yieldToBlock(𝚪, 'else');
}
});
}
Expand Down Expand Up @@ -125,7 +125,7 @@ import { EmptyObject } from '@glint/template/-private/integration';
}

{
const [...args] = component.blockParams.inverse;
const [...args] = component.blockParams.else;
expectTypeOf(args).toEqualTypeOf<[]>();
}
}
Expand Down
2 changes: 1 addition & 1 deletion packages/template/-private/keywords/each.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,6 @@ import { AcceptsBlocks, DirectInvokable } from '../integration';
export type EachKeyword = DirectInvokable<{
<T>(args: { key?: string }, items: readonly T[]): AcceptsBlocks<{
default: [T, number];
inverse?: [];
else?: [];
}>;
}>;
2 changes: 1 addition & 1 deletion packages/template/-private/keywords/with.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,6 @@ import { AcceptsBlocks, DirectInvokable, EmptyObject } from '../integration';
export type WithKeyword = DirectInvokable<{
<T>(args: EmptyObject, value: T): AcceptsBlocks<{
default: [T];
inverse?: [];
else?: [];
}>;
}>;
4 changes: 2 additions & 2 deletions packages/template/__tests__/custom-invokable.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ declare const caseOf: DirectInvokable<
key: K
) => AcceptsBlocks<{
default: SumVariants<T>[K];
inverse?: [];
else?: [];
}>
>
];
Expand Down Expand Up @@ -62,7 +62,7 @@ declare const caseOf: DirectInvokable<
emitValue(resolveOrReturn(n)({}));
}
{
component.blockParams.inverse;
component.blockParams.else;
{
const component = emitComponent(resolve(when)({}, 'Nothing'));
expectTypeOf(component.blockParams.default).toEqualTypeOf<[]>();
Expand Down
2 changes: 1 addition & 1 deletion packages/template/__tests__/keywords/with.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const withKeyword = resolve({} as WithKeyword);
}

{
component.blockParams.inverse;
component.blockParams.else;
}
}

Expand Down
30 changes: 25 additions & 5 deletions packages/transform/__tests__/template-to-typescript.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -291,7 +291,7 @@ describe('rewriteTemplate', () => {
χ.emitValue(χ.resolveOrReturn(ok)({}));
}
{
const [] = 𝛄.blockParams.inverse;
const [] = 𝛄.blockParams.else;
χ.emitValue(χ.resolveOrReturn(𝚪.args.nevermind)({}));
}
χ.Globals[\\"doAThing\\"];
Expand Down Expand Up @@ -355,6 +355,26 @@ describe('rewriteTemplate', () => {
`"χ.yieldToBlock(𝚪, \\"body\\", 123);"`
);
});

test('{{yield}} to else', () => {
let template = stripIndent`
{{yield 123 to="else"}}
`;

expect(templateBody(template)).toMatchInlineSnapshot(
`"χ.yieldToBlock(𝚪, \\"else\\", 123);"`
);
});

test('{{yield}} to inverse', () => {
let template = stripIndent`
{{yield 123 to="inverse"}}
`;

expect(templateBody(template)).toMatchInlineSnapshot(
`"χ.yieldToBlock(𝚪, \\"else\\", 123);"`
);
});
});

describe('{{array}}', () => {
Expand Down Expand Up @@ -687,7 +707,7 @@ describe('rewriteTemplate', () => {
`);
});

test('invocation with an inverse block', () => {
test('invocation with an else block', () => {
let template = stripIndent`
{{#foo as |bar baz|}}
{{bar}}: {{baz}}
Expand All @@ -705,15 +725,15 @@ describe('rewriteTemplate', () => {
χ.emitValue(χ.resolveOrReturn(baz)({}));
}
{
const [] = 𝛄.blockParams.inverse;
const [] = 𝛄.blockParams.else;
χ.emitValue(χ.resolveOrReturn(𝚪.args.oh)({}));
}
χ.Globals[\\"foo\\"];
}"
`);
});

test('chained inverse', () => {
test('chained else', () => {
let template = stripIndent`
{{#foo as |bar baz|}}
{{bar}}: {{baz}}
Expand All @@ -731,7 +751,7 @@ describe('rewriteTemplate', () => {
χ.emitValue(χ.resolveOrReturn(baz)({}));
}
{
const [] = 𝛄.blockParams.inverse;
const [] = 𝛄.blockParams.else;
χ.emitValue(χ.resolveOrReturn(𝚪.args.oh)({}));
}
χ.Globals[\\"foo\\"];
Expand Down
7 changes: 6 additions & 1 deletion packages/transform/src/template-to-typescript.ts
Original file line number Diff line number Diff line change
Expand Up @@ -671,7 +671,12 @@ export function templateToTypescript(
to = toPair.value.value;
}

if (to === 'inverse') {
to = 'else';
}

emit.text('χ.yieldToBlock(𝚪, ');

emit.text(JSON.stringify(to));

for (let param of node.params) {
Expand Down Expand Up @@ -780,7 +785,7 @@ export function templateToTypescript(
emitBlock('default', node.program);

if (node.inverse) {
emitBlock('inverse', node.inverse);
emitBlock('else', node.inverse);
}

// TODO: emit something corresponding to `{{/foo}}` like we do
Expand Down