@ks-digital/designsystem-angular 0.0.1-alpha.25 → 0.0.1-alpha.28

package/__internals/index.d.ts

@@ -0,0 +1,54 @@
+import * as _angular_core from '@angular/core';
+
+/**
+Lifted from https://github.com/digdir/designsystemet/blob/main/packages/react/src/colors.ts
+**/
+declare const emptyObjectSymbol: unique symbol;
+type EmptyObject = {
+    [emptyObjectSymbol]?: never;
+};
+/**
+ * Base interface for available colors in the design system.
+ * The CLI will generate augmentations of this interface to allow
+ * type safety of custom color names.
+ */
+interface MainAndSupportColors {
+}
+/**
+ * If {@link MainAndSupportColors} has been extended to include color names, return T,
+ * otherwise return the arbitrary string type.
+ */
+type ColorWithFallback<T> = MainAndSupportColors extends EmptyObject ? string : T;
+type SeverityInfo = 'info';
+type SeveritySuccess = 'success';
+type SeverityWarning = 'warning';
+type SeverityDanger = 'danger';
+type SeverityColors = SeverityInfo | SeveritySuccess | SeverityWarning | SeverityDanger;
+type Color = ColorWithFallback<'neutral' | keyof MainAndSupportColors>;
+
+type Size = 'sm' | 'md' | 'lg';
+declare class CommonInputs {
+    /**
+     * Changes size for descendant Designsystemet components. Select from predefined sizes.
+     * @attribute data-size
+     */
+    dataSize: _angular_core.InputSignal<Size | undefined>;
+    /**
+     * Changes color for descendant Designsystemet components.
+     * Select from predefined colors and colors defined using theme.designsystemet.no.
+     * @attribute data-color
+     */
+    dataColor: _angular_core.InputSignal<string | undefined>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CommonInputs, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<CommonInputs, never, never, { "dataSize": { "alias": "data-size"; "required": false; "isSignal": true; }; "dataColor": { "alias": "data-color"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare const logIfDevMode: ({ component, message, }: {
+    component: string;
+    message: string;
+}) => void;
+
+declare const randomId: () => string;
+
+export { CommonInputs, logIfDevMode, randomId };
+export type { Color, MainAndSupportColors, SeverityColors, SeverityDanger, SeverityInfo, SeveritySuccess, SeverityWarning, Size };

package/alert/index.d.ts

@@ -0,0 +1,17 @@
+import * as i0 from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+import { SeverityColors } from '@ks-digital/designsystem-angular/__internals';
+
+/**
+ * Alerts are used to inform users about important information, warnings, errors, or success.
+ */
+declare class Alert {
+    /**
+     * The color variant of the alert.
+     */
+    dataColor: i0.InputSignal<SeverityColors | undefined>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Alert, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Alert, "ksd-alert", never, { "dataColor": { "alias": "data-color"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof i1.CommonInputs; inputs: { "data-size": "data-size"; }; outputs: {}; }]>;
+}
+
+export { Alert };

package/button/index.d.ts

@@ -0,0 +1,29 @@
+import * as _angular_core from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+
+declare class Button {
+    /**
+     * Specify which variant to use
+     * @default 'primary'
+     */
+    readonly variant: _angular_core.InputSignal<"primary" | "secondary" | "tertiary">;
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
+     * @default false
+     */
+    readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Disables element
+     */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * If this is a button with only an icon
+     */
+    readonly icon: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<Button, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Button, "button[ksd-button], a[ksd-button]", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof i1.CommonInputs; inputs: { "data-size": "data-size"; "data-color": "data-color"; }; outputs: {}; }]>;
+}
+
+export { Button };

package/card/index.d.ts

@@ -0,0 +1,22 @@
+import * as i0 from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+
+declare class Card {
+    /**
+     * Change the background color of the card
+     * @default 'default'
+     */
+    variant: i0.InputSignal<"tinted" | "default">;
+    private elementRef;
+    private projectedLink;
+    protected handleClick: (event: MouseEvent) => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Card, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Card, "[ksd-card]", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof i1.CommonInputs; inputs: { "data-size": "data-size"; "data-color": "data-color"; }; outputs: {}; }]>;
+}
+
+declare class CardBlock {
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardBlock, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardBlock, "[ksd-card-block]", never, {}, {}, never, ["*"], true, never>;
+}
+
+export { Card, CardBlock };

package/details/index.d.ts

