forty-cdk 0.2.0 → 0.3.0

package/fesm2022/forty-cdk-breakpoints.mjs

@@ -0,0 +1,117 @@
+import { createDefaults, injectMediaQuery } from 'forty-cdk/core';
+import { inject, Injector, runInInjectionContext, computed } from '@angular/core';
+
+/**
+ * The default breakpoint map, mirroring Tailwind CSS's `sm`–`2xl` scale. Used
+ * as the library fallback when no `provideForBreakpoints` is in scope, and the
+ * source of the typed breakpoint names when the consumer has not augmented
+ * {@link BreakpointRegistry}.
+ */
+const breakpointsTailwind = {
+    sm: 640,
+    md: 768,
+    lg: 1024,
+    xl: 1280,
+    '2xl': 1536,
+};
+const FALLBACK = {
+    breakpoints: breakpointsTailwind,
+};
+const { token, provideDefaults } = createDefaults('FOR_BREAKPOINTS', FALLBACK);
+/**
+ * Token holding the resolved breakpoint map for the current injector scope.
+ * The library always provides a fully-populated value (the Tailwind fallback
+ * at the root, or the map from the nearest `provideForBreakpoints`).
+ */
+const FOR_BREAKPOINTS = token;
+/**
+ * Configures the breakpoint map for this injector scope so `injectBreakpoints`
+ * can be called with no arguments. Provide it once in your application config:
+ *
+ * ```ts
+ * providers: [
+ *   provideForBreakpoints({ mobile: 0, tablet: 640, laptop: 1024, desktop: 1280 }),
+ * ]
+ * ```
+ *
+ * Providing it again on a component injector replaces the map for that subtree
+ * only (the nearest scope wins; the map is replaced wholesale, never merged
+ * key-by-key). Omit it entirely to use {@link breakpointsTailwind}.
+ */
+function provideForBreakpoints(breakpoints) {
+    return provideDefaults({ breakpoints });
+}
+
+/**
+ * A signal-first, zoneless, SSR-safe viewport breakpoint observer. Reads the
+ * breakpoint map from the ambient {@link FOR_BREAKPOINTS} token (configured
+ * with `provideForBreakpoints`, or the Tailwind fallback), so call sites never
+ * repeat the breakpoint set:
+ *
+ * ```ts
+ * private bp = injectBreakpoints();
+ * protected isDesktop = this.bp.up('desktop');
+ * protected active = this.bp.active;
+ * ```
+ *
+ * Each query method returns a `Signal<boolean>` backed by a cached
+ * `MediaQueryList`. The returned handle captures the calling injection
+ * context, so its methods can be invoked lazily from `computed()` or a
+ * template — not only during construction. Listeners are torn down with the
+ * injector. On the server (or where `matchMedia` is unavailable) every signal
+ * reads `false` and `active` reads `null`.
+ *
+ * Must be called from an injection context.
+ *
+ * @returns A {@link ForBreakpoints} handle of reactive query methods.
+ */
+function injectBreakpoints() {
+    const injector = inject(Injector);
+    const map = inject(FOR_BREAKPOINTS).breakpoints;
+    const names = Object.keys(map).sort((a, b) => map[a] - map[b]);
+    const cache = new Map();
+    const observe = (query) => {
+        let result = cache.get(query);
+        if (result === undefined) {
+            result = runInInjectionContext(injector, () => injectMediaQuery(query));
+            cache.set(query, result);
+        }
+        return result;
+    };
+    const thresholdOf = (name) => {
+        const value = map[name];
+        if (value === undefined) {
+            throw new Error(`[forty-cdk/breakpoints] Unknown breakpoint "${name}". Defined breakpoints: ${names.join(', ') || '(none)'}.`);
+        }
+        return value;
+    };
+    const up = (name) => observe(`(min-width: ${thresholdOf(name)}px)`);
+    const down = (name) => observe(`(max-width: ${thresholdOf(name) - 0.02}px)`);
+    const between = (min, max) => observe(`(min-width: ${thresholdOf(min)}px) and (max-width: ${thresholdOf(max) - 0.02}px)`);
+    const only = (name) => {
+        const lower = thresholdOf(name);
+        const index = names.indexOf(name);
+        const next = index < names.length - 1 ? thresholdOf(names[index + 1]) : null;
+        return next === null
+            ? observe(`(min-width: ${lower}px)`)
+            : observe(`(min-width: ${lower}px) and (max-width: ${next - 0.02}px)`);
+    };
+    const active = computed(() => {
+        let current = null;
+        for (const name of names) {
+            if (observe(`(min-width: ${map[name]}px)`)()) {
+                current = name;
+            }
+        }
+        return current;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    return { up, down, between, only, active, matches: (query) => observe(query) };
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { FOR_BREAKPOINTS, breakpointsTailwind, injectBreakpoints, provideForBreakpoints };
+//# sourceMappingURL=forty-cdk-breakpoints.mjs.map

package/fesm2022/forty-cdk-breakpoints.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"forty-cdk-breakpoints.mjs","sources":["../../../projects/forty-cdk/breakpoints/src/breakpoints-defaults.ts","../../../projects/forty-cdk/breakpoints/src/breakpoints.ts","../../../projects/forty-cdk/breakpoints/src/forty-cdk-breakpoints.ts"],"sourcesContent":["import { type Provider } from '@angular/core';\n\nimport { createDefaults } from 'forty-cdk/core';\n\n/**\n * A breakpoint map: each named breakpoint paired with its `min-width`\n * threshold in CSS pixels. Names are arbitrary — `injectBreakpoints` derives\n * its query methods (`up`, `down`, `between`, `only`) from whatever keys this\n * map declares, sorted ascending by threshold.\n */\nexport type BreakpointMap = Record<string, number>;\n\n/**\n * The default breakpoint map, mirroring Tailwind CSS's `sm`–`2xl` scale. Used\n * as the library fallback when no `provideForBreakpoints` is in scope, and the\n * source of the typed breakpoint names when the consumer has not augmented\n * {@link BreakpointRegistry}.\n */\nexport const breakpointsTailwind = {\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n  '2xl': 1536,\n} as const satisfies BreakpointMap;\n\n/** The breakpoint names from the default Tailwind scale. */\nexport type TailwindBreakpointName = keyof typeof breakpointsTailwind;\n\n/** Resolved shape stored against {@link FOR_BREAKPOINTS}. */\nexport interface ForBreakpointsDefaults {\n  /** The active breakpoint map for the current injector scope. */\n  breakpoints: BreakpointMap;\n}\n\nconst FALLBACK: ForBreakpointsDefaults = {\n  breakpoints: breakpointsTailwind,\n};\n\nconst { token, provideDefaults } = createDefaults<ForBreakpointsDefaults>(\n  'FOR_BREAKPOINTS',\n  FALLBACK,\n);\n\n/**\n * Token holding the resolved breakpoint map for the current injector scope.\n * The library always provides a fully-populated value (the Tailwind fallback\n * at the root, or the map from the nearest `provideForBreakpoints`).\n */\nexport const FOR_BREAKPOINTS = token;\n\n/**\n * Configures the breakpoint map for this injector scope so `injectBreakpoints`\n * can be called with no arguments. Provide it once in your application config:\n *\n * ```ts\n * providers: [\n *   provideForBreakpoints({ mobile: 0, tablet: 640, laptop: 1024, desktop: 1280 }),\n * ]\n * ```\n *\n * Providing it again on a component injector replaces the map for that subtree\n * only (the nearest scope wins; the map is replaced wholesale, never merged\n * key-by-key). Omit it entirely to use {@link breakpointsTailwind}.\n */\nexport function provideForBreakpoints(breakpoints: BreakpointMap): Provider[] {\n  return provideDefaults({ breakpoints });\n}\n","import { Injector, computed, inject, runInInjectionContext, type Signal } from '@angular/core';\n\nimport { injectMediaQuery } from 'forty-cdk/core';\nimport { FOR_BREAKPOINTS, type TailwindBreakpointName } from './breakpoints-defaults';\n\n/**\n * Extension point for typing custom breakpoint names. Augment it via module\n * declaration merging so `injectBreakpoints` autocompletes your own names\n * instead of the default Tailwind scale:\n *\n * ```ts\n * import type { appBreakpoints } from './breakpoints';\n *\n * declare module 'forty-cdk' {\n *   interface BreakpointRegistry extends Record<keyof typeof appBreakpoints, true> {}\n * }\n * ```\n *\n * When left empty (no augmentation), {@link BreakpointName} falls back to the\n * keys of {@link breakpointsTailwind}.\n */\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface BreakpointRegistry {}\n\n/**\n * The set of valid breakpoint names. Resolves to the augmented\n * {@link BreakpointRegistry} keys when present, otherwise the Tailwind scale\n * (`'sm' | 'md' | 'lg' | 'xl' | '2xl'`).\n */\nexport type BreakpointName = [keyof BreakpointRegistry] extends [never]\n  ? TailwindBreakpointName\n  : keyof BreakpointRegistry & string;\n\n/** Reactive handle returned by {@link injectBreakpoints}. */\nexport interface ForBreakpoints<K extends string = BreakpointName> {\n  /**\n   * Matches the named breakpoint and wider — `(min-width: <threshold>px)`.\n   * @param name A breakpoint declared in the active map.\n   */\n  up(name: K): Signal<boolean>;\n  /**\n   * Matches narrower than the named breakpoint —\n   * `(max-width: <threshold - 0.02>px)`. The 0.02px back-off keeps `up(name)`\n   * and `down(name)` from both matching at the exact threshold.\n   * @param name A breakpoint declared in the active map.\n   */\n  down(name: K): Signal<boolean>;\n  /**\n   * Matches from `min` (inclusive) up to but not including `max`.\n   * @param min Lower breakpoint, inclusive.\n   * @param max Upper breakpoint, exclusive.\n   */\n  between(min: K, max: K): Signal<boolean>;\n  /**\n   * Matches only the named breakpoint's own band — from its threshold up to\n   * but not including the next-larger breakpoint (open-ended for the largest).\n   * @param name A breakpoint declared in the active map.\n   */\n  only(name: K): Signal<boolean>;\n  /**\n   * The largest breakpoint whose `min-width` currently matches, or `null` when\n   * the viewport is narrower than the smallest breakpoint (and on the server).\n   */\n  readonly active: Signal<K | null>;\n  /**\n   * Escape hatch for an arbitrary media query string (orientation, pointer,\n   * `prefers-color-scheme`, …) that the named helpers don't cover.\n   * @param query Any valid media query.\n   */\n  matches(query: string): Signal<boolean>;\n}\n\n/**\n * A signal-first, zoneless, SSR-safe viewport breakpoint observer. Reads the\n * breakpoint map from the ambient {@link FOR_BREAKPOINTS} token (configured\n * with `provideForBreakpoints`, or the Tailwind fallback), so call sites never\n * repeat the breakpoint set:\n *\n * ```ts\n * private bp = injectBreakpoints();\n * protected isDesktop = this.bp.up('desktop');\n * protected active = this.bp.active;\n * ```\n *\n * Each query method returns a `Signal<boolean>` backed by a cached\n * `MediaQueryList`. The returned handle captures the calling injection\n * context, so its methods can be invoked lazily from `computed()` or a\n * template — not only during construction. Listeners are torn down with the\n * injector. On the server (or where `matchMedia` is unavailable) every signal\n * reads `false` and `active` reads `null`.\n *\n * Must be called from an injection context.\n *\n * @returns A {@link ForBreakpoints} handle of reactive query methods.\n */\nexport function injectBreakpoints(): ForBreakpoints {\n  const injector = inject(Injector);\n  const map = inject(FOR_BREAKPOINTS).breakpoints;\n  const names = Object.keys(map).sort((a, b) => map[a] - map[b]);\n  const cache = new Map<string, Signal<boolean>>();\n\n  const observe = (query: string): Signal<boolean> => {\n    let result = cache.get(query);\n    if (result === undefined) {\n      result = runInInjectionContext(injector, () => injectMediaQuery(query));\n      cache.set(query, result);\n    }\n    return result;\n  };\n\n  const thresholdOf = (name: string): number => {\n    const value = map[name];\n    if (value === undefined) {\n      throw new Error(\n        `[forty-cdk/breakpoints] Unknown breakpoint \"${name}\". Defined breakpoints: ${\n          names.join(', ') || '(none)'\n        }.`,\n      );\n    }\n    return value;\n  };\n\n  const up = (name: string): Signal<boolean> => observe(`(min-width: ${thresholdOf(name)}px)`);\n\n  const down = (name: string): Signal<boolean> =>\n    observe(`(max-width: ${thresholdOf(name) - 0.02}px)`);\n\n  const between = (min: string, max: string): Signal<boolean> =>\n    observe(`(min-width: ${thresholdOf(min)}px) and (max-width: ${thresholdOf(max) - 0.02}px)`);\n\n  const only = (name: string): Signal<boolean> => {\n    const lower = thresholdOf(name);\n    const index = names.indexOf(name);\n    const next = index < names.length - 1 ? thresholdOf(names[index + 1]) : null;\n    return next === null\n      ? observe(`(min-width: ${lower}px)`)\n      : observe(`(min-width: ${lower}px) and (max-width: ${next - 0.02}px)`);\n  };\n\n  const active = computed<BreakpointName | null>(() => {\n    let current: string | null = null;\n    for (const name of names) {\n      if (observe(`(min-width: ${map[name]}px)`)()) {\n        current = name;\n      }\n    }\n    return current as BreakpointName | null;\n  });\n\n  return { up, down, between, only, active, matches: (query) => observe(query) };\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/forty-cdk-button.mjs

@@ -0,0 +1,134 @@
+import * as i0 from '@angular/core';
+import { inject, ElementRef, input, booleanAttribute, output, signal, computed, Directive } from '@angular/core';
+import { injectFocusVisible, injectHovered, injectPressed, createDefaults } from 'forty-cdk/core';
+
+/**
+ * Headless implementation of the [WAI-ARIA Button pattern](https://www.w3.org/WAI/ARIA/apg/patterns/button/).
+ *
+ * Works on a native `<button>` host and on any arbitrary host element (e.g. `<div>`, `<span>`).
+ * On a native button the platform handles Enter/Space → click synthesis and no `role` or
+ * `tabindex` is emitted (the platform owns those). On a non-button host, `role="button"` and
+ * `tabindex="0"` are applied, and keydown for Enter/Space synthesizes a click so the directive's
+ * single `onClick` path handles all activations.
+ *
+ * Disabled stays focusable: per the APG a disabled button must remain reachable by assistive
+ * technology, so the native `disabled` attribute is never set. Instead `aria-disabled="true"` and
+ * `data-disabled=""` are reflected and the activation handler becomes a no-op.
+ *
+ * Interaction state is reflected as `data-pressed`, `data-hovered`, and `data-focus-visible`
+ * (present/absent boolean attributes). There is no `data-state` — this primitive has no
+ * open/closed or checked/unchecked logical state.
+ *
+ * @example
+ * ```html
+ * <!-- Native button — platform handles Enter/Space -->
+ * <button forButton (activate)="doSomething()">Click me</button>
+ *
+ * <!-- Non-button host — role, tabindex, and keyboard handling added automatically -->
+ * <div forButton (activate)="doSomething()">Click me</div>
+ *
+ * <!-- Disabled: stays focusable, activation is a no-op -->
+ * <button forButton [disabled]="true" (activate)="doSomething()">Disabled</button>
+ * ```
+ */
+class ForButton {
+    #host = inject(ElementRef).nativeElement;
+    #isNativeButton = this.#host.tagName === 'BUTTON';
+    #initialType = this.#host.getAttribute('type');
+    /**
+     * When `true`, activation (click, Enter, Space) is suppressed and the element
+     * reflects `aria-disabled="true"` + `data-disabled=""`. The element remains
+     * focusable so assistive technology can announce it.
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Emitted once per user activation: a pointer click on any host, or Enter / Space
+     * on a non-native-button host (native buttons synthesize click from keyboard). The
+     * name `activate` is chosen deliberately to avoid colliding with the native `click`
+     * event (which would trip `@angular-eslint/no-output-native` on wrapping consumers).
+     */
+    activate = output();
+    #focused = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "#focused" }] : /* istanbul ignore next */ []));
+    #keyboardModality = injectFocusVisible();
+    hovered = injectHovered({ disabled: this.disabled });
+    pressed = injectPressed({ disabled: this.disabled });
+    focusVisible = computed(() => this.#focused() && this.#keyboardModality(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focusVisible" }] : /* istanbul ignore next */ []));
+    resolvedType = computed(() => this.#initialType ?? (this.#isNativeButton ? 'button' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedType" }] : /* istanbul ignore next */ []));
+    resolvedRole = computed(() => (this.#isNativeButton ? null : 'button'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedRole" }] : /* istanbul ignore next */ []));
+    resolvedTabindex = computed(() => (this.#isNativeButton ? null : '0'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedTabindex" }] : /* istanbul ignore next */ []));
+    onClick(event) {
+        if (this.disabled()) {
+            event.preventDefault();
+            event.stopImmediatePropagation();
+            return;
+        }
+        this.activate.emit();
+    }
+    onKeydown(event) {
+        if (this.#isNativeButton) {
+            return;
+        }
+        if (event.key !== 'Enter' && event.key !== ' ') {
+            return;
+        }
+        if (this.disabled()) {
+            return;
+        }
+        event.preventDefault();
+        this.#host.click();
+    }
+    onFocusIn() {
+        this.#focused.set(true);
+    }
+    onFocusOut() {
+        this.#focused.set(false);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ForButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.2", type: ForButton, isStandalone: true, selector: "[forButton]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate" }, host: { listeners: { "click": "onClick($event)", "keydown": "onKeydown($event)", "focusin": "onFocusIn()", "focusout": "onFocusOut()" }, properties: { "attr.type": "resolvedType()", "attr.role": "resolvedRole()", "attr.tabindex": "resolvedTabindex()", "attr.aria-disabled": "disabled() ? 'true' : null", "attr.data-disabled": "disabled() ? '' : null", "attr.data-pressed": "pressed() ? '' : null", "attr.data-hovered": "hovered() ? '' : null", "attr.data-focus-visible": "focusVisible() ? '' : null" } }, exportAs: ["forButton"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: ForButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[forButton]',
+                    exportAs: 'forButton',
+                    host: {
+                        '[attr.type]': 'resolvedType()',
+                        '[attr.role]': 'resolvedRole()',
+                        '[attr.tabindex]': 'resolvedTabindex()',
+                        '[attr.aria-disabled]': "disabled() ? 'true' : null",
+                        '[attr.data-disabled]': "disabled() ? '' : null",
+                        '[attr.data-pressed]': "pressed() ? '' : null",
+                        '[attr.data-hovered]': "hovered() ? '' : null",
+                        '[attr.data-focus-visible]': "focusVisible() ? '' : null",
+                        '(click)': 'onClick($event)',
+                        '(keydown)': 'onKeydown($event)',
+                        '(focusin)': 'onFocusIn()',
+                        '(focusout)': 'onFocusOut()',
+                    },
+                }]
+        }], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], activate: [{ type: i0.Output, args: ["activate"] }] } });
+
+const FALLBACK = {};
+const { token, provideDefaults } = createDefaults('FOR_BUTTON_DEFAULTS', FALLBACK);
+/** Token holding the resolved button defaults for the current scope. */
+const FOR_BUTTON_DEFAULTS = token;
+/**
+ * Configures forty-cdk button defaults for this injector scope. Partial
+ * overrides inherit unspecified keys from the parent scope (or library
+ * defaults at the root).
+ */
+function provideForButtonDefaults(defaults = {}) {
+    return provideDefaults(defaults);
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { FOR_BUTTON_DEFAULTS, ForButton, provideForButtonDefaults };
+//# sourceMappingURL=forty-cdk-button.mjs.map

package/fesm2022/forty-cdk-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"forty-cdk-button.mjs","sources":["../../../projects/forty-cdk/button/src/button.ts","../../../projects/forty-cdk/button/src/button-defaults.ts","../../../projects/forty-cdk/button/src/forty-cdk-button.ts"],"sourcesContent":["import {\n  Directive,\n  ElementRef,\n  booleanAttribute,\n  computed,\n  inject,\n  input,\n  output,\n  signal,\n} from '@angular/core';\n\nimport { injectFocusVisible, injectHovered, injectPressed } from 'forty-cdk/core';\n\n/**\n * Headless implementation of the [WAI-ARIA Button pattern](https://www.w3.org/WAI/ARIA/apg/patterns/button/).\n *\n * Works on a native `<button>` host and on any arbitrary host element (e.g. `<div>`, `<span>`).\n * On a native button the platform handles Enter/Space → click synthesis and no `role` or\n * `tabindex` is emitted (the platform owns those). On a non-button host, `role=\"button\"` and\n * `tabindex=\"0\"` are applied, and keydown for Enter/Space synthesizes a click so the directive's\n * single `onClick` path handles all activations.\n *\n * Disabled stays focusable: per the APG a disabled button must remain reachable by assistive\n * technology, so the native `disabled` attribute is never set. Instead `aria-disabled=\"true\"` and\n * `data-disabled=\"\"` are reflected and the activation handler becomes a no-op.\n *\n * Interaction state is reflected as `data-pressed`, `data-hovered`, and `data-focus-visible`\n * (present/absent boolean attributes). There is no `data-state` — this primitive has no\n * open/closed or checked/unchecked logical state.\n *\n * @example\n * ```html\n * <!-- Native button — platform handles Enter/Space -->\n * <button forButton (activate)=\"doSomething()\">Click me</button>\n *\n * <!-- Non-button host — role, tabindex, and keyboard handling added automatically -->\n * <div forButton (activate)=\"doSomething()\">Click me</div>\n *\n * <!-- Disabled: stays focusable, activation is a no-op -->\n * <button forButton [disabled]=\"true\" (activate)=\"doSomething()\">Disabled</button>\n * ```\n */\n@Directive({\n  selector: '[forButton]',\n  exportAs: 'forButton',\n  host: {\n    '[attr.type]': 'resolvedType()',\n    '[attr.role]': 'resolvedRole()',\n    '[attr.tabindex]': 'resolvedTabindex()',\n    '[attr.aria-disabled]': \"disabled() ? 'true' : null\",\n    '[attr.data-disabled]': \"disabled() ? '' : null\",\n    '[attr.data-pressed]': \"pressed() ? '' : null\",\n    '[attr.data-hovered]': \"hovered() ? '' : null\",\n    '[attr.data-focus-visible]': \"focusVisible() ? '' : null\",\n    '(click)': 'onClick($event)',\n    '(keydown)': 'onKeydown($event)',\n    '(focusin)': 'onFocusIn()',\n    '(focusout)': 'onFocusOut()',\n  },\n})\nexport class ForButton {\n  readonly #host = inject<ElementRef<HTMLElement>>(ElementRef).nativeElement;\n  readonly #isNativeButton = this.#host.tagName === 'BUTTON';\n  readonly #initialType = this.#host.getAttribute('type');\n\n  /**\n   * When `true`, activation (click, Enter, Space) is suppressed and the element\n   * reflects `aria-disabled=\"true\"` + `data-disabled=\"\"`. The element remains\n   * focusable so assistive technology can announce it.\n   */\n  readonly disabled = input(false, { transform: booleanAttribute });\n\n  /**\n   * Emitted once per user activation: a pointer click on any host, or Enter / Space\n   * on a non-native-button host (native buttons synthesize click from keyboard). The\n   * name `activate` is chosen deliberately to avoid colliding with the native `click`\n   * event (which would trip `@angular-eslint/no-output-native` on wrapping consumers).\n   */\n  readonly activate = output<void>();\n\n  readonly #focused = signal(false);\n  readonly #keyboardModality = injectFocusVisible();\n  protected readonly hovered = injectHovered({ disabled: this.disabled });\n  protected readonly pressed = injectPressed({ disabled: this.disabled });\n  protected readonly focusVisible = computed(() => this.#focused() && this.#keyboardModality());\n\n  protected readonly resolvedType = computed(\n    () => this.#initialType ?? (this.#isNativeButton ? 'button' : null),\n  );\n  protected readonly resolvedRole = computed(() => (this.#isNativeButton ? null : 'button'));\n  protected readonly resolvedTabindex = computed(() => (this.#isNativeButton ? null : '0'));\n\n  protected onClick(event: MouseEvent): void {\n    if (this.disabled()) {\n      event.preventDefault();\n      event.stopImmediatePropagation();\n      return;\n    }\n    this.activate.emit();\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.#isNativeButton) {\n      return;\n    }\n    if (event.key !== 'Enter' && event.key !== ' ') {\n      return;\n    }\n    if (this.disabled()) {\n      return;\n    }\n    event.preventDefault();\n    this.#host.click();\n  }\n\n  protected onFocusIn(): void {\n    this.#focused.set(true);\n  }\n\n  protected onFocusOut(): void {\n    this.#focused.set(false);\n  }\n}\n","import { type Provider } from '@angular/core';\n\nimport { createDefaults } from 'forty-cdk/core';\n\n/**\n * Defaults inherited by descendant buttons in the surrounding injector\n * scope. Configure with `provideForButtonDefaults`. The shape is a stub\n * today — present so future per-scope tuning can land without churning the\n * public surface.\n */\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface ForButtonDefaults {}\n\nconst FALLBACK: ForButtonDefaults = {};\n\nconst { token, provideDefaults } = createDefaults<ForButtonDefaults>(\n  'FOR_BUTTON_DEFAULTS',\n  FALLBACK,\n);\n\n/** Token holding the resolved button defaults for the current scope. */\nexport const FOR_BUTTON_DEFAULTS = token;\n\n/**\n * Configures forty-cdk button defaults for this injector scope. Partial\n * overrides inherit unspecified keys from the parent scope (or library\n * defaults at the root).\n */\nexport function provideForButtonDefaults(defaults: Partial<ForButtonDefaults> = {}): Provider[] {\n  return provideDefaults(defaults);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}