@aglyn/plugins-mui 1.0.0-beta.143

package/src/lib/components/screen-link.js

@@ -0,0 +1,324 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import * as Aglyn from "@aglyn/aglyn";
+import { mdiLinkVariant } from "@aglyn/shared-data-mdi";
+import { AppLink } from "@aglyn/shared-ui-jsx";
+import Button from "@mui/material/Button";
+import Link from "@mui/material/Link";
+import { forwardRef } from "react";
+import { BUNDLE_ID } from "../constants/bundle-common.js";
+import { FIELD_COLOR, FIELD_FULL_WIDTH, FIELD_LINK_TARGET, FIELD_LINK_TARGET_NAME, FIELD_SIZE, FIELD_TEXT_CONTENT } from "../constants/field-presets.js";
+import { withAuthorHtmlLabel } from "../utils/author-html-label.js";
+import { dropClearedProps } from "../utils/drop-cleared-props.js";
+import { generatePresetId } from "../utils/generate-preset-id.js";
+import { linkTargetProps } from "../utils/link-target-props.js";
+// Component ids are persisted in screen documents; never rename.
+export const ID = 'muiScreenLink';
+/**
+ * What a button-styled LINK renders as with nothing to point at (canvas,
+ * preview, unresolved screen). `role: undefined` is the load-bearing half:
+ * MUI's `ButtonBase` stamps `role="button"` onto any non-`<button>` root,
+ * and merges the caller's props AFTER its own, so an explicit `undefined`
+ * is what removes it.
+ */ const STYLED_LINK_PLACEHOLDER = {
+    component: 'span',
+    role: undefined
+};
+/**
+ * Link that targets a screen by id, never a hardcoded path. Degrades to a
+ * plain button when the id doesn't resolve (unpublished/deleted screen) and
+ * when navigation is suppressed (besigner canvas, preview).
+ *
+ * `renderAs="link"` renders MUI's `Link` instead of `Button` (AGL-1195).
+ * Footer and inline navigation are *text*: as buttons they inherit button
+ * typography, uppercase transforms and the wrong role for assistive tech.
+ * The button-only props are dropped in that mode rather than passed through
+ * — `variant` means the typography variant on a `Link`, so forwarding
+ * `"contained"` would silently produce an unstyled element.
+ *
+ * `renderAs="linkButton"` splits the two halves that used to travel together
+ * (AGL-1347). A pill row whose chips all navigate — docs URLs, `mailto:`,
+ * social profiles — is a legitimate design, but every chip announced as a
+ * button, which tells a screen-reader user to expect an action and costs
+ * them the link-list and open-in-new-tab affordances. This mode keeps the
+ * button's `variant`/`size`/`fullWidth` and drops the role, exactly as MUI's
+ * own `Button component={Link}` does. It is a THIRD value rather than
+ * `variant` becoming live in `"link"` mode, because a node switched to Text
+ * link keeps whatever `variant` it was authored with (the shipped preset is
+ * `variant: 'outlined'`) — honouring those would repaint the site's nav and
+ * footer as outlined pills.
+ */ const ScreenLink = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { screenId, href: externalHref, renderAs, target, targetName, html } = props, spread = _object_without_properties_loose(props, [
+        "screenId",
+        "href",
+        "renderAs",
+        "target",
+        "targetName",
+        "html"
+    ]);
+    // A CLEARED attribute persists as null, and null is not "use the default"
+    // in React — `color={null}` reaches MUI, which capitalizes it and throws
+    // error #7 during SSR, 500ing the page (AGL-1226). This is the site's
+    // most-used element (70–77 nodes per page), so the guard runs BEFORE
+    // `variant`/`size`/`fullWidth` are split out: they are forwarded as named
+    // attributes, and guarding only the spread would leave those three exposed.
+    //
+    // The formatted label (AGL-2557) is substituted for `children` in the same
+    // breath, so all five shapes below carry it without five more spreads —
+    // and an unformatted link, which is nearly all of them, gets the very
+    // object `dropClearedProps` returned.
+    const _withAuthorHtmlLabel = withAuthorHtmlLabel(dropClearedProps(spread), html), { variant, size, fullWidth } = _withAuthorHtmlLabel, rest = _object_without_properties_loose(_withAuthorHtmlLabel, [
+        "variant",
+        "size",
+        "fullWidth"
+    ]);
+    // Id-vs-URL precedence and the `javascript:`/`data:` guard live in
+    // `useLinkTarget` (AGL-1335) — one copy for every linking element, and
+    // the only place that knows a `screen:`-prefixed value is a reference.
+    const { href, suppressNavigation, editorInert, broken, leavesSite } = Aglyn.useLinkTarget(screenId, externalHref);
+    // Resolved rather than spread: `'custom'` is an authoring sentinel, and an
+    // anchor carrying `target="custom"` would open a window literally named
+    // that. The pair is destructured OUT of `spread` above, so the inert canvas
+    // branches below never see either half.
+    const targetAttrs = linkTargetProps(target, targetName, leavesSite);
+    /**
+   * The same dead-target problem Tabs had, on the element there are 326 of
+   * (AGL-1893). Here it is less violent — an unresolved Screen Link already
+   * degrades to inert content rather than to a fake control — but it is just
+   * as silent: unpublish a screen and every link to it quietly stops
+   * navigating, with nothing in the editor to say which ones.
+   *
+   * So the LIVE rendering is deliberately unchanged, and only the authoring
+   * surface gains anything: on the besigner canvas the link wears a warning
+   * ring and explains itself on hover. A live restyle would be the riskier
+   * half of this by far — it would repaint any published CTA whose screen is
+   * temporarily unpublished, on sites whose owners never asked.
+   */ const flagged = Aglyn.brokenScreenLinkProps(broken, editorInert);
+    const asLink = renderAs === 'link';
+    // Semantics and appearance are independent choices now (AGL-1347): a
+    // styled link takes the button's styling props and none of its role.
+    const asStyledLink = renderAs === 'linkButton';
+    if (!href || suppressNavigation) {
+        // The canvas must not lie about which element the page will ship, so
+        // the unresolved/suppressed case mirrors the same three shapes.
+        //
+        // `sx` is lifted out of the spread so the editor ring can be merged
+        // rather than replace the author's styles — the AGL-1284 mistake, in a
+        // place where the symptom would be "my link lost all its styling the
+        // day its screen was unpublished". The ring goes LAST, and is the one
+        // thing here allowed to outrank an authored value: it is a diagnostic
+        // on a surface only the author sees, not a style.
+        const { sx: authoredSx } = rest, restNoSx = _object_without_properties_loose(rest, [
+            "sx"
+        ]);
+        const inertSx = [
+            ...Array.isArray(authoredSx) ? authoredSx : authoredSx ? [
+                authoredSx
+            ] : [],
+            ...broken && editorInert ? [
+                Aglyn.BROKEN_SCREEN_LINK_SX
+            ] : []
+        ];
+        if (asLink) {
+            return /*#__PURE__*/ _jsx(Link, _extends({
+                ref: ref,
+                component: "span",
+                underline: "hover"
+            }, flagged, restNoSx, {
+                sx: inertSx
+            }));
+        }
+        return /*#__PURE__*/ _jsx(Button, _extends({
+            ref: ref
+        }, asStyledLink ? STYLED_LINK_PLACEHOLDER : {}, {
+            variant: variant,
+            size: size,
+            fullWidth: fullWidth
+        }, flagged, restNoSx, {
+            sx: inertSx
+        }));
+    }
+    return asLink ? /*#__PURE__*/ _jsx(AppLink, _extends({
+        ref: ref,
+        underline: "hover",
+        href: href
+    }, targetAttrs, rest)) : /*#__PURE__*/ _jsx(AppLink, _extends({
+        ref: ref,
+        componentVariant: "button",
+        href: href
+    }, targetAttrs, {
+        // The whole defect in one attribute. `ButtonBase` adds `role="button"`
+        // to every non-`<button>` root, so the button LOOK used to drag the
+        // button ROLE onto a navigating anchor. It spreads the caller's props
+        // after its own, so passing `undefined` here is what clears it — and
+        // only for the mode that asked to be a link.
+        role: asStyledLink ? undefined : 'button',
+        variant: variant,
+        size: size,
+        fullWidth: fullWidth
+    }, rest));
+});
+ScreenLink.displayName = 'ScreenLink';
+/**
+ * Shows an attribute in the two modes that wear button styling — Button and
+ * Link (button styling). `notMatch` inverts `is`, so an unset `renderAs` —
+ * every link authored before AGL-1195 — still counts as a button and keeps
+ * its controls, and only Text link hides them.
+ */ const BUTTON_STYLED = {
+    when: 'renderAs',
+    is: 'link',
+    notMatch: true
+};
+export const schema = {
+    $id: ID,
+    pluginId: BUNDLE_ID,
+    displayName: 'Screen Link',
+    description: 'Links to another screen by id, so it survives a slug change.',
+    category: Aglyn.ComponentCategory.NAVIGATION,
+    icon: {
+        path: mdiLinkVariant.path,
+        sx: {
+            color: '#2196f3'
+        }
+    },
+    flags: {
+        textEditable: Aglyn.FEATURE_FLAG.ENABLED,
+        richTextEditable: Aglyn.FEATURE_FLAG.ENABLED
+    },
+    // Emphasis only (AGL-2557). Every mode of this element ships an anchor or
+    // a button, and neither may contain a list or a second control.
+    richTextCommands: [
+        Aglyn.RICH_TEXT_COMMANDS.EMPHASIS
+    ],
+    attributes: [
+        FIELD_TEXT_CONTENT,
+        {
+            name: 'screenId',
+            description: 'Screen this link navigates to. The address is generated from the ' + 'published path at render time, so it keeps working when the ' + "screen's slug or parent changes.",
+            component: Aglyn.FieldComponentType.SCREEN_SELECT,
+            label: 'Screen'
+        },
+        {
+            name: 'href',
+            description: 'Where this link goes when it points off this site. Ignored while ' + 'Screen names one — that field wins, so clear it to use a URL.',
+            component: Aglyn.FieldComponentType.TEXT_FIELD,
+            label: 'External URL',
+            // A bare `#fragment` saves and goes nowhere (AGL-2867).
+            resolveProps: Aglyn.bareFragmentLinkFieldProps
+        },
+        FIELD_LINK_TARGET,
+        FIELD_LINK_TARGET_NAME,
+        {
+            name: 'renderAs',
+            description: 'What this announces as. Button is for calls to action; both link ' + 'options announce as a link, which is what navigation should be — ' + 'pick "Link (button styling)" to keep the button look on something ' + 'that navigates.',
+            component: Aglyn.FieldComponentType.SELECT,
+            label: 'Render as',
+            // `'button'` is a REAL SENTINEL, not a deletion (AGL-1453): `''` here
+            // spelled an author's actual choice, and the one they could not make.
+            // The attributes form strips `''` before save (AGL-1191), so a link
+            // switched to Text link had NO route in this dropdown back to Button —
+            // and 213 of the 326 Screen Links in the corpus are in that mode.
+            //
+            // Safe because `renderAs` never reaches MUI: it is destructured out
+            // above and read only as `=== 'link'` / `=== 'linkButton'`, so
+            // `'button'` and an absent value take the identical branch. That is
+            // also what keeps every link authored before AGL-1195 rendering
+            // unchanged.
+            options: [
+                {
+                    value: 'button',
+                    label: 'Button'
+                },
+                {
+                    value: 'link',
+                    label: 'Text link'
+                },
+                {
+                    value: 'linkButton',
+                    label: 'Link (button styling)'
+                }
+            ]
+        },
+        // `color` survives both shapes — MUI's Link takes it too.
+        FIELD_COLOR,
+        // The rest are appearance: the renderer drops them in Text link mode, so
+        // leaving them on screen there would offer three controls that silently
+        // do nothing — but they are live in Link (button styling), which is the
+        // point of that mode. Spread rather than mutate — these presets are
+        // shared.
+        _extends({}, FIELD_SIZE, {
+            condition: BUTTON_STYLED
+        }),
+        _extends({}, FIELD_FULL_WIDTH, {
+            condition: BUTTON_STYLED
+        }),
+        {
+            name: 'variant',
+            description: 'How the link is drawn once its style is Button: Contained is a ' + 'filled call to action, Outlined a secondary one, Text the lightest. ' + 'Ignored while the link is styled as plain text.',
+            component: Aglyn.FieldComponentType.SELECT,
+            label: 'Variant',
+            // "Default" deleted (AGL-1453): unpersistable, and a second name for
+            // `text`, MUI Button's own default, already on the list.
+            options: [
+                {
+                    value: 'text',
+                    label: 'Text'
+                },
+                {
+                    value: 'outlined',
+                    label: 'Outlined'
+                },
+                {
+                    value: 'contained',
+                    label: 'Contained'
+                }
+            ],
+            condition: BUTTON_STYLED
+        }
+    ]
+};
+export const presets = [
+    {
+        $id: generatePresetId(ID),
+        type: Aglyn.NodeType.PRESET,
+        displayName: 'Screen Link',
+        icon: {
+            path: mdiLinkVariant.path,
+            sx: {
+                color: '#2196f3'
+            }
+        },
+        category: Aglyn.ComponentCategory.NAVIGATION,
+        data: {
+            $id: null,
+            componentId: ID,
+            pluginId: BUNDLE_ID,
+            props: {
+                children: 'Screen Link',
+                // Same visible-on-any-surface defaults as the button preset; the
+                // default text color disappears against a same-hue appbar.
+                variant: 'outlined',
+                color: 'inherit'
+            }
+        }
+    }
+];
+export default ScreenLink;
+
+//# sourceMappingURL=screen-link.js.map