@@ -0,0 +1,26 @@
+import * as _angular_core from '@angular/core';
+
+declare class Details {
+    readonly dataSize: _angular_core.InputSignal<"sm" | "md" | "lg" | undefined>;
+    readonly dataColor: _angular_core.InputSignal<string | undefined>;
+    readonly variant: _angular_core.InputSignal<"tinted" | "default">;
+    readonly defaultOpen: _angular_core.InputSignal<boolean>;
+    readonly open: _angular_core.InputSignal<boolean | undefined>;
+    readonly toggled: _angular_core.OutputEmitterRef<Event>;
+    private detailsRef;
+    onToggle(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<Details, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<Details, "ksd-details", never, { "dataSize": { "alias": "data-size"; "required": false; "isSignal": true; }; "dataColor": { "alias": "data-color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; }, { "toggled": "toggled"; }, never, ["ksd-details-summary", "ksd-details-content"], true, never>;
+}
+
+declare class DetailsContent {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DetailsContent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DetailsContent, "ksd-details-content", never, {}, {}, never, ["*"], true, never>;
+}
+
+declare class DetailsSummary {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DetailsSummary, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DetailsSummary, "ksd-details-summary", never, {}, {}, never, ["*"], true, never>;
+}
+
+export { Details, DetailsContent, DetailsSummary };

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

@@ -0,0 +1,50 @@
+import * as i0 from '@angular/core';
+import { input, Directive, isDevMode } from '@angular/core';
+
+/**
+Lifted from https://github.com/digdir/designsystemet/blob/main/packages/react/src/colors.ts
+**/
+
+/* 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.
+ *
+ * Todo: Some components are using only a subset of colors, e.g., SeverityColors for Alert. We should reconsider this directive
+ */
+class CommonInputs {
+    /**
+     * Changes size for descendant Designsystemet components. Select from predefined sizes.
+     * @attribute data-size
+     */
+    dataSize = input(undefined, ...(ngDevMode ? [{ debugName: "dataSize", alias: 'data-size' }] : [{ 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, ...(ngDevMode ? [{ debugName: "dataColor", alias: 'data-color' }] : [{ alias: 'data-color' }]));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: CommonInputs, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", 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.3.9", ngImport: i0, type: CommonInputs, decorators: [{
+            type: Directive
+        }], propDecorators: { dataSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "data-size", required: false }] }], dataColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "data-color", required: false }] }] } });
+
+const logIfDevMode = ({ component, message, }) => {
+    if (isDevMode()) {
+        console.log(`[${component}] ${message}`);
+    }
+};
+
+const randomId = () => {
+    return `:${Math.random().toString(36).slice(2, 7)}`;
+};
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CommonInputs, logIfDevMode, randomId };
+//# sourceMappingURL=ks-digital-designsystem-angular-__internals.mjs.map

