@supersoniks/concorde 5.0.5 → 5.1.1

package/docs/src/core/components/ui/menu/menu.md

@@ -1,370 +0,0 @@
-# Menu
-
-**`sonic-menu`** lays out navigation or actions as a **`direction`** row or column of **`sonic-menu-item`** entries (ghost **`variant`** and block **`shape`** by default), optional **`sonic-divider`** separators, and overflow content in the **`more`** slot (popover “…” trigger). Set **`href`** / **`pushstate`** / **`autoActive`** on each **`sonic-menu-item`**—same API as **`sonic-button`**—not on the menu host.
-
-## Basic example
-
-<sonic-code>
-  <template>
-    <sonic-menu direction="row">
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
-        Home
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item type="danger">
-        <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
-        Log out
-      </sonic-menu-item>
-    </sonic-menu>
-  </template>
-</sonic-code>
-
-## Direction
-
-Default **`direction`** is **`column`**. Use **`row`** for horizontal toolbars or tabs.
-
-<sonic-code>
-  <template>
-    <sonic-menu direction="row">
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="arrow-right" slot="prefix"></sonic-icon>
-        Row
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu-item type="danger">
-        <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
-        Log out
-      </sonic-menu-item>
-    </sonic-menu>
-    <sonic-menu direction="column">
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="arrow-down" slot="prefix"></sonic-icon>
-        Column
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu-item type="danger">
-        <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
-        Log out
-      </sonic-menu-item>
-    </sonic-menu>
-  </template>
-</sonic-code>
-
-## Size
-
-**`size`** on the menu propagates to items and the **`more`** trigger when they omit their own **`size`**.
-
-<sonic-code>
-  <template>
-    <div class="grid gap-3">
-      <sonic-menu size="xs" direction="row">
-        <sonic-menu-item>XS</sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-          History
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-          Orders
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu size="sm" direction="row">
-        <sonic-menu-item>Small</sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-          History
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-          Orders
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu direction="row">
-        <sonic-menu-item>Medium</sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-          History
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-          Orders
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu size="lg" direction="row">
-        <sonic-menu-item>Large</sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-          History
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-          Orders
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu size="xl" direction="row">
-        <sonic-menu-item>XL</sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-          History
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-          Orders
-        </sonic-menu-item>
-      </sonic-menu>
-    </div>
-  </template>
-</sonic-code>
-
-## Shadow
-
-Optional **`shadow`** wraps the menu surface (no shadow when omitted).
-
-<sonic-code>
-  <template>
-    <div class="grid gap-3">
-      <sonic-menu direction="row">
-        <sonic-menu-item>None</sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu shadow="sm" direction="row">
-        <sonic-menu-item>Small</sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu shadow="md" direction="row">
-        <sonic-menu-item>Medium</sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu shadow="lg" direction="row">
-        <sonic-menu-item>Large</sonic-menu-item>
-      </sonic-menu>
-    </div>
-  </template>
-</sonic-code>
-
-## Align
-
-**`align`** propagates to items except square / circle **`shape`**.
-
-<sonic-code>
-  <template>
-    <div class="grid gap-3">
-      <sonic-menu align="center">
-        <sonic-menu-item variant="ghost">
-          <sonic-icon library="iconoir" name="home"></sonic-icon>
-          Home
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu align="left">
-        <sonic-menu-item variant="ghost">
-          <sonic-icon library="iconoir" name="home"></sonic-icon>
-          Home
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-      </sonic-menu>
-      <sonic-menu align="right">
-        <sonic-menu-item variant="ghost">
-          <sonic-icon library="iconoir" name="home"></sonic-icon>
-          Home
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="user"></sonic-icon>
-          Profile
-        </sonic-menu-item>
-      </sonic-menu>
-    </div>
-  </template>
-</sonic-code>
-
-## More
-
-Assign nodes to **`slot="more"`** to show the overflow popover. The trigger appears only when the slot has content. Icon orientation follows **`direction`** (vertical ellipsis in a row menu).
-
-<sonic-code>
-  <template>
-    <sonic-menu direction="row">
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="home"></sonic-icon>
-        Home
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu slot="more">
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
-          Settings
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
-          Messages
-        </sonic-menu-item>
-        <sonic-divider></sonic-divider>
-        <sonic-menu-item type="danger">
-          <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
-          Log out
-        </sonic-menu-item>
-      </sonic-menu>
-    </sonic-menu>
-  </template>
-</sonic-code>
-
-## Scrollable
-
-With **`scrollable`**, the main slot scrolls with edge fade masks; drag-to-scroll works on pointer devices. When exactly one item is **`active`**, the menu scrolls it into view.
-
-<sonic-code>
-  <template>
-    <sonic-menu direction="row" scrollable>
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
-        Home
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
-        Home
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu-item variant="ghost">
-        <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
-        Home
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
-        Profile
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
-        History
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
-        Orders
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
-        Settings
-      </sonic-menu-item>
-      <sonic-menu-item>
-        <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
-        Messages
-      </sonic-menu-item>
-      <sonic-menu slot="more">
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
-          Settings
-        </sonic-menu-item>
-        <sonic-menu-item>
-          <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
-          Messages
-        </sonic-menu-item>
-        <sonic-divider></sonic-divider>
-        <sonic-menu-item type="danger">
-          <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
-          Log out
-        </sonic-menu-item>
-      </sonic-menu>
-    </sonic-menu>
-  </template>
-</sonic-code>
-
-## API reference
-
-| Attribute | Values | Description |
-|----------|---------|-------------|
-| `direction` | `column` (default) · `row` | Vertical list or horizontal bar |
-| `align` | `left` (default) · `center` · `right` | Alignment propagated to items (except square / circle **`shape`**) |
-| `size` | `xs` · `sm` · `md` · `lg` · `xl` | Propagated to items and the **`more`** trigger when unset on the item |
-| `shadow` | `sm` · `md` · `lg` | Shadow around the menu; omitted for none |
-| `minWidth` | CSS length | Minimum width of the container (default `0`) |
-| `scrollable` | boolean | Scroll with edge fade; auto-scroll when a single item is **`active`** |
-| `moreShape` | `circle` (default) · `square` | Shape of the **`more`** slot trigger button |
-
-| Slot | Description |
-|------|-------------|
-| *(default)* | Visible items: **`sonic-menu-item`**, **`sonic-divider`**, nested **`sonic-menu`** |
-| `more` | Popover content for the “…” control; shown only when the slot has assigned nodes |
-
-**`sonic-menu-item`** extends **`sonic-button`** (defaults: **`variant="ghost"`**, **`shape="block"`**). Use the button docs for **`type`**, **`variant`**, **`href`**, **`pushstate`**, **`autoActive`**, and item slots.

