@raqm/ui 0.0.0-stage → 0.1.1

package/CHANGELOG.md

@@ -0,0 +1,22 @@
+# Changelog
+
+All notable changes to `@raqm/ui` are recorded here. The format follows
+[Keep a Changelog](https://keepachangelog.com/en/1.1.0/) and the project follows
+[Semantic Versioning](https://semver.org/spec/v2.0.0.html). Before `1.0.0`, minor
+releases may include breaking changes.
+
+## [0.1.1] - 2026-11-13
+
+### Fixed
+
+- Align the default dialog close control with the title and content edge, and move
+  Dialog and Alert Dialog to a consistent spacing rhythm (24px surface and footer
+  padding for both, 12px title-to-description gap in Dialog) instead of relying on
+  user-agent heading margins. The command dialog keeps its close control on the search
+  row.
+
+## [0.1.0] - 2026-11-04
+
+### Added
+
+- Initial public release of Raqm UI, an Angular UI library with its own design and API.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Raqm UI contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/NOTICE.md

@@ -0,0 +1,28 @@
+# Notices
+
+## shadcn/ui
+
+Raqm UI's early visual direction was informed by [shadcn/ui](https://ui.shadcn.com),
+specifically its **Nova** style. shadcn/ui is distributed under the MIT License,
+Copyright (c) 2023 shadcn.
+
+The reference checkout used during that work was the shadcn/ui v4 monorepo, identified by
+these package versions:
+
+- `shadcn` 4.21.4 (`packages/shadcn`)
+- `@shadcn/react` 0.3.1 (`packages/react`)
+- `@shadcn/registry` 0.1.3 (`packages/registry`)
+
+The checkout is not tracked in this repository. To retrieve the same source, check out
+[shadcn-ui/ui](https://github.com/shadcn-ui/ui) at the release or commit that publishes
+those versions.
+
+Raqm UI does not include or bundle shadcn/ui source code. The components are implemented
+from scratch for Angular with the Angular CDK, and Raqm UI's design and API are its own;
+shadcn/ui was an early reference, not a parity target. The attribution is kept because the
+initial visual direction and several token values were derived from that reference.
+
+## Angular
+
+Raqm UI is built on Angular and the Angular CDK, both distributed under the MIT
+License, Copyright (c) 2010-2026 Google LLC.

package/README.md

@@ -1,3 +1,126 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+# Raqm UI
+
+UI components with Raqm's own design and APIs,
+implemented natively for Angular with the Angular CDK. Standalone components and
+directives, signal inputs and outputs, light/dark themes and first-class RTL.
+
+- **Status:** pre-1.0 — the component API may still change in minor releases.
+- **Angular:** 22.2 (peer dependency), Angular CDK 22.2, `@angular/forms` for the
+  form controls.
+- **Styles:** plain CSS custom properties and SCSS. No Tailwind, no React, no runtime
+  copy of shadcn/ui.
+
+## Install
+
+```sh
+npm install @raqm/ui @angular/cdk
+```
+
+`@angular/core`, `@angular/common` and `@angular/forms` are peer dependencies and
+are expected to come from your application.
+
+## Load the theme
+
+Load the CDK overlay stylesheet first, then the package theme, then your own styles:
+
+```jsonc
+// angular.json -> projects.<app>.architect.build.options.styles
+"styles": [
+  "@angular/cdk/overlay-prebuilt.css",
+  "@raqm/ui/theme.css",
+  "src/styles.scss"
+]
+```
+
+Import the components you use from their own entrypoint. Focused subpaths keep each
+lazy route from pulling the whole library into its bundle:
+
+```ts
+import { Component } from '@angular/core';
+import { RaqmButton } from '@raqm/ui/button';
+import { RaqmCard } from '@raqm/ui/card';
+
+@Component({
+  selector: 'app-example',
+  imports: [RaqmButton, RaqmCard],
+  template: `
+    <raqm-card>
+      <raqm-card-header>
+        <h3 raqm-card-title>Monthly report</h3>
+      </raqm-card-header>
+      <raqm-card-content>
+        <button raqm-button="outline" type="button">Download</button>
+      </raqm-card-content>
+    </raqm-card>
+  `,
+})
+export class ExampleComponent {}
+```
+
+The root import (`from '@raqm/ui'`) aggregates the historically root-exported
+families. Attachment, Calendar, Carousel, Resizable, and Questionnaire remain
+subpath-only. Prefer focused subpaths in application code.
+
+## Themes
+
+The theme ships light and dark scopes and follows `prefers-reduced-motion`:
+
+| Scope                       | Effect                                     |
+| --------------------------- | ------------------------------------------ |
+| `:root`                     | light theme (default)                      |
+| `[data-raqm-theme="light"]` | explicit light island inside a dark app    |
+| `[data-raqm-theme="dark"]`  | dark theme for the element and its subtree |
+
+All design tokens are `--raqm-*` custom properties, so an application can override
+them in its own stylesheet after the package theme loads. Components use logical CSS
+properties, so `dir="rtl"` mirrors layouts without extra overrides.
+
+## Entrypoints
+
+| Area                 | Subpaths                                                                                                                                                                                                                |
+| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Form controls        | `button`, `button-group`, `input`, `checkbox`, `switch`, `textarea`, `label`, `radio-group`, `native-select`, `field`, `input-group`, `input-otp`, `select`, `combobox`, `slider`, `calendar`, `toggle`, `toggle-group` |
+| Layout and content   | `card`, `item`, `table`, `sidebar`, `pagination`, `breadcrumb`, `empty`, `attachment`, `resizable`, `scroll-area`                                                                                                       |
+| Overlays             | `dialog`, `alert-dialog`, `drawer`, `sheet`, `popover`, `hover-card`, `tooltip`, `toast`, `command`                                                                                                                     |
+| Menus and disclosure | `dropdown-menu`, `context-menu`, `menubar`, `navigation-menu`, `accordion`, `collapsible`, `tabs`                                                                                                                       |
+| Display              | `badge`, `avatar`, `spinner`, `kbd`, `separator`, `skeleton`, `aspect-ratio`                                                                                                                                            |
+| Feedback             | `alert`, `progress`, `questionnaire`                                                                                                                                                                                    |
+| Media                | `carousel` (bundles `embla-carousel`)                                                                                                                                                                                   |
+
+Multipart families provide one readonly Angular template dependency array:
+
+```ts
+import { RaqmCard } from '@raqm/ui/card';
+// Use imports: [RaqmCard] to enable the Card template parts.
+```
+
+Single-piece controls export their class directly, for example `RaqmInput` from
+`@raqm/ui/input`. Use actual `Component`/`Directive` suffixed declarations for
+instance queries, injection, and inheritance—not a family array. Services and
+data types remain separately exported. The former `/controls` and `/display`
+entrypoints are removed; Toggle Group now uses `/toggle-group`. This is an
+intentional pre-release breaking import migration, without compatibility aliases.
+
+Attachment, Calendar, Carousel, Resizable, and Questionnaire are secondary-only;
+the root aggregate preserves its historical family boundary.
+
+## Accessibility
+
+Components are authored with keyboard and screen-reader semantics in hand: the dialog
+family warns in development when no accessible name is provided, focus is moved and
+restored through the CDK, and interactive parts expose their state through ARIA.
+Overlay panes render in a CDK overlay; load `@angular/cdk/overlay-prebuilt.css` as
+shown above.
+
+## Component guides
+
+Every component page in the docs app pairs a Markdown guide with live examples and
+copy-ready code. Browse all 55 pages under
+[Raqm-UI-demo/src/app/pages](https://github.com/KeyLitDev/RaqmUI/tree/main/Raqm-UI-demo/src/app/pages).
+
+## License
+
+MIT — see [LICENSE](https://github.com/KeyLitDev/RaqmUI/blob/main/LICENSE).
+
+For attribution, see
+[NOTICE.md](https://github.com/KeyLitDev/RaqmUI/blob/main/NOTICE.md).

package/combobox/README.md

@@ -0,0 +1,17 @@
+# Combobox data and templates
+
+`items` accepts a mixture of `RaqmComboboxOption` and `RaqmComboboxGroup` entries. A group has a `label` and an `options` array. Values must be unique across all entries, including groups. Filtering uses option labels, hides groups with no matching options, and preserves entry order. As in the existing single-value behavior, a query equal to the selected label shows all options. Group labels are not selectable.
+
+Set `separatorBefore` on a group to draw a nonselectable separator before it when a preceding entry is visible. Empty filtered groups and leading separators are omitted.
+
+In single-value modes, a disabled selected option cannot be cleared or replaced by the user; programmatic value writes remain available.
+
+For inline mode, project an `ng-template[raqm-combobox-prefix]` to render passive content in the input group's start addon. Other modes ignore it. Mark decorative icons `aria-hidden="true"`; provide the combobox's accessible label separately.
+
+`popupWidth` accepts a CSS width string; by default the popup follows its anchor's width. `popupAlignOffset` is a number of CSS pixels along the logical inline axis: negative moves toward inline-start, including in RTL. For the input-group reference, use `popupWidth="15rem"` and `[popupAlignOffset]="-28"`. The existing minimum width and viewport collision constraints still apply. Both inputs apply in every mode and can change while open.
+
+While open, direction updates follow the `dir` input, CDK direction changes, viewport resize, and `dir`, `class`, or `style` attribute changes on the host or its existing ancestors. Stylesheet-only changes without those events and reparenting the host while open are not observed; reopening resolves direction again.
+
+Project an `ng-template[raqm-combobox-item]` to customize option content in any mode. Its implicit value and `item` are the option; `selected` and `active` are booleans. The component retains the option role, selection state and accessible name from `item.label`; filtering and selected labels also use that label. Template content must be noninteractive, without nested buttons, links, inputs or focusable elements.
+
+For meaningful secondary content, set the option's `description` to the corresponding text. It is exposed as an accessible description without changing the option name or filtering; render the visible description in the item template if desired.

package/fesm2022/raqm-ui-accordion.mjs

@@ -0,0 +1,414 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, DestroyRef, Directive, InjectionToken, booleanAttribute, computed, inject, input, isDevMode, model, signal } from "@angular/core";
+const RAQM_ACCORDION = new InjectionToken("RaqmAccordion");
+const RAQM_ACCORDION_ITEM = new InjectionToken("RaqmAccordionItem");
+var RaqmAccordionComponent = class RaqmAccordionComponent {
+	multiple = input(false, {
+		...ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	value = model([], ...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	defaultValue = input([], ...ngDevMode ? [{ debugName: "defaultValue" }] : /* istanbul ignore next */ []);
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	items = signal([], ...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	interacted = signal(false, ...ngDevMode ? [{ debugName: "interacted" }] : /* istanbul ignore next */ []);
+	openValues = computed(() => {
+		const bound = this.value();
+		if (bound.length > 0 || this.interacted()) return bound;
+		const seed = this.defaultValue();
+		return this.multiple() ? seed : seed.slice(0, 1);
+	}, ...ngDevMode ? [{ debugName: "openValues" }] : /* istanbul ignore next */ []);
+	isOpen(value) {
+		const current = this.openValues();
+		return this.multiple() ? current.includes(value) : current[0] === value;
+	}
+	toggle(value) {
+		if (this.disabled()) return;
+		const current = this.openValues();
+		this.interacted.set(true);
+		if (this.multiple()) {
+			this.value.set(current.includes(value) ? current.filter((open) => open !== value) : [...current, value]);
+			return;
+		}
+		this.value.set(current[0] === value ? [] : [value]);
+	}
+	register(item) {
+		if (isDevMode() && this.items().some((registered) => registered.value === item.value)) console.error(`[raqm-accordion] Duplicate item value "${item.value}"; Accordion item values must be unique.`);
+		this.items.update((items) => [...items, item]);
+	}
+	unregister(item) {
+		this.items.update((items) => items.filter((registered) => registered !== item));
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmAccordionComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.2",
+		type: RaqmAccordionComponent,
+		isStandalone: true,
+		selector: "raqm-accordion",
+		inputs: {
+			multiple: {
+				classPropertyName: "multiple",
+				publicName: "multiple",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			defaultValue: {
+				classPropertyName: "defaultValue",
+				publicName: "defaultValue",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { value: "valueChange" },
+		host: { classAttribute: "raqm-accordion" },
+		providers: [{
+			provide: RAQM_ACCORDION,
+			useExisting: RaqmAccordionComponent
+		}],
+		ngImport: i0,
+		template: "<ng-content />",
+		isInline: true,
+		styles: [":host{display:flex;flex-direction:column;inline-size:100%}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmAccordionComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "raqm-accordion",
+			template: "<ng-content />",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: { class: "raqm-accordion" },
+			providers: [{
+				provide: RAQM_ACCORDION,
+				useExisting: RaqmAccordionComponent
+			}],
+			styles: [":host{display:flex;flex-direction:column;inline-size:100%}\n"]
+		}]
+	}],
+	propDecorators: {
+		multiple: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "multiple",
+				required: false
+			}]
+		}],
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["valueChange"]
+		}],
+		defaultValue: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "defaultValue",
+				required: false
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}]
+	}
+});
+let nextAccordionItemId = 0;
+var RaqmAccordionItemComponent = class RaqmAccordionItemComponent {
+	accordion = inject(RAQM_ACCORDION, { optional: true });
+	destroyRef = inject(DestroyRef);
+	value = input.required(...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	disabled = input(false, {
+		...ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	instanceId = `raqm-accordion-item-${++nextAccordionItemId}`;
+	triggerId = `${this.instanceId}-trigger`;
+	contentId = `${this.instanceId}-content`;
+	effectiveDisabled = computed(() => this.disabled() || (this.accordion?.disabled() ?? false), ...ngDevMode ? [{ debugName: "effectiveDisabled" }] : /* istanbul ignore next */ []);
+	open = computed(() => this.accordion?.isOpen(this.value()) ?? false, ...ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []);
+	ref = (() => {
+		const self = this;
+		return { get value() {
+			return self.value();
+		} };
+	})();
+	constructor() {
+		if (isDevMode() && this.accordion === null) console.error("[raqm-accordion-item] No parent <raqm-accordion> found; the item has no open state.");
+		this.destroyRef.onDestroy(() => this.accordion?.unregister(this.ref));
+	}
+	ngOnInit() {
+		this.accordion?.register(this.ref);
+	}
+	toggle() {
+		if (this.effectiveDisabled()) return;
+		this.accordion?.toggle(this.value());
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmAccordionItemComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.2",
+		type: RaqmAccordionItemComponent,
+		isStandalone: true,
+		selector: "raqm-accordion-item",
+		inputs: {
+			value: {
+				classPropertyName: "value",
+				publicName: "value",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			disabled: {
+				classPropertyName: "disabled",
+				publicName: "disabled",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			properties: {
+				"attr.data-raqm-state": "open() ? \"open\" : \"closed\"",
+				"attr.data-raqm-disabled": "effectiveDisabled() ? \"\" : null"
+			},
+			classAttribute: "raqm-accordion-item"
+		},
+		providers: [{
+			provide: RAQM_ACCORDION_ITEM,
+			useExisting: RaqmAccordionItemComponent
+		}],
+		ngImport: i0,
+		template: "<ng-content />",
+		isInline: true,
+		styles: [":host{display:block}:host(:not(:last-child)){border-block-end:1px solid var(--raqm-border)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmAccordionItemComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "raqm-accordion-item",
+			template: "<ng-content />",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "raqm-accordion-item",
+				"[attr.data-raqm-state]": "open() ? \"open\" : \"closed\"",
+				"[attr.data-raqm-disabled]": "effectiveDisabled() ? \"\" : null"
+			},
+			providers: [{
+				provide: RAQM_ACCORDION_ITEM,
+				useExisting: RaqmAccordionItemComponent
+			}],
+			styles: [":host{display:block}:host(:not(:last-child)){border-block-end:1px solid var(--raqm-border)}\n"]
+		}]
+	}],
+	ctorParameters: () => [],
+	propDecorators: {
+		value: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "value",
+				required: true
+			}]
+		}],
+		disabled: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "disabled",
+				required: false
+			}]
+		}]
+	}
+});
+var RaqmAccordionTriggerDirective = class RaqmAccordionTriggerDirective {
+	item = inject(RAQM_ACCORDION_ITEM, { optional: true });
+	open = computed(() => this.item?.open() ?? false, ...ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []);
+	effectiveDisabled = computed(() => this.item?.effectiveDisabled() ?? false, ...ngDevMode ? [{ debugName: "effectiveDisabled" }] : /* istanbul ignore next */ []);
+	triggerId = computed(() => this.item?.triggerId ?? null, ...ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []);
+	contentId = computed(() => this.item?.contentId ?? null, ...ngDevMode ? [{ debugName: "contentId" }] : /* istanbul ignore next */ []);
+	constructor() {
+		if (isDevMode() && this.item === null) console.error("[raqm-accordion-trigger] No parent <raqm-accordion-item> found; the trigger cannot toggle a panel.");
+	}
+	onClick() {
+		if (!this.effectiveDisabled()) this.item?.toggle();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmAccordionTriggerDirective,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Directive
+	});
+	static ɵdir = i0.ɵɵngDeclareDirective({
+		minVersion: "14.0.0",
+		version: "22.2.2",
+		type: RaqmAccordionTriggerDirective,
+		isStandalone: true,
+		selector: "button[raqm-accordion-trigger]",
+		host: {
+			attributes: { "type": "button" },
+			listeners: { "click": "onClick()" },
+			properties: {
+				"attr.id": "triggerId()",
+				"attr.aria-expanded": "open() ? \"true\" : \"false\"",
+				"attr.aria-controls": "contentId()",
+				"attr.aria-disabled": "effectiveDisabled() ? \"true\" : null"
+			},
+			classAttribute: "raqm-accordion-trigger"
+		},
+		ngImport: i0
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmAccordionTriggerDirective,
+	decorators: [{
+		type: Directive,
+		args: [{
+			selector: "button[raqm-accordion-trigger]",
+			host: {
+				class: "raqm-accordion-trigger",
+				type: "button",
+				"[attr.id]": "triggerId()",
+				"[attr.aria-expanded]": "open() ? \"true\" : \"false\"",
+				"[attr.aria-controls]": "contentId()",
+				"[attr.aria-disabled]": "effectiveDisabled() ? \"true\" : null",
+				"(click)": "onClick()"
+			}
+		}]
+	}],
+	ctorParameters: () => []
+});
+var RaqmAccordionContentComponent = class RaqmAccordionContentComponent {
+	item = inject(RAQM_ACCORDION_ITEM, { optional: true });
+	open = computed(() => this.item?.open() ?? true, ...ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []);
+	contentId = computed(() => this.item?.contentId ?? null, ...ngDevMode ? [{ debugName: "contentId" }] : /* istanbul ignore next */ []);
+	triggerId = computed(() => this.item?.triggerId ?? null, ...ngDevMode ? [{ debugName: "triggerId" }] : /* istanbul ignore next */ []);
+	constructor() {
+		if (isDevMode() && this.item === null) console.error("[raqm-accordion-content] No parent <raqm-accordion-item> found; the content cannot know its open state.");
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.2",
+		ngImport: i0,
+		type: RaqmAccordionContentComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "14.0.0",
+		version: "22.2.2",
+		type: RaqmAccordionContentComponent,
+		isStandalone: true,
+		selector: "raqm-accordion-content",
+		host: {
+			attributes: { "role": "region" },
+			properties: {
+				"attr.id": "contentId()",
+				"attr.aria-labelledby": "triggerId()",
+				"attr.data-raqm-state": "open() ? \"open\" : \"closed\"",
+				"attr.inert": "open() ? null : \"\""
+			},
+			classAttribute: "raqm-accordion-content"
+		},
+		ngImport: i0,
+		template: "<div class=\"raqm-accordion-content-inner\"><ng-content /></div>",
+		isInline: true,
+		styles: [":host{display:grid;grid-template-rows:0fr;overflow:hidden;font-size:var(--raqm-font-size-sm);line-height:calc(var(--raqm-spacing) * 5);transition:grid-template-rows var(--raqm-duration-slow) var(--raqm-ease-out)}:host([data-raqm-state=open]){grid-template-rows:1fr}.raqm-accordion-content-inner{min-block-size:0;overflow:hidden}.raqm-accordion-content-inner:after{content:\"\";display:block;block-size:calc(var(--raqm-spacing) * 2.5)}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.2",
+	ngImport: i0,
+	type: RaqmAccordionContentComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "raqm-accordion-content",
+			template: "<div class=\"raqm-accordion-content-inner\"><ng-content /></div>",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "raqm-accordion-content",
+				role: "region",
+				"[attr.id]": "contentId()",
+				"[attr.aria-labelledby]": "triggerId()",
+				"[attr.data-raqm-state]": "open() ? \"open\" : \"closed\"",
+				"[attr.inert]": "open() ? null : \"\""
+			},
+			styles: [":host{display:grid;grid-template-rows:0fr;overflow:hidden;font-size:var(--raqm-font-size-sm);line-height:calc(var(--raqm-spacing) * 5);transition:grid-template-rows var(--raqm-duration-slow) var(--raqm-ease-out)}:host([data-raqm-state=open]){grid-template-rows:1fr}.raqm-accordion-content-inner{min-block-size:0;overflow:hidden}.raqm-accordion-content-inner:after{content:\"\";display:block;block-size:calc(var(--raqm-spacing) * 2.5)}\n"]
+		}]
+	}],
+	ctorParameters: () => []
+});
+const RaqmAccordion = [
+	RaqmAccordionComponent,
+	RaqmAccordionItemComponent,
+	RaqmAccordionTriggerDirective,
+	RaqmAccordionContentComponent
+];
+export { RaqmAccordion, RaqmAccordionComponent, RaqmAccordionContentComponent, RaqmAccordionItemComponent, RaqmAccordionTriggerDirective };
+
+//# sourceMappingURL=raqm-ui-accordion.mjs.map