package/fesm2022/ks-digital-designsystem-angular-__internals.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ks-digital-designsystem-angular-__internals.mjs","sources":["../../../../packages/angular/__internals/src/colors.ts","../../../../packages/angular/__internals/src/common-inputs.ts","../../../../packages/angular/__internals/src/log-if-devmode.ts","../../../../packages/angular/__internals/src/random-id.ts","../../../../packages/angular/__internals/src/ks-digital-designsystem-angular-__internals.ts"],"sourcesContent":["/**\nLifted from https://github.com/digdir/designsystemet/blob/main/packages/react/src/colors.ts\n**/\n\n// EmptyObject implementation from https://github.com/sindresorhus/type-fest/blob/main/source/empty-object.d.ts\ndeclare const emptyObjectSymbol: unique symbol\ntype EmptyObject = { [emptyObjectSymbol]?: never }\n\n/**\n * Base interface for available colors in the design system.\n * The CLI will generate augmentations of this interface to allow\n * type safety of custom color names.\n */\n\n// eslint-disable-next-line\nexport interface MainAndSupportColors {}\n\n/**\n * If {@link MainAndSupportColors} has been extended to include color names, return T,\n * otherwise return the arbitrary string type.\n */\ntype ColorWithFallback<T> = MainAndSupportColors extends EmptyObject\n  ? string\n  : T\n\nexport type SeverityInfo = 'info'\nexport type SeveritySuccess = 'success'\nexport type SeverityWarning = 'warning'\nexport type SeverityDanger = 'danger'\nexport type SeverityColors =\n  | SeverityInfo\n  | SeveritySuccess\n  | SeverityWarning\n  | SeverityDanger\n\nexport type Color = ColorWithFallback<'neutral' | keyof MainAndSupportColors>\n","/* eslint-disable @angular-eslint/no-input-rename */\n\n/**\n * We use input aliasing to bridge the gap between Angular's camelCase property naming convention and our HTML data attributes.\n * This approach allows us to use valid HTML data attributes as documented by Designsystemet while maintaining\n * proper TypeScript intellisense support.\n *\n * Todo: Some components are using only a subset of colors, e.g., SeverityColors for Alert. We should reconsider this directive\n */\n\nimport { Directive, input } from '@angular/core'\nimport { Color } from './colors'\n\nexport type Size = 'sm' | 'md' | 'lg'\n\n@Directive()\nexport class CommonInputs {\n  /**\n   * Changes size for descendant Designsystemet components. Select from predefined sizes.\n   * @attribute data-size\n   */\n  dataSize = input<Size>(undefined, { alias: 'data-size' })\n\n  /**\n   * Changes color for descendant Designsystemet components.\n   * Select from predefined colors and colors defined using theme.designsystemet.no.\n   * @attribute data-color\n   */\n  dataColor = input<Color>(undefined, { alias: 'data-color' })\n}\n","import { isDevMode } from '@angular/core'\n\nexport const logIfDevMode = ({\n  component,\n  message,\n}: {\n  component: string\n  message: string\n}) => {\n  if (isDevMode()) {\n    console.log(`[${component}] ${message}`)\n  }\n}\n","export const randomId = () => {\n  return `:${Math.random().toString(36).slice(2, 7)}`\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;;AAEG;;ACFH;AAEA;;;;;;AAMG;MAQU,YAAY,CAAA;AACvB;;;AAGG;AACH,IAAA,QAAQ,GAAG,KAAK,CAAO,SAAS,4CAAI,KAAK,EAAE,WAAW,EAAA,CAAA,GAAA,CAApB,EAAE,KAAK,EAAE,WAAW,EAAE,GAAC;AAEzD;;;;AAIG;AACH,IAAA,SAAS,GAAG,KAAK,CAAQ,SAAS,6CAAI,KAAK,EAAE,YAAY,EAAA,CAAA,GAAA,CAArB,EAAE,KAAK,EAAE,YAAY,EAAE,GAAC;uGAZjD,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBADxB;;;ACbM,MAAM,YAAY,GAAG,CAAC,EAC3B,SAAS,EACT,OAAO,GAIR,KAAI;IACH,IAAI,SAAS,EAAE,EAAE;QACf,OAAO,CAAC,GAAG,CAAC,CAAA,CAAA,EAAI,SAAS,CAAA,EAAA,EAAK,OAAO,CAAA,CAAE,CAAC;IAC1C;AACF;;ACZO,MAAM,QAAQ,GAAG,MAAK;AAC3B,IAAA,OAAO,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE;AACrD;;ACFA;;AAEG;;;;"}

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

@@ -0,0 +1,35 @@
+import * as i0 from '@angular/core';
+import { input, Component } from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+import { CommonInputs } from '@ks-digital/designsystem-angular/__internals';
+
+/**
+ * Alerts are used to inform users about important information, warnings, errors, or success.
+ */
+class Alert {
+    /**
+     * The color variant of the alert.
+     */
+    /* eslint-disable-next-line @angular-eslint/no-input-rename */
+    dataColor = input(undefined, ...(ngDevMode ? [{ debugName: "dataColor", alias: 'data-color' }] : [{ alias: 'data-color' }]));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Alert, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.9", type: Alert, isStandalone: true, selector: "ksd-alert", inputs: { dataColor: { classPropertyName: "dataColor", publicName: "data-color", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ds-alert" }, hostDirectives: [{ directive: i1.CommonInputs, inputs: ["data-size", "data-size"] }], ngImport: i0, template: ` <ng-content />`, isInline: true, styles: [":host{display:block;--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128,24A104,104,0,1,0,232,128A104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z'/%3E%3C/svg%3E\")}:host[data-color=warning]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M120,136V80a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0ZM232,91.55v72.9a15.86,15.86,0,0,1-4.69,11.31l-51.55,51.55A15.86,15.86,0,0,1,164.45,232H91.55a15.86,15.86,0,0,1-11.31-4.69L28.69,175.76A15.86,15.86,0,0,1,24,164.45V91.55a15.86,15.86,0,0,1,4.69-11.31L80.24,28.69A15.86,15.86,0,0,1,91.55,24h72.9a15.86,15.86,0,0,1,11.31,4.69l51.55,51.55A15.86,15.86,0,0,1,232,91.55Zm-16,0L164.45,40H91.55L40,91.55v72.9L91.55,216h72.9L216,164.45ZM128,160a12,12,0,1,0,12,12A12,12,0,0,0,128,160Z'/%3E%3C/svg%3E\")}:host[data-color=success]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\")}:host[data-color=danger]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M165.66,101.66,139.31,128l26.35,26.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\")}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Alert, decorators: [{
+            type: Component,
+            args: [{ selector: 'ksd-alert', template: ` <ng-content />`, host: {
+                        class: 'ds-alert',
+                    }, hostDirectives: [
+                        {
+                            directive: CommonInputs,
+                            inputs: ['data-size'],
+                        },
+                    ], styles: [":host{display:block;--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128,24A104,104,0,1,0,232,128A104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z'/%3E%3C/svg%3E\")}:host[data-color=warning]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M120,136V80a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0ZM232,91.55v72.9a15.86,15.86,0,0,1-4.69,11.31l-51.55,51.55A15.86,15.86,0,0,1,164.45,232H91.55a15.86,15.86,0,0,1-11.31-4.69L28.69,175.76A15.86,15.86,0,0,1,24,164.45V91.55a15.86,15.86,0,0,1,4.69-11.31L80.24,28.69A15.86,15.86,0,0,1,91.55,24h72.9a15.86,15.86,0,0,1,11.31,4.69l51.55,51.55A15.86,15.86,0,0,1,232,91.55Zm-16,0L164.45,40H91.55L40,91.55v72.9L91.55,216h72.9L216,164.45ZM128,160a12,12,0,1,0,12,12A12,12,0,0,0,128,160Z'/%3E%3C/svg%3E\")}:host[data-color=success]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\")}:host[data-color=danger]{--dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M165.66,101.66,139.31,128l26.35,26.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\")}\n"] }]
+        }], propDecorators: { dataColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "data-color", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Alert };
+//# sourceMappingURL=ks-digital-designsystem-angular-alert.mjs.map