package/src/lib/components/screen-link.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/mui/src/lib/components/screen-link.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport * as Aglyn from '@aglyn/aglyn'\nimport { mdiLinkVariant } from '@aglyn/shared-data-mdi'\nimport { AppLink } from '@aglyn/shared-ui-jsx'\nimport Button, { type ButtonProps } from '@mui/material/Button'\nimport Link from '@mui/material/Link'\nimport { forwardRef } from 'react'\nimport { BUNDLE_ID } from '../constants/bundle-common'\nimport {\n  FIELD_COLOR,\n  FIELD_FULL_WIDTH,\n  FIELD_LINK_TARGET,\n  FIELD_LINK_TARGET_NAME,\n  FIELD_SIZE,\n  FIELD_TEXT_CONTENT,\n} from '../constants/field-presets'\nimport { withAuthorHtmlLabel } from '../utils/author-html-label'\nimport { dropClearedProps } from '../utils/drop-cleared-props'\nimport { generatePresetId } from '../utils/generate-preset-id'\nimport {\n  type LinkTargetChoice,\n  linkTargetProps,\n} from '../utils/link-target-props'\n\n// Component ids are persisted in screen documents; never rename.\nexport const ID: Aglyn.ComponentId = 'muiScreenLink'\n\nexport interface ScreenLinkProps extends ButtonProps {\n  /**\n   * Target screen id. The href is resolved from the host routing map at\n   * render time (see `ScreenLinkContext`), so slug renames and re-parenting\n   * never break the link — which is what makes navigation inside a shared\n   * layout viable.\n   */\n  screenId?: string\n  /** External URL escape hatch, used only when no `screenId` is set. */\n  href?: string\n  /**\n   * Which element this ships as (AGL-1195, AGL-1347). Persisted in screen\n   * documents; never rename, and `undefined` must keep meaning `'button'` —\n   * every link authored before this existed is one.\n   *\n   * - `'button'` (or unset) — `<a role=\"button\">` with the button's look.\n   * - `'link'` — a plain text link; the button-only props are dropped.\n   * - `'linkButton'` — a plain `<a>` with NO role, wearing the button's\n   *   `variant`/`size`/`fullWidth`. Appearance without semantics: a pill\n   *   that navigates announces as the link it is.\n   */\n  renderAs?: 'button' | 'link' | 'linkButton'\n  /**\n   * Where the link opens. Persisted in screen documents; never rename a\n   * value, and `undefined` must keep meaning `'_self'` — every link authored\n   * before this existed stays in the tab.\n   */\n  target?: LinkTargetChoice\n  /** Window name used only when `target` is `'custom'`. */\n  targetName?: string\n  /**\n   * Sanitized emphasis markup for the label, written by the inline editor's\n   * rich mode (AGL-2557). `children` keeps the plain-text reading of it, and\n   * is what every surface that cannot render markup falls back to.\n   */\n  html?: string\n}\n\n/**\n * What a button-styled LINK renders as with nothing to point at (canvas,\n * preview, unresolved screen). `role: undefined` is the load-bearing half:\n * MUI's `ButtonBase` stamps `role=\"button\"` onto any non-`<button>` root,\n * and merges the caller's props AFTER its own, so an explicit `undefined`\n * is what removes it.\n */\nconst STYLED_LINK_PLACEHOLDER = { component: 'span', role: undefined } as const\n\n/**\n * Link that targets a screen by id, never a hardcoded path. Degrades to a\n * plain button when the id doesn't resolve (unpublished/deleted screen) and\n * when navigation is suppressed (besigner canvas, preview).\n *\n * `renderAs=\"link\"` renders MUI's `Link` instead of `Button` (AGL-1195).\n * Footer and inline navigation are *text*: as buttons they inherit button\n * typography, uppercase transforms and the wrong role for assistive tech.\n * The button-only props are dropped in that mode rather than passed through\n * — `variant` means the typography variant on a `Link`, so forwarding\n * `\"contained\"` would silently produce an unstyled element.\n *\n * `renderAs=\"linkButton\"` splits the two halves that used to travel together\n * (AGL-1347). A pill row whose chips all navigate — docs URLs, `mailto:`,\n * social profiles — is a legitimate design, but every chip announced as a\n * button, which tells a screen-reader user to expect an action and costs\n * them the link-list and open-in-new-tab affordances. This mode keeps the\n * button's `variant`/`size`/`fullWidth` and drops the role, exactly as MUI's\n * own `Button component={Link}` does. It is a THIRD value rather than\n * `variant` becoming live in `\"link\"` mode, because a node switched to Text\n * link keeps whatever `variant` it was authored with (the shipped preset is\n * `variant: 'outlined'`) — honouring those would repaint the site's nav and\n * footer as outlined pills.\n */\nconst ScreenLink = forwardRef<any, ScreenLinkProps>((props, ref) => {\n  const {\n    screenId,\n    href: externalHref,\n    renderAs,\n    target,\n    targetName,\n    html,\n    ...spread\n  } = props\n  // A CLEARED attribute persists as null, and null is not \"use the default\"\n  // in React — `color={null}` reaches MUI, which capitalizes it and throws\n  // error #7 during SSR, 500ing the page (AGL-1226). This is the site's\n  // most-used element (70–77 nodes per page), so the guard runs BEFORE\n  // `variant`/`size`/`fullWidth` are split out: they are forwarded as named\n  // attributes, and guarding only the spread would leave those three exposed.\n  //\n  // The formatted label (AGL-2557) is substituted for `children` in the same\n  // breath, so all five shapes below carry it without five more spreads —\n  // and an unformatted link, which is nearly all of them, gets the very\n  // object `dropClearedProps` returned.\n  const { variant, size, fullWidth, ...rest } = withAuthorHtmlLabel(\n    dropClearedProps(spread),\n    html,\n  )\n  // Id-vs-URL precedence and the `javascript:`/`data:` guard live in\n  // `useLinkTarget` (AGL-1335) — one copy for every linking element, and\n  // the only place that knows a `screen:`-prefixed value is a reference.\n  const { href, suppressNavigation, editorInert, broken, leavesSite } =\n    Aglyn.useLinkTarget(screenId, externalHref)\n  // Resolved rather than spread: `'custom'` is an authoring sentinel, and an\n  // anchor carrying `target=\"custom\"` would open a window literally named\n  // that. The pair is destructured OUT of `spread` above, so the inert canvas\n  // branches below never see either half.\n  const targetAttrs = linkTargetProps(target, targetName, leavesSite)\n  /**\n   * The same dead-target problem Tabs had, on the element there are 326 of\n   * (AGL-1893). Here it is less violent — an unresolved Screen Link already\n   * degrades to inert content rather than to a fake control — but it is just\n   * as silent: unpublish a screen and every link to it quietly stops\n   * navigating, with nothing in the editor to say which ones.\n   *\n   * So the LIVE rendering is deliberately unchanged, and only the authoring\n   * surface gains anything: on the besigner canvas the link wears a warning\n   * ring and explains itself on hover. A live restyle would be the riskier\n   * half of this by far — it would repaint any published CTA whose screen is\n   * temporarily unpublished, on sites whose owners never asked.\n   */\n  const flagged = Aglyn.brokenScreenLinkProps(broken, editorInert)\n  const asLink = renderAs === 'link'\n  // Semantics and appearance are independent choices now (AGL-1347): a\n  // styled link takes the button's styling props and none of its role.\n  const asStyledLink = renderAs === 'linkButton'\n\n  if (!href || suppressNavigation) {\n    // The canvas must not lie about which element the page will ship, so\n    // the unresolved/suppressed case mirrors the same three shapes.\n    //\n    // `sx` is lifted out of the spread so the editor ring can be merged\n    // rather than replace the author's styles — the AGL-1284 mistake, in a\n    // place where the symptom would be \"my link lost all its styling the\n    // day its screen was unpublished\". The ring goes LAST, and is the one\n    // thing here allowed to outrank an authored value: it is a diagnostic\n    // on a surface only the author sees, not a style.\n    const { sx: authoredSx, ...restNoSx } = rest as Record<string, any>\n    const inertSx = [\n      ...(Array.isArray(authoredSx) ? authoredSx : authoredSx ? [authoredSx] : []),\n      ...(broken && editorInert ? [Aglyn.BROKEN_SCREEN_LINK_SX] : []),\n    ]\n    if (asLink) {\n      return (\n        <Link\n          ref={ref}\n          component=\"span\"\n          underline=\"hover\"\n          {...flagged}\n          {...restNoSx}\n          sx={inertSx}\n        />\n      )\n    }\n    return (\n      <Button\n        ref={ref}\n        {...(asStyledLink ? STYLED_LINK_PLACEHOLDER : {})}\n        variant={variant}\n        size={size}\n        fullWidth={fullWidth}\n        {...flagged}\n        {...restNoSx}\n        sx={inertSx}\n      />\n    )\n  }\n  return asLink ? (\n    <AppLink\n      ref={ref}\n      underline=\"hover\"\n      href={href}\n      {...targetAttrs}\n      {...rest}\n    />\n  ) : (\n    <AppLink\n      ref={ref}\n      componentVariant=\"button\"\n      href={href}\n      {...targetAttrs}\n      // The whole defect in one attribute. `ButtonBase` adds `role=\"button\"`\n      // to every non-`<button>` root, so the button LOOK used to drag the\n      // button ROLE onto a navigating anchor. It spreads the caller's props\n      // after its own, so passing `undefined` here is what clears it — and\n      // only for the mode that asked to be a link.\n      role={asStyledLink ? undefined : 'button'}\n      variant={variant}\n      size={size}\n      fullWidth={fullWidth}\n      {...rest}\n    />\n  )\n})\nScreenLink.displayName = 'ScreenLink'\n\n/**\n * Shows an attribute in the two modes that wear button styling — Button and\n * Link (button styling). `notMatch` inverts `is`, so an unset `renderAs` —\n * every link authored before AGL-1195 — still counts as a button and keeps\n * its controls, and only Text link hides them.\n */\nconst BUTTON_STYLED = { when: 'renderAs', is: 'link', notMatch: true }\n\nexport const schema: Aglyn.ComponentSchema<ScreenLinkProps> = {\n  $id: ID,\n  pluginId: BUNDLE_ID,\n  displayName: 'Screen Link',\n  description: 'Links to another screen by id, so it survives a slug change.',\n  category: Aglyn.ComponentCategory.NAVIGATION,\n  icon: {\n    path: mdiLinkVariant.path,\n    sx: { color: '#2196f3' },\n  },\n  flags: {\n    textEditable: Aglyn.FEATURE_FLAG.ENABLED,\n    richTextEditable: Aglyn.FEATURE_FLAG.ENABLED,\n  },\n  // Emphasis only (AGL-2557). Every mode of this element ships an anchor or\n  // a button, and neither may contain a list or a second control.\n  richTextCommands: [Aglyn.RICH_TEXT_COMMANDS.EMPHASIS],\n  attributes: [\n    FIELD_TEXT_CONTENT,\n    {\n      name: 'screenId',\n      description:\n        'Screen this link navigates to. The address is generated from the ' +\n        'published path at render time, so it keeps working when the ' +\n        \"screen's slug or parent changes.\",\n      component: Aglyn.FieldComponentType.SCREEN_SELECT,\n      label: 'Screen',\n    },\n    {\n      name: 'href',\n      description:\n        'Where this link goes when it points off this site. Ignored while ' +\n        'Screen names one — that field wins, so clear it to use a URL.',\n      component: Aglyn.FieldComponentType.TEXT_FIELD,\n      label: 'External URL',\n      // A bare `#fragment` saves and goes nowhere (AGL-2867).\n      resolveProps: Aglyn.bareFragmentLinkFieldProps,\n    },\n    FIELD_LINK_TARGET,\n    FIELD_LINK_TARGET_NAME,\n    {\n      name: 'renderAs',\n      description:\n        'What this announces as. Button is for calls to action; both link ' +\n        'options announce as a link, which is what navigation should be — ' +\n        'pick \"Link (button styling)\" to keep the button look on something ' +\n        'that navigates.',\n      component: Aglyn.FieldComponentType.SELECT,\n      label: 'Render as',\n      // `'button'` is a REAL SENTINEL, not a deletion (AGL-1453): `''` here\n      // spelled an author's actual choice, and the one they could not make.\n      // The attributes form strips `''` before save (AGL-1191), so a link\n      // switched to Text link had NO route in this dropdown back to Button —\n      // and 213 of the 326 Screen Links in the corpus are in that mode.\n      //\n      // Safe because `renderAs` never reaches MUI: it is destructured out\n      // above and read only as `=== 'link'` / `=== 'linkButton'`, so\n      // `'button'` and an absent value take the identical branch. That is\n      // also what keeps every link authored before AGL-1195 rendering\n      // unchanged.\n      options: [\n        { value: 'button', label: 'Button' },\n        { value: 'link', label: 'Text link' },\n        { value: 'linkButton', label: 'Link (button styling)' },\n      ],\n    },\n    // `color` survives both shapes — MUI's Link takes it too.\n    FIELD_COLOR,\n    // The rest are appearance: the renderer drops them in Text link mode, so\n    // leaving them on screen there would offer three controls that silently\n    // do nothing — but they are live in Link (button styling), which is the\n    // point of that mode. Spread rather than mutate — these presets are\n    // shared.\n    { ...FIELD_SIZE, condition: BUTTON_STYLED },\n    { ...FIELD_FULL_WIDTH, condition: BUTTON_STYLED },\n    {\n      name: 'variant',\n      description:\n        'How the link is drawn once its style is Button: Contained is a ' +\n        'filled call to action, Outlined a secondary one, Text the lightest. ' +\n        'Ignored while the link is styled as plain text.',\n      component: Aglyn.FieldComponentType.SELECT,\n      label: 'Variant',\n      // \"Default\" deleted (AGL-1453): unpersistable, and a second name for\n      // `text`, MUI Button's own default, already on the list.\n      options: [\n        { value: 'text', label: 'Text' },\n        { value: 'outlined', label: 'Outlined' },\n        { value: 'contained', label: 'Contained' },\n      ],\n      condition: BUTTON_STYLED,\n    },\n  ],\n}\n\nexport const presets: Aglyn.PresetSchema[] = [\n  {\n    $id: generatePresetId(ID),\n    type: Aglyn.NodeType.PRESET,\n    displayName: 'Screen Link',\n    icon: {\n      path: mdiLinkVariant.path,\n      sx: { color: '#2196f3' },\n    },\n    category: Aglyn.ComponentCategory.NAVIGATION,\n    data: {\n      $id: null,\n      componentId: ID,\n      pluginId: BUNDLE_ID,\n      props: {\n        children: 'Screen Link',\n        // Same visible-on-any-surface defaults as the button preset; the\n        // default text color disappears against a same-hue appbar.\n        variant: 'outlined',\n        color: 'inherit',\n      },\n    },\n  },\n]\n\nexport default ScreenLink\n"],"names":["Aglyn","mdiLinkVariant","AppLink","Button","Link","forwardRef","BUNDLE_ID","FIELD_COLOR","FIELD_FULL_WIDTH","FIELD_LINK_TARGET","FIELD_LINK_TARGET_NAME","FIELD_SIZE","FIELD_TEXT_CONTENT","withAuthorHtmlLabel","dropClearedProps","generatePresetId","linkTargetProps","ID","STYLED_LINK_PLACEHOLDER","component","role","undefined","ScreenLink","props","ref","screenId","href","externalHref","renderAs","target","targetName","html","spread","variant","size","fullWidth","rest","suppressNavigation","editorInert","broken","leavesSite","useLinkTarget","targetAttrs","flagged","brokenScreenLinkProps","asLink","asStyledLink","sx","authoredSx","restNoSx","inertSx","Array","isArray","BROKEN_SCREEN_LINK_SX","underline","componentVariant","displayName","BUTTON_STYLED","when","is","notMatch","schema","$id","pluginId","description","category","ComponentCategory","NAVIGATION","icon","path","color","flags","textEditable","FEATURE_FLAG","ENABLED","richTextEditable","richTextCommands","RICH_TEXT_COMMANDS","EMPHASIS","attributes","name","FieldComponentType","SCREEN_SELECT","label","TEXT_FIELD","resolveProps","bareFragmentLinkFieldProps","SELECT","options","value","condition","presets","type","NodeType","PRESET","data","componentId","children"],"mappings":"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"}

