@ks-digital/designsystem-angular 0.0.1-alpha.8 → 0.0.1-alpha.80

package/types/ks-digital-designsystem-angular-error-summary.d.ts

@@ -0,0 +1,17 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class ErrorSummary {
+  protected id: import("@angular/core").WritableSignal<string>;
+  private heading;
+  private el;
+  constructor();
+  focus(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<ErrorSummary, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<ErrorSummary, "[ksd-error-summary]", never, {}, {}, ["heading"], ["*"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }]>;
+}

package/types/ks-digital-designsystem-angular-forms.d.ts

@@ -0,0 +1,146 @@
+import "@digdir/designsystemet-web/ds-field";
+import * as i0 from "@angular/core";
+import * as i1$1 from "@ks-digital/designsystem-angular/__internals";
+import * as i1 from "@ks-digital/designsystem-angular/validation-message";
+import "@digdir/designsystemet-web/fieldset";
+import "@digdir/designsystemet-web/readonly";
+/**
+ * Use the Field component to connect inputs and labels
+ */
+export declare class Field {
+  /**
+   * Preferred position input for toggle inputs (radio, checkbox, switch) in field.
+   * @default start
+   */
+  dataPosition: import("@angular/core").InputSignal<"start" | "end" | undefined>;
+  /**
+   * Legacy position input kept for backward compatibility.
+   * @deprecated Use data-position instead.
+   * @default start
+   */
+  position: import("@angular/core").InputSignal<"start" | "end" | undefined>;
+  /**
+   * Variant forwarded to ds-field.
+   */
+  dataVariant: import("@angular/core").InputSignal<"outline" | undefined>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Field, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Field, "ksd-field", never, {
+    "dataPosition": {
+      "alias": "data-position";
+      "required": false;
+      "isSignal": true;
+    };
+    "position": {
+      "alias": "position";
+      "required": false;
+      "isSignal": true;
+    };
+    "dataVariant": {
+      "alias": "data-variant";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1$1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1$1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+export declare class FieldDescription {
+  static ɵfac: i0.ɵɵFactoryDeclaration<FieldDescription, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<FieldDescription, "[ksd-field-description]", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class FieldError {
+  static ɵfac: i0.ɵɵFactoryDeclaration<FieldError, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<FieldError, "ksd-error, [ksd-error]", never, {}, {}, never, ["*"], true, [{
+    directive: typeof i1.ValidationMessage;
+    inputs: {};
+    outputs: {};
+  }]>;
+}
+export declare class Fieldset {
+  static ɵfac: i0.ɵɵFactoryDeclaration<Fieldset, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Fieldset, "fieldset[ksd-fieldset]", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class FieldsetDescription {
+  static ɵfac: i0.ɵɵFactoryDeclaration<FieldsetDescription, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<FieldsetDescription, "p[ksd-fieldset-description]", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class FieldsetLegend {
+  static ɵfac: i0.ɵɵFactoryDeclaration<FieldsetLegend, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<FieldsetLegend, "legend[ksd-fieldset-legend]", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class Input {
+  /**
+   * The value of the input
+   */
+  value: import("@angular/core").WritableSignal<string | undefined>;
+  /**
+   * Whether the input is readonly
+   */
+  readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Disables element
+   */
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Whether the element is invalid.
+   */
+  readonly ariaInvalid: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  onClick(event: Event): void;
+  onInput(event: Event): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Input, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<Input, "input[ksd-input], textarea[ksd-input], select[ksd-input]", never, {
+    "readonly": {
+      "alias": "readonly";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaInvalid": {
+      "alias": "aria-invalid";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1$1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1$1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+export declare class Label {
+  static ɵfac: i0.ɵɵFactoryDeclaration<Label, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Label, "ksd-label", never, {}, {}, never, ["*"], true, [{
+    directive: typeof i1$1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1$1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}

package/types/ks-digital-designsystem-angular-heading.d.ts

@@ -0,0 +1,22 @@
+import * as i0 from "@angular/core";
+export declare class Heading {
+  id: import("@angular/core").WritableSignal<string | undefined>;
+  /**
+   * Changes text sizing
+   * @default 'md'
+   */
+  readonly dataSize: import("@angular/core").InputSignal<"2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined>;
+  /**
+   * Set the id of the heading
+   * @param id
+   */
+  setId(id: string): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Heading, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<Heading, "h1[ksd-heading], h2[ksd-heading], h3[ksd-heading], h4[ksd-heading], h5[ksd-heading], h6[ksd-heading]", never, {
+    "dataSize": {
+      "alias": "data-size";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}

package/types/ks-digital-designsystem-angular-link.d.ts

@@ -0,0 +1,18 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class Link {
+  static ɵfac: i0.ɵɵFactoryDeclaration<Link, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Link, "a[ksd-link]", never, {}, {}, never, ["*"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}

package/types/ks-digital-designsystem-angular-pagination.d.ts

@@ -0,0 +1,141 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+/**
+ * A page entry, or an ellipsis placeholder that renders as an empty `<li>`.
+ */
+export type PaginationPage = {
+  type: 'page';
+  page: number;
+  current: boolean;
+  key: string;
+} | {
+  type: 'ellipsis';
+  key: string;
+};
+export interface PaginationPages {
+  pages: PaginationPage[];
+  prev: number;
+  next: number;
+}
+export declare class Pagination {
+  /**
+   * The current page
+   */
+  readonly current: import("@angular/core").InputSignalWithTransform<number, string | number>;
+  /**
+   * The total number of pages
+   */
+  readonly total: import("@angular/core").InputSignalWithTransform<number, string | number>;
+  /**
+   * Sets the screen reader label for the pagination
+   */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * How many pages to show. Default is 7
+   */
+  readonly show: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  /**
+   * E.g if "?page=%d" all the links will set href to "?page=1", "?page=2".
+   */
+  readonly href: import("@angular/core").InputSignal<string | undefined>;
+  /**
+   * Label for the previous button. Only used when no content is projected.
+   */
+  readonly previousLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * Label for the next button. Only used when no content is projected.
+   */
+  readonly nextLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * Screen reader label for each page. Only used when no content is projected.
+   */
+  readonly pageLabel: import("@angular/core").InputSignal<string>;
+  /**
+   * Emits the page number when a page is clicked
+   */
+  readonly pageClicked: import("@angular/core").OutputEmitterRef<number>;
+  /**
+   * Exposes pagination data for consumer use
+   */
+  readonly pages: import("@angular/core").Signal<PaginationPages>;
+  protected hrefFor(page: number): string | null;
+  protected labelFor(page: number): string;
+  protected onClick(e: MouseEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Pagination, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Pagination, "ksd-pagination", never, {
+    "current": {
+      "alias": "current";
+      "required": true;
+      "isSignal": true;
+    };
+    "total": {
+      "alias": "total";
+      "required": true;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "aria-label";
+      "required": false;
+      "isSignal": true;
+    };
+    "show": {
+      "alias": "show";
+      "required": false;
+      "isSignal": true;
+    };
+    "href": {
+      "alias": "href";
+      "required": false;
+      "isSignal": true;
+    };
+    "previousLabel": {
+      "alias": "previousLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "nextLabel": {
+      "alias": "nextLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "pageLabel": {
+      "alias": "pageLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "pageClicked": "pageClicked";
+  }, never, ["*"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+/** Accepts a string so the valueless `<button ksdPaginationButton>` form still type-checks. */
+type PageInput = PaginationPage | number | string | null | undefined;
+export declare class PaginationButton {
+  /**
+   * The page this control targets. Pass an entry from `pages().pages`, or a
+   * number for the previous/next controls.
+   */
+  readonly page: import("@angular/core").InputSignal<PageInput>;
+  protected readonly pageNumber: import("@angular/core").Signal<number | null>;
+  protected readonly isCurrent: import("@angular/core").Signal<boolean>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<PaginationButton, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<PaginationButton, "[ksdPaginationButton]", never, {
+    "page": {
+      "alias": "ksdPaginationButton";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export {};

package/types/ks-digital-designsystem-angular-paragraph.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class Paragraph {
+  static ɵfac: i0.ɵɵFactoryDeclaration<Paragraph, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Paragraph, "p[ksd-paragraph]", never, {}, {}, never, ["*"], true, never>;
+}

package/types/ks-digital-designsystem-angular-popover.d.ts

@@ -0,0 +1,44 @@
+import "@digdir/designsystemet-web/popover";
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class Popover {
+  readonly autoPlacement: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly variant: import("@angular/core").InputSignal<"tinted" | "default">;
+  readonly placement: import("@angular/core").InputSignal<"bottom" | "bottom-end" | "bottom-start" | "left" | "left-end" | "left-start" | "right" | "right-end" | "right-start" | "top" | "top-end" | "top-start">;
+  readonly popover: import("@angular/core").InputSignal<"auto" | "manual">;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Popover, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<Popover, "[ksd-popover]", never, {
+    "autoPlacement": {
+      "alias": "autoPlacement";
+      "required": false;
+      "isSignal": true;
+    };
+    "variant": {
+      "alias": "data-variant";
+      "required": false;
+      "isSignal": true;
+    };
+    "placement": {
+      "alias": "data-placement";
+      "required": false;
+      "isSignal": true;
+    };
+    "popover": {
+      "alias": "popover";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}

package/types/ks-digital-designsystem-angular-search.d.ts

@@ -0,0 +1,100 @@
+import "@digdir/designsystemet-web";
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+/**
+ * Search Component
+ *
+ * Use to contain the search input and buttons.
+ * Only `SearchInput` is required, while `SearchClear` and `SearchButton` are optional.
+ *
+ * @example
+ * <div ksd-search>
+ *   <input ksd-search-input />
+ *   <button ksd-search-clear></button>
+ *   <button ksd-search-button></button>
+ * </div>
+ */
+export declare class Search {
+  private readonly input;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<Search, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Search, "ksd-search", never, {}, {}, ["input"], ["[ksd-search-input]", "[ksd-search-clear]", "[ksd-search-button]"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+/**
+ * Search button
+ *
+ * Used within Search to provide a submit button.
+ *
+ * @param {('primary' | 'secondary')} [variant] - Specify which button variant to use
+ * @param {string} [aria-label] - Aria label for the button
+ *
+ */
+export declare class SearchButton {
+  /**
+   * Specify which button variant to use
+   *
+   * @default 'primary'
+   */
+  readonly variant: import("@angular/core").InputSignal<"primary" | "secondary">;
+  /**
+   * Aria label for the button
+   */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SearchButton, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<SearchButton, "button[ksd-search-button]", never, {
+    "variant": {
+      "alias": "variant";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "aria-label";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Search clear button
+ *
+ * Used within Search to provide a clear button.
+ * ds-suggestion clears and refocuses the input, and fires an `input` event on it.
+ *
+ * @param {string} [aria-label] - Aria label for the button.
+ */
+export declare class SearchClear {
+  /**
+   * Aria label for the button
+   * @default 'Tøm'
+   */
+  readonly ariaLabel: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SearchClear, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<SearchClear, "button[ksd-search-clear]", never, {
+    "ariaLabel": {
+      "alias": "aria-label";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Search input
+ *
+ * Used within Search to provide a search input.
+ */
+export declare class SearchInput {
+  static ɵfac: i0.ɵɵFactoryDeclaration<SearchInput, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<SearchInput, "input[ksd-search-input]", never, {}, {}, never, never, true, never>;
+}

package/types/ks-digital-designsystem-angular-skeleton.d.ts

@@ -0,0 +1,21 @@
+import * as i0 from "@angular/core";
+/**
+ * Skeleton is used to represent a draft of a page while the content loads.
+ */
+export declare class Skeleton {
+  /**
+   * Specify which variant to use
+   * @default 'rectangle'
+   */
+  readonly variant: import("@angular/core").InputSignal<"rectangle" | "circle" | "text">;
+  readonly isText: import("@angular/core").Signal<boolean>;
+  readonly dataText: import("@angular/core").Signal<"-" | null>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Skeleton, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Skeleton, "ksd-skeleton", never, {
+    "variant": {
+      "alias": "data-variant";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}

package/types/ks-digital-designsystem-angular-spinner.d.ts

@@ -0,0 +1,42 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class Spinner {
+  /**
+   * Aria-label for the spinner
+   */
+  readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
+  /**
+   * Aria-hidden for the spinner
+   */
+  readonly ariaHidden: import("@angular/core").InputSignalWithTransform<boolean | undefined, unknown>;
+  constructor();
+  /**
+   * Changes size for descendant Designsystemet components. Select from predefined sizes.
+   * @attribute data-size
+   */
+  readonly dataSize: import("@angular/core").InputSignal<any>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Spinner, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Spinner, "ksd-spinner", never, {
+    "ariaLabel": {
+      "alias": "aria-label";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaHidden": {
+      "alias": "aria-hidden";
+      "required": false;
+      "isSignal": true;
+    };
+    "dataSize": {
+      "alias": "data-size";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, [{
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}