@aglyn/plugins-mui 1.0.0-beta.143

package/src/lib/components/button.js

@@ -0,0 +1,272 @@
+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 { mdiGestureTapButton } from "@aglyn/shared-data-mdi";
+import { getMdiIconPath } from "@aglyn/shared-data-mdi";
+import { AppLink, MdiIcon } from "@aglyn/shared-ui-jsx";
+import Button from "@mui/material/Button";
+import { forwardRef } from "react";
+import { BUNDLE_ID } from "../constants/bundle-common.js";
+import { withAuthorHtmlLabel } from "../utils/author-html-label.js";
+import { dropClearedProps } from "../utils/drop-cleared-props.js";
+import { FIELD_COLOR, FIELD_DISABLED, FIELD_FULL_WIDTH, FIELD_LINK_TARGET, FIELD_LINK_TARGET_NAME, FIELD_SIZE, FIELD_TEXT_CONTENT } from "../constants/field-presets.js";
+import { generatePresetId } from "../utils/generate-preset-id.js";
+import { linkTargetProps } from "../utils/link-target-props.js";
+// Component ids are persisted in screen documents; keep the legacy ids.
+export const ID = 'muiButton';
+/**
+ * What a button-styled LINK renders as while navigation is suppressed
+ * (besigner canvas, preview). `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. Mirrors `screen-link.tsx` (AGL-1347).
+ */ const STYLED_LINK_PLACEHOLDER = {
+    component: 'span',
+    role: undefined
+};
+/**
+ * mdi id → icon element; unknown/empty ids render nothing.
+ *
+ * Prefers the persisted path (AGL-1212) so render surfaces never need the
+ * ~2.9 MB catalog, and falls back to the catalog for buttons authored before
+ * paths were stored. `getMdiIconPath` rather than `getMdiIconFromId`: the
+ * latter substitutes `DEFAULT_ICON`, which has a real path, so a miss used to
+ * render a "help" glyph instead of nothing.
+ */ function iconFromId(iconId, iconPath) {
+    const path = iconPath || getMdiIconPath(iconId);
+    return path ? /*#__PURE__*/ _jsx(MdiIcon, {
+        path: path,
+        fontSize: "small"
+    }) : undefined;
+}
+/**
+ * Button with optional link mode (AGL-139): a screen id or external URL
+ * renders through AppLink exactly like the Screen Link component —
+ * degrading to a plain button in the besigner/preview and when the id
+ * doesn't resolve.
+ *
+ * Resolution (id-vs-URL precedence, protocol hardening) is `useLinkTarget`
+ * so a `Link`-typed component prop bound into EITHER field resolves the
+ * same way here as in Screen Link, Link Box and Image (AGL-1335).
+ *
+ * `renderAs="linkButton"` splits appearance from semantics in that link mode
+ * (AGL-1426), the same split `screen-link.tsx` got in AGL-1347. The 12 chips
+ * in "Dig in, or just say hello" on `aglyn.com/` are Buttons, not Screen
+ * Links: docs URLs, `mailto:` and social profiles, every one of them purely
+ * navigating, and every one announcing as a button — which tells a
+ * screen-reader user to expect an action and costs them the link list and
+ * the open-in-new-tab affordance. This mode keeps the `variant`/`size`/
+ * `fullWidth` pixels and drops the role, exactly as MUI's own
+ * `Button component={Link}` does.
+ *
+ * It only touches the link branch. A Button with no link target is a genuine
+ * `<button>` whose role is correct, so the value is inert there.
+ */ const LinkableButton = /*#__PURE__*/ forwardRef((props, ref)=>{
+    const { screenId, href: externalHref, startIconId, endIconId, startIconPath, endIconPath, renderAs, target, targetName, html } = props, spread = _object_without_properties_loose(props, [
+        "screenId",
+        "href",
+        "startIconId",
+        "endIconId",
+        "startIconPath",
+        "endIconPath",
+        "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).
+    //
+    // The formatted label (AGL-2557) is substituted for `children` here rather
+    // than at each return below, so the two branches keep one shape and an
+    // unformatted button renders the identical tree it always did.
+    const rest = withAuthorHtmlLabel(dropClearedProps(spread), html);
+    const iconProps = {
+        startIcon: iconFromId(startIconId, startIconPath),
+        endIcon: iconFromId(endIconId, endIconPath)
+    };
+    const { href, suppressNavigation, 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 plain-button
+    // and suppressed branches below never stamp it on a `<button>`.
+    const targetAttrs = linkTargetProps(target, targetName, leavesSite);
+    // Semantics and appearance are independent choices now (AGL-1426): 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 a
+        // suppressed styled link mirrors the live shape. Gated on `href` unlike
+        // `screen-link.tsx`: there, no target still means a link, but here it
+        // means a genuine button, which must keep being a real `<button>`.
+        return /*#__PURE__*/ _jsx(Button, _extends({
+            ref: ref
+        }, asStyledLink && href ? STYLED_LINK_PLACEHOLDER : {}, iconProps, rest));
+    }
+    return /*#__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. `'button'` is what
+        // `ButtonBase` stamps anyway, so nothing already authored moves.
+        role: asStyledLink ? undefined : 'button'
+    }, iconProps, rest));
+});
+LinkableButton.displayName = 'LinkableButton';
+export const schema = {
+    $id: ID,
+    pluginId: BUNDLE_ID,
+    displayName: 'Button',
+    description: 'A button — or a link styled as one, if you point it at a screen or URL.',
+    category: Aglyn.ComponentCategory.INPUT,
+    icon: {
+        path: mdiGestureTapButton.path,
+        sx: {
+            color: '#2196f3'
+        }
+    },
+    flags: {
+        textEditable: Aglyn.FEATURE_FLAG.ENABLED,
+        richTextEditable: Aglyn.FEATURE_FLAG.ENABLED
+    },
+    // Emphasis only (AGL-2557). With no link target this is a real `<button>`,
+    // whose content model admits no list and no nested control; with one it is
+    // an `<a>`, where a second anchor is the same invalid nesting. Both shapes
+    // land on the same answer, so the schema does not have to know which one
+    // an author picked.
+    richTextCommands: [
+        Aglyn.RICH_TEXT_COMMANDS.EMPHASIS
+    ],
+    attributes: [
+        FIELD_TEXT_CONTENT,
+        FIELD_COLOR,
+        FIELD_DISABLED,
+        FIELD_FULL_WIDTH,
+        FIELD_SIZE,
+        {
+            name: 'variant',
+            description: 'How much weight the button carries: Contained is a filled primary ' + 'action, Outlined a secondary one, Text the lightest. One contained ' + 'button per view is a good rule.',
+            component: Aglyn.FieldComponentType.SELECT,
+            label: 'Variant',
+            // "Default" deleted (AGL-1453): it could not persist, and `text` — the
+            // value it resolved to, MUI's own default — is already on the list.
+            options: [
+                {
+                    value: 'text',
+                    label: 'Text'
+                },
+                {
+                    value: 'outlined',
+                    label: 'Outlined'
+                },
+                {
+                    value: 'contained',
+                    label: 'Contained'
+                }
+            ]
+        },
+        {
+            name: 'screenId',
+            description: 'Optional: navigate to this screen when clicked — the address ' + 'follows the published path like a Screen Link (AGL-139).',
+            component: Aglyn.FieldComponentType.SCREEN_SELECT,
+            label: 'Link to screen'
+        },
+        {
+            name: 'href',
+            description: 'Where the button goes when it points off this site. Ignored while ' + 'Link to screen names one — that field wins, so clear it to use a ' + 'URL. Absolute (https://…) for another site, or a path for one of ' + 'your own routes.',
+            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 once it links somewhere. Button is for ' + 'calls to action; pick "Link (button styling)" for a chip that only ' + 'navigates, so it keeps this look but announces as the link it is. ' + 'Ignored when there is no screen or URL to point at.',
+            component: Aglyn.FieldComponentType.SELECT,
+            label: 'Render as',
+            // `'button'` is a REAL SENTINEL, not a deletion (AGL-1453). Unlike the
+            // "Default" options on this component, `''` here spelled an author's
+            // actual choice, and one they could not make: the attributes form
+            // strips `''` before save (AGL-1191), so a button switched to Link
+            // (button styling) had no route in this dropdown back to Button — the
+            // pick reverted and the stored `linkButton` stayed.
+            //
+            // Safe because `renderAs` never reaches MUI: it is destructured out
+            // above and read only as `renderAs === 'linkButton'`. So `'button'` and
+            // an absent value take the identical branch, which is also what keeps
+            // every button authored before this existed rendering unchanged.
+            options: [
+                {
+                    value: 'button',
+                    label: 'Button'
+                },
+                {
+                    value: 'linkButton',
+                    label: 'Link (button styling)'
+                }
+            ]
+        },
+        {
+            name: 'startIconId',
+            description: 'Icon shown before the label.',
+            component: Aglyn.FieldComponentType.ICON_PICKER,
+            label: 'Start icon'
+        },
+        {
+            name: 'endIconId',
+            description: 'Icon shown after the label.',
+            component: Aglyn.FieldComponentType.ICON_PICKER,
+            label: 'End icon'
+        }
+    ]
+};
+export const presets = [
+    {
+        $id: generatePresetId(ID),
+        type: Aglyn.NodeType.PRESET,
+        displayName: 'Outlined Button',
+        icon: {
+            path: mdiGestureTapButton.path,
+            sx: {
+                color: '#2196f3'
+            }
+        },
+        category: Aglyn.ComponentCategory.INPUT,
+        data: {
+            $id: null,
+            componentId: ID,
+            pluginId: BUNDLE_ID,
+            props: {
+                variant: 'outlined',
+                children: 'Click Me'
+            }
+        }
+    }
+];
+export default LinkableButton;
+
+//# sourceMappingURL=button.js.map

package/src/lib/components/button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/mui/src/lib/components/button.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 { mdiGestureTapButton } from '@aglyn/shared-data-mdi'\nimport { getMdiIconPath } from '@aglyn/shared-data-mdi'\nimport { AppLink, MdiIcon } from '@aglyn/shared-ui-jsx'\nimport Button, { type ButtonProps } from '@mui/material/Button'\nimport { forwardRef } from 'react'\nimport { BUNDLE_ID } from '../constants/bundle-common'\nimport { withAuthorHtmlLabel } from '../utils/author-html-label'\nimport { dropClearedProps } from '../utils/drop-cleared-props'\nimport {\n  FIELD_COLOR,\n  FIELD_DISABLED,\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 { 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; keep the legacy ids.\nexport const ID: Aglyn.ComponentId = 'muiButton'\n\nexport interface LinkableButtonProps extends ButtonProps {\n  /** Target screen id; resolved from the routing map (AGL-139). */\n  screenId?: string\n  /** External URL, used only when no `screenId` is set. */\n  href?: string\n  /** mdi icon id rendered before the label (AGL-146). */\n  startIconId?: string\n  /** mdi icon id rendered after the label (AGL-146). */\n  endIconId?: string\n  /** Resolved SVG path for `startIconId`, stored at author time (AGL-1212). */\n  startIconPath?: string\n  /** Resolved SVG path for `endIconId`, stored at author time (AGL-1212). */\n  endIconPath?: string\n  /**\n   * What the LINK MODE announces as (AGL-1426). Persisted in screen\n   * documents; never rename, and `undefined` must keep meaning `'button'` —\n   * every button authored before this existed is one.\n   *\n   * - `'button'` (or unset) — `<a role=\"button\">` with the button's look.\n   * - `'linkButton'` — a plain `<a>` with NO role, keeping the button's\n   *   `variant`/`size`/`fullWidth`. Appearance without semantics.\n   *\n   * There is no `'link'` value here: a plain text link is `muiScreenLink`'s\n   * job, and this component's whole purpose is the button styling.\n   */\n  renderAs?: 'button' | 'linkButton'\n  /**\n   * Where LINK MODE opens. Persisted in screen documents; never rename a\n   * value, and `undefined` must keep meaning `'_self'`. Inert on a button\n   * with nothing to point at — that is a real `<button>`, which has no\n   * browsing context to choose.\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 while navigation is suppressed\n * (besigner canvas, preview). `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. Mirrors `screen-link.tsx` (AGL-1347).\n */\nconst STYLED_LINK_PLACEHOLDER = { component: 'span', role: undefined } as const\n\n/**\n * mdi id → icon element; unknown/empty ids render nothing.\n *\n * Prefers the persisted path (AGL-1212) so render surfaces never need the\n * ~2.9 MB catalog, and falls back to the catalog for buttons authored before\n * paths were stored. `getMdiIconPath` rather than `getMdiIconFromId`: the\n * latter substitutes `DEFAULT_ICON`, which has a real path, so a miss used to\n * render a \"help\" glyph instead of nothing.\n */\nfunction iconFromId(iconId?: string, iconPath?: string) {\n  const path = iconPath || getMdiIconPath(iconId)\n  return path ? <MdiIcon path={path} fontSize=\"small\" /> : undefined\n}\n\n/**\n * Button with optional link mode (AGL-139): a screen id or external URL\n * renders through AppLink exactly like the Screen Link component —\n * degrading to a plain button in the besigner/preview and when the id\n * doesn't resolve.\n *\n * Resolution (id-vs-URL precedence, protocol hardening) is `useLinkTarget`\n * so a `Link`-typed component prop bound into EITHER field resolves the\n * same way here as in Screen Link, Link Box and Image (AGL-1335).\n *\n * `renderAs=\"linkButton\"` splits appearance from semantics in that link mode\n * (AGL-1426), the same split `screen-link.tsx` got in AGL-1347. The 12 chips\n * in \"Dig in, or just say hello\" on `aglyn.com/` are Buttons, not Screen\n * Links: docs URLs, `mailto:` and social profiles, every one of them purely\n * navigating, and every one announcing as a button — which tells a\n * screen-reader user to expect an action and costs them the link list and\n * the open-in-new-tab affordance. This mode keeps the `variant`/`size`/\n * `fullWidth` pixels and drops the role, exactly as MUI's own\n * `Button component={Link}` does.\n *\n * It only touches the link branch. A Button with no link target is a genuine\n * `<button>` whose role is correct, so the value is inert there.\n */\nconst LinkableButton = forwardRef<any, LinkableButtonProps>((props, ref) => {\n  const {\n    screenId,\n    href: externalHref,\n    startIconId,\n    endIconId,\n    startIconPath,\n    endIconPath,\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).\n  //\n  // The formatted label (AGL-2557) is substituted for `children` here rather\n  // than at each return below, so the two branches keep one shape and an\n  // unformatted button renders the identical tree it always did.\n  const rest = withAuthorHtmlLabel(dropClearedProps(spread), html)\n  const iconProps = {\n    startIcon: iconFromId(startIconId, startIconPath),\n    endIcon: iconFromId(endIconId, endIconPath),\n  }\n  const { href, suppressNavigation, leavesSite } = Aglyn.useLinkTarget(\n    screenId,\n    externalHref,\n  )\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 plain-button\n  // and suppressed branches below never stamp it on a `<button>`.\n  const targetAttrs = linkTargetProps(target, targetName, leavesSite)\n  // Semantics and appearance are independent choices now (AGL-1426): 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 a\n    // suppressed styled link mirrors the live shape. Gated on `href` unlike\n    // `screen-link.tsx`: there, no target still means a link, but here it\n    // means a genuine button, which must keep being a real `<button>`.\n    return (\n      <Button\n        ref={ref}\n        {...(asStyledLink && href ? STYLED_LINK_PLACEHOLDER : {})}\n        {...iconProps}\n        {...rest}\n      />\n    )\n  }\n  return (\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. `'button'` is what\n      // `ButtonBase` stamps anyway, so nothing already authored moves.\n      role={asStyledLink ? undefined : 'button'}\n      {...iconProps}\n      {...rest}\n    />\n  )\n})\nLinkableButton.displayName = 'LinkableButton'\n\nexport const schema: Aglyn.ComponentSchema<LinkableButtonProps> = {\n  $id: ID,\n  pluginId: BUNDLE_ID,\n  displayName: 'Button',\n  description:\n    'A button — or a link styled as one, if you point it at a screen or URL.',\n  category: Aglyn.ComponentCategory.INPUT,\n  icon: {\n    path: mdiGestureTapButton.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). With no link target this is a real `<button>`,\n  // whose content model admits no list and no nested control; with one it is\n  // an `<a>`, where a second anchor is the same invalid nesting. Both shapes\n  // land on the same answer, so the schema does not have to know which one\n  // an author picked.\n  richTextCommands: [Aglyn.RICH_TEXT_COMMANDS.EMPHASIS],\n  attributes: [\n    FIELD_TEXT_CONTENT,\n    FIELD_COLOR,\n    FIELD_DISABLED,\n    FIELD_FULL_WIDTH,\n    FIELD_SIZE,\n    {\n      name: 'variant',\n      description:\n        'How much weight the button carries: Contained is a filled primary ' +\n        'action, Outlined a secondary one, Text the lightest. One contained ' +\n        'button per view is a good rule.',\n      component: Aglyn.FieldComponentType.SELECT,\n      label: 'Variant',\n      // \"Default\" deleted (AGL-1453): it could not persist, and `text` — the\n      // value it resolved to, MUI's own default — is already on the list.\n      options: [\n        { value: 'text', label: 'Text' },\n        { value: 'outlined', label: 'Outlined' },\n        { value: 'contained', label: 'Contained' },\n      ],\n    },\n    {\n      name: 'screenId',\n      description:\n        'Optional: navigate to this screen when clicked — the address ' +\n        'follows the published path like a Screen Link (AGL-139).',\n      component: Aglyn.FieldComponentType.SCREEN_SELECT,\n      label: 'Link to screen',\n    },\n    {\n      name: 'href',\n      description:\n        'Where the button goes when it points off this site. Ignored while ' +\n        'Link to screen names one — that field wins, so clear it to use a ' +\n        'URL. Absolute (https://…) for another site, or a path for one of ' +\n        'your own routes.',\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 once it links somewhere. Button is for ' +\n        'calls to action; pick \"Link (button styling)\" for a chip that only ' +\n        'navigates, so it keeps this look but announces as the link it is. ' +\n        'Ignored when there is no screen or URL to point at.',\n      component: Aglyn.FieldComponentType.SELECT,\n      label: 'Render as',\n      // `'button'` is a REAL SENTINEL, not a deletion (AGL-1453). Unlike the\n      // \"Default\" options on this component, `''` here spelled an author's\n      // actual choice, and one they could not make: the attributes form\n      // strips `''` before save (AGL-1191), so a button switched to Link\n      // (button styling) had no route in this dropdown back to Button — the\n      // pick reverted and the stored `linkButton` stayed.\n      //\n      // Safe because `renderAs` never reaches MUI: it is destructured out\n      // above and read only as `renderAs === 'linkButton'`. So `'button'` and\n      // an absent value take the identical branch, which is also what keeps\n      // every button authored before this existed rendering unchanged.\n      options: [\n        { value: 'button', label: 'Button' },\n        { value: 'linkButton', label: 'Link (button styling)' },\n      ],\n    },\n    {\n      name: 'startIconId',\n      description: 'Icon shown before the label.',\n      component: Aglyn.FieldComponentType.ICON_PICKER,\n      label: 'Start icon',\n    },\n    {\n      name: 'endIconId',\n      description: 'Icon shown after the label.',\n      component: Aglyn.FieldComponentType.ICON_PICKER,\n      label: 'End icon',\n    },\n  ],\n}\n\nexport const presets: Aglyn.PresetSchema[] = [\n  {\n    $id: generatePresetId(ID),\n    type: Aglyn.NodeType.PRESET,\n    displayName: 'Outlined Button',\n    icon: {\n      path: mdiGestureTapButton.path,\n      sx: { color: '#2196f3' },\n    },\n    category: Aglyn.ComponentCategory.INPUT,\n    data: {\n      $id: null,\n      componentId: ID,\n      pluginId: BUNDLE_ID,\n      props: {\n        variant: 'outlined',\n        children: 'Click Me',\n      },\n    },\n  },\n]\n\nexport default LinkableButton\n"],"names":["Aglyn","mdiGestureTapButton","getMdiIconPath","AppLink","MdiIcon","Button","forwardRef","BUNDLE_ID","withAuthorHtmlLabel","dropClearedProps","FIELD_COLOR","FIELD_DISABLED","FIELD_FULL_WIDTH","FIELD_LINK_TARGET","FIELD_LINK_TARGET_NAME","FIELD_SIZE","FIELD_TEXT_CONTENT","generatePresetId","linkTargetProps","ID","STYLED_LINK_PLACEHOLDER","component","role","undefined","iconFromId","iconId","iconPath","path","fontSize","LinkableButton","props","ref","screenId","href","externalHref","startIconId","endIconId","startIconPath","endIconPath","renderAs","target","targetName","html","spread","rest","iconProps","startIcon","endIcon","suppressNavigation","leavesSite","useLinkTarget","targetAttrs","asStyledLink","componentVariant","displayName","schema","$id","pluginId","description","category","ComponentCategory","INPUT","icon","sx","color","flags","textEditable","FEATURE_FLAG","ENABLED","richTextEditable","richTextCommands","RICH_TEXT_COMMANDS","EMPHASIS","attributes","name","FieldComponentType","SELECT","label","options","value","SCREEN_SELECT","TEXT_FIELD","resolveProps","bareFragmentLinkFieldProps","ICON_PICKER","presets","type","NodeType","PRESET","data","componentId","variant","children"],"mappings":"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"}

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

@@ -0,0 +1,61 @@
+/**
+ * @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 { type ReactNode } from 'react';
+export declare const CARD_ID: Aglyn.ComponentId;
+export declare const CARD_HEADER_ID: Aglyn.ComponentId;
+export declare const CARD_CONTENT_ID: Aglyn.ComponentId;
+export declare const CARD_ACTIONS_ID: Aglyn.ComponentId;
+export interface CardElementProps {
+    variant?: 'elevation' | 'outlined';
+    /** Shadow depth, 0–24; ignored on the outlined variant. */
+    elevation?: number | string;
+    children?: ReactNode;
+}
+export interface CardHeaderElementProps {
+    title?: string;
+    subheader?: string;
+}
+export interface CardActionsElementProps {
+    /** If true, the 8px gap between action buttons is removed. */
+    disableSpacing?: boolean;
+    children?: ReactNode;
+}
+/**
+ * Card (https://mui.com/material-ui/react-card/) — a Paper with card
+ * padding conventions. Composed from separate Header/Content/Actions
+ * elements rather than a single element with a dozen text props, so the
+ * pieces are individually selectable, stylable and reorderable on the
+ * canvas like everything else.
+ */
+declare const CardElement: import("react").ForwardRefExoticComponent<CardElementProps & import("react").RefAttributes<HTMLDivElement>>;
+/**
+ * Card header. `title`/`subheader` are plain strings: MUI wraps each in
+ * its own Typography, and passing children instead would drop the
+ * heading/subheading type scale a card header exists to provide.
+ */
+export declare const CardHeaderElement: import("react").ForwardRefExoticComponent<CardHeaderElementProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const CardContentElement: import("react").ForwardRefExoticComponent<{
+    children?: ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const CardActionsElement: import("react").ForwardRefExoticComponent<CardActionsElementProps & import("react").RefAttributes<HTMLDivElement>>;
+export declare const cardSchema: Aglyn.ComponentSchema<CardElementProps>;
+export declare const cardHeaderSchema: Aglyn.ComponentSchema<CardHeaderElementProps>;
+export declare const cardContentSchema: Aglyn.ComponentSchema;
+export declare const cardActionsSchema: Aglyn.ComponentSchema<CardActionsElementProps>;
+export declare const cardPresets: Aglyn.PresetSchema[];
+export default CardElement;