add custom head component

types/Head/Head.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="svelte" />
+
+export interface HeadProps {
+  /**
+   * Set the flexDirection of the head
+   * @default 'row'
+   */
+  flexDirection?: "row" | "row-reverse";
+
+  /**
+   * Set the margin of the head
+   * @default '20px 0 15px'
+   */
+  margin?: string;
+}
+
+export default class Head {
+  $$prop_def: HeadProps;
+  $$slot_def: {
+    default: {};
+  };
+
+  $on(eventname: string, cb: (event: Event) => void): () => void;
+}

types/Head/HeadAction.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="svelte" />
+
+export interface HeadActionProps {
+  /**
+   * Specify the href attribute
+   */
+  href?: string;
+
+  /**
+   * Specify the icon from `carbon-icons-svelte` to render
+   */
+  icon?: typeof import("carbon-icons-svelte").CarbonIcon;
+
+  /**
+   * Specify the description
+   */
+  description?: string;
+}
+
+export default class HeadAction {
+  $$prop_def: HeadActionProps;
+  $$slot_def: {};
+
+  $on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
+  $on(eventname: string, cb: (event: Event) => void): () => void;
+}

types/Head/HeadActions.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="svelte" />
+
+export interface HeadActionsProps {
+  /**
+   * Set the width of the head actions
+   * @default "100%"
+   */
+  width?: string;
+}
+
+export default class HeadActions {
+  $$prop_def: HeadActionsProps;
+  $$slot_def: {
+    default: {};
+  };
+
+  $on(eventname: string, cb: (event: Event) => void): () => void;
+}

types/Head/HeadFilters.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="svelte" />
+
+export interface HeadFiltersProps {}
+
+export default class HeadFilters {
+  $$prop_def: HeadFiltersProps;
+  $$slot_def: {
+    default: {};
+  };
+
+  $on(eventname: string, cb: (event: Event) => void): () => void;
+}

types/Head/HeadIdentity.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="svelte" />
+
+export interface HeadIdentityProps {
+  /**
+   * Specify the href attribute
+   */
+  title?: string;
+
+  /**
+   * Specify the subtitle attribute
+   */
+  subtitle?: string;
+
+  /**
+   * Specify the imgSrc attribute
+   */
+  imgSrc?: string;
+
+  /**
+   * Set the imgSize of the head
+   * @default 'normal'
+   */
+  imgSize?: "small" | "normal" | "large";
+
+  /**
+   * Set the titleSize of the head
+   * @default 'normal'
+   */
+  titleSize?: "small" | "normal" | "large";
+}
+
+export default class HeadIdentity {
+  $$prop_def: HeadIdentityProps;
+  $$slot_def: {
+    default: {};
+    tabs: {};
+  };
+
+  $on(eventname: string, cb: (event: Event) => void): () => void;
+}

types/index.d.ts

@@ -70,6 +70,11 @@ export { default as FormLabel } from "./FormLabel/FormLabel";
 export { default as Grid } from "./Grid/Grid";
 export { default as Row } from "./Grid/Row";
 export { default as Column } from "./Grid/Column";
+export { default as Head } from "./Head/Head";
+export { default as HeadAction } from "./Head/HeadAction";
+export { default as HeadActions } from "./Head/HeadActions";
+export { default as HeadFilters } from "./Head/HeadFilters";
+export { default as HeadIdentity } from "./Head/HeadIdentity";
 export { default as IconSkeleton } from "./Icon/IconSkeleton";
 export { default as Icon } from "./Icon/Icon";
 export { default as InlineLoading } from "./InlineLoading/InlineLoading";