Skip to content

Commit 1ab6ee3

Browse files
authored
HdsPageHeader TS Conversion (#2160)
1 parent e2862eb commit 1ab6ee3

15 files changed

+134
-6
lines changed

.changeset/pink-foxes-roll.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@hashicorp/design-system-components": minor
3+
---
4+
5+
`PageHeader` - Converted component to TypeScript

packages/components/src/components.ts

+2
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import HdsIconTile from './components/hds/icon-tile/index.ts';
2222
import HdsInteractive from './components/hds/interactive/index.ts';
2323
import HdsLinkInline from './components/hds/link/inline.ts';
2424
import HdsLinkStandalone from './components/hds/link/standalone.ts';
25+
import HdsPageHeader from './components/hds/page-header/index.ts';
2526
import HdsReveal from './components/hds/reveal/index.ts';
2627
import HdsSeparator from './components/hds/separator/index.ts';
2728
import HdsStepperStepIndicator from './components/hds/stepper/step/indicator.ts';
@@ -52,6 +53,7 @@ export {
5253
HdsInteractive,
5354
HdsLinkInline,
5455
HdsLinkStandalone,
56+
HdsPageHeader,
5557
HdsReveal,
5658
HdsSeparator,
5759
HdsStepperStepIndicator,

packages/components/src/components/hds/page-header/actions.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
3+
export interface HdsPageHeaderActionsSignature {
4+
Blocks: {
5+
default: [];
6+
};
7+
Element: HTMLDivElement;
8+
}
9+
10+
const HdsPageHeaderActionsComponent =
11+
TemplateOnlyComponent<HdsPageHeaderActionsSignature>();
12+
13+
export default HdsPageHeaderActionsComponent;

packages/components/src/components/hds/page-header/badges.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
3+
export interface HdsPageHeaderBadgesSignature {
4+
Blocks: {
5+
default: [];
6+
};
7+
Element: HTMLDivElement;
8+
}
9+
10+
const HdsPageHeaderBadgesComponent =
11+
TemplateOnlyComponent<HdsPageHeaderBadgesSignature>();
12+
13+
export default HdsPageHeaderBadgesComponent;

packages/components/src/components/hds/page-header/description.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
import type { HdsTextBodySignature } from '../text/body';
3+
4+
export interface HdsPageHeaderDescriptionSignature {
5+
Args: HdsTextBodySignature['Args'];
6+
Blocks: {
7+
default: [];
8+
};
9+
Element: HdsTextBodySignature['Element'];
10+
}
11+
12+
const HdsPageHeaderDescriptionComponent =
13+
TemplateOnlyComponent<HdsPageHeaderDescriptionSignature>();
14+
15+
export default HdsPageHeaderDescriptionComponent;

packages/components/src/components/hds/page-header/index.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
import type { ComponentLike } from '@glint/template';
3+
import type { HdsIconTileSignature } from '../icon-tile';
4+
import type { HdsYieldSignature } from '../yield';
5+
import type { HdsPageHeaderActionsSignature } from './actions';
6+
import type { HdsPageHeaderBadgesSignature } from './badges';
7+
import type { HdsPageHeaderDescriptionSignature } from './description';
8+
import type { HdsPageHeaderTitleSignature } from './title';
9+
import type { HdsPageHeaderSubtitleSignature } from './subtitle';
10+
11+
interface HdsPageHeaderSignature {
12+
Blocks: {
13+
default: [
14+
{
15+
Actions?: ComponentLike<HdsPageHeaderActionsSignature>;
16+
Badges?: ComponentLike<HdsPageHeaderBadgesSignature>;
17+
Breadcrumb?: ComponentLike<HdsYieldSignature>;
18+
Description?: ComponentLike<HdsPageHeaderDescriptionSignature>;
19+
Generic?: ComponentLike<HdsYieldSignature>;
20+
IconTile?: ComponentLike<HdsIconTileSignature>;
21+
Subtitle?: ComponentLike<HdsPageHeaderSubtitleSignature>;
22+
Title?: ComponentLike<HdsPageHeaderTitleSignature>;
23+
}
24+
];
25+
};
26+
Element: HTMLElement;
27+
}
28+
29+
const HdsPageHeaderComponent = TemplateOnlyComponent<HdsPageHeaderSignature>();
30+
31+
export default HdsPageHeaderComponent;

packages/components/src/components/hds/page-header/subtitle.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
import type { HdsTextBodySignature } from '../text/body';
3+
4+
export interface HdsPageHeaderSubtitleSignature {
5+
Args: HdsTextBodySignature['Args'];
6+
Blocks: {
7+
default: [];
8+
};
9+
Element: HdsTextBodySignature['Element'];
10+
}
11+
12+
const HdsPageHeaderSubtitleComponent =
13+
TemplateOnlyComponent<HdsPageHeaderSubtitleSignature>();
14+
15+
export default HdsPageHeaderSubtitleComponent;

packages/components/src/components/hds/page-header/title.hbs

-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
{{! @glint-nocheck: not typesafe yet }}
21
{{!
32
Copyright (c) HashiCorp, Inc.
43
SPDX-License-Identifier: MPL-2.0
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import TemplateOnlyComponent from '@ember/component/template-only';
2+
import type { HdsTextDisplaySignature } from '../text/display';
3+
4+
export interface HdsPageHeaderTitleSignature {
5+
Args: HdsTextDisplaySignature['Args'];
6+
Blocks: {
7+
default: [];
8+
};
9+
Element: HdsTextDisplaySignature['Element'];
10+
}
11+
12+
const HdsPageHeaderTitleComponent =
13+
TemplateOnlyComponent<HdsPageHeaderTitleSignature>();
14+
15+
export default HdsPageHeaderTitleComponent;

packages/components/src/template-registry.ts

+25
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,12 @@ import type HdsIconTileComponent from './components/hds/icon-tile';
3838
import type HdsInteractiveComponent from './components/hds/interactive';
3939
import type HdsLinkInlineComponent from './components/hds/link/inline';
4040
import type HdsLinkStandaloneComponent from './components/hds/link/standalone';
41+
import type HdsPageHeaderComponent from './components/hds/page-header';
42+
import type HdsPageHeaderActionsComponent from './components/hds/page-header/actions';
43+
import type HdsPageHeaderBadgesComponent from './components/hds/page-header/badges';
44+
import type HdsPageHeaderDescriptionComponent from './components/hds/page-header/description';
45+
import type HdsPageHeaderSubtitleComponent from './components/hds/page-header/subtitle';
46+
import type HdsPageHeaderTitleComponent from './components/hds/page-header/title';
4147
import type HdsRevealComponent from './components/hds/reveal';
4248
import type HdsRevealToggleButtonComponent from './components/hds/reveal/toggle/button';
4349
import type HdsSeparatorComponent from './components/hds/separator';
@@ -193,6 +199,25 @@ export default interface HdsComponentsRegistry {
193199
'Hds::Link::Standalone': typeof HdsLinkStandaloneComponent;
194200
'hds/link/standalone': typeof HdsLinkStandaloneComponent;
195201

202+
// Page Header
203+
'Hds::PageHeader': typeof HdsPageHeaderComponent;
204+
'hds/page-header': typeof HdsPageHeaderComponent;
205+
206+
'Hds::PageHeader::Actions': typeof HdsPageHeaderActionsComponent;
207+
'hds/page-header/actions': typeof HdsPageHeaderActionsComponent;
208+
209+
'Hds::PageHeader::Badges': typeof HdsPageHeaderBadgesComponent;
210+
'hds/page-header/badges': typeof HdsPageHeaderBadgesComponent;
211+
212+
'Hds::PageHeader::Description': typeof HdsPageHeaderDescriptionComponent;
213+
'hds/page-header/description': typeof HdsPageHeaderDescriptionComponent;
214+
215+
'Hds::PageHeader::Subtitle': typeof HdsPageHeaderSubtitleComponent;
216+
'hds/page-header/subtitle': typeof HdsPageHeaderSubtitleComponent;
217+
218+
'Hds::PageHeader::Title': typeof HdsPageHeaderTitleComponent;
219+
'hds/page-header/title': typeof HdsPageHeaderTitleComponent;
220+
196221
// Reveal
197222
'Hds::Reveal': typeof HdsRevealComponent;
198223
'hds/reveal': typeof HdsRevealComponent;

0 commit comments

Comments
 (0)