package/src/lib/components/search-box.d.ts

@@ -0,0 +1,41 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as Aglyn from '@aglyn/aglyn';
+export declare const ID: Aglyn.ComponentId;
+export interface SearchBoxProps {
+    placeholder?: string;
+    /**
+     * What the field starts with (AGL-2513). The results page prefills the
+     * query it is showing, so a reader can refine it where they are rather
+     * than going back for the box they typed into.
+     *
+     * Uncontrolled on purpose: this component holds no state and issues no
+     * request, and a `value` would freeze the field the moment the reader
+     * typed into it.
+     */
+    defaultValue?: string;
+}
+/**
+ * Site search box (AGL-88): a plain GET form to the tenant's /search page,
+ * so it works with zero JavaScript and is inert in the besigner (the
+ * console has no /search route to submit to; navigation there is a no-op
+ * form post the editor never triggers).
+ */
+declare const SearchBox: import("react").ForwardRefExoticComponent<SearchBoxProps & import("react").RefAttributes<HTMLFormElement>>;
+export declare const schema: Aglyn.ComponentSchema<SearchBoxProps>;
+export declare const presets: Aglyn.PresetSchema[];
+export default SearchBox;

package/src/lib/components/search-box.js

@@ -0,0 +1,125 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import * as Aglyn from "@aglyn/aglyn";
+import { mdiMagnify } from "@aglyn/shared-data-mdi";
+import IconButton from "@mui/material/IconButton";
+import InputAdornment from "@mui/material/InputAdornment";
+import TextField from "@mui/material/TextField";
+import { MdiIcon } from "@aglyn/shared-ui-jsx";
+import { forwardRef } from "react";
+import { BUNDLE_ID } from "../constants/bundle-common.js";
+import { generatePresetId } from "../utils/generate-preset-id.js";
+// Component ids are persisted in screen documents; never rename.
+export const ID = 'searchBox';
+/**
+ * Site search box (AGL-88): a plain GET form to the tenant's /search page,
+ * so it works with zero JavaScript and is inert in the besigner (the
+ * console has no /search route to submit to; navigation there is a no-op
+ * form post the editor never triggers).
+ */ const SearchBox = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { placeholder, defaultValue } = props, rest = _object_without_properties_loose(props, [
+        "placeholder",
+        "defaultValue"
+    ]);
+    return /*#__PURE__*/ _jsx("form", _extends({
+        ref: ref,
+        action: "/search",
+        method: "get",
+        role: "search"
+    }, rest, {
+        children: /*#__PURE__*/ _jsx(TextField, {
+            name: "q",
+            size: "small",
+            placeholder: placeholder || 'Search…',
+            defaultValue: defaultValue || '',
+            slotProps: {
+                input: {
+                    endAdornment: /*#__PURE__*/ _jsx(InputAdornment, {
+                        position: "end",
+                        children: /*#__PURE__*/ _jsx(IconButton, {
+                            type: "submit",
+                            size: "small",
+                            "aria-label": "search",
+                            children: /*#__PURE__*/ _jsx(MdiIcon, {
+                                path: mdiMagnify.path,
+                                fontSize: "small"
+                            })
+                        })
+                    })
+                }
+            }
+        })
+    }));
+});
+SearchBox.displayName = 'AglynSearchBox';
+export const schema = {
+    $id: ID,
+    pluginId: BUNDLE_ID,
+    displayName: 'Search Box',
+    description: "A search field that opens the site's search page. It works without JavaScript.",
+    category: Aglyn.ComponentCategory.FORMS,
+    icon: {
+        path: mdiMagnify.path,
+        sx: {
+            color: '#455a64'
+        }
+    },
+    flags: {
+        selfClosing: Aglyn.FEATURE_FLAG.ENABLED
+    },
+    attributes: [
+        {
+            name: 'placeholder',
+            description: 'Placeholder text inside the search field.',
+            component: Aglyn.FieldComponentType.TEXT_FIELD,
+            label: 'Placeholder'
+        },
+        {
+            name: 'defaultValue',
+            description: 'Text the field starts with. The search results page fills in the ' + 'query it is showing.',
+            component: Aglyn.FieldComponentType.TEXT_FIELD,
+            label: 'Starting text'
+        }
+    ]
+};
+export const presets = [
+    {
+        $id: generatePresetId(ID),
+        type: Aglyn.NodeType.PRESET,
+        displayName: 'Search Box',
+        pluginId: BUNDLE_ID,
+        description: 'Search field that opens the site search page',
+        category: Aglyn.ComponentCategory.FORMS,
+        icon: {
+            path: mdiMagnify.path,
+            sx: {
+                color: '#455a64'
+            }
+        },
+        data: {
+            $id: null,
+            componentId: ID,
+            pluginId: BUNDLE_ID,
+            props: {}
+        }
+    }
+];
+export default SearchBox;
+
+//# sourceMappingURL=search-box.js.map

