* Close dialog on navigation.
* web: update dialog, form, and sidebar styles with logical properties and scroll shadows
Migrate dialog padding CSS variables from physical (top/right/bottom/left) to logical
(block-start/inline-end/block-end/inline-start) naming. Add scroll shadow utility
class (ak-m-scroll-shadows) for scrollable regions. Rework radio input and form
control styles including transparent backgrounds, checkbox-style indicators, and
improved hover states. Refactor FormGroup marker to use CSS custom properties for
open/closed states. Move sidebar padding from nav container to scrollable list.
* web: refine elements and components for accessibility, type safety, and consistency
Add ARIA role and label to dialog body, apply scroll shadow classes to modal body,
sidebar nav, and wizard main. Update ak-status-label to support tri-state
(good/bad/null) rendering with ts-pattern matching and a neutral label. Simplify
FormGroup by removing wrapper div around default slot, adding part attributes for
header styling, and changing description to nullable type. Clean up LogViewer and
StaticTable with proper access modifiers, override annotations, and nullable item
types. Simplify ak-switch-input checked binding and remove unused slot attribute
from ak-radio-input help text.
* web: modernize application pages with modalInvoker and updated form patterns
Refactor ApplicationCheckAccessForm to use static form metadata properties
(verboseName, submitVerb, createLabel), formatAPISuccessMessage, and a private
CoreApi instance. Migrate ApplicationViewPage from ak-forms-modal slots to the
modalInvoker directive for both edit and check-access actions. Accept nullable
input in createPaginatedResponse for better null-safety. Fix casing of dropdown
menu items in ApplicationListPage.
* web: migrate remaining view pages to modalInvoker (#21592)
* Fix visibility check, search params.
* Add scroll shadow.
* Partial revert of input layout.
* Tidy groups.
* Fix check access form invoker, styles.
* Optional sizing.
* Lowercase
* Revise checkbox style.
* Close dialog on navigation.
* Fix padding.
* Touch up shadow heights.
* Migrate remaining view pages to modalInvoker, add e2e coverage.
* Fix alignment.
* Fix click handler, add placeholders.
* Fix issue where form field is not serialized.
* web/elements: rename hasSlotted to findSlotted and refactor host styles
Rename the slot-inspection helper on `AKElement` from `hasSlotted` to
`findSlotted` and return the first matching element rather than a
boolean, so callers can both check for presence and reach the node.
Update every call site in the tree (default callers pass no argument
instead of `null`).
Along the way, tidy `AKElement`'s host-style plumbing: expose
`hostStyles` as a getter/setter backed by a `CSSStyleSheet` cache and
move the adoption logic into `attachHostStyles` / `detachHostStyles`
class methods, so subclasses can share the lifecycle. Drop the now
unused `@localized` decorator import.
Also add a `findAssignedSlot` helper in `elements/utils/slots.ts` for
light-DOM → slot lookups, and give `EmptyState` an explicit
`display: block` so empty-state placement doesn't collapse when
wrapped.
* web/chips: tighten chip group rendering and add placeholder class
Make `ChipGroup` generic over its chip value type, expose a
`placeholder` property that renders an inline placeholder when the
default slot is empty, and intercept clicks that land on child chips
so outer handlers can tell "clicked the group" apart from "clicked a
chip". Give the host an explicit `display: block` so the group
participates in layout correctly.
Move the removal tooltip on `Chip` to the right so it doesn't clip at
the top of the row.
In `base/common.css`, add the `ak-m-placeholder` class used by the
new chip-group placeholder and extend `.ak-fade-in` with an opt-in
`ak-m-delayed` modifier that animates height alongside the fade via
`interpolate-size`, so loading cards can slide in without jank.
* web/elements: add scrollbar helpers and polish table styles
Introduce `elements/utils/scrollbars.ts` with `measureScrollbarWidth`
and `applyScrollbarClass`, and call it from `Interface` so the root
document picks up `ak-m-visible-scrollbars` / `ak-m-overlay-scrollbars`
depending on the platform. Add an `ak-m-thin-scrollbar` selector to
the thin-scrollbar rule in `base/scrollbars.css` so ad-hoc containers
can opt in.
Refresh `Table.css`: expose `search-form`, `search-input`,
`pagination-bottom`, and `table` parts; introduce
`--ak-c-table--expandable-overlay--Color` theming for expandable rows
(including a nested-table background pass); add an
`ak-c-table__actions` helper so per-row action buttons wrap
consistently; and teach the host to honor `display-box="contents"` so
tables embedded in `display: contents` parents still participate in
layout checks.
Drop the unused `elements/utils/isVisible.ts`; the only live
`isVisible` helpers live beside their callers under SearchSelect.
* web/buttons: support split-button Dropdown layout
Teach `ak-dropdown` to recognize a PatternFly split-button toggle —
look for `.pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button:last-child`
first and fall back to the single-button selector — so a primary
action and a menu trigger can coexist in one dropdown. Drop the
workaround that skipped wiring menu-item click handlers: now that
dropdowns live inside native dialogs, letting a menu-item click
bubble no longer closes the parent modal. Switch the private fields
to `protected` so subclasses can reach them, and anchor the
AKRefreshEvent and outside-click listeners at `window` explicitly
(matching the new `@listen` default).
In `@listen`, flip the default target from `window` to `this`. A
component's own element is the more intuitive default for a decorator
attached to an instance method, and call sites that want the window
now opt in explicitly.
Extend `Dropdown/dropdown.css` with `--pf-c-dropdown__toggle--*`
padding variables so split-button variants get consistent spacing.
* web/forms: improve form ARIA scaffolding and tighten group styles
Add a sticky `ak-c-form__header` row to `Form.css` with a
`form-actions` part so form headers can host an inline title and
action cluster without each form reinventing the layout.
In `Form/form.css`, add a `.ak-m-content-center` variant for forms
that center their body inside a fixed-size container, and introduce a
PatternFly-compatible grid-based Radio label so the input and its
description align cleanly and the whole row is clickable.
Tighten the `FormGroup` summary spacing (use `spacer--sm` inline and
`spacer-xs` block) and hoist the high-contrast overrides onto the
open group so the details marker stays aligned.
Make `AKControlElement` abstract (requiring a `name`), rename
`isValid` → `valid`, declare it as implementing the new
`FormField<T>` interface, and mark it deprecated in favor of
`FormAssociatedElement`. Make `FormField` generic over the JSON
value type, extend `HTMLElement`, and drop the `Jsonifiable` runtime
import in favor of a type-only import. `HorizontalFormElement` now
searches for either legacy control elements or the new `FormField`
shape when picking its focus target.
* web/elements: migrate modal plumbing to the native <dialog> element
Replace the bespoke modal stack with an `<ak-modal>` built on the
browser's native `<dialog>`, and collect every piece of the new
infrastructure under `#elements/dialogs`:
* `ak-modal.ts` / `ak-modal.css` — the element + its PatternFly
compatible styles.
* `dialog.css` — the global `ak-c-dialog` token and backdrop rules,
imported via the new `components/Modal/modal.css` entry point
(replacing the old `base/modal.css` import in `base.css` and
`interface.global.css`).
* `shared.ts` — the `TransclusionChildElement` /
`TransclusionChildSymbol` contract plus the parent-side helpers
(`isTransclusionParentElement`, `slottedElementUpdatedAt`), so
forms and tables hosted inside a modal can signal re-render hints
to the dialog wrapper.
* `directives.ts` / `invokers.ts` / `utils.ts` — the
`modalInvoker`, `renderModal`, and `DialogInit` helpers that
declarative call sites use to open a modal from a button without
imperatively mounting the element.
* `components/` — the ready-made invoker buttons
(`ModalInvokerButton`, `IconEditButton`, `IconEditButtonByTagName`,
`IconPermissionButton`) and the `components.ts` barrel.
* `components/Modal/modal.css` — the short host wrapper that pulls
`dialog.css` into the bundled base stylesheet chain.
Rewire the existing modal consumers to use the new contract:
* `Form` now implements `TransclusionChildElement`, exposes
`verboseName`/`verboseNamePlural`/`createLabel`/`submitVerb`
statics, tracks visibility via `intersectionObserver`, and
forwards `asModalInvoker` / `showModal` through the new
`modalInvoker` / `renderModal` helpers. `ModalForm` and
`ModelForm` follow the same shape. `ModalButton` drops its own
`pf-c-modal-box` padding fix (the dialog handles it).
* `Table` implements `TransclusionChildElement`, dispatches refresh
via `AKRefreshEvent`, and exposes `display-box="contents"` so
tables embedded in dialogs participate in layout checks.
`TablePage` / `TableSearch` widen types and surface `search-form`
/ `search-input` parts for dialog-scoped styling.
* `ak-about-modal`, `ObjectPermissionModal`,
`RACLaunchEndpointModal`, the command palette, and the admin/user
interface roots all move off `#elements/modals` and onto
`#elements/dialogs`.
* `AdminSettingsForm` / `AdminSettingsPage` render their header /
actions through the new `ak-c-form__header` + `form-actions`
slots introduced in the prior Form CSS commit, and swap the
outermost `<section>` for `<main>` for better landmark semantics.
* `elements/utils/render-roots.ts` and
`elements/utils/unsafe.ts` gain dialog-aware helpers (notably a
directive-based replacement for the old `unsafe` builder).
* `base/globals.css` disables overscroll while any dialog is open
via `html[data-dialog-count]`; `package.json` adds the
`#elements/dialogs` barrel alias.
Delete the old `elements/modals/` directory (`ak-modal.ts`,
`shared.ts`, `styles.css`, `utils.ts`) and `styles/authentik/base/modal.css`
now that nothing imports them.
* web/wizards: refactor wizards to dialog-based flow
Rebuild the shared Wizard primitives on top of the new <dialog> contract:
split CreateWizard/utils out of Wizard, rename admin *Wizard.ts entry
points to ak-*-wizard.ts (Policy, Provider, Source, Stage,
PropertyMapping, ServiceConnection), and port the Application wizard
steps to the new WizardStep base. Adds the user wizard and recovery
invoker plus the refreshed Wizard component styles.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* web/admin: migrate forms and list pages to dialog-based modals
Port every admin form, list page, and RBAC surface to the new
TransclusionChildElement / asModalInvoker contract introduced with the
native <dialog> migration. Replace the old ModalButton-driven helpers
with the new modalInvoker/renderModal flow, add the shared
IconCopyButton/IconTokenCopyButton/IconEnrollmentTokenCopyButton
components (with .ak-c-button--icon__progress styling), and refresh
messages, notifications, flow inspector, and user portal consumers to
match. Includes small common/element utility updates picked up along
the way.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* web/test: update browser e2e tests for dialog-based flow
Adjust application, group, session, and user browser tests to the new
wizard and modal selectors introduced by the <dialog> migration and
relax a handful of timeouts that were tight against the old
ModalButton animation sequence.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* Fix visibility detection.
* Fix layout, behavior.
* Fix type.
* Flesh out test revisions.
* Fix type.
* Format.
* Use plural path.
* Fix strict selector in Safari.
* Remove unused.
* Spellcheck.
* Partial type fix.
* Fix translation.
---------
Co-authored-by: Teffen Ellis <592134+GirlBossRush@users.noreply.github.com>
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
* web: Fix numeric values in search select inputs.
* web: Fix ARIA attributes on menu items.
* web: Fix issues surrounding nested modal actions, selectors, labels.
* web: Prepare group forms for testing, ARIA, etc.
* web: Clarify when spinner buttons are busy.
* web: Fix dark theme toggle input visibility.
* web: Fix issue where tests complete before optional search inputs load.
* web: Add user creation tests, group creation. Flesh out fixtures.
