@joanroucoux/cairn-ui 0.8.1 → 0.9.0

package/fesm2022/joanroucoux-cairn-ui-select.mjs

@@ -1,69 +1,123 @@
-import * as i0 from '@angular/core';
-import { input, computed, forwardRef, Directive } from '@angular/core';
-import { UI_CONTROL } from '@joanroucoux/cairn-ui/control';
-import { CONTROL_BASE_CLASSES, CONTROL_SIZE_CLASSES } from '@joanroucoux/cairn-ui/input';
-
-const SELECT_CLASSES = 'cursor-pointer appearance-none pr-10 bg-(image:--chevron-down) bg-no-repeat bg-[position:right_0.75rem_center] bg-[size:1.125rem]';
-// Spelled out prefix included: Tailwind scans for literal strings, so a prefix applied in code
-// emits nothing.
+import * as i0 from "@angular/core";
+import { Directive, computed, forwardRef, input } from "@angular/core";
+import { UI_CONTROL } from "@joanroucoux/cairn-ui/control";
+import { CONTROL_BASE_CLASSES, CONTROL_SIZE_CLASSES } from "@joanroucoux/cairn-ui/input";
+const SELECT_CLASSES = "cursor-pointer appearance-none pr-10 bg-(image:--chevron-down) bg-no-repeat bg-[position:right_0.75rem_center] bg-[size:1.125rem]";
 const PICKER_CLASSES = [
-    'pointer-fine:supports-[appearance:base-select]:[appearance:base-select]',
-    'pointer-fine:supports-[appearance:base-select]:items-center',
-    'pointer-fine:supports-[appearance:base-select]:[&_option]:cursor-pointer',
-    'pointer-fine:supports-[appearance:base-select]:[&_option]:rounded-control',
-    'pointer-fine:supports-[appearance:base-select]:[&_option]:px-2.5',
-    'pointer-fine:supports-[appearance:base-select]:[&_option]:py-2',
-    'pointer-fine:supports-[appearance:base-select]:[&_option:hover]:bg-(--soft)',
-    'pointer-fine:supports-[appearance:base-select]:[&_option:focus]:bg-(--soft)',
-    'pointer-fine:supports-[appearance:base-select]:[&_option:checked]:font-medium',
-    '[&::picker-icon]:hidden',
-    '[&::picker(select)]:[appearance:base-select]',
-    '[&::picker(select)]:my-1.5',
-    '[&::picker(select)]:rounded-control',
-    '[&::picker(select)]:border',
-    '[&::picker(select)]:border-(--border)',
-    '[&::picker(select)]:bg-(--card)',
-    '[&::picker(select)]:[position-try-fallbacks:none]',
-    '[&::picker(select)]:overflow-y-auto',
-    '[&::picker(select)]:p-1',
-    '[&::picker(select)]:text-(--card-foreground)',
-].join(' ');
-/**
- * Styled native select, drop-down list included where the browser allows it. It stays a native
- * `<select>`: keyboard, typeahead and semantics come from the platform, not from a rebuilt listbox.
- *
- * Declares the `errors` and `touched` inputs Angular's `[formField]` fills, so a `ui-field` around
- * it can show the message without any binding here.
- *
- * @example
- * <select uiSelect><option value="pea">PEA</option></select>
- */
-class UiSelect {
-    size = input('md', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    errors = input([], /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
-    touched = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
-    classes = computed(() => `${CONTROL_BASE_CLASSES} bg-(--background) ${SELECT_CLASSES} ${PICKER_CLASSES} ${CONTROL_SIZE_CLASSES[this.size()]}`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiSelect, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: UiSelect, isStandalone: true, selector: "select[uiSelect]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, errors: { classPropertyName: "errors", publicName: "errors", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, providers: [{ provide: UI_CONTROL, useExisting: forwardRef(() => UiSelect) }], ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiSelect, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'select[uiSelect]',
-                    host: {
-                        '[class]': 'classes()',
-                    },
-                    providers: [{ provide: UI_CONTROL, useExisting: forwardRef(() => UiSelect) }],
-                }]
-        }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], errors: [{ type: i0.Input, args: [{ isSignal: true, alias: "errors", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+	"pointer-fine:supports-[appearance:base-select]:[appearance:base-select]",
+	"pointer-fine:supports-[appearance:base-select]:items-center",
+	"pointer-fine:supports-[appearance:base-select]:[&_option]:cursor-pointer",
+	"pointer-fine:supports-[appearance:base-select]:[&_option]:rounded-control",
+	"pointer-fine:supports-[appearance:base-select]:[&_option]:px-2.5",
+	"pointer-fine:supports-[appearance:base-select]:[&_option]:py-2",
+	"pointer-fine:supports-[appearance:base-select]:[&_option:hover]:bg-(--soft)",
+	"pointer-fine:supports-[appearance:base-select]:[&_option:focus]:bg-(--soft)",
+	"pointer-fine:supports-[appearance:base-select]:[&_option:checked]:font-medium",
+	"[&::picker-icon]:hidden",
+	"[&::picker(select)]:[appearance:base-select]",
+	"[&::picker(select)]:my-1.5",
+	"[&::picker(select)]:rounded-control",
+	"[&::picker(select)]:border",
+	"[&::picker(select)]:border-(--border)",
+	"[&::picker(select)]:bg-(--card)",
+	"[&::picker(select)]:[position-try-fallbacks:none]",
+	"[&::picker(select)]:overflow-y-auto",
+	"[&::picker(select)]:p-1",
+	"[&::picker(select)]:text-(--card-foreground)"
+].join(" ");
+var UiSelect = class UiSelect {
+	size = input("md", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	errors = input([], ...ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []);
+	touched = input(false, ...ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []);
+	classes = computed(() => `${CONTROL_BASE_CLASSES} bg-(--background) ${SELECT_CLASSES} ${PICKER_CLASSES} ${CONTROL_SIZE_CLASSES[this.size()]}`, ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: UiSelect,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: UiSelect,
+		isStandalone: true,
+		selector: "select[uiSelect]",
+		inputs: {
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			errors: {
+				classPropertyName: "errors",
+				publicName: "errors",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			touched: {
+				classPropertyName: "touched",
+				publicName: "touched",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: { "class": "classes()" } },
+		providers: [{
+			provide: UI_CONTROL,
+			useExisting: forwardRef(() => UiSelect)
+		}],
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: UiSelect,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "select[uiSelect]",
+			host: { "[class]": "classes()" },
+			providers: [{
+				provide: UI_CONTROL,
+				useExisting: forwardRef(() => UiSelect)
+			}]
+		}]
+	}],
+	propDecorators: {
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}],
+		errors: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "errors",
+				required: false
+			}]
+		}],
+		touched: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "touched",
+				required: false
+			}]
+		}]
+	}
+});
 export { UiSelect };