package/src/lib/components/search-box.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/mui/src/lib/components/search-box.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport * as Aglyn from '@aglyn/aglyn'\nimport { mdiMagnify } from '@aglyn/shared-data-mdi'\nimport IconButton from '@mui/material/IconButton'\nimport InputAdornment from '@mui/material/InputAdornment'\nimport TextField from '@mui/material/TextField'\nimport { MdiIcon } from '@aglyn/shared-ui-jsx'\nimport { forwardRef } from 'react'\nimport { BUNDLE_ID } from '../constants/bundle-common'\nimport { generatePresetId } from '../utils/generate-preset-id'\n\n// Component ids are persisted in screen documents; never rename.\nexport const ID: Aglyn.ComponentId = 'searchBox'\n\nexport interface SearchBoxProps {\n  placeholder?: string\n  /**\n   * What the field starts with (AGL-2513). The results page prefills the\n   * query it is showing, so a reader can refine it where they are rather\n   * than going back for the box they typed into.\n   *\n   * Uncontrolled on purpose: this component holds no state and issues no\n   * request, and a `value` would freeze the field the moment the reader\n   * typed into it.\n   */\n  defaultValue?: string\n}\n\n/**\n * Site search box (AGL-88): a plain GET form to the tenant's /search page,\n * so it works with zero JavaScript and is inert in the besigner (the\n * console has no /search route to submit to; navigation there is a no-op\n * form post the editor never triggers).\n */\nconst SearchBox = forwardRef<HTMLFormElement, SearchBoxProps>(\n  (props, ref) => {\n    const { placeholder, defaultValue, ...rest } = props\n    return (\n      <form ref={ref} action=\"/search\" method=\"get\" role=\"search\" {...rest}>\n        <TextField\n          name=\"q\"\n          size=\"small\"\n          placeholder={placeholder || 'Search…'}\n          defaultValue={defaultValue || ''}\n          slotProps={{\n            input: {\n              endAdornment: (\n                <InputAdornment position=\"end\">\n                  <IconButton type=\"submit\" size=\"small\" aria-label=\"search\">\n                    <MdiIcon path={mdiMagnify.path} fontSize=\"small\" />\n                  </IconButton>\n                </InputAdornment>\n              ),\n            },\n          }}\n        />\n      </form>\n    )\n  },\n)\nSearchBox.displayName = 'AglynSearchBox'\n\nexport const schema: Aglyn.ComponentSchema<SearchBoxProps> = {\n  $id: ID,\n  pluginId: BUNDLE_ID,\n  displayName: 'Search Box',\n  description:\n    \"A search field that opens the site's search page. It works without JavaScript.\",\n  category: Aglyn.ComponentCategory.FORMS,\n  icon: { path: mdiMagnify.path, sx: { color: '#455a64' } },\n  flags: { selfClosing: Aglyn.FEATURE_FLAG.ENABLED },\n  attributes: [\n    {\n      name: 'placeholder',\n      description: 'Placeholder text inside the search field.',\n      component: Aglyn.FieldComponentType.TEXT_FIELD,\n      label: 'Placeholder',\n    },\n    {\n      name: 'defaultValue',\n      description:\n        'Text the field starts with. The search results page fills in the ' +\n        'query it is showing.',\n      component: Aglyn.FieldComponentType.TEXT_FIELD,\n      label: 'Starting text',\n    },\n  ],\n}\n\nexport const presets: Aglyn.PresetSchema[] = [\n  {\n    $id: generatePresetId(ID),\n    type: Aglyn.NodeType.PRESET,\n    displayName: 'Search Box',\n    pluginId: BUNDLE_ID,\n    description: 'Search field that opens the site search page',\n    category: Aglyn.ComponentCategory.FORMS,\n    icon: { path: mdiMagnify.path, sx: { color: '#455a64' } },\n    data: {\n      $id: null,\n      componentId: ID,\n      pluginId: BUNDLE_ID,\n      props: {},\n    },\n  },\n]\n\nexport default SearchBox\n"],"names":["Aglyn","mdiMagnify","IconButton","InputAdornment","TextField","MdiIcon","forwardRef","BUNDLE_ID","generatePresetId","ID","SearchBox","props","ref","placeholder","defaultValue","rest","form","action","method","role","name","size","slotProps","input","endAdornment","position","type","aria-label","path","fontSize","displayName","schema","$id","pluginId","description","category","ComponentCategory","FORMS","icon","sx","color","flags","selfClosing","FEATURE_FLAG","ENABLED","attributes","component","FieldComponentType","TEXT_FIELD","label","presets","NodeType","PRESET","data","componentId"],"mappings":";;;AAAA;;;;;;;;;;;;;;;CAeC,GAED,YAAYA,WAAW,eAAc;AACrC,SAASC,UAAU,QAAQ,yBAAwB;AACnD,OAAOC,gBAAgB,2BAA0B;AACjD,OAAOC,oBAAoB,+BAA8B;AACzD,OAAOC,eAAe,0BAAyB;AAC/C,SAASC,OAAO,QAAQ,uBAAsB;AAC9C,SAASC,UAAU,QAAQ,QAAO;AAClC,SAASC,SAAS,QAAQ,gCAA4B;AACtD,SAASC,gBAAgB,QAAQ,iCAA6B;AAE9D,iEAAiE;AACjE,OAAO,MAAMC,KAAwB,YAAW;AAgBhD;;;;;CAKC,GACD,MAAMC,0BAAYJ,WAChB,CAACK,OAAOC;IACN,MAAM,EAAEC,WAAW,EAAEC,YAAY,EAAW,GAAGH,OAATI,wCAASJ;;;;IAC/C,qBACE,KAACK;QAAKJ,KAAKA;QAAKK,QAAO;QAAUC,QAAO;QAAMC,MAAK;OAAaJ;kBAC9D,cAAA,KAACX;YACCgB,MAAK;YACLC,MAAK;YACLR,aAAaA,eAAe;YAC5BC,cAAcA,gBAAgB;YAC9BQ,WAAW;gBACTC,OAAO;oBACLC,4BACE,KAACrB;wBAAesB,UAAS;kCACvB,cAAA,KAACvB;4BAAWwB,MAAK;4BAASL,MAAK;4BAAQM,cAAW;sCAChD,cAAA,KAACtB;gCAAQuB,MAAM3B,WAAW2B,IAAI;gCAAEC,UAAS;;;;gBAIjD;YACF;;;AAIR;AAEFnB,UAAUoB,WAAW,GAAG;AAExB,OAAO,MAAMC,SAAgD;IAC3DC,KAAKvB;IACLwB,UAAU1B;IACVuB,aAAa;IACbI,aACE;IACFC,UAAUnC,MAAMoC,iBAAiB,CAACC,KAAK;IACvCC,MAAM;QAAEV,MAAM3B,WAAW2B,IAAI;QAAEW,IAAI;YAAEC,OAAO;QAAU;IAAE;IACxDC,OAAO;QAAEC,aAAa1C,MAAM2C,YAAY,CAACC,OAAO;IAAC;IACjDC,YAAY;QACV;YACEzB,MAAM;YACNc,aAAa;YACbY,WAAW9C,MAAM+C,kBAAkB,CAACC,UAAU;YAC9CC,OAAO;QACT;QACA;YACE7B,MAAM;YACNc,aACE,sEACA;YACFY,WAAW9C,MAAM+C,kBAAkB,CAACC,UAAU;YAC9CC,OAAO;QACT;KACD;AACH,EAAC;AAED,OAAO,MAAMC,UAAgC;IAC3C;QACElB,KAAKxB,iBAAiBC;QACtBiB,MAAM1B,MAAMmD,QAAQ,CAACC,MAAM;QAC3BtB,aAAa;QACbG,UAAU1B;QACV2B,aAAa;QACbC,UAAUnC,MAAMoC,iBAAiB,CAACC,KAAK;QACvCC,MAAM;YAAEV,MAAM3B,WAAW2B,IAAI;YAAEW,IAAI;gBAAEC,OAAO;YAAU;QAAE;QACxDa,MAAM;YACJrB,KAAK;YACLsB,aAAa7C;YACbwB,UAAU1B;YACVI,OAAO,CAAC;QACV;IACF;CACD,CAAA;AAED,eAAeD,UAAS"}