package/docs/src/core/components/ui/modal/modal.md

@@ -1,235 +0,0 @@
-# Modal
-
-**`sonic-modal`** presents focused content in a `<dialog>` overlay with backdrop, enter/exit animation, and a built-in close control. Compose **`sonic-modal-title`** / **`sonic-modal-subtitle`** / **`sonic-modal-content`** / **`sonic-modal-actions`**, or use the default slot. Call **`show()`** on the element to open; use **`hideModal`** on action buttons or **`hide()`** from script. Set **`forceAction`** when dismissal must go through explicit actions only. Imperative dialogs: **`Modal.create()`** (also **`window.SonicModal`**).
-
-## Basic example
-
-Click the trigger to open. **`sonic-modal-actions`** lays out footer buttons; **`hideModal`** closes the modal on click. Scope form state with **`formDataProvider`** on **`sonic-modal-actions`** so child **`sonic-button`** elements share one publisher.
-
-<sonic-code>
-  <template>
-    <sonic-button onclick="document.getElementById('modalExample').show()">
-      Open modal
-    </sonic-button>
-    <sonic-modal id="modalExample">
-      <sonic-modal-title>
-        Export ready
-        <sonic-badge type="success" size="sm">New</sonic-badge>
-      </sonic-modal-title>
-      <sonic-modal-subtitle>Your report finished processing.</sonic-modal-subtitle>
-      <sonic-modal-content>
-        Download the CSV now or review the summary in your dashboard before sharing.
-      </sonic-modal-content>
-      <sonic-modal-actions formDataProvider="ModalMiniForm">
-        <sonic-button minWidth="8rem" value="true" name="click">
-          Save draft
-        </sonic-button>
-        <sonic-button minWidth="8rem" type="success" hideModal>Download</sonic-button>
-      </sonic-modal-actions>
-    </sonic-modal>
-  </template>
-</sonic-code>
-
-## Scrollable content
-
-Long copy scrolls inside the dialog. Default **`maxHeight`** is `90vh`. Default **`align`** is `left`.
-
-<sonic-code>
-  <template>
-    <sonic-button onclick="document.getElementById('modalText').show()">Venue details</sonic-button>
-    <sonic-modal align="left" id="modalText">
-      <sonic-modal-title>Hours and tickets</sonic-modal-title>
-      <sonic-modal-content>
-        <div class="prose">
-          <p>
-            <strong>Opening hours</strong><br />
-            Wednesday–Saturday, 1:30 p.m.–7:00 p.m.; Sunday, 1:30 p.m.–6:00 p.m.
-          </p>
-          <p>
-            <strong>Ticketing</strong><br />
-            Some events require online or box-office reservations. Prices vary by event; booking ahead is recommended when capacity is limited.
-          </p>
-          <p>
-            <strong>Contact</strong><br />
-            tickets@example.com · +33 3 28 33 48 33
-          </p>
-          <p>
-            <strong>Access</strong><br />
-            14 Place Faidherbe, 59100 Roubaix<br />
-            Metro line 2, Eurotéléport stop
-          </p>
-        </div>
-      </sonic-modal-content>
-    </sonic-modal>
-  </template>
-</sonic-code>
-
-## Force action
-
-With **`forceAction`**, backdrop click, Escape, and the default close button are disabled. Provide **`sonic-modal-actions`** (or **`sonic-modal-close`**) so users can finish the flow.
-
-<sonic-code>
-  <template>
-    <sonic-button onclick="document.getElementById('force').show()">Cookie consent</sonic-button>
-    <sonic-modal forceAction id="force">
-      <sonic-modal-title>Allow analytics cookies?</sonic-modal-title>
-      <sonic-modal-content>
-        We use cookies to measure traffic and improve the product. You can change this later in settings.
-      </sonic-modal-content>
-      <sonic-modal-actions>
-        <sonic-button hideModal minWidth="8rem">Decline</sonic-button>
-        <sonic-button hideModal minWidth="8rem" type="success">Accept</sonic-button>
-      </sonic-modal-actions>
-    </sonic-modal>
-  </template>
-</sonic-code>
-
-## Custom dimensions
-
-Set **`width`** / **`height`** / **`maxWidth`** / **`maxHeight`** (CSS lengths). On narrow viewports the panel becomes a bottom sheet. Use **`rounded="none"`** for edge-to-edge media.
-
-<sonic-code>
-  <template>
-    <sonic-button onclick="document.getElementById('CustomWidth').show()">Image preview</sonic-button>
-    <sonic-modal
-      rounded="none"
-      maxHeight="50vh"
-      maxWidth="90vw"
-      width="100%"
-      height="100%"
-      id="CustomWidth"
-    >
-      <sonic-image
-        cover
-        objectPosition="center 20%"
-        src="https://thegoodlife.fr/wp-content/uploads/sites/2/2022/03/compagnies-aeriennes-nostalgie-coeur-insert-03-dr.jpg"
-        alt="View from an airplane window"
-      ></sonic-image>
-    </sonic-modal>
-  </template>
-</sonic-code>
-
-## Fullscreen
-
-**`fullscreen`** fills the viewport and hides the backdrop.
-
-<sonic-code>
-  <template>
-    <sonic-button onclick="document.getElementById('Fullscreen').show()">Fullscreen</sonic-button>
-    <sonic-modal fullscreen id="Fullscreen">
-      <sonic-image
-        cover
-        src="https://thegoodlife.fr/wp-content/uploads/sites/2/2022/03/compagnies-aeriennes-nostalgie-coeur-insert-03-dr.jpg"
-        alt="View from an airplane window"
-      ></sonic-image>
-    </sonic-modal>
-  </template>
-</sonic-code>
-
-## Programmatic creation
-
-Use **`Modal.create(options)`** when there is no modal in the template—for confirmations, toasts that need a follow-up, or one-off flows from script. The modal is appended to the nearest **`sonic-theme`** pop container (same as declarative modals), opened automatically, and returns the **`sonic-modal`** instance. Set **`removeOnHide: true`** to detach it from the DOM after close. In the browser, **`window.SonicModal`** is the same class after the module loads.
-
-Pass **`title`** / **`subtitle`** / **`content`** / **`actions`** as HTML strings (or Lit template results from application code). Put **`hideModal`** on action buttons in the **`actions`** string so clicks close the dialog.
-
-<sonic-code>
-  <template>
-    <sonic-button
-      onclick="window.SonicModal.create({
-        title: 'Send invite?',
-        subtitle: 'The recipient can join immediately.',
-        content: 'We will email an invitation to alex@example.com.',
-        actions: '&lt;sonic-button hideModal minWidth=\'8rem\'&gt;Cancel&lt;/sonic-button&gt;&lt;sonic-button hideModal minWidth=\'8rem\' type=\'success\'&gt;Send&lt;/sonic-button&gt;',
-        removeOnHide: true
-      })"
-    >
-      Open programmatic modal
-    </sonic-button>
-  </template>
-</sonic-code>
-
-<sonic-code language="javascript">
-  <template>
-import { Modal } from "@supersoniks/concorde/core/components/ui/modal/modal";
-
-const modal = Modal.create({
-  title: "Delete project?",
-  subtitle: "This cannot be undone.",
-  content: "<p>All files in <strong>Acme HQ</strong> will be removed.</p>",
-  actions: `
-    <sonic-button hideModal minWidth="8rem">Cancel</sonic-button>
-    <sonic-button hideModal minWidth="8rem" type="danger">Delete</sonic-button>
-  `,
-  removeOnHide: true,
-  forceAction: false,
-  maxWidth: "min(100vw, 28rem)",
-});
-
-modal.addEventListener("hidden", () => {
-  console.log("Modal removed from the DOM");
-});
-
-// Or close from script: await modal.hide(); await modal.dispose();
-  </template>
-</sonic-code>
-
-## API reference
-
-### `sonic-modal`
-
-| Attribute | Values | Description |
-|----------|---------|-------------|
-| `align` | `left` (default) · `center` · `right` | Align title and slotted content |
-| `maxWidth` | CSS length (default `min(100vw, 40rem)`) | Dialog max width |
-| `maxHeight` | CSS length (default `90vh`) | Scrollable body max height |
-| `width` | CSS length (default `100%`) | Dialog width |
-| `height` | CSS length (default `fit-content`) | Dialog height |
-| `paddingX` · `paddingY` | CSS length | Override content padding (`--sc-modal-px` / `--sc-modal-py`) |
-| `zIndex` | CSS number | Stacking order (default `990`) |
-| `effect` | `slide` (default) · `fade` · `none` | Open/close animation |
-| `fullscreen` | boolean | Full viewport; no backdrop |
-| `forceAction` | boolean | Disable overlay, Escape, and default close button |
-| `noCloseButton` | boolean | Hide built-in close when not **`forceAction`** |
-| `closeButtonType` | **`sonic-button`** `type` | Style of built-in close |
-| `visible` | boolean | When toggled, opens or closes the dialog |
-| `removeOnHide` | boolean | Remove element from DOM after close |
-| `removeHashOnHide` | boolean | Clear URL hash on close |
-| `closeOnLocationChange` | boolean | Close when app location changes |
-| `resetDataProviderOnHide` | string | Reset named **`formDataProvider`** on close |
-| `rounded` | `none` | Square dialog corners (useful for full-bleed media) |
-
-| Slot | Description |
-|------|-------------|
-| *(default)* | Additional markup alongside structured children |
-
-| Event | Description |
-|-------|-------------|
-| `show` | Fired when open animation completes |
-| `hide` | Fired when close starts |
-| `hidden` | Fired when close finishes |
-
-Methods: **`show()`** · **`hide()`** · **`dispose()`** (hide and remove). Static **`Modal.create(options)`** appends a modal to the theme pop container and opens it. **`options`** / **`styleSheet`** are JavaScript-only.
-
-### `sonic-modal-title` · `sonic-modal-subtitle` · `sonic-modal-content`
-
-| Slot | Description |
-|------|-------------|
-| *(default)* | Title, subtitle, or main body content |
-
-### `sonic-modal-actions`
-
-| Slot | Description |
-|------|-------------|
-| *(default)* | Footer actions (typically **`sonic-button`**) |
-
-Put **`hideModal`** on a **`sonic-button`** to close the parent modal on click. Ancestor **`formDataProvider`** on this element is inherited by child form controls.
-
-### `sonic-modal-close`
-
-Rendered automatically unless **`forceAction`** or **`noCloseButton`** is set. Calls **`hide()`** on the parent modal.
-
-| Attribute | Values | Description |
-|----------|---------|-------------|
-| `type` | **`sonic-button`** `type` | Close button color |
-| `reset` | string | Passed to inner **`sonic-button`** **`reset`** |
-| `translation` | UI label object | Overrides default close **`aria-label`** |