-//# sourceMappingURL=joanroucoux-cairn-ui-select.mjs.map
+
+//# sourceMappingURL=joanroucoux-cairn-ui-select.mjs.map

package/fesm2022/joanroucoux-cairn-ui-select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"joanroucoux-cairn-ui-select.mjs","sources":["../../../projects/ui/select/select.ts","../../../projects/ui/select/joanroucoux-cairn-ui-select.ts"],"sourcesContent":["import { Directive, computed, forwardRef, input } from '@angular/core';\n\nimport { UI_CONTROL, type UiControl, type UiControlError } from '@joanroucoux/cairn-ui/control';\nimport { CONTROL_BASE_CLASSES, CONTROL_SIZE_CLASSES, type ControlSize } from '@joanroucoux/cairn-ui/input';\n\nconst SELECT_CLASSES =\n  'cursor-pointer appearance-none pr-10 bg-(image:--chevron-down) bg-no-repeat bg-[position:right_0.75rem_center] bg-[size:1.125rem]';\n\n// Spelled out prefix included: Tailwind scans for literal strings, so a prefix applied in code\n// emits nothing.\nconst PICKER_CLASSES = [\n  'pointer-fine:supports-[appearance:base-select]:[appearance:base-select]',\n  'pointer-fine:supports-[appearance:base-select]:items-center',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:cursor-pointer',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:rounded-control',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:px-2.5',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:py-2',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:hover]:bg-(--soft)',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:focus]:bg-(--soft)',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:checked]:font-medium',\n  '[&::picker-icon]:hidden',\n  '[&::picker(select)]:[appearance:base-select]',\n  '[&::picker(select)]:my-1.5',\n  '[&::picker(select)]:rounded-control',\n  '[&::picker(select)]:border',\n  '[&::picker(select)]:border-(--border)',\n  '[&::picker(select)]:bg-(--card)',\n  '[&::picker(select)]:[position-try-fallbacks:none]',\n  '[&::picker(select)]:overflow-y-auto',\n  '[&::picker(select)]:p-1',\n  '[&::picker(select)]:text-(--card-foreground)',\n].join(' ');\n\n/**\n * Styled native select, drop-down list included where the browser allows it. It stays a native\n * `<select>`: keyboard, typeahead and semantics come from the platform, not from a rebuilt listbox.\n *\n * Declares the `errors` and `touched` inputs Angular's `[formField]` fills, so a `ui-field` around\n * it can show the message without any binding here.\n *\n * @example\n * <select uiSelect><option value=\"pea\">PEA</option></select>\n */\n@Directive({\n  selector: 'select[uiSelect]',\n  host: {\n    '[class]': 'classes()',\n  },\n  providers: [{ provide: UI_CONTROL, useExisting: forwardRef(() => UiSelect) }],\n})\nexport class UiSelect implements UiControl {\n  readonly size = input<ControlSize>('md');\n  readonly errors = input<readonly UiControlError[]>([]);\n  readonly touched = input(false);\n\n  protected readonly classes = computed(\n    () =>\n      `${CONTROL_BASE_CLASSES} bg-(--background) ${SELECT_CLASSES} ${PICKER_CLASSES} ${CONTROL_SIZE_CLASSES[this.size()]}`,\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAKA,MAAM,cAAc,GAClB,mIAAmI;AAErI;AACA;AACA,MAAM,cAAc,GAAG;IACrB,yEAAyE;IACzE,6DAA6D;IAC7D,0EAA0E;IAC1E,2EAA2E;IAC3E,kEAAkE;IAClE,gEAAgE;IAChE,6EAA6E;IAC7E,6EAA6E;IAC7E,+EAA+E;IAC/E,yBAAyB;IACzB,8CAA8C;IAC9C,4BAA4B;IAC5B,qCAAqC;IACrC,4BAA4B;IAC5B,uCAAuC;IACvC,iCAAiC;IACjC,mDAAmD;IACnD,qCAAqC;IACrC,yBAAyB;IACzB,8CAA8C;AAC/C,CAAA,CAAC,IAAI,CAAC,GAAG,CAAC;AAEX;;;;;;;;;AASG;MAQU,QAAQ,CAAA;IACV,IAAI,GAAG,KAAK,CAAc,IAAI;6EAAC;IAC/B,MAAM,GAAG,KAAK,CAA4B,EAAE;+EAAC;IAC7C,OAAO,GAAG,KAAK,CAAC,KAAK;gFAAC;IAEZ,OAAO,GAAG,QAAQ,CACnC,MACE,CAAA,EAAG,oBAAoB,CAAA,mBAAA,EAAsB,cAAc,IAAI,cAAc,CAAA,CAAA,EAAI,oBAAoB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAA,CAAE;gFACvH;uGARU,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAR,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,QAAQ,yeAFR,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC,MAAM,QAAQ,CAAC,EAAE,CAAC,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAElE,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAPpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC5B,oBAAA,IAAI,EAAE;AACJ,wBAAA,SAAS,EAAE,WAAW;AACvB,qBAAA;AACD,oBAAA,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC,MAAK,QAAS,CAAC,EAAE,CAAC;AAC9E,iBAAA;;;ACjDD;;AAEG;;;;"}
+{"version":3,"file":"joanroucoux-cairn-ui-select.mjs","names":[],"sources":["../../../projects/ui/select/select.ts"],"sourcesContent":["import { Directive, computed, forwardRef, input } from '@angular/core';\n\nimport { UI_CONTROL, type UiControl, type UiControlError } from '@joanroucoux/cairn-ui/control';\nimport { CONTROL_BASE_CLASSES, CONTROL_SIZE_CLASSES, type ControlSize } from '@joanroucoux/cairn-ui/input';\n\nconst SELECT_CLASSES =\n  'cursor-pointer appearance-none pr-10 bg-(image:--chevron-down) bg-no-repeat bg-[position:right_0.75rem_center] bg-[size:1.125rem]';\n\n// Tailwind scans for literal strings: build no class by prefixing in code.\nconst PICKER_CLASSES = [\n  'pointer-fine:supports-[appearance:base-select]:[appearance:base-select]',\n  'pointer-fine:supports-[appearance:base-select]:items-center',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:cursor-pointer',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:rounded-control',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:px-2.5',\n  'pointer-fine:supports-[appearance:base-select]:[&_option]:py-2',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:hover]:bg-(--soft)',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:focus]:bg-(--soft)',\n  'pointer-fine:supports-[appearance:base-select]:[&_option:checked]:font-medium',\n  '[&::picker-icon]:hidden',\n  '[&::picker(select)]:[appearance:base-select]',\n  '[&::picker(select)]:my-1.5',\n  '[&::picker(select)]:rounded-control',\n  '[&::picker(select)]:border',\n  '[&::picker(select)]:border-(--border)',\n  '[&::picker(select)]:bg-(--card)',\n  '[&::picker(select)]:[position-try-fallbacks:none]',\n  '[&::picker(select)]:overflow-y-auto',\n  '[&::picker(select)]:p-1',\n  '[&::picker(select)]:text-(--card-foreground)',\n].join(' ');\n\n/**\n * Styled native select, drop-down list included where the browser allows it. Declares the `errors`\n * and `touched` inputs Angular's `[formField]` fills, so a surrounding `ui-field` can show the message.\n *\n * @example\n * <select uiSelect><option value=\"pea\">PEA</option></select>\n */\n@Directive({\n  selector: 'select[uiSelect]',\n  host: {\n    '[class]': 'classes()',\n  },\n  providers: [{ provide: UI_CONTROL, useExisting: forwardRef(() => UiSelect) }],\n})\nexport class UiSelect implements UiControl {\n  readonly size = input<ControlSize>('md');\n  readonly errors = input<readonly UiControlError[]>([]);\n  readonly touched = input(false);\n\n  protected readonly classes = computed(\n    () =>\n      `${CONTROL_BASE_CLASSES} bg-(--background) ${SELECT_CLASSES} ${PICKER_CLASSES} ${CONTROL_SIZE_CLASSES[this.size()]}`,\n  );\n}\n"],"mappings":";;;;AAKA,MAAM,iBACJ;AAGF,MAAM,iBAAiB;CACrB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACD,CAAA,CAAC,KAAK,GAAG;AAgBV,IAAa,WAAb,MAAa,SAAQ;CACV,OAAO,MAAmB,MAAK,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAC/B,SAAS,MAAiC,CAAA,GAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAC7C,UAAU,MAAM,OAAM,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CAEZ,UAAU,eAEzB,GAAG,qBAAoB,qBAAsB,eAAc,GAAI,eAAc,GAAI,qBAAqB,KAAK,KAAI,MAClH,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CARU,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAQ,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAR,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAQ,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA,EAAA,YAAA,EAAA,SAAA,YAAA,EAAA;EAAA,WAFR,CAAC;GAAE,SAAS;GAAY,aAAa,iBAAiB,QAAQ;EAAC,CAAE;EAAC,UAAA;CAAA,CAAA;;AAElE,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAQ,YAAA,CAAA;EAPpB,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,MAAM,EACJ,WAAW,YACZ;GACD,WAAW,CAAC;IAAE,SAAS;IAAY,aAAa,iBAAgB,QAAS;GAAC,CAAE;EAC7E,CAAA"}