package/src/lib/components/section.d.ts

@@ -0,0 +1,56 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import * as Aglyn from '@aglyn/aglyn';
+export declare const ID: Aglyn.ComponentId;
+/**
+ * W3C sectioning/grouping elements the component may render as (AGL-336).
+ *
+ * ⛔ `main` IS NOT ONE OF THEM (AGL-2486). A published page carries exactly
+ * one `main` landmark, placed by composition on the page's content region —
+ * the layout's slot, or the screen root when there is no layout, each of which
+ * offers its own element picker. An author-selectable `main` on a grouping
+ * container that may appear any number of times per page could only ever
+ * produce a SECOND one — and two `main` elements is a worse
+ * accessibility outcome than none, because the landmark stops naming anything
+ * in particular. It was offered in this select, with field help recommending
+ * it, which made the duplicate the documented choice rather than a mistake.
+ *
+ * Removing it degrades rather than breaks: the resolver below falls back to
+ * `section` for any value not in this list, so a stored `element: 'main'` on a
+ * published screen renders as `<section>` — still a grouping element, still
+ * where the author put it, and no longer competing with the layout's landmark.
+ */
+export declare const SECTION_ELEMENTS: readonly ["section", "div", "article", "aside", "nav", "header", "footer"];
+export type SectionElement = (typeof SECTION_ELEMENTS)[number];
+export interface SectionProps {
+    /** The DOM element rendered; defaults to `section`. */
+    element?: SectionElement;
+    /** Accessible name announced for landmark elements. */
+    ariaLabel?: string;
+    children?: JSX.Children;
+}
+/**
+ * Semantic grouping container (AGL-336): renders children inside the
+ * chosen W3C element so pages keep meaningful document structure
+ * (landmarks for assistive tech, better SEO outlines) instead of
+ * div-soup. Behaves like any container: droppable, stylable via sx,
+ * classes, and interactions.
+ */
+declare const Section: import("react").ForwardRefExoticComponent<SectionProps & import("react").RefAttributes<HTMLElement>>;
+export declare const schema: Aglyn.ComponentSchema<SectionProps>;
+export declare const presets: Aglyn.PresetSchema[];
+export default Section;