@radix-ng/primitives 0.12.1 → 0.13.0

package/tabs/src/tabs-trigger.directive.d.ts

@@ -0,0 +1,19 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { InputSignalWithTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+interface TabsTriggerProps {
+    disabled: InputSignalWithTransform<boolean, BooleanInput>;
+}
+export declare class RdxTabsTriggerDirective implements TabsTriggerProps {
+    protected readonly tabsContext: import("./tabs-context.service").RdxTabsContextService;
+    readonly value: import("@angular/core").InputSignal<string>;
+    readonly disabled: InputSignalWithTransform<boolean, BooleanInput>;
+    protected readonly contentId: import("@angular/core").Signal<string>;
+    protected readonly triggerId: import("@angular/core").Signal<string>;
+    protected readonly selected: import("@angular/core").Signal<boolean>;
+    protected onMouseDown(event: MouseEvent): void;
+    protected onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RdxTabsTriggerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxTabsTriggerDirective, "[rdxTabsTrigger]", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export {};

package/toggle/src/toggle.directive.d.ts

@@ -0,0 +1,30 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface ToggleProps {
+    /**
+     * The controlled state of the toggle.
+     */
+    pressed?: boolean;
+    /**
+     * The state of the toggle when initially rendered. Use `defaultPressed`
+     * if you do not need to control the state of the toggle.
+     * @defaultValue false
+     */
+    defaultPressed?: boolean;
+    /**
+     * The callback that fires when the state of the toggle changes.
+     */
+    onPressedChange?: EventEmitter<boolean>;
+}
+export declare class RdxToggleDirective {
+    readonly defaultPressed: import("@angular/core").InputSignal<boolean>;
+    readonly pressed: import("@angular/core").ModelSignal<boolean>;
+    readonly disabled: import("@angular/core").InputSignal<boolean>;
+    /**
+     * Event emitted when the toggle is pressed.
+     */
+    readonly onPressedChange: EventEmitter<boolean>;
+    protected toggle(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RdxToggleDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxToggleDirective, "button[rdxToggle]", ["rdxToggle"], { "defaultPressed": { "alias": "defaultPressed"; "required": false; "isSignal": true; }; "pressed": { "alias": "pressed"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "pressed": "pressedChange"; "onPressedChange": "onPressedChange"; }, never, never, true, never>;
+}

package/toggle-group/src/toggle-group-button.directive.d.ts

@@ -0,0 +1,39 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class RdxToggleGroupButtonDirective implements OnChanges {
+    /**
+     * Access the toggle group.
+     * @ignore
+     */
+    protected readonly toggleGroup: import("@radix-ng/primitives/toggle-group").RdxToggleGroupDirective | import("@radix-ng/primitives/toggle-group").RdxToggleGroupMultiDirective;
+    /**
+     * The value of this toggle button.
+     */
+    value: string;
+    /**
+     * Whether this toggle button is disabled.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Whether this toggle button is checked.
+     */
+    protected get checked(): boolean;
+    /**
+     * @ignore
+     */
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * @ignore
+     */
+    toggle(): void;
+    /**
+     * Ensure the disabled state is propagated to the roving focus item.
+     * @internal
+     * @ignore
+     */
+    updateDisabled(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RdxToggleGroupButtonDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxToggleGroupButtonDirective, "button[rdxToggleGroupButton]", never, { "value": { "alias": "value"; "required": true; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+}

package/toggle-group/src/toggle-group-button.token.d.ts

@@ -0,0 +1,4 @@
+import { InjectionToken } from '@angular/core';
+import type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';
+export declare const RdxToggleGroupButtonToken: InjectionToken<RdxToggleGroupButtonDirective>;
+export declare function injectToggleGroupButton(): RdxToggleGroupButtonDirective;

package/toggle-group/src/toggle-group-multi.directive.d.ts

@@ -0,0 +1,93 @@
+import { AfterContentInit, EventEmitter, OnChanges, QueryList, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';
+import * as i0 from "@angular/core";
+export declare class RdxToggleGroupMultiDirective implements OnChanges, AfterContentInit, ControlValueAccessor {
+    /**
+     * The selected toggle button.
+     */
+    value: ReadonlyArray<string>;
+    /**
+     * The orientation of the toggle group.
+     * @default 'horizontal'
+     */
+    orientation: 'horizontal' | 'vertical';
+    /**
+     * Whether the toggle group is disabled.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Whether the toggle group roving focus should wrap.
+     * @default true
+     */
+    wrap: boolean;
+    /**
+     * Event emitted when the selected toggle button changes.
+     */
+    readonly valueChange: EventEmitter<readonly string[]>;
+    /**
+     * Access the buttons in the toggle group.
+     * @ignore
+     */
+    protected buttons?: QueryList<RdxToggleGroupButtonDirective>;
+    /**
+     * The value change callback.
+     * @ignore
+     */
+    private onChange?;
+    /**
+     * onTouch function registered via registerOnTouch (ControlValueAccessor).
+     * @ignore
+     */
+    protected onTouched?: () => void;
+    /**
+     * @ignore
+     */
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * @ignore
+     */
+    ngAfterContentInit(): void;
+    /**
+     * Determine if a value is selected.
+     * @param value The value to check.
+     * @returns Whether the value is selected.
+     * @ignore
+     */
+    isSelected(value: string): boolean;
+    /**
+     * Toggle a value.
+     * @param value The value to toggle.
+     * @ignore
+     */
+    toggle(value: string): void;
+    /**
+     * Select a value from Angular forms.
+     * @param value The value to select.
+     * @ignore
+     */
+    writeValue(value: ReadonlyArray<string>): void;
+    /**
+     * Register a callback to be called when the value changes.
+     * @param fn The callback to register.
+     * @ignore
+     */
+    registerOnChange(fn: (value: ReadonlyArray<string>) => void): void;
+    /**
+     * Register a callback to be called when the toggle group is touched.
+     * @param fn The callback to register.
+     * @ignore
+     */
+    registerOnTouched(fn: () => void): void;
+    /**
+     * Set the disabled state of the toggle group.
+     * @param isDisabled Whether the toggle group is disabled.
+     * @ignore
+     */
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RdxToggleGroupMultiDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxToggleGroupMultiDirective, "[rdxToggleGroupMulti]", never, { "value": { "alias": "rdxToggleGroupMultiValue"; "required": false; }; "orientation": { "alias": "rdxToggleGroupMultiOrientation"; "required": false; }; "disabled": { "alias": "rdxToggleGroupMultiDisabled"; "required": false; }; "wrap": { "alias": "rdxToggleGroupMultiWrap"; "required": false; }; "valueChange": { "alias": "rdxToggleGroupMultiValueChange"; "required": false; }; }, {}, ["buttons"], never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_wrap: unknown;
+}

package/toggle-group/src/toggle-group.directive.d.ts

@@ -0,0 +1,84 @@
+import { AfterContentInit, EventEmitter, OnChanges, QueryList, SimpleChanges } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+import type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';
+import * as i0 from "@angular/core";
+export declare class RdxToggleGroupDirective implements OnChanges, AfterContentInit, ControlValueAccessor {
+    /**
+     * The selected toggle button.
+     */
+    value: string | null;
+    /**
+     * The orientation of the toggle group.
+     * @default 'horizontal'
+     */
+    orientation: 'horizontal' | 'vertical';
+    /**
+     * Whether the toggle group is disabled.
+     * @default false
+     */
+    disabled: boolean;
+    /**
+     * Whether the toggle group roving focus should wrap.
+     * @default true
+     */
+    wrap: boolean;
+    /**
+     * Event emitted when the selected toggle button changes.
+     */
+    readonly valueChange: EventEmitter<string | null>;
+    /**
+     * Access the buttons in the toggle group.
+     */
+    protected buttons?: QueryList<RdxToggleGroupButtonDirective>;
+    /**
+     * The value change callback.
+     */
+    private onChange?;
+    /**
+     * onTouch function registered via registerOnTouch (ControlValueAccessor).
+     */
+    protected onTouched?: () => void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterContentInit(): void;
+    /**
+     * Determine if a value is selected.
+     * @param value The value to check.
+     * @returns Whether the value is selected.
+     * @internal
+     */
+    isSelected(value: string): boolean;
+    /**
+     * Toggle a value.
+     * @param value The value to toggle.
+     * @internal
+     */
+    toggle(value: string): void;
+    /**
+     * Select a value from Angular forms.
+     * @param value The value to select.
+     * @internal
+     */
+    writeValue(value: string): void;
+    /**
+     * Register a callback to be called when the value changes.
+     * @param fn The callback to register.
+     * @internal
+     */
+    registerOnChange(fn: (value: string | null) => void): void;
+    /**
+     * Register a callback to be called when the toggle group is touched.
+     * @param fn The callback to register.
+     * @internal
+     */
+    registerOnTouched(fn: () => void): void;
+    /**
+     * Set the disabled state of the toggle group.
+     * @param isDisabled Whether the toggle group is disabled.
+     * @internal
+     */
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<RdxToggleGroupDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<RdxToggleGroupDirective, "[rdxToggleGroup]", never, { "value": { "alias": "value"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "wrap": { "alias": "wrap"; "required": false; }; "valueChange": { "alias": "valueChange"; "required": false; }; }, {}, ["buttons"], never, true, never>;
+    static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_wrap: unknown;
+}

package/toggle-group/src/toggle-group.token.d.ts

@@ -0,0 +1,5 @@
+import { InjectionToken } from '@angular/core';
+import type { RdxToggleGroupMultiDirective } from './toggle-group-multi.directive';
+import type { RdxToggleGroupDirective } from './toggle-group.directive';
+export declare const RdxToggleGroupToken: InjectionToken<RdxToggleGroupDirective | RdxToggleGroupMultiDirective>;
+export declare function injectToggleGroup(): RdxToggleGroupDirective | RdxToggleGroupMultiDirective;

package/.compodocrc.json

@@ -1,12 +0,0 @@
-{
-    "$schema": "../../node_modules/@compodoc/compodoc/src/config/schema.json",
-    "tsconfig": "tsconfig.doc.json",
-    "output": "../../dist/primitives/compodoc",
-    "exportFormat": "json",
-    "hideGenerator": true,
-    "disableCoverage": true,
-    "disablePrivate": true,
-    "disableInternal": true,
-    "disableLifeCycleHooks": true,
-    "disableDependencies": true
-}

package/CHANGELOG.md

@@ -1,189 +0,0 @@
-## 0.12.1 (2024-09-19)
-
-
-### 🩹 Fixes
-
-- publish script ([1ecaf0c](https://github.com/radix-ng/primitives/commit/1ecaf0c))
-
-## 0.12.0 (2024-09-19)
-
-
-### 🚀 Features
-
-- **dialog:** added Dialog primitive ([#101](https://github.com/radix-ng/primitives/pull/101))
-
-- **radio:** added prefix rdx ([e5ebbc6](https://github.com/radix-ng/primitives/commit/e5ebbc6))
-
-- **ci:** added eslint support ([#103](https://github.com/radix-ng/primitives/pull/103))
-
-- **context-menu:** added context menu ([#2865](https://github.com/radix-ng/primitives/pull/2865), [#104](https://github.com/radix-ng/primitives/pull/104))
-
-
-### 🩹 Fixes
-
-- **avatar:** supported SSR ([c50ce18](https://github.com/radix-ng/primitives/commit/c50ce18))
-
-- **dropdown-menu:** navigation ([#106](https://github.com/radix-ng/primitives/pull/106))
-
-## 0.11.1 (2024-09-10)
-
-
-### 🩹 Fixes
-
-- shadcn/ui accordion example ([ee300bb](https://github.com/radix-ng/primitives/commit/ee300bb))
-
-- animation in accordion-content.directive ([#94](https://github.com/radix-ng/primitives/pull/94))
-
-## 0.11.0 (2024-09-06)
-
-
-### 🚀 Features
-
-- radix documentation - Astro and MDX ([#69](https://github.com/radix-ng/primitives/pull/69))
-
-- accordion (#DS-2773) ([#92](https://github.com/radix-ng/primitives/pull/92))
-
-- **collapsible:** rename onOpenChange and added content attributes ([24baf80](https://github.com/radix-ng/primitives/commit/24baf80))
-
-
-### 🩹 Fixes
-
-- **radio-group:** added focusKeyManager ([#95](https://github.com/radix-ng/primitives/pull/95))
-
-## 0.10.0 (2024-08-21)
-
-
-### 🚀 Features
-
-- **primitives:** added rdx suffix for separator directive ([be5f9a5](https://github.com/radix-ng/primitives/commit/be5f9a5))
-
-
-### 🩹 Fixes
-
-- extend in trigger and menu + onEscapeKeyDown ([#86](https://github.com/radix-ng/primitives/pull/86))
-
-## 0.9.1 (2024-08-15)
-
-
-### 🩹 Fixes
-
-- use extend for CdkMenuItem ([#85](https://github.com/radix-ng/primitives/pull/85))
-
-## 0.9.0 (2024-08-13)
-
-
-### 🚀 Features
-
-- added stylelint support ([#64](https://github.com/radix-ng/primitives/pull/64))
-
-- added prettier support for ts files ([#80](https://github.com/radix-ng/primitives/pull/80))
-
-- added prettier support for mdx files ([#81](https://github.com/radix-ng/primitives/pull/81))
-
-- **primitives:** dropdown menu, added parameters – side, align and offsets ([#65](https://github.com/radix-ng/primitives/pull/65))
-
-- **primitives:** avatar - added prefix ([908bce1](https://github.com/radix-ng/primitives/commit/908bce1))
-
-- **primitives:** updated prefix and documentation ([a2e5d34](https://github.com/radix-ng/primitives/commit/a2e5d34))
-
-- **primitives:** dropdown menu ([#79](https://github.com/radix-ng/primitives/pull/79))
-
-## 0.8.2 (2024-07-20)
-
-
-### 🚀 Features
-
-- **primitives:** upd Checkbox added input primitive and upd docs for imdeterminate ([e7d1279](https://github.com/radix-ng/primitives/commit/e7d1279))
-
-- **shadcn:** updated checkbox indeterminate state ([497659d](https://github.com/radix-ng/primitives/commit/497659d))
-
-## 0.8.1 (2024-07-10)
-
-This was a version bump only for primitives to align it with other projects, there were no code changes.
-
-## 0.7.2 (2024-07-06)
-
-
-### 🚀 Features
-
-- added Menubar base primitive ([0db991f](https://github.com/radix-ng/primitives/commit/0db991f))
-
-- added Menu base primitive ([c7e395e](https://github.com/radix-ng/primitives/commit/c7e395e))
-
-- **menubar:** added MenuBar ([#44](https://github.com/radix-ng/primitives/pull/44))
-
-## 0.7.1 (2024-06-30)
-
-This was a version bump only for primitives to align it with other projects, there were no code changes.
-
-## 0.7.0 (2024-06-29)
-
-
-### 🚀 Features
-
-- **tabs:** added Tabs ([#38](https://github.com/radix-ng/primitives/pull/38))
-
-## 0.6.0 (2024-06-20)
-
-
-### 🚀 Features
-
-- based for Textarea ([fcd14e1](https://github.com/radix-ng/primitives/commit/fcd14e1))
-
-- added beta presence ([55b4a75](https://github.com/radix-ng/primitives/commit/55b4a75))
-
-- **alert-dialog:** poc code ([f314588](https://github.com/radix-ng/primitives/commit/f314588))
-
-## 0.5.0 (2024-04-26)
-
-
-### 🚀 Features
-
-- added Accordion primitive ([2e95121](https://github.com/radix-ng/primitives/commit/2e95121))
-
-- **toggle-group:** added Toggle Group primitive ([88a38d3](https://github.com/radix-ng/primitives/commit/88a38d3))
-
-
-### 🩹 Fixes
-
-- **label:** added setter for UniqueId ([774c82f](https://github.com/radix-ng/primitives/commit/774c82f))
-
-## 0.4.0 (2024-04-22)
-
-
-### 🚀 Features
-
-- **toggle:** added Toggle primitive ([f9a98dc](https://github.com/radix-ng/primitives/commit/f9a98dc))
-
-## 0.3.0 (2024-04-20)
-
-
-### 🚀 Features
-
-- added overlay and tooltip ([e993fb3](https://github.com/radix-ng/primitives/commit/e993fb3))
-
-- **avatar:** added primitive ([f76e8e9](https://github.com/radix-ng/primitives/commit/f76e8e9))
-
-## 0.2.0 (2024-04-16)
-
-### 🚀 Features
-
--   **radio:** added Radio Group ([f0b0eed](https://github.com/radix-ng/primitives/commit/f0b0eed))
-
-### 🩹 Fixes
-
--   **checkbox:** updated story and styles ([7999532](https://github.com/radix-ng/primitives/commit/7999532))
-
--   **styles:** radix variables ([532a6d1](https://github.com/radix-ng/primitives/commit/532a6d1))
-
-## 0.1.1 (2024-04-14)
-
-### 🩹 Fixes
-
--   nx release publish target ([a27032f](https://github.com/radix-ng/primitives/commit/a27032f))
-
-## 0.1.0 (2024-04-14)
-
-### 🚀 Features
-
--   **progress:** added progress meter ([17f3ffb](https://github.com/radix-ng/primitives/commit/17f3ffb))

package/accordion/__tests__/accordion-content.directive.spec.ts

@@ -1,8 +0,0 @@
-import { RdxAccordionContentDirective } from '../src/accordion-content.directive';
-
-xdescribe('RdxAccordionContentDirective', () => {
-    it('should create an instance', () => {
-        const directive = new RdxAccordionContentDirective();
-        expect(directive).toBeTruthy();
-    });
-});

package/accordion/__tests__/accordion-header.directive.spec.ts

@@ -1,8 +0,0 @@
-import { RdxAccordionHeaderDirective } from '../src/accordion-header.directive';
-
-xdescribe('RdxAccordionHeaderDirective', () => {
-    it('should create an instance', () => {
-        const directive = new RdxAccordionHeaderDirective();
-        expect(directive).toBeTruthy();
-    });
-});

package/accordion/__tests__/accordion-item.directive.spec.ts

@@ -1,8 +0,0 @@
-import { RdxAccordionItemDirective } from '../src/accordion-item.directive';
-
-xdescribe('RdxAccordionItemDirective', () => {
-    it('should create an instance', () => {
-        const directive = new RdxAccordionItemDirective();
-        expect(directive).toBeTruthy();
-    });
-});

package/accordion/__tests__/accordion-root.directive.spec.ts

@@ -1,8 +0,0 @@
-import { RdxAccordionRootDirective } from '../src/accordion-root.directive';
-
-xdescribe('RdxAccordionRootDirective', () => {
-    it('should create an instance', () => {
-        const directive = new RdxAccordionRootDirective();
-        expect(directive).toBeTruthy();
-    });
-});

package/accordion/__tests__/accordion-trigger.directive.spec.ts

@@ -1,8 +0,0 @@
-import { RdxAccordionTriggerDirective } from '../src/accordion-trigger.directive';
-
-xdescribe('RdxAccordionTriggerDirective', () => {
-    it('should create an instance', () => {
-        const directive = new RdxAccordionTriggerDirective();
-        expect(directive).toBeTruthy();
-    });
-});

package/accordion/index.ts

@@ -1,5 +0,0 @@
-export * from './src/accordion-content.directive';
-export * from './src/accordion-header.directive';
-export * from './src/accordion-item.directive';
-export * from './src/accordion-root.directive';
-export * from './src/accordion-trigger.directive';

package/accordion/ng-package.json

@@ -1,5 +0,0 @@
-{
-    "lib": {
-        "entryFile": "index.ts"
-    }
-}

package/accordion/src/accordion-content.directive.ts

@@ -1,46 +0,0 @@
-import { Directive, ElementRef, inject } from '@angular/core';
-import { RdxAccordionItemDirective } from './accordion-item.directive';
-
-@Directive({
-    selector: '[rdxAccordionContent]',
-    standalone: true,
-    exportAs: 'rdxAccordionContent',
-    host: {
-        '[attr.role]': '"region"',
-        '[style.display]': 'hidden ? "none" : ""',
-        '[attr.data-state]': 'item.dataState',
-        '[attr.data-disabled]': 'item.disabled',
-        '[attr.data-orientation]': 'item.orientation',
-        '(animationend)': 'onAnimationEnd()'
-    }
-})
-export class RdxAccordionContentDirective {
-    protected readonly item = inject(RdxAccordionItemDirective);
-    protected readonly nativeElement = inject(ElementRef).nativeElement;
-
-    protected hidden = false;
-
-    protected onAnimationEnd() {
-        this.hidden = !this.item.expanded;
-
-        const { height, width } = this.nativeElement.getBoundingClientRect();
-
-        this.nativeElement.style.setProperty('--radix-collapsible-content-height', `${height}px`);
-        this.nativeElement.style.setProperty('--radix-collapsible-content-width', `${width}px`);
-
-        this.nativeElement.style.setProperty(
-            '--radix-accordion-content-height',
-            'var(--radix-collapsible-content-height)'
-        );
-        this.nativeElement.style.setProperty(
-            '--radix-accordion-content-width',
-            'var(--radix-collapsible-content-width)'
-        );
-    }
-
-    onToggle() {
-        if (!this.item.expanded) {
-            this.hidden = false;
-        }
-    }
-}

package/accordion/src/accordion-header.directive.ts

@@ -1,15 +0,0 @@
-import { Directive, inject } from '@angular/core';
-import { RdxAccordionItemDirective } from './accordion-item.directive';
-
-@Directive({
-    selector: '[rdxAccordionHeader]',
-    standalone: true,
-    host: {
-        '[attr.data-state]': 'item.dataState',
-        '[attr.data-disabled]': 'item.disabled',
-        '[attr.data-orientation]': 'item.orientation'
-    }
-})
-export class RdxAccordionHeaderDirective {
-    protected readonly item = inject(RdxAccordionItemDirective);
-}