package/fesm2022/joanroucoux-cairn-ui-skeleton.mjs

@@ -1,42 +1,89 @@
-import * as i0 from '@angular/core';
-import { input, computed, Component } from '@angular/core';
-
-/** Available skeleton shapes. `SkeletonShape` is derived from this tuple. */
-const SKELETON_SHAPES = ['text', 'figure', 'row', 'chart', 'ring', 'dot'];
-const LAST_LINE_WIDTH = '62%';
-const PULSE_ANIMATION = 'cairn-pulse var(--pulse-duration) var(--ease-out) infinite alternate';
-const BAR_CLASSES = 'block rounded-control bg-(--muted)';
-/**
- * Decorative, pulsing placeholder for content that is still loading, at the shape of the content
- * it stands in for.
- *
- * @example
- * <ui-skeleton shape="figure" />
- * <ui-skeleton [lines]="3" />
- */
-class UiSkeleton {
-    shape = input('text', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
-    lines = input(1, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "lines" }] : /* istanbul ignore next */ []));
-    height = input(12, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []));
-    size = input(232, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    animation = PULSE_ANIMATION;
-    bars = computed(() => {
-        const count = Math.max(1, this.lines());
-        return Array.from({ length: count }, (_, index) => (index === count - 1 && count > 1 ? LAST_LINE_WIDTH : '100%'));
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "bars" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: UiSkeleton, isStandalone: true, selector: "ui-skeleton", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, lines: { classPropertyName: "lines", publicName: "lines", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, classAttribute: "flex flex-col gap-2" }, ngImport: i0, template: "\n    @switch (shape()) {\n      @case ('figure') {\n        <span class=\"block rounded-control bg-(--muted) h-10 w-65\" [style.animation]=\"animation\"></span>\n      }\n      @case ('row') {\n        <span class=\"flex h-14 items-center justify-between gap-4\">\n          <span class=\"flex min-w-0 flex-1 flex-col gap-1.5\">\n            <span class=\"block rounded-control bg-(--muted) h-4 w-3/5\" [style.animation]=\"animation\"></span>\n            <span class=\"block rounded-control bg-(--muted) h-3 w-20\" [style.animation]=\"animation\"></span>\n          </span>\n          <span class=\"block rounded-control bg-(--muted) h-4 w-[90px] flex-none\" [style.animation]=\"animation\"></span>\n        </span>\n      }\n      @case ('chart') {\n        <span class=\"rounded-control min-h-50 w-full flex-1 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('dot') {\n        <span class=\"rounded-pill size-3 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('ring') {\n        <span\n          class=\"rounded-pill shadow-[inset_0_0_0_30px_var(--muted)]\"\n          [style.animation]=\"animation\"\n          [style.height.px]=\"size()\"\n          [style.width.px]=\"size()\"\n        ></span>\n      }\n      @default {\n        @for (line of bars(); track $index) {\n          <span\n            class=\"block rounded-control bg-(--muted)\"\n            [style.animation]=\"animation\"\n            [style.height.px]=\"height()\"\n            [style.width]=\"line\"\n          ></span>\n        }\n      }\n    }\n  ", isInline: true });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiSkeleton, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ui-skeleton',
-                    template: `
+import * as i0 from "@angular/core";
+import { Component, computed, input } from "@angular/core";
+const SKELETON_SHAPES = [
+	"text",
+	"figure",
+	"row",
+	"chart",
+	"ring",
+	"dot"
+];
+const LAST_LINE_WIDTH = "62%";
+const PULSE_ANIMATION = "cairn-pulse var(--pulse-duration) var(--ease-out) infinite alternate";
+const BAR_CLASSES = "block rounded-control bg-(--muted)";
+var UiSkeleton = class UiSkeleton {
+	shape = input("text", ...ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []);
+	lines = input(1, ...ngDevMode ? [{ debugName: "lines" }] : /* istanbul ignore next */ []);
+	height = input(12, ...ngDevMode ? [{ debugName: "height" }] : /* istanbul ignore next */ []);
+	size = input(232, ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	animation = PULSE_ANIMATION;
+	bars = computed(() => {
+		const count = Math.max(1, this.lines());
+		return Array.from({ length: count }, (_, index) => index === count - 1 && count > 1 ? LAST_LINE_WIDTH : "100%");
+	}, ...ngDevMode ? [{ debugName: "bars" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: UiSkeleton,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.0",
+		type: UiSkeleton,
+		isStandalone: true,
+		selector: "ui-skeleton",
+		inputs: {
+			shape: {
+				classPropertyName: "shape",
+				publicName: "shape",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			lines: {
+				classPropertyName: "lines",
+				publicName: "lines",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			height: {
+				classPropertyName: "height",
+				publicName: "height",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "aria-hidden": "true" },
+			classAttribute: "flex flex-col gap-2"
+		},
+		ngImport: i0,
+		template: "\n    @switch (shape()) {\n      @case ('figure') {\n        <span class=\"block rounded-control bg-(--muted) h-10 w-65\" [style.animation]=\"animation\"></span>\n      }\n      @case ('row') {\n        <span class=\"flex h-14 items-center justify-between gap-4\">\n          <span class=\"flex min-w-0 flex-1 flex-col gap-1.5\">\n            <span class=\"block rounded-control bg-(--muted) h-4 w-3/5\" [style.animation]=\"animation\"></span>\n            <span class=\"block rounded-control bg-(--muted) h-3 w-20\" [style.animation]=\"animation\"></span>\n          </span>\n          <span class=\"block rounded-control bg-(--muted) h-4 w-[90px] flex-none\" [style.animation]=\"animation\"></span>\n        </span>\n      }\n      @case ('chart') {\n        <span class=\"rounded-control min-h-50 w-full flex-1 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('dot') {\n        <span class=\"rounded-pill size-3 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('ring') {\n        <span\n          class=\"rounded-pill shadow-[inset_0_0_0_30px_var(--muted)]\"\n          [style.animation]=\"animation\"\n          [style.height.px]=\"size()\"\n          [style.width.px]=\"size()\"\n        ></span>\n      }\n      @default {\n        @for (line of bars(); track $index) {\n          <span\n            class=\"block rounded-control bg-(--muted)\"\n            [style.animation]=\"animation\"\n            [style.height.px]=\"height()\"\n            [style.width]=\"line\"\n          ></span>\n        }\n      }\n    }\n  ",
+		isInline: true
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: UiSkeleton,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "ui-skeleton",
+			template: `
     @switch (shape()) {
       @case ('figure') {
         <span class="${BAR_CLASSES} h-10 w-65" [style.animation]="animation"></span>
@@ -76,16 +123,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
       }
     }
   `,
-                    host: {
-                        'aria-hidden': 'true',
-                        class: 'flex flex-col gap-2',
-                    },
-                }]
-        }], propDecorators: { shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], lines: [{ type: i0.Input, args: [{ isSignal: true, alias: "lines", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+			host: {
+				"aria-hidden": "true",
+				class: "flex flex-col gap-2"
+			}
+		}]
+	}],
+	propDecorators: {
+		shape: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "shape",
+				required: false
+			}]
+		}],
+		lines: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "lines",
+				required: false
+			}]
+		}],
+		height: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "height",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}]
+	}
+});
 export { SKELETON_SHAPES, UiSkeleton };
-//# sourceMappingURL=joanroucoux-cairn-ui-skeleton.mjs.map
+
+//# sourceMappingURL=joanroucoux-cairn-ui-skeleton.mjs.map

package/fesm2022/joanroucoux-cairn-ui-skeleton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"joanroucoux-cairn-ui-skeleton.mjs","sources":["../../../projects/ui/skeleton/skeleton.ts","../../../projects/ui/skeleton/joanroucoux-cairn-ui-skeleton.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\n\n/** Available skeleton shapes. `SkeletonShape` is derived from this tuple. */\nexport const SKELETON_SHAPES = ['text', 'figure', 'row', 'chart', 'ring', 'dot'] as const;\nexport type SkeletonShape = (typeof SKELETON_SHAPES)[number];\n\nconst LAST_LINE_WIDTH = '62%';\n\nconst PULSE_ANIMATION = 'cairn-pulse var(--pulse-duration) var(--ease-out) infinite alternate';\n\nconst BAR_CLASSES = 'block rounded-control bg-(--muted)';\n\n/**\n * Decorative, pulsing placeholder for content that is still loading, at the shape of the content\n * it stands in for.\n *\n * @example\n * <ui-skeleton shape=\"figure\" />\n * <ui-skeleton [lines]=\"3\" />\n */\n@Component({\n  selector: 'ui-skeleton',\n  template: `\n    @switch (shape()) {\n      @case ('figure') {\n        <span class=\"${BAR_CLASSES} h-10 w-65\" [style.animation]=\"animation\"></span>\n      }\n      @case ('row') {\n        <span class=\"flex h-14 items-center justify-between gap-4\">\n          <span class=\"flex min-w-0 flex-1 flex-col gap-1.5\">\n            <span class=\"${BAR_CLASSES} h-4 w-3/5\" [style.animation]=\"animation\"></span>\n            <span class=\"${BAR_CLASSES} h-3 w-20\" [style.animation]=\"animation\"></span>\n          </span>\n          <span class=\"${BAR_CLASSES} h-4 w-[90px] flex-none\" [style.animation]=\"animation\"></span>\n        </span>\n      }\n      @case ('chart') {\n        <span class=\"rounded-control min-h-50 w-full flex-1 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('dot') {\n        <span class=\"rounded-pill size-3 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('ring') {\n        <span\n          class=\"rounded-pill shadow-[inset_0_0_0_30px_var(--muted)]\"\n          [style.animation]=\"animation\"\n          [style.height.px]=\"size()\"\n          [style.width.px]=\"size()\"\n        ></span>\n      }\n      @default {\n        @for (line of bars(); track $index) {\n          <span\n            class=\"${BAR_CLASSES}\"\n            [style.animation]=\"animation\"\n            [style.height.px]=\"height()\"\n            [style.width]=\"line\"\n          ></span>\n        }\n      }\n    }\n  `,\n  host: {\n    'aria-hidden': 'true',\n    class: 'flex flex-col gap-2',\n  },\n})\nexport class UiSkeleton {\n  readonly shape = input<SkeletonShape>('text');\n  readonly lines = input(1);\n  readonly height = input(12);\n  readonly size = input(232);\n\n  protected readonly animation = PULSE_ANIMATION;\n\n  protected readonly bars = computed(() => {\n    const count = Math.max(1, this.lines());\n\n    return Array.from({ length: count }, (_, index) => (index === count - 1 && count > 1 ? LAST_LINE_WIDTH : '100%'));\n  });\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;AACO,MAAM,eAAe,GAAG,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK;AAG/E,MAAM,eAAe,GAAG,KAAK;AAE7B,MAAM,eAAe,GAAG,sEAAsE;AAE9F,MAAM,WAAW,GAAG,oCAAoC;AAExD;;;;;;;AAOG;MAgDU,UAAU,CAAA;IACZ,KAAK,GAAG,KAAK,CAAgB,MAAM;8EAAC;IACpC,KAAK,GAAG,KAAK,CAAC,CAAC;8EAAC;IAChB,MAAM,GAAG,KAAK,CAAC,EAAE;+EAAC;IAClB,IAAI,GAAG,KAAK,CAAC,GAAG;6EAAC;IAEP,SAAS,GAAG,eAAe;AAE3B,IAAA,IAAI,GAAG,QAAQ,CAAC,MAAK;AACtC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC;AAEvC,QAAA,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,MAAM,KAAK,KAAK,KAAK,GAAG,CAAC,IAAI,KAAK,GAAG,CAAC,GAAG,eAAe,GAAG,MAAM,CAAC,CAAC;IACnH,CAAC;6EAAC;uGAZS,UAAU,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAV,UAAU,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,qBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,kjDAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA;;2FAAV,UAAU,EAAA,UAAA,EAAA,CAAA;kBA/CtB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,aAAa;AACvB,oBAAA,QAAQ,EAAE;;;uBAGW,WAAW,CAAA;;;;;2BAKP,WAAW,CAAA;2BACX,WAAW,CAAA;;yBAEb,WAAW,CAAA;;;;;;;;;;;;;;;;;;;;qBAoBf,WAAW,CAAA;;;;;;;;AAQ7B,EAAA,CAAA;AACD,oBAAA,IAAI,EAAE;AACJ,wBAAA,aAAa,EAAE,MAAM;AACrB,wBAAA,KAAK,EAAE,qBAAqB;AAC7B,qBAAA;AACF,iBAAA;;;AClED;;AAEG;;;;"}
+{"version":3,"file":"joanroucoux-cairn-ui-skeleton.mjs","names":[],"sources":["../../../projects/ui/skeleton/skeleton.ts"],"sourcesContent":["import { Component, computed, input } from '@angular/core';\n\n/** Available skeleton shapes. */\nexport const SKELETON_SHAPES = ['text', 'figure', 'row', 'chart', 'ring', 'dot'] as const;\nexport type SkeletonShape = (typeof SKELETON_SHAPES)[number];\n\nconst LAST_LINE_WIDTH = '62%';\n\nconst PULSE_ANIMATION = 'cairn-pulse var(--pulse-duration) var(--ease-out) infinite alternate';\n\nconst BAR_CLASSES = 'block rounded-control bg-(--muted)';\n\n/**\n * Decorative, pulsing placeholder for content that is still loading.\n *\n * @example\n * <ui-skeleton shape=\"figure\" />\n * <ui-skeleton [lines]=\"3\" />\n */\n@Component({\n  selector: 'ui-skeleton',\n  template: `\n    @switch (shape()) {\n      @case ('figure') {\n        <span class=\"${BAR_CLASSES} h-10 w-65\" [style.animation]=\"animation\"></span>\n      }\n      @case ('row') {\n        <span class=\"flex h-14 items-center justify-between gap-4\">\n          <span class=\"flex min-w-0 flex-1 flex-col gap-1.5\">\n            <span class=\"${BAR_CLASSES} h-4 w-3/5\" [style.animation]=\"animation\"></span>\n            <span class=\"${BAR_CLASSES} h-3 w-20\" [style.animation]=\"animation\"></span>\n          </span>\n          <span class=\"${BAR_CLASSES} h-4 w-[90px] flex-none\" [style.animation]=\"animation\"></span>\n        </span>\n      }\n      @case ('chart') {\n        <span class=\"rounded-control min-h-50 w-full flex-1 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('dot') {\n        <span class=\"rounded-pill size-3 bg-(--muted)\" [style.animation]=\"animation\"></span>\n      }\n      @case ('ring') {\n        <span\n          class=\"rounded-pill shadow-[inset_0_0_0_30px_var(--muted)]\"\n          [style.animation]=\"animation\"\n          [style.height.px]=\"size()\"\n          [style.width.px]=\"size()\"\n        ></span>\n      }\n      @default {\n        @for (line of bars(); track $index) {\n          <span\n            class=\"${BAR_CLASSES}\"\n            [style.animation]=\"animation\"\n            [style.height.px]=\"height()\"\n            [style.width]=\"line\"\n          ></span>\n        }\n      }\n    }\n  `,\n  host: {\n    'aria-hidden': 'true',\n    class: 'flex flex-col gap-2',\n  },\n})\nexport class UiSkeleton {\n  readonly shape = input<SkeletonShape>('text');\n  readonly lines = input(1);\n  readonly height = input(12);\n  readonly size = input(232);\n\n  protected readonly animation = PULSE_ANIMATION;\n\n  protected readonly bars = computed(() => {\n    const count = Math.max(1, this.lines());\n\n    return Array.from({ length: count }, (_, index) => (index === count - 1 && count > 1 ? LAST_LINE_WIDTH : '100%'));\n  });\n}\n"],"mappings":";;AAGA,MAAa,kBAAkB;CAAC;CAAQ;CAAU;CAAO;CAAS;CAAQ;AAAK;AAG/E,MAAM,kBAAkB;AAExB,MAAM,kBAAkB;AAExB,MAAM,cAAc;AAwDpB,IAAa,aAAb,MAAa,WAAU;CACZ,QAAQ,MAAqB,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CACpC,QAAQ,MAAM,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,QAAA,CAAA,+BAAA,CAAA,CAAA;CAChB,SAAS,MAAM,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAClB,OAAO,MAAM,KAAI,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAEP,YAAY;CAEZ,OAAO,eAAc;EACtC,MAAM,QAAQ,KAAK,IAAI,GAAG,KAAK,MAAK,CAAE;EAEtC,OAAO,MAAM,KAAK,EAAE,QAAQ,MAAK,IAAK,GAAG,UAAW,UAAU,QAAQ,KAAK,QAAQ,IAAI,kBAAkB,MAAO;CAClH,GAAE,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAZS,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAU,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAV,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAU,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,OAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,QAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA;GAAA,YAAA,EAAA,eAAA,OAAA;GAAA,gBAAA;EAAA;EAAA,UAAA;EAAA,UAAA;EAAA,UAAA;CAAA,CAAA;;AAAV,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAU,YAAA,CAAA;EA/CtB,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,UAAU;;;uBAGW,YAAW;;;;;2BAKP,YAAW;2BACX,YAAW;;yBAEb,YAAW;;;;;;;;;;;;;;;;;;;;qBAoBf,YAAW;;;;;;;;;GAS9B,MAAM;IACJ,eAAe;IACf,OAAO;GACR;EACF,CAAA"}

package/fesm2022/joanroucoux-cairn-ui-stale-link.mjs

@@ -1,43 +1,84 @@
-import * as i0 from '@angular/core';
-import { input, booleanAttribute, computed, Directive } from '@angular/core';
-
-/** Available stale link sizes. `StaleLinkSize` is derived from this tuple. */
-const STALE_LINK_SIZES = ['caption', 'label'];
-const BASE_CLASSES = "relative inline-flex items-center gap-0.5 rounded-[4px] font-medium text-(--stale) hover:underline underline-offset-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--ring) before:absolute before:inset-x-0 before:top-1/2 before:h-11 pointer-fine:before:h-10 before:-translate-y-1/2 before:content-['']";
+import * as i0 from "@angular/core";
+import { Directive, booleanAttribute, computed, input } from "@angular/core";
+const STALE_LINK_SIZES = ["caption", "label"];
+const BASE_CLASSES = "relative inline-flex items-center gap-1 pointer-fine:gap-0.5 rounded-[4px] font-medium text-(--stale) hover:underline underline-offset-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--ring) before:absolute before:inset-x-0 before:top-1/2 before:h-11 pointer-fine:before:h-10 before:-translate-y-1/2 before:content-['']";
 const SIZE_CLASSES = {
-    caption: 'text-caption',
-    label: 'text-label',
+	caption: "text-caption",
+	label: "text-label"
 };
 const CHEVRON_CLASSES = "after:size-4 after:flex-none after:bg-current after:content-[''] after:mask-center after:mask-no-repeat after:mask-[url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m9%2018%206-6-6-6%27%2F%3E%3C%2Fsvg%3E)]";
-/**
- * Link in the stale tone, for a caption about data that is late or left out of a total, such as
- * "1 ligne sans cours, non comptée". Weight 500, underlined on hover, with an optional trailing
- * chevron. `size` is `caption` (12/17, the default) or `label` (14/20, the dashboard total's
- * "1 cours en retard").
- *
- * @example
- * <a uiStaleLink chevron size="label" routerLink="/holdings">1 cours en retard</a>
- */
-class UiStaleLink {
-    chevron = input(false, { ...(ngDevMode ? { debugName: "chevron" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
-    size = input('caption', /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    classes = computed(() => `${BASE_CLASSES} ${SIZE_CLASSES[this.size()]}${this.chevron() ? ` ${CHEVRON_CLASSES}` : ''}`, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiStaleLink, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: UiStaleLink, isStandalone: true, selector: "a[uiStaleLink]", inputs: { chevron: { classPropertyName: "chevron", publicName: "chevron", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: UiStaleLink, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: 'a[uiStaleLink]',
-                    host: { '[class]': 'classes()' },
-                }]
-        }], propDecorators: { chevron: [{ type: i0.Input, args: [{ isSignal: true, alias: "chevron", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+var UiStaleLink = class UiStaleLink {
+	chevron = input(false, {
+		...ngDevMode ? { debugName: "chevron" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	size = input("caption", ...ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []);
+	classes = computed(() => `${BASE_CLASSES} ${SIZE_CLASSES[this.size()]}${this.chevron() ? ` ${CHEVRON_CLASSES}` : ""}`, ...ngDevMode ? [{ debugName: "classes" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.0",
+		ngImport: i0,
+		type: UiStaleLink,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "17.1.0",
+		version: "22.2.0",
+		type: UiStaleLink,
+		isStandalone: true,
+		selector: "a[uiStaleLink]",
+		inputs: {
+			chevron: {
+				classPropertyName: "chevron",
+				publicName: "chevron",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: { properties: { "class": "classes()" } },
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.0",
+	ngImport: i0,
+	type: UiStaleLink,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "a[uiStaleLink]",
+			host: { "[class]": "classes()" }
+		}]
+	}],
+	propDecorators: {
+		chevron: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "chevron",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}]
+	}
+});
 export { STALE_LINK_SIZES, UiStaleLink };
-//# sourceMappingURL=joanroucoux-cairn-ui-stale-link.mjs.map
+
+//# sourceMappingURL=joanroucoux-cairn-ui-stale-link.mjs.map

package/fesm2022/joanroucoux-cairn-ui-stale-link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"joanroucoux-cairn-ui-stale-link.mjs","sources":["../../../projects/ui/stale-link/stale-link.ts","../../../projects/ui/stale-link/joanroucoux-cairn-ui-stale-link.ts"],"sourcesContent":["import { Directive, booleanAttribute, computed, input } from '@angular/core';\n\n/** Available stale link sizes. `StaleLinkSize` is derived from this tuple. */\nexport const STALE_LINK_SIZES = ['caption', 'label'] as const;\nexport type StaleLinkSize = (typeof STALE_LINK_SIZES)[number];\n\nconst BASE_CLASSES =\n  \"relative inline-flex items-center gap-0.5 rounded-[4px] font-medium text-(--stale) hover:underline underline-offset-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--ring) before:absolute before:inset-x-0 before:top-1/2 before:h-11 pointer-fine:before:h-10 before:-translate-y-1/2 before:content-['']\";\n\nconst SIZE_CLASSES: Record<StaleLinkSize, string> = {\n  caption: 'text-caption',\n  label: 'text-label',\n};\n\nconst CHEVRON_CLASSES =\n  \"after:size-4 after:flex-none after:bg-current after:content-[''] after:mask-center after:mask-no-repeat after:mask-[url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m9%2018%206-6-6-6%27%2F%3E%3C%2Fsvg%3E)]\";\n\n/**\n * Link in the stale tone, for a caption about data that is late or left out of a total, such as\n * \"1 ligne sans cours, non comptée\". Weight 500, underlined on hover, with an optional trailing\n * chevron. `size` is `caption` (12/17, the default) or `label` (14/20, the dashboard total's\n * \"1 cours en retard\").\n *\n * @example\n * <a uiStaleLink chevron size=\"label\" routerLink=\"/holdings\">1 cours en retard</a>\n */\n@Directive({\n  selector: 'a[uiStaleLink]',\n  host: { '[class]': 'classes()' },\n})\nexport class UiStaleLink {\n  readonly chevron = input(false, { transform: booleanAttribute });\n  readonly size = input<StaleLinkSize>('caption');\n\n  protected readonly classes = computed(\n    () => `${BASE_CLASSES} ${SIZE_CLASSES[this.size()]}${this.chevron() ? ` ${CHEVRON_CLASSES}` : ''}`,\n  );\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;MACa,gBAAgB,GAAG,CAAC,SAAS,EAAE,OAAO;AAGnD,MAAM,YAAY,GAChB,8UAA8U;AAEhV,MAAM,YAAY,GAAkC;AAClD,IAAA,OAAO,EAAE,cAAc;AACvB,IAAA,KAAK,EAAE,YAAY;CACpB;AAED,MAAM,eAAe,GACnB,4aAA4a;AAE9a;;;;;;;;AAQG;MAKU,WAAW,CAAA;IACb,OAAO,GAAG,KAAK,CAAC,KAAK,+EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IACvD,IAAI,GAAG,KAAK,CAAgB,SAAS;6EAAC;AAE5B,IAAA,OAAO,GAAG,QAAQ,CACnC,MAAM,CAAA,EAAG,YAAY,CAAA,CAAA,EAAI,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAA,EAAG,IAAI,CAAC,OAAO,EAAE,GAAG,CAAA,CAAA,EAAI,eAAe,CAAA,CAAE,GAAG,EAAE,CAAA,CAAE;gFACnG;uGANU,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAX,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAX,WAAW,EAAA,UAAA,EAAA,CAAA;kBAJvB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE;AACjC,iBAAA;;;AC7BD;;AAEG;;;;"}
+{"version":3,"file":"joanroucoux-cairn-ui-stale-link.mjs","names":[],"sources":["../../../projects/ui/stale-link/stale-link.ts"],"sourcesContent":["import { Directive, booleanAttribute, computed, input } from '@angular/core';\n\n/** Available stale link sizes. */\nexport const STALE_LINK_SIZES = ['caption', 'label'] as const;\nexport type StaleLinkSize = (typeof STALE_LINK_SIZES)[number];\n\nconst BASE_CLASSES =\n  \"relative inline-flex items-center gap-1 pointer-fine:gap-0.5 rounded-[4px] font-medium text-(--stale) hover:underline underline-offset-3 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--ring) before:absolute before:inset-x-0 before:top-1/2 before:h-11 pointer-fine:before:h-10 before:-translate-y-1/2 before:content-['']\";\n\nconst SIZE_CLASSES: Record<StaleLinkSize, string> = {\n  caption: 'text-caption',\n  label: 'text-label',\n};\n\nconst CHEVRON_CLASSES =\n  \"after:size-4 after:flex-none after:bg-current after:content-[''] after:mask-center after:mask-no-repeat after:mask-[url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%271.75%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27m9%2018%206-6-6-6%27%2F%3E%3C%2Fsvg%3E)]\";\n\n/**\n * Link in the stale tone, for a caption about data that is late or left out of a total, such as\n * \"1 ligne sans cours, non comptée\". `chevron` adds a trailing chevron, `size` is `caption` (the\n * default) or `label`.\n *\n * @example\n * <a uiStaleLink chevron size=\"label\" routerLink=\"/holdings\">1 cours en retard</a>\n */\n@Directive({\n  selector: 'a[uiStaleLink]',\n  host: { '[class]': 'classes()' },\n})\nexport class UiStaleLink {\n  readonly chevron = input(false, { transform: booleanAttribute });\n  readonly size = input<StaleLinkSize>('caption');\n\n  protected readonly classes = computed(\n    () => `${BASE_CLASSES} ${SIZE_CLASSES[this.size()]}${this.chevron() ? ` ${CHEVRON_CLASSES}` : ''}`,\n  );\n}\n"],"mappings":";;AAGA,MAAa,mBAAmB,CAAC,WAAW,OAAO;AAGnD,MAAM,eACJ;AAEF,MAAM,eAA8C;CAClD,SAAS;CACT,OAAO;AACR;AAED,MAAM,kBACJ;AAcF,IAAa,cAAb,MAAa,YAAW;CACb,UAAU,MAAM,OAAK;EAAA,GAAA,YAAA,EAAA,WAAA,UAAA,+BAAA,CAAA;EAAI,WAAW;CAAgB,CAAA;CACpD,OAAO,MAAqB,WAAU,GAAA,YAAA,CAAA,EAAA,WAAA,OAAA,CAAA,+BAAA,CAAA,CAAA;CAE5B,UAAU,eACrB,GAAG,aAAY,GAAI,aAAa,KAAK,KAAI,KAAM,KAAK,QAAO,IAAK,IAAI,oBAAoB,MAC/F,GAAA,YAAA,CAAA,EAAA,WAAA,UAAA,CAAA,+BAAA,CAAA,CAAA;CANU,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAW,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAAX,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAW,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,SAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;GAAA,MAAA;IAAA,mBAAA;IAAA,YAAA;IAAA,UAAA;IAAA,YAAA;IAAA,mBAAA;GAAA;EAAA;EAAA,MAAA,EAAA,YAAA,EAAA,SAAA,YAAA,EAAA;EAAA,UAAA;CAAA,CAAA;;AAAX,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAW,YAAA,CAAA;EAJvB,MAAA;EAAU,MAAA,CAAA;GACT,UAAU;GACV,MAAM,EAAE,WAAW,YAAW;EAC/B,CAAA"}