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

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

@@ -0,0 +1,198 @@
+import { FormValueControl } from "@angular/forms/signals";
+import "@digdir/designsystemet-web";
+import * as i0 from "@angular/core";
+import { TemplateRef } from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class SuggestionListEmpty {
+  /**
+   * Hack to get the content from parent component so that we can
+   * keep the dom structure needed without additional host elements
+   */
+  templateRef: import("@angular/core").Signal<TemplateRef<unknown> | undefined>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SuggestionListEmpty, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<SuggestionListEmpty, "ksd-suggestion-list-empty", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class SuggestionListOption {
+  /**
+   * Hack to get the content from parent component so that we can
+   * keep the dom structure needed without additional host elements
+   */
+  templateRef: import("@angular/core").Signal<TemplateRef<unknown> | undefined>;
+  value: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SuggestionListOption, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<SuggestionListOption, "ksd-suggestion-list-option", never, {
+    "value": {
+      "alias": "value";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare class SuggestionList {
+  /**
+   * Screen reader announcement template for singular result count.
+   *
+   * @default '%d forslag'
+   */
+  readonly singular: import("@angular/core").InputSignal<string>;
+  /**
+   * Screen reader announcement template for plural result count.
+   *
+   * @default '%d forslag'
+   */
+  readonly plural: import("@angular/core").InputSignal<string>;
+  readonly options: import("@angular/core").Signal<readonly SuggestionListOption[]>;
+  readonly empty: import("@angular/core").Signal<SuggestionListEmpty | undefined>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<SuggestionList, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<SuggestionList, "ksd-suggestion-list", never, {
+    "singular": {
+      "alias": "singular";
+      "required": false;
+      "isSignal": true;
+    };
+    "plural": {
+      "alias": "plural";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, ["options", "empty"], never, true, never>;
+}
+type SuggestionItem = {
+  label: string;
+  value: string;
+};
+/** Value of the `value` model and Angular signal forms. Always primitive. */
+type SuggestionValue = string | string[] | undefined;
+/** Accepted by `[selected]`; items and raw option values are both allowed. */
+type SuggestionSelectedInput = SuggestionItem | SuggestionItem[] | string | string[] | null | undefined;
+/** Emitted by `(selectedChange)`. Always resolved items. */
+type SuggestionSelected = SuggestionItem | SuggestionItem[] | undefined;
+type SuggestionFilterArgs = {
+  index: number;
+  label: string;
+  text: string;
+  value: string;
+  optionElement: HTMLOptionElement;
+  input: HTMLInputElement;
+};
+type SuggestionFilter = (args: SuggestionFilterArgs) => boolean;
+declare const UNSET: unique symbol;
+export declare class Suggestion implements FormValueControl<SuggestionValue> {
+  /**
+   * Allows the user to select multiple items
+   *
+   * @default false
+   */
+  multiple: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Allows the user to create new items
+   *
+   * @default false
+   */
+  creatable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Filter options; boolean or a custom callback.
+   *
+   * @default true
+   */
+  filter: import("@angular/core").InputSignal<boolean | SuggestionFilter>;
+  /**
+   * Current value, as primitive option values. Bound by Angular signal forms.
+   *
+   * @default undefined
+   */
+  readonly value: import("@angular/core").ModelSignal<SuggestionValue>;
+  /**
+   * Controlled selection. Accepts items or raw option values.
+   *
+   * @default undefined
+   */
+  readonly selected: import("@angular/core").InputSignal<SuggestionSelectedInput | typeof UNSET>;
+  /**
+   * Emits the resolved selection whenever the user changes it.
+   */
+  readonly selectedChange: import("@angular/core").OutputEmitterRef<SuggestionSelected>;
+  /**
+   * Form-control dirty state.
+   *
+   * @default false
+   */
+  readonly dirty: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Whether the control has been touched. Bound by Angular signal forms.
+   *
+   * @default false
+   */
+  readonly touched: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Emits when focus leaves the control, marking the bound form field as touched.
+   */
+  readonly touch: import("@angular/core").OutputEmitterRef<void>;
+  protected selectedArray: import("@angular/core").Signal<import("@ks-digital/designsystem-angular/suggestion").SuggestionItem[]>;
+  private readonly suggestionElement;
+  private readonly labels;
+  private readonly query;
+  protected readonly suggestionList: import("@angular/core").Signal<SuggestionList | undefined>;
+  constructor();
+  protected onSelect(event: Event): void;
+  protected onFocusOut(event: FocusEvent): void;
+  protected onInput(event: Event): void;
+  private setValue;
+  private learnLabels;
+  private syncOptions;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Suggestion, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Suggestion, "ksd-suggestion", never, {
+    "multiple": {
+      "alias": "multiple";
+      "required": false;
+      "isSignal": true;
+    };
+    "creatable": {
+      "alias": "creatable";
+      "required": false;
+      "isSignal": true;
+    };
+    "filter": {
+      "alias": "filter";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "selected": {
+      "alias": "selected";
+      "required": false;
+      "isSignal": true;
+    };
+    "dirty": {
+      "alias": "dirty";
+      "required": false;
+      "isSignal": true;
+    };
+    "touched": {
+      "alias": "touched";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "value": "valueChange";
+    "selectedChange": "selectedChange";
+    "touch": "touch";
+  }, ["suggestionList"], ["*"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+export type { SuggestionFilter, SuggestionFilterArgs, SuggestionItem, SuggestionSelected, SuggestionSelectedInput, SuggestionValue };

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

@@ -0,0 +1,68 @@
+import * as i0 from "@angular/core";
+export declare class Table {
+  /**
+   * Will give the table a hover effect on rows
+   * @default false
+   */
+  readonly hover: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Will give the table a rounded border
+   * @default false
+   */
+  readonly border: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Will make the table header sticky
+   * @default false
+   */
+  readonly stickyHeader: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Will give the table zebra striping
+   * @default false
+   */
+  readonly zebra: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Table, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Table, "table[ksd-table]", never, {
+    "hover": {
+      "alias": "data-hover";
+      "required": false;
+      "isSignal": true;
+    };
+    "border": {
+      "alias": "data-border";
+      "required": false;
+      "isSignal": true;
+    };
+    "stickyHeader": {
+      "alias": "data-sticky-header";
+      "required": false;
+      "isSignal": true;
+    };
+    "zebra": {
+      "alias": "data-zebra";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare class TableHeaderCell {
+  /**
+   * If 'none' | 'ascending' | 'descending' will add a button to the header cell and change aria-sort and icon
+   * @default undefined
+   */
+  readonly sort: import("@angular/core").InputSignal<"none" | "ascending" | "descending" | undefined>;
+  /**
+   * Emitted when the sort button is clicked
+   * @emits void
+   */
+  readonly sortChange: import("@angular/core").OutputEmitterRef<void>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<TableHeaderCell, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<TableHeaderCell, "th[ksd-header-cell]", never, {
+    "sort": {
+      "alias": "aria-sort";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "sortChange": "sortChange";
+  }, never, ["*"], true, never>;
+}

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

@@ -0,0 +1,105 @@
+import "@digdir/designsystemet-web/ds-tabs";
+import * as i0 from "@angular/core";
+import { TemplateRef } from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+/**
+ * Payload emitted from `tabClicked` on both `ksd-tabs` and `ksd-tabs-tab`.
+ */
+interface TabClickEvent {
+  /**
+   * Zero-based index of the clicked tab in its current render order.
+   */
+  index: number;
+  /**
+   * Consumer-provided stable tab identifier from `tabId`.
+   *
+   * `undefined` when `tabId` is not provided.
+   */
+  tabId: string | undefined;
+}
+export declare class TabsTab {
+  /**
+   * Stable identifier for this tab.
+   *
+   * Recommended for logic such as analytics, routing and persisted state.
+   *
+   * If omitted, `tabClicked` emits `tabId: undefined`.
+   */
+  readonly tabId: import("@angular/core").InputSignal<string | undefined>;
+  /**
+   * Marks this tab as the selected tab, forwarded to the underlying `ds-tab`.
+   *
+   * @default false
+   */
+  readonly ariaSelected: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /**
+   * Emits tab click details when this tab is clicked.
+   */
+  readonly tabClicked: import("@angular/core").OutputEmitterRef<TabClickEvent>;
+  /**
+   * Hack to get the content of the tab from outside so that we can
+   * keep the dom structure needed without additional host elements
+   */
+  templateRef: import("@angular/core").Signal<TemplateRef<unknown> | undefined>;
+  emitTabClicked(event: TabClickEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<TabsTab, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<TabsTab, "ksd-tabs-tab", never, {
+    "tabId": {
+      "alias": "tabId";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaSelected": {
+      "alias": "aria-selected";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "tabClicked": "tabClicked";
+  }, never, ["*"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+export declare class Tabs {
+  /**
+   * Emits tab click details when any tab is clicked.
+   */
+  readonly tabClicked: import("@angular/core").OutputEmitterRef<TabClickEvent>;
+  readonly tabs: import("@angular/core").Signal<readonly TabsTab[]>;
+  protected onTabClick(index: number, tab: TabsTab): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Tabs, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Tabs, "ksd-tabs", never, {}, {
+    "tabClicked": "tabClicked";
+  }, ["tabs"], ["ksd-tabs-panel"], true, [{
+    directive: typeof i1.HostSize;
+    inputs: {
+      "data-size": "data-size";
+    };
+    outputs: {};
+  }, {
+    directive: typeof i1.HostColor;
+    inputs: {
+      "data-color": "data-color";
+    };
+    outputs: {};
+  }]>;
+}
+export declare class TabsList {
+  static ɵfac: i0.ɵɵFactoryDeclaration<TabsList, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<TabsList, "ksd-tabs-list", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class TabsPanel {
+  static ɵfac: i0.ɵɵFactoryDeclaration<TabsPanel, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<TabsPanel, "ksd-tabs-panel", never, {}, {}, never, ["*"], true, never>;
+}
+export type { TabClickEvent };

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

@@ -0,0 +1,30 @@
+import * as i0 from "@angular/core";
+import * as i1 from "@ks-digital/designsystem-angular/__internals";
+export declare class Tag {
+  /**
+   * The visual variant of the tag
+   *
+   * @default 'default'
+   */
+  readonly variant: import("@angular/core").InputSignal<"default" | "outline">;
+  static ɵfac: i0.ɵɵFactoryDeclaration<Tag, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<Tag, "ksd-tag", never, {
+    "variant": {
+      "alias": "data-variant";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, 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-validation-message.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class ValidationMessage {
+  static ɵfac: i0.ɵɵFactoryDeclaration<ValidationMessage, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<ValidationMessage, "[ksd-validation-message]", never, {}, {}, never, never, true, never>;
+}

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

@@ -0,0 +1,2 @@
+declare const _default: undefined;
+export {};

package/validation-message/README.md

@@ -0,0 +1,3 @@
+# @ks-digital/designsystem-angular/validation-message
+
+Secondary entry point of `@ks-digital/designsystem-angular`. It can be used by importing from `@ks-digital/designsystem-angular/validation-message`.

package/dist/README.md

@@ -1,43 +0,0 @@
-# 🚧 KS Digital Designsystem for Angular
-
-> This is an experimental POC as for now
-
-This library provides Angular components for KS Digital, designed to align closely with the components from [Designsystemet.no](https://www.designsystemet.no/komponenter).
-
-## Installation (WIP)
-
-Install the required packages using your preferred package manager:
-
-```bash
-pnpm add @ks-digital/designsystem-angular @ks-digital/designsystem-themes
-```
-
-## Setup
-
-### 1. Include the Inter Font
-
-Add the Inter font to your `index.html`. This API supports the same parameters as the Google Fonts API, allowing you to customize the font weights as needed:
-
-```html
-<link
-  href="https://static.fiks.ks.no/googlefonts/googleapis/css2?family=Inter&display=swap"
-  rel="stylesheet"
-/>
-```
-
-### 2. Import Base Styles and Themes
-
-Import the base styles and the theme you want to use in your application:
-
-```javascript
-import '@ks-digital/designsystem-themes/base.css'
-import '@ks-digital/designsystem-themes/ledsagerbevis.css'
-```
-
-### 3. Use Components
-
-To be written.
-
-## Example
-
-A complete example setup is available in the `angular-demo` located under the `apps` folder.

package/dist/fesm2022/ks-digital-designsystem-angular.mjs

@@ -1,195 +0,0 @@
-import * as i0 from '@angular/core';
-import { input, Directive, model, Component, contentChild, signal, afterNextRender, isDevMode } from '@angular/core';
-
-/* eslint-disable @angular-eslint/no-input-rename */
-/**
- * We use input aliasing to bridge the gap between Angular's camelCase property naming convention and our HTML data attributes.
- * This approach allows us to use valid HTML data attributes as documented by Designsystemet while maintaining
- * proper TypeScript intellisense support.
- */
-class CommonInputs {
-    /**
-     * Changes size for descendant Designsystemet components. Select from predefined sizes.
-     * @attribute data-size
-     */
-    dataSize = input(undefined, { alias: 'data-size' });
-    /**
-     * Changes color for descendant Designsystemet components.
-     * Select from predefined colors and colors defined using theme.designsystemet.no.
-     * @attribute data-color
-     */
-    dataColor = input(undefined, { alias: 'data-color' });
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: CommonInputs, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.3", type: CommonInputs, isStandalone: true, inputs: { dataSize: { classPropertyName: "dataSize", publicName: "data-size", isSignal: true, isRequired: false, transformFunction: null }, dataColor: { classPropertyName: "dataColor", publicName: "data-color", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: CommonInputs, decorators: [{
-            type: Directive
-        }] });
-
-class Checkbox {
-    id = model();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Checkbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", type: Checkbox, isStandalone: true, selector: "input[ksd-checkbox]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { id: "idChange" }, host: { attributes: { "type": "checkbox" }, properties: { "attr.id": "id()" }, classAttribute: "ds-input" }, hostDirectives: [{ directive: CommonInputs, inputs: ["data-size", "data-size", "data-color", "data-color"] }], ngImport: i0, template: ``, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Checkbox, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'input[ksd-checkbox]',
-                    hostDirectives: [{
-                            directive: CommonInputs,
-                            inputs: ['data-size', 'data-color']
-                        }],
-                    host: {
-                        type: 'checkbox',
-                        class: 'ds-input',
-                        '[attr.id]': 'id()',
-                    },
-                    template: ``,
-                }]
-        }] });
-
-const randomId = () => {
-    return Math.random().toString(36).slice(2, 7);
-};
-
-class Label {
-    for = model();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Label, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.3", type: Label, isStandalone: true, selector: "ksd-label", inputs: { for: { classPropertyName: "for", publicName: "for", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { for: "forChange" }, hostDirectives: [{ directive: CommonInputs, inputs: ["data-size", "data-size", "data-color", "data-color"] }], ngImport: i0, template: `<label class="ds-label" [for]="for()"><ng-content /></label>`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Label, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ksd-label',
-                    hostDirectives: [{
-                            directive: CommonInputs,
-                            inputs: ['data-size', 'data-color']
-                        }],
-                    template: `<label class="ds-label" [for]="for()"><ng-content /></label>`,
-                }]
-        }] });
-
-/**
- * Use the Field component to connect inputs and labels
- */
-class Field {
-    /**
-     * Position of toggle inputs (radio, checkbox, switch) in field
-     * @default start
-     */
-    position = input('start');
-    input = contentChild(Checkbox);
-    label = contentChild(Label);
-    id = signal(randomId());
-    constructor() {
-        afterNextRender(() => {
-            if (isDevMode() && (!this.label() || !this.input())) {
-                console.error('[Field] Missing required elements: ksd-label and ksd-input must be provided as children');
-            }
-            this.input()?.id.set(this.id());
-            this.label()?.for.set(this.id());
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Field, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.0.3", type: Field, isStandalone: true, selector: "ksd-field", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.dataPosition": "position()" }, classAttribute: "ds-field" }, queries: [{ propertyName: "input", first: true, predicate: Checkbox, descendants: true, isSignal: true }, { propertyName: "label", first: true, predicate: Label, descendants: true, isSignal: true }], hostDirectives: [{ directive: CommonInputs, inputs: ["data-size", "data-size", "data-color", "data-color"] }], ngImport: i0, template: ` <ng-content /> `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Field, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ksd-field',
-                    hostDirectives: [
-                        {
-                            directive: CommonInputs,
-                            inputs: ['data-size', 'data-color'],
-                        },
-                    ],
-                    host: {
-                        class: 'ds-field',
-                        '[attr.dataPosition]': 'position()',
-                    },
-                    template: ` <ng-content /> `,
-                }]
-        }], ctorParameters: () => [] });
-
-class Fieldset {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Fieldset, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: Fieldset, isStandalone: true, selector: "fieldset[ksd-fieldset]", host: { attributes: { "role": "fieldset" }, classAttribute: "ds-fieldset" }, ngImport: i0, template: ` <ng-content /> `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Fieldset, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'fieldset[ksd-fieldset]',
-                    host: {
-                        role: 'fieldset',
-                        class: 'ds-fieldset',
-                    },
-                    template: ` <ng-content /> `,
-                }]
-        }] });
-
-class FieldsetDescription {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldsetDescription, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: FieldsetDescription, isStandalone: true, selector: "p[ksd-fieldset-description]", ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldsetDescription, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'p[ksd-fieldset-description]',
-                    template: `<ng-content />`,
-                    host: {}
-                }]
-        }] });
-
-class FieldsetLegend {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldsetLegend, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: FieldsetLegend, isStandalone: true, selector: "legend[ksd-fieldset-legend]", host: { attributes: { "role": "legend" }, classAttribute: "ds-label" }, ngImport: i0, template: ` <ng-content /> `, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldsetLegend, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'legend[ksd-fieldset-legend]',
-                    host: {
-                        role: 'legend',
-                        class: 'ds-label',
-                    },
-                    template: ` <ng-content /> `,
-                }]
-        }] });
-
-class Paragraph {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Paragraph, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: Paragraph, isStandalone: true, selector: "ksd-paragraph", host: { classAttribute: "ds-paragraph" }, ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: Paragraph, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ksd-paragraph',
-                    template: `<ng-content />`,
-                    host: {
-                        class: 'ds-paragraph',
-                    },
-                }]
-        }] });
-
-class ValidationMessage {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: ValidationMessage, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.3", type: ValidationMessage, isStandalone: true, selector: "p[ksd-validation-message]", host: { attributes: { "data-field": "validation" }, classAttribute: "ds-validation-message" }, ngImport: i0, template: `<ng-content />`, isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: ValidationMessage, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'p[ksd-validation-message]',
-                    template: `<ng-content />`,
-                    host: {
-                        class: 'ds-validation-message',
-                        'data-field': 'validation',
-                    },
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { Checkbox, CommonInputs, Field, Fieldset, FieldsetDescription, FieldsetLegend, Label, Paragraph, ValidationMessage };
-//# sourceMappingURL=ks-digital-designsystem-angular.mjs.map