package/fesm2022/ks-digital-designsystem-angular-alert.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ks-digital-designsystem-angular-alert.mjs","sources":["../../../../packages/angular/alert/src/alert.ts","../../../../packages/angular/alert/src/ks-digital-designsystem-angular-alert.ts"],"sourcesContent":["import { Component, input } from '@angular/core'\nimport {\n  CommonInputs,\n  SeverityColors,\n} from '@ks-digital/designsystem-angular/__internals'\n\n/**\n * Alerts are used to inform users about important information, warnings, errors, or success.\n */\n@Component({\n  selector: 'ksd-alert',\n  template: ` <ng-content />`,\n  host: {\n    class: 'ds-alert',\n  },\n  /**\n   * Use Phosphor Icons\n   */\n  styles: `\n    :host {\n      display: block;\n      --dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128,24A104,104,0,1,0,232,128A104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z'/%3E%3C/svg%3E\");\n    }\n    :host[data-color='warning'] {\n      --dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M120,136V80a8,8,0,0,1,16,0v56a8,8,0,0,1-16,0ZM232,91.55v72.9a15.86,15.86,0,0,1-4.69,11.31l-51.55,51.55A15.86,15.86,0,0,1,164.45,232H91.55a15.86,15.86,0,0,1-11.31-4.69L28.69,175.76A15.86,15.86,0,0,1,24,164.45V91.55a15.86,15.86,0,0,1,4.69-11.31L80.24,28.69A15.86,15.86,0,0,1,91.55,24h72.9a15.86,15.86,0,0,1,11.31,4.69l51.55,51.55A15.86,15.86,0,0,1,232,91.55Zm-16,0L164.45,40H91.55L40,91.55v72.9L91.55,216h72.9L216,164.45ZM128,160a12,12,0,1,0,12,12A12,12,0,0,0,128,160Z'/%3E%3C/svg%3E\");\n    }\n\n    :host[data-color='success'] {\n      --dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\");\n    }\n\n    :host[data-color='danger'] {\n      --dsc-alert-icon-url: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M165.66,101.66,139.31,128l26.35,26.34a8,8,0,0,1-11.32,11.32L128,139.31l-26.34,26.35a8,8,0,0,1-11.32-11.32L116.69,128,90.34,101.66a8,8,0,0,1,11.32-11.32L128,116.69l26.34-26.35a8,8,0,0,1,11.32,11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z'%3E%3C/path%3E%3C/svg%3E\");\n    }\n  `,\n  hostDirectives: [\n    {\n      directive: CommonInputs,\n      inputs: ['data-size'],\n    },\n  ],\n})\nexport class Alert {\n  /**\n   * The color variant of the alert.\n   */\n  /* eslint-disable-next-line @angular-eslint/no-input-rename */\n  dataColor = input<SeverityColors>(undefined, { alias: 'data-color' })\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAMA;;AAEG;MAkCU,KAAK,CAAA;AAChB;;AAEG;;AAEH,IAAA,SAAS,GAAG,KAAK,CAAiB,SAAS,6CAAI,KAAK,EAAE,YAAY,EAAA,CAAA,GAAA,CAArB,EAAE,KAAK,EAAE,YAAY,EAAE,GAAC;uGAL1D,KAAK,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAL,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAK,kVA/BN,CAAA,eAAA,CAAiB,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,85DAAA,CAAA,EAAA,CAAA;;2FA+BhB,KAAK,EAAA,UAAA,EAAA,CAAA;kBAjCjB,SAAS;+BACE,WAAW,EAAA,QAAA,EACX,iBAAiB,EAAA,IAAA,EACrB;AACJ,wBAAA,KAAK,EAAE,UAAU;qBAClB,EAAA,cAAA,EAqBe;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,YAAY;4BACvB,MAAM,EAAE,CAAC,WAAW,CAAC;AACtB,yBAAA;AACF,qBAAA,EAAA,MAAA,EAAA,CAAA,85DAAA,CAAA,EAAA;;;ACxCH;;AAEG;;;;"}

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

@@ -0,0 +1,63 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, Component } from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+import { CommonInputs } from '@ks-digital/designsystem-angular/__internals';
+import { Spinner } from '@ks-digital/designsystem-angular/spinner';
+
+class Button {
+    /**
+     * Specify which variant to use
+     * @default 'primary'
+     */
+    variant = input('primary', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    /**
+     * Toggle loading state.
+     * Pass an element if you want to display a custom loader.
+     *
+     * @default false
+     */
+    loading = input(false, ...(ngDevMode ? [{ debugName: "loading", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /**
+     * Disables element
+     */
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    /**
+     * If this is a button with only an icon
+     */
+    icon = input(false, ...(ngDevMode ? [{ debugName: "icon", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Button, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.9", type: Button, isStandalone: true, selector: "button[ksd-button], a[ksd-button]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "type": "button" }, properties: { "attr.data-variant": "variant()", "attr.data-icon": "icon() || null", "attr.disabled": "disabled() ? true : null", "attr.aria-busy": "loading() ? true : null" }, classAttribute: "ds-button" }, hostDirectives: [{ directive: i1.CommonInputs, inputs: ["data-size", "data-size", "data-color", "data-color"] }], ngImport: i0, template: `
+    @if (loading()) {
+      <ksd-spinner aria-hidden="true" />
+    }
+    <ng-content />
+  `, isInline: true, styles: [":host ::ng-deep>*{display:inline-flex}\n"], dependencies: [{ kind: "component", type: Spinner, selector: "ksd-spinner", inputs: ["aria-label", "data-size", "data-color", "aria-hidden"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Button, decorators: [{
+            type: Component,
+            args: [{ selector: 'button[ksd-button], a[ksd-button]', hostDirectives: [
+                        {
+                            directive: CommonInputs,
+                            inputs: ['data-size', 'data-color'],
+                        },
+                    ], imports: [Spinner], host: {
+                        class: 'ds-button',
+                        type: 'button',
+                        '[attr.data-variant]': 'variant()',
+                        '[attr.data-icon]': 'icon() || null',
+                        '[attr.disabled]': 'disabled() ? true : null',
+                        '[attr.aria-busy]': 'loading() ? true : null',
+                    }, template: `
+    @if (loading()) {
+      <ksd-spinner aria-hidden="true" />
+    }
+    <ng-content />
+  `, styles: [":host ::ng-deep>*{display:inline-flex}\n"] }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Button };
+//# sourceMappingURL=ks-digital-designsystem-angular-button.mjs.map

package/fesm2022/ks-digital-designsystem-angular-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ks-digital-designsystem-angular-button.mjs","sources":["../../../../packages/angular/button/src/button.ts","../../../../packages/angular/button/src/ks-digital-designsystem-angular-button.ts"],"sourcesContent":["import { booleanAttribute, Component, input } from '@angular/core'\nimport { CommonInputs } from '@ks-digital/designsystem-angular/__internals'\nimport { Spinner } from '@ks-digital/designsystem-angular/spinner'\n\n@Component({\n  selector: 'button[ksd-button], a[ksd-button]',\n  hostDirectives: [\n    {\n      directive: CommonInputs,\n      inputs: ['data-size', 'data-color'],\n    },\n  ],\n  imports: [Spinner],\n  host: {\n    class: 'ds-button',\n    type: 'button',\n    '[attr.data-variant]': 'variant()',\n    '[attr.data-icon]': 'icon() || null',\n    '[attr.disabled]': 'disabled() ? true : null',\n    '[attr.aria-busy]': 'loading() ? true : null',\n  },\n  styles: `\n    /* Ensure transcluded icons are aligned properly */\n    :host ::ng-deep > * {\n      display: inline-flex;\n    }\n  `,\n\n  template: `\n    @if (loading()) {\n      <ksd-spinner aria-hidden=\"true\" />\n    }\n    <ng-content />\n  `,\n})\nexport class Button {\n  /**\n   * Specify which variant to use\n   * @default 'primary'\n   */\n  readonly variant = input<'primary' | 'secondary' | 'tertiary'>('primary')\n\n  /**\n   * Toggle loading state.\n   * Pass an element if you want to display a custom loader.\n   *\n   * @default false\n   */\n  readonly loading = input(false, { transform: booleanAttribute })\n\n  /**\n   * Disables element\n   */\n  readonly disabled = input(false, { transform: booleanAttribute })\n\n  /**\n   * If this is a button with only an icon\n   */\n  readonly icon = input(false, { transform: booleanAttribute })\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,70 @@
+import * as i0 from '@angular/core';
+import { input, inject, ElementRef, Component } from '@angular/core';
+import * as i1 from '@ks-digital/designsystem-angular/__internals';
+import { CommonInputs } from '@ks-digital/designsystem-angular/__internals';
+
+class Card {
+    /**
+     * Change the background color of the card
+     * @default 'default'
+     */
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    elementRef = inject(ElementRef);
+    projectedLink() {
+        const el = this.elementRef.nativeElement;
+        return el?.querySelector('h1 a, h2 a, h3 a, h4 a, h5 a, h6 a');
+    }
+    handleClick = (event) => {
+        const link = this.projectedLink();
+        if (!link)
+            return;
+        if (event.metaKey || event.ctrlKey) {
+            window.open(link.href, '_blank', 'noopener,noreferrer');
+        }
+        else {
+            link.click();
+        }
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Card, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.9", type: Card, isStandalone: true, selector: "[ksd-card]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "handleClick($event)" }, properties: { "attr.data-variant": "variant()" }, classAttribute: "ds-card" }, hostDirectives: [{ directive: i1.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.3.9", ngImport: i0, type: Card, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[ksd-card]',
+                    template: ` <ng-content /> `,
+                    hostDirectives: [
+                        {
+                            directive: CommonInputs,
+                            inputs: ['data-size', 'data-color'],
+                        },
+                    ],
+                    host: {
+                        class: 'ds-card',
+                        '[attr.data-variant]': 'variant()',
+                        '(click)': 'handleClick($event)',
+                    },
+                }]
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
+
+class CardBlock {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: CardBlock, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: CardBlock, isStandalone: true, selector: "[ksd-card-block]", host: { classAttribute: "ds-card__block" }, ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: CardBlock, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[ksd-card-block]',
+                    host: {
+                        class: 'ds-card__block',
+                    },
+                    template: `<ng-content />`,
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Card, CardBlock };
+//# sourceMappingURL=ks-digital-designsystem-angular-card.mjs.map

package/fesm2022/ks-digital-designsystem-angular-card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ks-digital-designsystem-angular-card.mjs","sources":["../../../../packages/angular/card/src/card.ts","../../../../packages/angular/card/src/card-block.ts","../../../../packages/angular/card/src/ks-digital-designsystem-angular-card.ts"],"sourcesContent":["import { Component, ElementRef, inject, input } from '@angular/core'\nimport { CommonInputs } from '@ks-digital/designsystem-angular/__internals'\n\n@Component({\n  selector: '[ksd-card]',\n  template: ` <ng-content /> `,\n  hostDirectives: [\n    {\n      directive: CommonInputs,\n      inputs: ['data-size', 'data-color'],\n    },\n  ],\n  host: {\n    class: 'ds-card',\n    '[attr.data-variant]': 'variant()',\n    '(click)': 'handleClick($event)',\n  },\n})\nexport class Card {\n  /**\n   * Change the background color of the card\n   * @default 'default'\n   */\n  public variant = input<'tinted' | 'default'>('default')\n  private elementRef = inject(ElementRef)\n\n  private projectedLink() {\n    const el = this.elementRef.nativeElement\n    return el?.querySelector(\n      'h1 a, h2 a, h3 a, h4 a, h5 a, h6 a',\n    ) as HTMLAnchorElement | null\n  }\n\n  protected handleClick = (event: MouseEvent) => {\n    const link = this.projectedLink()\n    if (!link) return\n\n    if (event.metaKey || event.ctrlKey) {\n      window.open(link.href, '_blank', 'noopener,noreferrer')\n    } else {\n      link.click()\n    }\n  }\n}\n","import { Component } from '@angular/core'\n\n@Component({\n  selector: '[ksd-card-block]',\n  host: {\n    class: 'ds-card__block',\n  },\n  template: `<ng-content />`,\n})\nexport class CardBlock {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAkBa,IAAI,CAAA;AACf;;;AAGG;AACI,IAAA,OAAO,GAAG,KAAK,CAAuB,SAAS,mDAAC;AAC/C,IAAA,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;IAE/B,aAAa,GAAA;AACnB,QAAA,MAAM,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa;AACxC,QAAA,OAAO,EAAE,EAAE,aAAa,CACtB,oCAAoC,CACT;IAC/B;AAEU,IAAA,WAAW,GAAG,CAAC,KAAiB,KAAI;AAC5C,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,EAAE;AACjC,QAAA,IAAI,CAAC,IAAI;YAAE;QAEX,IAAI,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,EAAE;YAClC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,qBAAqB,CAAC;QACzD;aAAO;YACL,IAAI,CAAC,KAAK,EAAE;QACd;AACF,IAAA,CAAC;uGAxBU,IAAI,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAJ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAI,wcAbL,CAAA,gBAAA,CAAkB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAajB,IAAI,EAAA,UAAA,EAAA,CAAA;kBAfhB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,QAAQ,EAAE,CAAA,gBAAA,CAAkB;AAC5B,oBAAA,cAAc,EAAE;AACd,wBAAA;AACE,4BAAA,SAAS,EAAE,YAAY;AACvB,4BAAA,MAAM,EAAE,CAAC,WAAW,EAAE,YAAY,CAAC;AACpC,yBAAA;AACF,qBAAA;AACD,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,SAAS;AAChB,wBAAA,qBAAqB,EAAE,WAAW;AAClC,wBAAA,SAAS,EAAE,qBAAqB;AACjC,qBAAA;AACF,iBAAA;;;MCRY,SAAS,CAAA;uGAAT,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAT,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,SAAS,wHAFV,CAAA,cAAA,CAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAEf,SAAS,EAAA,UAAA,EAAA,CAAA;kBAPrB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,IAAI,EAAE;AACJ,wBAAA,KAAK,EAAE,gBAAgB;AACxB,qBAAA;AACD,oBAAA,QAAQ,EAAE,CAAA,cAAA,CAAgB;AAC3B,iBAAA;;;ACRD;;AAEG;;;;"}

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

@@ -0,0 +1,100 @@
+import * as i0 from '@angular/core';
+import { input, output, viewChild, CUSTOM_ELEMENTS_SCHEMA, Component } from '@angular/core';
+import '@u-elements/u-details';
+
+class Details {
+    dataSize = input(undefined, ...(ngDevMode ? [{ debugName: "dataSize", 
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: 'data-size' }] : [{
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: 'data-size',
+        }]));
+    dataColor = input(undefined, ...(ngDevMode ? [{ debugName: "dataColor", 
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: 'data-color' }] : [{
+            // eslint-disable-next-line @angular-eslint/no-input-rename
+            alias: 'data-color',
+        }]));
+    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    defaultOpen = input(false, ...(ngDevMode ? [{ debugName: "defaultOpen" }] : []));
+    open = input(undefined, ...(ngDevMode ? [{ debugName: "open" }] : []));
+    toggled = output();
+    detailsRef = viewChild('detailsRef', ...(ngDevMode ? [{ debugName: "detailsRef" }] : []));
+    onToggle(event) {
+        const details = this.detailsRef()?.nativeElement;
+        if (details && details.open !== this.open()) {
+            this.toggled.emit(event);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Details, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.9", type: Details, isStandalone: true, selector: "ksd-details", 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 }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { toggled: "toggled" }, viewQueries: [{ propertyName: "detailsRef", first: true, predicate: ["detailsRef"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <u-details
+      #detailsRef
+      class="ds-details"
+      [attr.data-variant]="variant()"
+      [attr.open]="(open() ?? defaultOpen()) || undefined"
+      [attr.data-color]="dataColor()"
+      [attr.data-size]="dataSize()"
+      (toggle)="onToggle($event)"
+    >
+      <u-summary>
+        <ng-content select="ksd-details-summary" />
+      </u-summary>
+      <div>
+        <ng-content select="ksd-details-content" />
+      </div>
+    </u-details>
+  `, isInline: true, styles: [".ds-card>:host(:last-of-type)>.ds-details{border-bottom:0}.ds-card>:host(:first-of-type)>.ds-details{border-top:0}:host(:not(:first-of-type))>.ds-details{border-top:0;margin-top:0}\n"] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: Details, decorators: [{
+            type: Component,
+            args: [{ selector: 'ksd-details', schemas: [CUSTOM_ELEMENTS_SCHEMA], template: `
+    <u-details
+      #detailsRef
+      class="ds-details"
+      [attr.data-variant]="variant()"
+      [attr.open]="(open() ?? defaultOpen()) || undefined"
+      [attr.data-color]="dataColor()"
+      [attr.data-size]="dataSize()"
+      (toggle)="onToggle($event)"
+    >
+      <u-summary>
+        <ng-content select="ksd-details-summary" />
+      </u-summary>
+      <div>
+        <ng-content select="ksd-details-content" />
+      </div>
+    </u-details>
+  `, styles: [".ds-card>:host(:last-of-type)>.ds-details{border-bottom:0}.ds-card>:host(:first-of-type)>.ds-details{border-top:0}:host(:not(:first-of-type))>.ds-details{border-top:0;margin-top:0}\n"] }]
+        }], propDecorators: { dataSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "data-size", required: false }] }], dataColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "data-color", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], toggled: [{ type: i0.Output, args: ["toggled"] }], detailsRef: [{ type: i0.ViewChild, args: ['detailsRef', { isSignal: true }] }] } });
+
+class DetailsContent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: DetailsContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: DetailsContent, isStandalone: true, selector: "ksd-details-content", ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: DetailsContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ksd-details-content',
+                    template: `<ng-content />`,
+                }]
+        }] });
+
+class DetailsSummary {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: DetailsSummary, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.9", type: DetailsSummary, isStandalone: true, selector: "ksd-details-summary", ngImport: i0, template: `<ng-content />`, isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: DetailsSummary, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ksd-details-summary',
+                    template: `<ng-content />`,
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { Details, DetailsContent, DetailsSummary };
+//# sourceMappingURL=ks-digital-designsystem-angular-details.mjs.map

package/fesm2022/ks-digital-designsystem-angular-details.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ks-digital-designsystem-angular-details.mjs","sources":["../../../../packages/angular/details/src/details.ts","../../../../packages/angular/details/src/details-content.ts","../../../../packages/angular/details/src/details-summary.ts","../../../../packages/angular/details/src/ks-digital-designsystem-angular-details.ts"],"sourcesContent":["import {\n  Component,\n  CUSTOM_ELEMENTS_SCHEMA,\n  ElementRef,\n  input,\n  output,\n  viewChild,\n} from '@angular/core'\nimport '@u-elements/u-details'\n\n@Component({\n  selector: 'ksd-details',\n  schemas: [CUSTOM_ELEMENTS_SCHEMA],\n  template: `\n    <u-details\n      #detailsRef\n      class=\"ds-details\"\n      [attr.data-variant]=\"variant()\"\n      [attr.open]=\"(open() ?? defaultOpen()) || undefined\"\n      [attr.data-color]=\"dataColor()\"\n      [attr.data-size]=\"dataSize()\"\n      (toggle)=\"onToggle($event)\"\n    >\n      <u-summary>\n        <ng-content select=\"ksd-details-summary\" />\n      </u-summary>\n      <div>\n        <ng-content select=\"ksd-details-content\" />\n      </div>\n    </u-details>\n  `,\n  styles: `\n    /* Styles needed since Designsystemet styles doesnt expect an element wrapping .ds-details, which we have */\n    .ds-card > :host(:last-of-type) > .ds-details {\n      border-bottom: 0;\n    }\n\n    .ds-card > :host(:first-of-type) > .ds-details {\n      border-top: 0;\n    }\n\n    :host(:not(:first-of-type)) > .ds-details {\n      border-top: 0;\n      margin-top: 0;\n    }\n  `,\n})\nexport class Details {\n  readonly dataSize = input<'sm' | 'md' | 'lg' | undefined>(undefined, {\n    // eslint-disable-next-line @angular-eslint/no-input-rename\n    alias: 'data-size',\n  })\n  readonly dataColor = input<string | undefined>(undefined, {\n    // eslint-disable-next-line @angular-eslint/no-input-rename\n    alias: 'data-color',\n  })\n  readonly variant = input<'tinted' | 'default'>('default')\n  readonly defaultOpen = input<boolean>(false)\n  readonly open = input<boolean | undefined>(undefined)\n  readonly toggled = output<Event>()\n  private detailsRef = viewChild<ElementRef<HTMLDetailsElement>>('detailsRef')\n\n  onToggle(event: Event) {\n    const details = this.detailsRef()?.nativeElement\n    if (details && details.open !== this.open()) {\n      this.toggled.emit(event)\n    }\n  }\n}\n","import { Component } from '@angular/core'\n\n@Component({\n  selector: 'ksd-details-content',\n  template: `<ng-content />`,\n})\nexport class DetailsContent {}\n","import { Component } from '@angular/core'\n\n@Component({\n  selector: 'ksd-details-summary',\n  template: `<ng-content />`,\n})\nexport class DetailsSummary {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}