Admiral UI kit
Every component, with the Blade that produced it and the HTML for any other stack.
Actions
Button
Blade
<x-admin::toolbar>
<x-admin::button variant="primary" icon="plus">New segment</x-admin::button>
<x-admin::button>Cancel</x-admin::button>
<x-admin::button variant="outline">Preview</x-admin::button>
<x-admin::button variant="ghost">Skip</x-admin::button>
<x-admin::button variant="destructive">Delete</x-admin::button>
<x-admin::button variant="link" href="#">View history</x-admin::button>
</x-admin::toolbar>
<x-admin::stack gap="2" class="mt" style="max-width:20rem">
<x-admin::button block icon="plus">New segment</x-admin::button>
<x-admin::button variant="primary" block icon="search">Look up user</x-admin::button>
</x-admin::stack>
<x-admin::toolbar class="mt">
<x-admin::button variant="primary" size="xs">Extra small</x-admin::button>
<x-admin::button variant="primary" size="sm">Small</x-admin::button>
<x-admin::button variant="primary">Default</x-admin::button>
<x-admin::button variant="primary" size="lg">Large</x-admin::button>
<x-admin::button variant="primary" loading>Saving</x-admin::button>
<x-admin::button disabled>Disabled</x-admin::button>
<x-admin::button shape="square" icon="edit" aria-label="Edit" />
<x-admin::button shape="circle" icon="plus" aria-label="Add" />
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><button type="button" class="adm-btn adm-btn--primary" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>New segment</button>
<button type="button" class="adm-btn adm-btn--secondary" >Cancel</button>
<button type="button" class="adm-btn adm-btn--outline" >Preview</button>
<button type="button" class="adm-btn adm-btn--ghost" >Skip</button>
<button type="button" class="adm-btn adm-btn--destructive" >Delete</button>
<a href="#" class="adm-btn adm-btn--link">View history</a></div>
<div class="adm-stack mt" style="gap:var(--ad-space-2); max-width:20rem;"><button type="button" class="adm-btn adm-btn--secondary adm-btn--block" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>New segment</button>
<button type="button" class="adm-btn adm-btn--primary adm-btn--block" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg>Look up user</button></div>
<div class="adm-toolbar mt" role="toolbar"><button type="button" class="adm-btn adm-btn--primary adm-btn--xs" >Extra small</button>
<button type="button" class="adm-btn adm-btn--primary adm-btn--sm" >Small</button>
<button type="button" class="adm-btn adm-btn--primary" >Default</button>
<button type="button" class="adm-btn adm-btn--primary adm-btn--lg" >Large</button>
<button type="button" class="adm-btn adm-btn--primary" aria-busy="true" >Saving</button>
<button type="button" class="adm-btn adm-btn--secondary" disabled="disabled" >Disabled</button>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--square" aria-label="Edit" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg></button>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--circle" aria-label="Add" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg></button></div>
Button group
Blade
<x-admin::button-group>
<x-admin::button>Day</x-admin::button>
<x-admin::button>Week</x-admin::button>
<x-admin::button>Month</x-admin::button>
</x-admin::button-group>
HTML, for other stacks
<div class="adm-btn-group" role="group"><button type="button" class="adm-btn adm-btn--secondary" >Day</button>
<button type="button" class="adm-btn adm-btn--secondary" >Week</button>
<button type="button" class="adm-btn adm-btn--secondary" >Month</button></div>
Dropdown
Blade
<x-admin::toolbar>
<x-admin::dropdown label="Actions" icon="settings">
<x-admin::dropdown-item href="#" icon="edit">Edit</x-admin::dropdown-item>
<x-admin::dropdown-item href="#" icon="copy">Duplicate</x-admin::dropdown-item>
<x-admin::dropdown-separator />
<x-admin::dropdown-item icon="trash" destructive>Delete</x-admin::dropdown-item>
</x-admin::dropdown>
<x-admin::dropdown label="Rina Halim" icon="user">
<x-admin::dropdown-header>Signed in as rina@example.com</x-admin::dropdown-header>
<x-admin::dropdown-separator />
<x-admin::dropdown-item href="#" icon="user">Profile</x-admin::dropdown-item>
<x-admin::dropdown-item href="#" icon="logout">Sign out</x-admin::dropdown-item>
</x-admin::dropdown>
<x-admin::dropdown sr-label="Row actions">
<x-admin::dropdown-item href="#" icon="edit">Edit rule</x-admin::dropdown-item>
</x-admin::dropdown>
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><details class="adm-dropdown">
<summary class="adm-btn adm-btn--secondary adm-dropdown__trigger--icon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1"/></svg><span class="adm-dropdown__label">Actions</span><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></summary>
<div class="adm-menu"><a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg>Edit</a>
<a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg>Duplicate</a>
<div class="adm-menu__sep" role="separator"></div>
<button type="button" class="adm-menu__item adm-menu__item--destructive"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg>Delete</button></div>
</details>
<details class="adm-dropdown">
<summary class="adm-btn adm-btn--secondary adm-dropdown__trigger--icon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="8" r="4"/><path d="M4 21a8 8 0 0 1 16 0"/></svg><span class="adm-dropdown__label">Rina Halim</span><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></summary>
<div class="adm-menu"><div class="adm-menu__header" role="presentation">Signed in as rina@example.com</div>
<div class="adm-menu__sep" role="separator"></div>
<a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="8" r="4"/><path d="M4 21a8 8 0 0 1 16 0"/></svg>Profile</a>
<a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 21H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h4M16 17l5-5-5-5M21 12H9"/></svg>Sign out</a></div>
</details>
<details class="adm-dropdown">
<summary class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" aria-label="Row actions"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="5" cy="12" r="1.2" fill="currentColor"/><circle cx="12" cy="12" r="1.2" fill="currentColor"/><circle cx="19" cy="12" r="1.2" fill="currentColor"/></svg></summary>
<div class="adm-menu"><a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg>Edit rule</a></div>
</details></div>
Notification menu
Blade
<x-admin::toolbar>
<x-admin::notification-menu id="g-notify" view-all="#" :items="[
['title' => 'Sheet export failed', 'description' => 'Quota exceeded. Retrying in 15 minutes.', 'time' => '3 hours ago', 'href' => '#'],
['title' => 'Rebuild finished: Early entry', 'time' => 'Yesterday', 'href' => '#', 'unread' => false],
]" />
<x-admin::notification-menu :count="120" />
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><details class="adm-dropdown adm-notify" id="g-notify">
<summary class="adm-btn adm-btn--secondary adm-btn--square">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9M10.3 21a1.94 1.94 0 0 0 3.4 0"/></svg> <span class="adm-sr-only">1 unread notification</span>
<span class="adm-notify__count" aria-hidden="true">1</span> </summary>
<div class="adm-menu adm-notify__menu">
<div class="adm-menu__header">Notifications</div>
<a class="adm-notify__item adm-notify__item--unread" href="#" >
<span class="adm-notify__title">Sheet export failed</span>
<span class="adm-notify__text">Quota exceeded. Retrying in 15 minutes.</span> <span class="adm-notify__text">3 hours ago</span> </a>
<a class="adm-notify__item" href="#" >
<span class="adm-notify__title">Rebuild finished: Early entry</span>
<span class="adm-notify__text">Yesterday</span> </a>
<div class="adm-menu__sep" role="separator"></div>
<a class="adm-menu__item" href="#">View all</a>
</div>
</details>
<details class="adm-dropdown adm-notify">
<summary class="adm-btn adm-btn--secondary adm-btn--square">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9M10.3 21a1.94 1.94 0 0 0 3.4 0"/></svg> <span class="adm-sr-only">120 unread notifications</span>
<span class="adm-notify__count" aria-hidden="true">99+</span> </summary>
<div class="adm-menu adm-notify__menu">
<div class="adm-menu__header">Notifications</div>
<div class="adm-notify__empty">No new notifications</div>
</div>
</details></div>
Export menu
Export
Blade
<x-admin::export-menu url="/perks/export?status=live" id="g-export" />
HTML, for other stacks
<details class="adm-dropdown" id="g-export">
<summary class="adm-btn adm-btn--secondary adm-dropdown__trigger--icon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v12M7 10l5 5 5-5M5 21h14"/></svg><span class="adm-dropdown__label">Export</span><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></summary>
<div class="adm-menu"><a href="/perks/export?status=live&format=csv" class="adm-menu__item">CSV</a>
<a href="/perks/export?status=live&format=xlsx" class="adm-menu__item">Excel</a>
<button type="button" class="adm-menu__item" data-adm-copy-url="/perks/export?status=live&format=tsv"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg>Copy</button>
<a href="/perks/export?status=live&format=print" class="adm-menu__item" target="_blank">Print</a>
<a href="/perks/export?status=live&format=pdf" class="adm-menu__item">PDF</a></div>
</details>
Toggle and segmented
Blade
<x-admin::toolbar>
<x-admin::toggle name="failing" icon="filter" checked>Failing only</x-admin::toggle>
<x-admin::segmented name="view" label="View" value="table" :options="['table' => 'Table', 'board' => 'Board']" />
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><label class="adm-toggle"><input type="checkbox" name="failing" value="1" checked ><span><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 5h18l-7 8v6l-4 2v-8z"/></svg>Failing only</span></label>
<div class="adm-segmented" role="radiogroup" aria-label="View" >
<label><input type="radio" name="view" value="table" checked><span>Table</span></label>
<label><input type="radio" name="view" value="board" ><span>Board</span></label>
</div></div>
Link
Blade
<x-admin::link href="#">Field dictionary</x-admin::link> and
<x-admin::link href="https://example.com" external>external docs</x-admin::link>
HTML, for other stacks
<a href="#" class="adm-link">Field dictionary</a>
and
<a href="https://example.com" class="adm-link" target="_blank" rel="noopener noreferrer">external docs<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5"/></svg><span class="adm-sr-only"> (opens in a new tab)</span></a>
Forms
Input
Shown to admins only.
$
USD
Use a cron expression, for example */5 * * * *.
15 / 40
Lower case, digits and underscores.
Blade
<x-admin::form-grid>
<x-admin::input name="g_name" label="Segment name" hint="Shown to admins only." value="Lapsed members" required />
<x-admin::input name="g_search" label="Search" icon="search" placeholder="Filter by name" optional />
<x-admin::input name="g_price" label="Price" prefix="$" suffix="USD" type="number" value="120" />
<x-admin::input name="g_schedule" label="Schedule" value="every 5 min" error="Use a cron expression, for example */5 * * * *." />
<x-admin::input name="g_slug" label="Segment ID" value="seg_lapsed_2025" maxlength="40" counter mono hint="Lower case, digits and underscores." />
</x-admin::form-grid>
HTML, for other stacks
<div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_name">Segment name <span class="adm-error" aria-hidden="true">*</span></label>
<input
type="text"
name="g_name" id="g_name" value="Lapsed members" required aria-describedby="g_name-hint" class="adm-input"
>
<span class="adm-hint" id="g_name-hint">Shown to admins only.</span> </div>
<div class="adm-field">
<label class="adm-label" for="g_search">Search <span class="adm-label__optional">(optional)</span></label>
<div class="adm-input-group"> <span class="adm-input-group__addon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg></span> <input
type="text"
name="g_search" id="g_search" class="adm-input" placeholder="Filter by name"
>
</div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_price">Price</label>
<div class="adm-input-group"> <span class="adm-input-group__addon">$</span> <input
type="number"
name="g_price" id="g_price" value="120" class="adm-input"
>
<span class="adm-input-group__addon">USD</span> </div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_schedule">Schedule</label>
<input
type="text"
name="g_schedule" id="g_schedule" value="every 5 min" aria-invalid="true" aria-describedby="g_schedule-error" class="adm-input"
>
<span class="adm-error" id="g_schedule-error">Use a cron expression, for example */5 * * * *.</span></div>
<div class="adm-field">
<label class="adm-label" for="g_slug">Segment ID</label>
<input
type="text"
name="g_slug" id="g_slug" value="seg_lapsed_2025" aria-describedby="g_slug-hint g_slug-counter" class="adm-input adm-mono" maxlength="40"
>
<span class="adm-counter " id="g_slug-counter" data-adm-counter="g_slug" data-max="40" >15 / 40</span>
<span class="adm-sr-only" aria-live="polite" data-adm-counter-live></span>
<span class="adm-hint" id="g_slug-hint">Lower case, digits and underscores.</span> </div></div>
Textarea
0 / 200
Kept in the history.
Blade
<x-admin::textarea name="g_notes" label="Notes" rows="3" hint="Kept in the history." maxlength="200" counter optional />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_notes">Notes <span class="adm-label__optional">(optional)</span></label>
<textarea
name="g_notes" id="g_notes" rows="3"
aria-describedby="g_notes-hint g_notes-counter" class="adm-textarea" maxlength="200"
></textarea>
<span class="adm-counter " id="g_notes-counter" data-adm-counter="g_notes" data-max="200" >0 / 200</span>
<span class="adm-sr-only" aria-live="polite" data-adm-counter-live></span>
<span class="adm-hint" id="g_notes-hint">Kept in the history.</span> </div>
Rich text
Blade
<x-admin::rich-text name="g_body" id="g_body" label="Perk description" hint="Shown to members in the portal." value="<p>Early entry for <strong>club members</strong>.</p><ul><li>10% off</li></ul>" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_body">Perk description</label>
<div class="adm-richtext" data-adm-richtext style="--_rows:6">
<div class="adm-richtext__toolbar" role="toolbar" aria-label="Text formatting" hidden>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="bold" aria-pressed="false" aria-label="Bold"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M7 5h6a3.5 3.5 0 0 1 0 7H7zM7 12h7a3.5 3.5 0 0 1 0 7H7z"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="italic" aria-pressed="false" aria-label="Italic"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M15 5h-5M14 19H9M14 5l-4 14"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="underline" aria-pressed="false" aria-label="Underline"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M7 5v6a5 5 0 0 0 10 0V5M5 20h14"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="h2" aria-pressed="false" aria-label="H2 heading">H2</button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="h3" aria-pressed="false" aria-label="H3 heading">H3</button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="ul" aria-pressed="false" aria-label="Bulleted list"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="ol" aria-pressed="false" aria-label="Numbered list"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10 6h10M10 12h10M10 18h10M4 5l1.5-1v6M4 15.5a1.5 1.5 0 0 1 3 0c0 1-3 2-3 3.5h3"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="quote" aria-pressed="false" aria-label="Quote"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 7H5v6h4v-6zM9 13c0 2-1 4-3 4M19 7h-4v6h4V7zM19 13c0 2-1 4-3 4"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-rt="link" aria-pressed="false" aria-label="Link"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10 14a4 4 0 0 0 6 .5l3-3a4 4 0 0 0-5.7-5.7l-1.5 1.5M14 10a4 4 0 0 0-6-.5l-3 3a4 4 0 0 0 5.7 5.7l1.5-1.5"/></svg></button>
</div>
<div class="adm-richtext__link" hidden>
<label class="adm-richtext__link-field"><span class="adm-small">Link address</span><input type="url" class="adm-input"></label>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" data-adm-rt-apply>Apply</button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--sm" data-adm-rt-cancel>Cancel</button>
</div>
<textarea
name="g_body" id="g_body" rows="6"
aria-describedby="g_body-hint" class="adm-textarea adm-richtext__source"
><p>Early entry for <strong>club members</strong>.</p><ul><li>10% off</li></ul></textarea>
</div>
<script >(()=>{var Ju=Object.create;var wn=Object.defineProperty;var tf=Object.getOwnPropertyDescriptor;var ef=Object.getOwnPropertyNames;var rf=Object.getPrototypeOf,nf=Object.prototype.hasOwnProperty;var Bt=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),sf=(e,t)=>{for(var r in t)wn(e,r,{get:t[r],enumerable:!0})},of=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of ef(t))!nf.call(e,s)&&s!==r&&wn(e,s,{get:()=>t[s],enumerable:!(n=tf(t,s))||n.enumerable});return e};var ct=(e,t,r)=>(r=e!=null?Ju(rf(e)):{},of(t||!e||!e.__esModule?wn(r,"default",{value:e,enumerable:!0}):r,e));var ja=Bt((D_,Ma)=>{var tt=-1,H=1,M=0;function Xe(e,t,r,n,s){if(e===t)return e?[[M,e]]:[];if(r!=null){var i=Xm(e,t,r);if(i)return i}var o=Fn(e,t),a=e.substring(0,o);e=e.substring(o),t=t.substring(o),o=qr(e,t);var l=e.substring(e.length-o);e=e.substring(0,e.length-o),t=t.substring(0,t.length-o);var u=Fm(e,t);return a&&u.unshift([M,a]),l&&u.push([M,l]),zn(u,s),n&&Hm(u),u}function Fm(e,t){var r;if(!e)return[[H,t]];if(!t)return[[tt,e]];var n=e.length>t.length?e:t,s=e.length>t.length?t:e,i=n.indexOf(s);if(i!==-1)return r=[[H,n.substring(0,i)],[M,s],[H,n.substring(i+s.length)]],e.length>t.length&&(r[0][0]=r[2][0]=tt),r;if(s.length===1)return[[tt,e],[H,t]];var o=Km(e,t);if(o){var a=o[0],l=o[1],u=o[2],f=o[3],c=o[4],h=Xe(a,u),d=Xe(l,f);return h.concat([[M,c]],d)}return zm(e,t)}function zm(e,t){for(var r=e.length,n=t.length,s=Math.ceil((r+n)/2),i=s,o=2*s,a=new Array(o),l=new Array(o),u=0;u<o;u++)a[u]=-1,l[u]=-1;a[i+1]=0,l[i+1]=0;for(var f=r-n,c=f%2!==0,h=0,d=0,m=0,y=0,x=0;x<s;x++){for(var p=-x+h;p<=x-d;p+=2){var v=i+p,N;p===-x||p!==x&&a[v-1]<a[v+1]?N=a[v+1]:N=a[v-1]+1;for(var A=N-p;N<r&&A<n&&e.charAt(N)===t.charAt(A);)N++,A++;if(a[v]=N,N>r)d+=2;else if(A>n)h+=2;else if(c){var T=i+f-p;if(T>=0&&T<o&&l[T]!==-1){var C=r-l[T];if(N>=C)return _a(e,t,N,A)}}}for(var W=-x+m;W<=x-y;W+=2){var T=i+W,C;W===-x||W!==x&&l[T-1]<l[T+1]?C=l[T+1]:C=l[T-1]+1;for(var at=C-W;C<r&&at<n&&e.charAt(r-C-1)===t.charAt(n-at-1);)C++,at++;if(l[T]=C,C>r)y+=2;else if(at>n)m+=2;else if(!c){var v=i+f-W;if(v>=0&&v<o&&a[v]!==-1){var N=a[v],A=i+N-v;if(C=r-C,N>=C)return _a(e,t,N,A)}}}}return[[tt,e],[H,t]]}function _a(e,t,r,n){var s=e.substring(0,r),i=t.substring(0,n),o=e.substring(r),a=t.substring(n),l=Xe(s,i),u=Xe(o,a);return l.concat(u)}function Fn(e,t){if(!e||!t||e.charAt(0)!==t.charAt(0))return 0;for(var r=0,n=Math.min(e.length,t.length),s=n,i=0;r<s;)e.substring(i,s)==t.substring(i,s)?(r=s,i=r):n=s,s=Math.floor((n-r)/2+r);return Ia(e.charCodeAt(s-1))&&s--,s}function Oa(e,t){var r=e.length,n=t.length;if(r==0||n==0)return 0;r>n?e=e.substring(r-n):r<n&&(t=t.substring(0,r));var s=Math.min(r,n);if(e==t)return s;for(var i=0,o=1;;){var a=e.substring(s-o),l=t.indexOf(a);if(l==-1)return i;o+=l,(l==0||e.substring(s-o)==t.substring(0,o))&&(i=o,o++)}}function qr(e,t){if(!e||!t||e.slice(-1)!==t.slice(-1))return 0;for(var r=0,n=Math.min(e.length,t.length),s=n,i=0;r<s;)e.substring(e.length-s,e.length-i)==t.substring(t.length-s,t.length-i)?(r=s,i=r):n=s,s=Math.floor((n-r)/2+r);return Ra(e.charCodeAt(e.length-s))&&s--,s}function Km(e,t){var r=e.length>t.length?e:t,n=e.length>t.length?t:e;if(r.length<4||n.length*2<r.length)return null;function s(d,m,y){for(var x=d.substring(y,y+Math.floor(d.length/4)),p=-1,v="",N,A,T,C;(p=m.indexOf(x,p+1))!==-1;){var W=Fn(d.substring(y),m.substring(p)),at=qr(d.substring(0,y),m.substring(0,p));v.length<at+W&&(v=m.substring(p-at,p)+m.substring(p,p+W),N=d.substring(0,y-at),A=d.substring(y+W),T=m.substring(0,p-at),C=m.substring(p+W))}return v.length*2>=d.length?[N,A,T,C,v]:null}var i=s(r,n,Math.ceil(r.length/4)),o=s(r,n,Math.ceil(r.length/2)),a;if(!i&&!o)return null;o?i?a=i[4].length>o[4].length?i:o:a=o:a=i;var l,u,f,c;e.length>t.length?(l=a[0],u=a[1],f=a[2],c=a[3]):(f=a[0],c=a[1],l=a[2],u=a[3]);var h=a[4];return[l,u,f,c,h]}function Hm(e){for(var t=!1,r=[],n=0,s=null,i=0,o=0,a=0,l=0,u=0;i<e.length;)e[i][0]==M?(r[n++]=i,o=l,a=u,l=0,u=0,s=e[i][1]):(e[i][0]==H?l+=e[i][1].length:u+=e[i][1].length,s&&s.length<=Math.max(o,a)&&s.length<=Math.max(l,u)&&(e.splice(r[n-1],0,[tt,s]),e[r[n-1]+1][0]=H,n--,n--,i=n>0?r[n-1]:-1,o=0,a=0,l=0,u=0,s=null,t=!0)),i++;for(t&&zn(e),Wm(e),i=1;i<e.length;){if(e[i-1][0]==tt&&e[i][0]==H){var f=e[i-1][1],c=e[i][1],h=Oa(f,c),d=Oa(c,f);h>=d?(h>=f.length/2||h>=c.length/2)&&(e.splice(i,0,[M,c.substring(0,h)]),e[i-1][1]=f.substring(0,f.length-h),e[i+1][1]=c.substring(h),i++):(d>=f.length/2||d>=c.length/2)&&(e.splice(i,0,[M,f.substring(0,d)]),e[i-1][0]=H,e[i-1][1]=c.substring(0,c.length-d),e[i+1][0]=tt,e[i+1][1]=f.substring(d),i++),i++}i++}}var Sa=/[^a-zA-Z0-9]/,La=/\s/,Ca=/[\r\n]/,$m=/\n\r?\n$/,Gm=/^\r?\n\r?\n/;function Wm(e){function t(d,m){if(!d||!m)return 6;var y=d.charAt(d.length-1),x=m.charAt(0),p=y.match(Sa),v=x.match(Sa),N=p&&y.match(La),A=v&&x.match(La),T=N&&y.match(Ca),C=A&&x.match(Ca),W=T&&d.match($m),at=C&&m.match(Gm);return W||at?5:T||C?4:p&&!N&&A?3:N||A?2:p||v?1:0}for(var r=1;r<e.length-1;){if(e[r-1][0]==M&&e[r+1][0]==M){var n=e[r-1][1],s=e[r][1],i=e[r+1][1],o=qr(n,s);if(o){var a=s.substring(s.length-o);n=n.substring(0,n.length-o),s=a+s.substring(0,s.length-o),i=a+i}for(var l=n,u=s,f=i,c=t(n,s)+t(s,i);s.charAt(0)===i.charAt(0);){n+=s.charAt(0),s=s.substring(1)+i.charAt(0),i=i.substring(1);var h=t(n,s)+t(s,i);h>=c&&(c=h,l=n,u=s,f=i)}e[r-1][1]!=l&&(l?e[r-1][1]=l:(e.splice(r-1,1),r--),e[r][1]=u,f?e[r+1][1]=f:(e.splice(r+1,1),r--))}r++}}function zn(e,t){e.push([M,""]);for(var r=0,n=0,s=0,i="",o="",a;r<e.length;){if(r<e.length-1&&!e[r][1]){e.splice(r,1);continue}switch(e[r][0]){case H:s++,o+=e[r][1],r++;break;case tt:n++,i+=e[r][1],r++;break;case M:var l=r-s-n-1;if(t){if(l>=0&&Da(e[l][1])){var u=e[l][1].slice(-1);if(e[l][1]=e[l][1].slice(0,-1),i=u+i,o=u+o,!e[l][1]){e.splice(l,1),r--;var f=l-1;e[f]&&e[f][0]===H&&(s++,o=e[f][1]+o,f--),e[f]&&e[f][0]===tt&&(n++,i=e[f][1]+i,f--),l=f}}if(Ba(e[r][1])){var u=e[r][1].charAt(0);e[r][1]=e[r][1].slice(1),i+=u,o+=u}}if(r<e.length-1&&!e[r][1]){e.splice(r,1);break}if(i.length>0||o.length>0){i.length>0&&o.length>0&&(a=Fn(o,i),a!==0&&(l>=0?e[l][1]+=o.substring(0,a):(e.splice(0,0,[M,o.substring(0,a)]),r++),o=o.substring(a),i=i.substring(a)),a=qr(o,i),a!==0&&(e[r][1]=o.substring(o.length-a)+e[r][1],o=o.substring(0,o.length-a),i=i.substring(0,i.length-a)));var c=s+n;i.length===0&&o.length===0?(e.splice(r-c,c),r=r-c):i.length===0?(e.splice(r-c,c,[H,o]),r=r-c+1):o.length===0?(e.splice(r-c,c,[tt,i]),r=r-c+1):(e.splice(r-c,c,[tt,i],[H,o]),r=r-c+2)}r!==0&&e[r-1][0]===M?(e[r-1][1]+=e[r][1],e.splice(r,1)):r++,s=0,n=0,i="",o="";break}}e[e.length-1][1]===""&&e.pop();var h=!1;for(r=1;r<e.length-1;)e[r-1][0]===M&&e[r+1][0]===M&&(e[r][1].substring(e[r][1].length-e[r-1][1].length)===e[r-1][1]?(e[r][1]=e[r-1][1]+e[r][1].substring(0,e[r][1].length-e[r-1][1].length),e[r+1][1]=e[r-1][1]+e[r+1][1],e.splice(r-1,1),h=!0):e[r][1].substring(0,e[r+1][1].length)==e[r+1][1]&&(e[r-1][1]+=e[r+1][1],e[r][1]=e[r][1].substring(e[r+1][1].length)+e[r+1][1],e.splice(r+1,1),h=!0)),r++;h&&zn(e,t)}function Ia(e){return e>=55296&&e<=56319}function Ra(e){return e>=56320&&e<=57343}function Ba(e){return Ra(e.charCodeAt(0))}function Da(e){return Ia(e.charCodeAt(e.length-1))}function Vm(e){for(var t=[],r=0;r<e.length;r++)e[r][1].length>0&&t.push(e[r]);return t}function Un(e,t,r,n){return Da(e)||Ba(n)?null:Vm([[M,e],[tt,t],[H,r],[M,n]])}function Xm(e,t,r){var n=typeof r=="number"?{index:r,length:0}:r.oldRange,s=typeof r=="number"?null:r.newRange,i=e.length,o=t.length;if(n.length===0&&(s===null||s.length===0)){var a=n.index,l=e.slice(0,a),u=e.slice(a),f=s?s.index:null;t:{var c=a+o-i;if(f!==null&&f!==c||c<0||c>o)break t;var h=t.slice(0,c),d=t.slice(c);if(d!==u)break t;var m=Math.min(a,c),y=l.slice(0,m),x=h.slice(0,m);if(y!==x)break t;var p=l.slice(m),v=h.slice(m);return Un(y,p,v,u)}t:{if(f!==null&&f!==a)break t;var N=a,h=t.slice(0,N),d=t.slice(N);if(h!==l)break t;var A=Math.min(i-N,o-N),T=u.slice(u.length-A),C=d.slice(d.length-A);if(T!==C)break t;var p=u.slice(0,u.length-A),v=d.slice(0,d.length-A);return Un(l,p,v,T)}}if(n.length>0&&s&&s.length===0)t:{var y=e.slice(0,n.index),T=e.slice(n.index+n.length),m=y.length,A=T.length;if(o<m+A)break t;var x=t.slice(0,m),C=t.slice(o-A);if(y!==x||T!==C)break t;var p=e.slice(m,i-A),v=t.slice(m,o-A);return Un(y,p,v,T)}return null}function Ur(e,t,r,n){return Xe(e,t,r,n,!0)}Ur.INSERT=H;Ur.DELETE=tt;Ur.EQUAL=M;Ma.exports=Ur});var ns=Bt((Ye,Ie)=>{var Ym=200,Va="__lodash_hash_undefined__",Xa=9007199254740991,Yn="[object Arguments]",Qm="[object Array]",Ya="[object Boolean]",Qa="[object Date]",Zm="[object Error]",Qn="[object Function]",Za="[object GeneratorFunction]",Fr="[object Map]",Ja="[object Number]",Zn="[object Object]",ka="[object Promise]",tl="[object RegExp]",zr="[object Set]",el="[object String]",rl="[object Symbol]",Hn="[object WeakMap]",nl="[object ArrayBuffer]",Kr="[object DataView]",sl="[object Float32Array]",il="[object Float64Array]",ol="[object Int8Array]",al="[object Int16Array]",ll="[object Int32Array]",ul="[object Uint8Array]",fl="[object Uint8ClampedArray]",cl="[object Uint16Array]",hl="[object Uint32Array]",Jm=/[\\^$.*+?()[\]{}|]/g,tg=/\w*$/,eg=/^\[object .+?Constructor\]$/,rg=/^(?:0|[1-9]\d*)$/,_={};_[Yn]=_[Qm]=_[nl]=_[Kr]=_[Ya]=_[Qa]=_[sl]=_[il]=_[ol]=_[al]=_[ll]=_[Fr]=_[Ja]=_[Zn]=_[tl]=_[zr]=_[el]=_[rl]=_[ul]=_[fl]=_[cl]=_[hl]=!0;_[Zm]=_[Qn]=_[Hn]=!1;var ng=typeof global=="object"&&global&&global.Object===Object&&global,sg=typeof self=="object"&&self&&self.Object===Object&&self,Tt=ng||sg||Function("return this")(),dl=typeof Ye=="object"&&Ye&&!Ye.nodeType&&Ye,Pa=dl&&typeof Ie=="object"&&Ie&&!Ie.nodeType&&Ie,ig=Pa&&Pa.exports===dl;function og(e,t){return e.set(t[0],t[1]),e}function ag(e,t){return e.add(t),e}function lg(e,t){for(var r=-1,n=e?e.length:0;++r<n&&t(e[r],r,e)!==!1;);return e}function ug(e,t){for(var r=-1,n=t.length,s=e.length;++r<n;)e[s+r]=t[r];return e}function pl(e,t,r,n){var s=-1,i=e?e.length:0;for(n&&i&&(r=e[++s]);++s<i;)r=t(r,e[s],s,e);return r}function fg(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}function cg(e,t){return e?.[t]}function ml(e){var t=!1;if(e!=null&&typeof e.toString!="function")try{t=!!(e+"")}catch{}return t}function qa(e){var t=-1,r=Array(e.size);return e.forEach(function(n,s){r[++t]=[s,n]}),r}function Jn(e,t){return function(r){return e(t(r))}}function Ua(e){var t=-1,r=Array(e.size);return e.forEach(function(n){r[++t]=n}),r}var hg=Array.prototype,dg=Function.prototype,Hr=Object.prototype,Kn=Tt["__core-js_shared__"],Fa=(function(){var e=/[^.]+$/.exec(Kn&&Kn.keys&&Kn.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""})(),gl=dg.toString,Ht=Hr.hasOwnProperty,$r=Hr.toString,pg=RegExp("^"+gl.call(Ht).replace(Jm,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),za=ig?Tt.Buffer:void 0,Ka=Tt.Symbol,Ha=Tt.Uint8Array,mg=Jn(Object.getPrototypeOf,Object),gg=Object.create,bg=Hr.propertyIsEnumerable,yg=hg.splice,$a=Object.getOwnPropertySymbols,xg=za?za.isBuffer:void 0,vg=Jn(Object.keys,Object),$n=De(Tt,"DataView"),Qe=De(Tt,"Map"),Gn=De(Tt,"Promise"),Wn=De(Tt,"Set"),Vn=De(Tt,"WeakMap"),Ze=De(Object,"create"),Eg=ne($n),Ng=ne(Qe),Ag=ne(Gn),Tg=ne(Wn),wg=ne(Vn),Ga=Ka?Ka.prototype:void 0,Wa=Ga?Ga.valueOf:void 0;function re(e){var t=-1,r=e?e.length:0;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function _g(){this.__data__=Ze?Ze(null):{}}function Og(e){return this.has(e)&&delete this.__data__[e]}function Sg(e){var t=this.__data__;if(Ze){var r=t[e];return r===Va?void 0:r}return Ht.call(t,e)?t[e]:void 0}function Lg(e){var t=this.__data__;return Ze?t[e]!==void 0:Ht.call(t,e)}function Cg(e,t){var r=this.__data__;return r[e]=Ze&&t===void 0?Va:t,this}re.prototype.clear=_g;re.prototype.delete=Og;re.prototype.get=Sg;re.prototype.has=Lg;re.prototype.set=Cg;function wt(e){var t=-1,r=e?e.length:0;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function Ig(){this.__data__=[]}function Rg(e){var t=this.__data__,r=Gr(t,e);if(r<0)return!1;var n=t.length-1;return r==n?t.pop():yg.call(t,r,1),!0}function Bg(e){var t=this.__data__,r=Gr(t,e);return r<0?void 0:t[r][1]}function Dg(e){return Gr(this.__data__,e)>-1}function Mg(e,t){var r=this.__data__,n=Gr(r,e);return n<0?r.push([e,t]):r[n][1]=t,this}wt.prototype.clear=Ig;wt.prototype.delete=Rg;wt.prototype.get=Bg;wt.prototype.has=Dg;wt.prototype.set=Mg;function Re(e){var t=-1,r=e?e.length:0;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function jg(){this.__data__={hash:new re,map:new(Qe||wt),string:new re}}function kg(e){return Wr(this,e).delete(e)}function Pg(e){return Wr(this,e).get(e)}function qg(e){return Wr(this,e).has(e)}function Ug(e,t){return Wr(this,e).set(e,t),this}Re.prototype.clear=jg;Re.prototype.delete=kg;Re.prototype.get=Pg;Re.prototype.has=qg;Re.prototype.set=Ug;function Be(e){this.__data__=new wt(e)}function Fg(){this.__data__=new wt}function zg(e){return this.__data__.delete(e)}function Kg(e){return this.__data__.get(e)}function Hg(e){return this.__data__.has(e)}function $g(e,t){var r=this.__data__;if(r instanceof wt){var n=r.__data__;if(!Qe||n.length<Ym-1)return n.push([e,t]),this;r=this.__data__=new Re(n)}return r.set(e,t),this}Be.prototype.clear=Fg;Be.prototype.delete=zg;Be.prototype.get=Kg;Be.prototype.has=Hg;Be.prototype.set=$g;function Gg(e,t){var r=es(e)||gb(e)?fg(e.length,String):[],n=r.length,s=!!n;for(var i in e)(t||Ht.call(e,i))&&!(s&&(i=="length"||hb(i,n)))&&r.push(i);return r}function bl(e,t,r){var n=e[t];(!(Ht.call(e,t)&&El(n,r))||r===void 0&&!(t in e))&&(e[t]=r)}function Gr(e,t){for(var r=e.length;r--;)if(El(e[r][0],t))return r;return-1}function Wg(e,t){return e&&yl(t,rs(t),e)}function Xn(e,t,r,n,s,i,o){var a;if(n&&(a=i?n(e,s,i,o):n(e)),a!==void 0)return a;if(!Vr(e))return e;var l=es(e);if(l){if(a=ub(e),!t)return ob(e,a)}else{var u=ee(e),f=u==Qn||u==Za;if(yb(e))return Jg(e,t);if(u==Zn||u==Yn||f&&!i){if(ml(e))return i?e:{};if(a=fb(f?{}:e),!t)return ab(e,Wg(a,e))}else{if(!_[u])return i?e:{};a=cb(e,u,Xn,t)}}o||(o=new Be);var c=o.get(e);if(c)return c;if(o.set(e,a),!l)var h=r?lb(e):rs(e);return lg(h||e,function(d,m){h&&(m=d,d=e[m]),bl(a,m,Xn(d,t,r,n,m,e,o))}),a}function Vg(e){return Vr(e)?gg(e):{}}function Xg(e,t,r){var n=t(e);return es(e)?n:ug(n,r(e))}function Yg(e){return $r.call(e)}function Qg(e){if(!Vr(e)||pb(e))return!1;var t=Al(e)||ml(e)?pg:eg;return t.test(ne(e))}function Zg(e){if(!vl(e))return vg(e);var t=[];for(var r in Object(e))Ht.call(e,r)&&r!="constructor"&&t.push(r);return t}function Jg(e,t){if(t)return e.slice();var r=new e.constructor(e.length);return e.copy(r),r}function ts(e){var t=new e.constructor(e.byteLength);return new Ha(t).set(new Ha(e)),t}function tb(e,t){var r=t?ts(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.byteLength)}function eb(e,t,r){var n=t?r(qa(e),!0):qa(e);return pl(n,og,new e.constructor)}function rb(e){var t=new e.constructor(e.source,tg.exec(e));return t.lastIndex=e.lastIndex,t}function nb(e,t,r){var n=t?r(Ua(e),!0):Ua(e);return pl(n,ag,new e.constructor)}function sb(e){return Wa?Object(Wa.call(e)):{}}function ib(e,t){var r=t?ts(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.length)}function ob(e,t){var r=-1,n=e.length;for(t||(t=Array(n));++r<n;)t[r]=e[r];return t}function yl(e,t,r,n){r||(r={});for(var s=-1,i=t.length;++s<i;){var o=t[s],a=n?n(r[o],e[o],o,r,e):void 0;bl(r,o,a===void 0?e[o]:a)}return r}function ab(e,t){return yl(e,xl(e),t)}function lb(e){return Xg(e,rs,xl)}function Wr(e,t){var r=e.__data__;return db(t)?r[typeof t=="string"?"string":"hash"]:r.map}function De(e,t){var r=cg(e,t);return Qg(r)?r:void 0}var xl=$a?Jn($a,Object):Eb,ee=Yg;($n&&ee(new $n(new ArrayBuffer(1)))!=Kr||Qe&&ee(new Qe)!=Fr||Gn&&ee(Gn.resolve())!=ka||Wn&&ee(new Wn)!=zr||Vn&&ee(new Vn)!=Hn)&&(ee=function(e){var t=$r.call(e),r=t==Zn?e.constructor:void 0,n=r?ne(r):void 0;if(n)switch(n){case Eg:return Kr;case Ng:return Fr;case Ag:return ka;case Tg:return zr;case wg:return Hn}return t});function ub(e){var t=e.length,r=e.constructor(t);return t&&typeof e[0]=="string"&&Ht.call(e,"index")&&(r.index=e.index,r.input=e.input),r}function fb(e){return typeof e.constructor=="function"&&!vl(e)?Vg(mg(e)):{}}function cb(e,t,r,n){var s=e.constructor;switch(t){case nl:return ts(e);case Ya:case Qa:return new s(+e);case Kr:return tb(e,n);case sl:case il:case ol:case al:case ll:case ul:case fl:case cl:case hl:return ib(e,n);case Fr:return eb(e,n,r);case Ja:case el:return new s(e);case tl:return rb(e);case zr:return nb(e,n,r);case rl:return sb(e)}}function hb(e,t){return t=t??Xa,!!t&&(typeof e=="number"||rg.test(e))&&e>-1&&e%1==0&&e<t}function db(e){var t=typeof e;return t=="string"||t=="number"||t=="symbol"||t=="boolean"?e!=="__proto__":e===null}function pb(e){return!!Fa&&Fa in e}function vl(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||Hr;return e===r}function ne(e){if(e!=null){try{return gl.call(e)}catch{}try{return e+""}catch{}}return""}function mb(e){return Xn(e,!0,!0)}function El(e,t){return e===t||e!==e&&t!==t}function gb(e){return bb(e)&&Ht.call(e,"callee")&&(!bg.call(e,"callee")||$r.call(e)==Yn)}var es=Array.isArray;function Nl(e){return e!=null&&xb(e.length)&&!Al(e)}function bb(e){return vb(e)&&Nl(e)}var yb=xg||Nb;function Al(e){var t=Vr(e)?$r.call(e):"";return t==Qn||t==Za}function xb(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=Xa}function Vr(e){var t=typeof e;return!!e&&(t=="object"||t=="function")}function vb(e){return!!e&&typeof e=="object"}function rs(e){return Nl(e)?Gg(e):Zg(e)}function Eb(){return[]}function Nb(){return!1}Ie.exports=mb});var ms=Bt((Je,je)=>{var Ab=200,ps="__lodash_hash_undefined__",rn=1,Ml=2,jl=9007199254740991,Xr="[object Arguments]",as="[object Array]",Tb="[object AsyncFunction]",kl="[object Boolean]",Pl="[object Date]",ql="[object Error]",Ul="[object Function]",wb="[object GeneratorFunction]",Yr="[object Map]",Fl="[object Number]",_b="[object Null]",Me="[object Object]",Tl="[object Promise]",Ob="[object Proxy]",zl="[object RegExp]",Qr="[object Set]",Kl="[object String]",Sb="[object Symbol]",Lb="[object Undefined]",ls="[object WeakMap]",Hl="[object ArrayBuffer]",Zr="[object DataView]",Cb="[object Float32Array]",Ib="[object Float64Array]",Rb="[object Int8Array]",Bb="[object Int16Array]",Db="[object Int32Array]",Mb="[object Uint8Array]",jb="[object Uint8ClampedArray]",kb="[object Uint16Array]",Pb="[object Uint32Array]",qb=/[\\^$.*+?()[\]{}|]/g,Ub=/^\[object .+?Constructor\]$/,Fb=/^(?:0|[1-9]\d*)$/,S={};S[Cb]=S[Ib]=S[Rb]=S[Bb]=S[Db]=S[Mb]=S[jb]=S[kb]=S[Pb]=!0;S[Xr]=S[as]=S[Hl]=S[kl]=S[Zr]=S[Pl]=S[ql]=S[Ul]=S[Yr]=S[Fl]=S[Me]=S[zl]=S[Qr]=S[Kl]=S[ls]=!1;var $l=typeof global=="object"&&global&&global.Object===Object&&global,zb=typeof self=="object"&&self&&self.Object===Object&&self,_t=$l||zb||Function("return this")(),Gl=typeof Je=="object"&&Je&&!Je.nodeType&&Je,wl=Gl&&typeof je=="object"&&je&&!je.nodeType&&je,Wl=wl&&wl.exports===Gl,ss=Wl&&$l.process,_l=(function(){try{return ss&&ss.binding&&ss.binding("util")}catch{}})(),Ol=_l&&_l.isTypedArray;function Kb(e,t){for(var r=-1,n=e==null?0:e.length,s=0,i=[];++r<n;){var o=e[r];t(o,r,e)&&(i[s++]=o)}return i}function Hb(e,t){for(var r=-1,n=t.length,s=e.length;++r<n;)e[s+r]=t[r];return e}function $b(e,t){for(var r=-1,n=e==null?0:e.length;++r<n;)if(t(e[r],r,e))return!0;return!1}function Gb(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}function Wb(e){return function(t){return e(t)}}function Vb(e,t){return e.has(t)}function Xb(e,t){return e?.[t]}function Yb(e){var t=-1,r=Array(e.size);return e.forEach(function(n,s){r[++t]=[s,n]}),r}function Qb(e,t){return function(r){return e(t(r))}}function Zb(e){var t=-1,r=Array(e.size);return e.forEach(function(n){r[++t]=n}),r}var Jb=Array.prototype,ty=Function.prototype,nn=Object.prototype,is=_t["__core-js_shared__"],Vl=ty.toString,gt=nn.hasOwnProperty,Sl=(function(){var e=/[^.]+$/.exec(is&&is.keys&&is.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""})(),Xl=nn.toString,ey=RegExp("^"+Vl.call(gt).replace(qb,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),Ll=Wl?_t.Buffer:void 0,Jr=_t.Symbol,Cl=_t.Uint8Array,Yl=nn.propertyIsEnumerable,ry=Jb.splice,se=Jr?Jr.toStringTag:void 0,Il=Object.getOwnPropertySymbols,ny=Ll?Ll.isBuffer:void 0,sy=Qb(Object.keys,Object),us=ke(_t,"DataView"),tr=ke(_t,"Map"),fs=ke(_t,"Promise"),cs=ke(_t,"Set"),hs=ke(_t,"WeakMap"),er=ke(Object,"create"),iy=ae(us),oy=ae(tr),ay=ae(fs),ly=ae(cs),uy=ae(hs),Rl=Jr?Jr.prototype:void 0,os=Rl?Rl.valueOf:void 0;function ie(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function fy(){this.__data__=er?er(null):{},this.size=0}function cy(e){var t=this.has(e)&&delete this.__data__[e];return this.size-=t?1:0,t}function hy(e){var t=this.__data__;if(er){var r=t[e];return r===ps?void 0:r}return gt.call(t,e)?t[e]:void 0}function dy(e){var t=this.__data__;return er?t[e]!==void 0:gt.call(t,e)}function py(e,t){var r=this.__data__;return this.size+=this.has(e)?0:1,r[e]=er&&t===void 0?ps:t,this}ie.prototype.clear=fy;ie.prototype.delete=cy;ie.prototype.get=hy;ie.prototype.has=dy;ie.prototype.set=py;function Ot(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function my(){this.__data__=[],this.size=0}function gy(e){var t=this.__data__,r=sn(t,e);if(r<0)return!1;var n=t.length-1;return r==n?t.pop():ry.call(t,r,1),--this.size,!0}function by(e){var t=this.__data__,r=sn(t,e);return r<0?void 0:t[r][1]}function yy(e){return sn(this.__data__,e)>-1}function xy(e,t){var r=this.__data__,n=sn(r,e);return n<0?(++this.size,r.push([e,t])):r[n][1]=t,this}Ot.prototype.clear=my;Ot.prototype.delete=gy;Ot.prototype.get=by;Ot.prototype.has=yy;Ot.prototype.set=xy;function oe(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}function vy(){this.size=0,this.__data__={hash:new ie,map:new(tr||Ot),string:new ie}}function Ey(e){var t=on(this,e).delete(e);return this.size-=t?1:0,t}function Ny(e){return on(this,e).get(e)}function Ay(e){return on(this,e).has(e)}function Ty(e,t){var r=on(this,e),n=r.size;return r.set(e,t),this.size+=r.size==n?0:1,this}oe.prototype.clear=vy;oe.prototype.delete=Ey;oe.prototype.get=Ny;oe.prototype.has=Ay;oe.prototype.set=Ty;function tn(e){var t=-1,r=e==null?0:e.length;for(this.__data__=new oe;++t<r;)this.add(e[t])}function wy(e){return this.__data__.set(e,ps),this}function _y(e){return this.__data__.has(e)}tn.prototype.add=tn.prototype.push=wy;tn.prototype.has=_y;function Gt(e){var t=this.__data__=new Ot(e);this.size=t.size}function Oy(){this.__data__=new Ot,this.size=0}function Sy(e){var t=this.__data__,r=t.delete(e);return this.size=t.size,r}function Ly(e){return this.__data__.get(e)}function Cy(e){return this.__data__.has(e)}function Iy(e,t){var r=this.__data__;if(r instanceof Ot){var n=r.__data__;if(!tr||n.length<Ab-1)return n.push([e,t]),this.size=++r.size,this;r=this.__data__=new oe(n)}return r.set(e,t),this.size=r.size,this}Gt.prototype.clear=Oy;Gt.prototype.delete=Sy;Gt.prototype.get=Ly;Gt.prototype.has=Cy;Gt.prototype.set=Iy;function Ry(e,t){var r=en(e),n=!r&&Wy(e),s=!r&&!n&&ds(e),i=!r&&!n&&!s&&nu(e),o=r||n||s||i,a=o?Gb(e.length,String):[],l=a.length;for(var u in e)(t||gt.call(e,u))&&!(o&&(u=="length"||s&&(u=="offset"||u=="parent")||i&&(u=="buffer"||u=="byteLength"||u=="byteOffset")||zy(u,l)))&&a.push(u);return a}function sn(e,t){for(var r=e.length;r--;)if(Jl(e[r][0],t))return r;return-1}function By(e,t,r){var n=t(e);return en(e)?n:Hb(n,r(e))}function nr(e){return e==null?e===void 0?Lb:_b:se&&se in Object(e)?Uy(e):Gy(e)}function Bl(e){return rr(e)&&nr(e)==Xr}function Ql(e,t,r,n,s){return e===t?!0:e==null||t==null||!rr(e)&&!rr(t)?e!==e&&t!==t:Dy(e,t,r,n,Ql,s)}function Dy(e,t,r,n,s,i){var o=en(e),a=en(t),l=o?as:$t(e),u=a?as:$t(t);l=l==Xr?Me:l,u=u==Xr?Me:u;var f=l==Me,c=u==Me,h=l==u;if(h&&ds(e)){if(!ds(t))return!1;o=!0,f=!1}if(h&&!f)return i||(i=new Gt),o||nu(e)?Zl(e,t,r,n,s,i):Py(e,t,l,r,n,s,i);if(!(r&rn)){var d=f&>.call(e,"__wrapped__"),m=c&>.call(t,"__wrapped__");if(d||m){var y=d?e.value():e,x=m?t.value():t;return i||(i=new Gt),s(y,x,r,n,i)}}return h?(i||(i=new Gt),qy(e,t,r,n,s,i)):!1}function My(e){if(!ru(e)||Hy(e))return!1;var t=tu(e)?ey:Ub;return t.test(ae(e))}function jy(e){return rr(e)&&eu(e.length)&&!!S[nr(e)]}function ky(e){if(!$y(e))return sy(e);var t=[];for(var r in Object(e))gt.call(e,r)&&r!="constructor"&&t.push(r);return t}function Zl(e,t,r,n,s,i){var o=r&rn,a=e.length,l=t.length;if(a!=l&&!(o&&l>a))return!1;var u=i.get(e);if(u&&i.get(t))return u==t;var f=-1,c=!0,h=r&Ml?new tn:void 0;for(i.set(e,t),i.set(t,e);++f<a;){var d=e[f],m=t[f];if(n)var y=o?n(m,d,f,t,e,i):n(d,m,f,e,t,i);if(y!==void 0){if(y)continue;c=!1;break}if(h){if(!$b(t,function(x,p){if(!Vb(h,p)&&(d===x||s(d,x,r,n,i)))return h.push(p)})){c=!1;break}}else if(!(d===m||s(d,m,r,n,i))){c=!1;break}}return i.delete(e),i.delete(t),c}function Py(e,t,r,n,s,i,o){switch(r){case Zr:if(e.byteLength!=t.byteLength||e.byteOffset!=t.byteOffset)return!1;e=e.buffer,t=t.buffer;case Hl:return!(e.byteLength!=t.byteLength||!i(new Cl(e),new Cl(t)));case kl:case Pl:case Fl:return Jl(+e,+t);case ql:return e.name==t.name&&e.message==t.message;case zl:case Kl:return e==t+"";case Yr:var a=Yb;case Qr:var l=n&rn;if(a||(a=Zb),e.size!=t.size&&!l)return!1;var u=o.get(e);if(u)return u==t;n|=Ml,o.set(e,t);var f=Zl(a(e),a(t),n,s,i,o);return o.delete(e),f;case Sb:if(os)return os.call(e)==os.call(t)}return!1}function qy(e,t,r,n,s,i){var o=r&rn,a=Dl(e),l=a.length,u=Dl(t),f=u.length;if(l!=f&&!o)return!1;for(var c=l;c--;){var h=a[c];if(!(o?h in t:gt.call(t,h)))return!1}var d=i.get(e);if(d&&i.get(t))return d==t;var m=!0;i.set(e,t),i.set(t,e);for(var y=o;++c<l;){h=a[c];var x=e[h],p=t[h];if(n)var v=o?n(p,x,h,t,e,i):n(x,p,h,e,t,i);if(!(v===void 0?x===p||s(x,p,r,n,i):v)){m=!1;break}y||(y=h=="constructor")}if(m&&!y){var N=e.constructor,A=t.constructor;N!=A&&"constructor"in e&&"constructor"in t&&!(typeof N=="function"&&N instanceof N&&typeof A=="function"&&A instanceof A)&&(m=!1)}return i.delete(e),i.delete(t),m}function Dl(e){return By(e,Yy,Fy)}function on(e,t){var r=e.__data__;return Ky(t)?r[typeof t=="string"?"string":"hash"]:r.map}function ke(e,t){var r=Xb(e,t);return My(r)?r:void 0}function Uy(e){var t=gt.call(e,se),r=e[se];try{e[se]=void 0;var n=!0}catch{}var s=Xl.call(e);return n&&(t?e[se]=r:delete e[se]),s}var Fy=Il?function(e){return e==null?[]:(e=Object(e),Kb(Il(e),function(t){return Yl.call(e,t)}))}:Qy,$t=nr;(us&&$t(new us(new ArrayBuffer(1)))!=Zr||tr&&$t(new tr)!=Yr||fs&&$t(fs.resolve())!=Tl||cs&&$t(new cs)!=Qr||hs&&$t(new hs)!=ls)&&($t=function(e){var t=nr(e),r=t==Me?e.constructor:void 0,n=r?ae(r):"";if(n)switch(n){case iy:return Zr;case oy:return Yr;case ay:return Tl;case ly:return Qr;case uy:return ls}return t});function zy(e,t){return t=t??jl,!!t&&(typeof e=="number"||Fb.test(e))&&e>-1&&e%1==0&&e<t}function Ky(e){var t=typeof e;return t=="string"||t=="number"||t=="symbol"||t=="boolean"?e!=="__proto__":e===null}function Hy(e){return!!Sl&&Sl in e}function $y(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||nn;return e===r}function Gy(e){return Xl.call(e)}function ae(e){if(e!=null){try{return Vl.call(e)}catch{}try{return e+""}catch{}}return""}function Jl(e,t){return e===t||e!==e&&t!==t}var Wy=Bl((function(){return arguments})())?Bl:function(e){return rr(e)&>.call(e,"callee")&&!Yl.call(e,"callee")},en=Array.isArray;function Vy(e){return e!=null&&eu(e.length)&&!tu(e)}var ds=ny||Zy;function Xy(e,t){return Ql(e,t)}function tu(e){if(!ru(e))return!1;var t=nr(e);return t==Ul||t==wb||t==Tb||t==Ob}function eu(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=jl}function ru(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}function rr(e){return e!=null&&typeof e=="object"}var nu=Ol?Wb(Ol):jy;function Yy(e){return Vy(e)?Ry(e):ky(e)}function Qy(){return[]}function Zy(){return!1}je.exports=Xy});var su=Bt(bs=>{"use strict";Object.defineProperty(bs,"__esModule",{value:!0});var Jy=ns(),tx=ms(),gs;(function(e){function t(i={},o={},a=!1){typeof i!="object"&&(i={}),typeof o!="object"&&(o={});let l=Jy(o);a||(l=Object.keys(l).reduce((u,f)=>(l[f]!=null&&(u[f]=l[f]),u),{}));for(let u in i)i[u]!==void 0&&o[u]===void 0&&(l[u]=i[u]);return Object.keys(l).length>0?l:void 0}e.compose=t;function r(i={},o={}){typeof i!="object"&&(i={}),typeof o!="object"&&(o={});let a=Object.keys(i).concat(Object.keys(o)).reduce((l,u)=>(tx(i[u],o[u])||(l[u]=o[u]===void 0?null:o[u]),l),{});return Object.keys(a).length>0?a:void 0}e.diff=r;function n(i={},o={}){i=i||{};let a=Object.keys(o).reduce((l,u)=>(o[u]!==i[u]&&i[u]!==void 0&&(l[u]=o[u]),l),{});return Object.keys(i).reduce((l,u)=>(i[u]!==o[u]&&o[u]===void 0&&(l[u]=null),l),a)}e.invert=n;function s(i,o,a=!1){if(typeof i!="object")return o;if(typeof o!="object")return;if(!a)return o;let l=Object.keys(o).reduce((u,f)=>(i[f]===void 0&&(u[f]=o[f]),u),{});return Object.keys(l).length>0?l:void 0}e.transform=s})(gs||(gs={}));bs.default=gs});var vs=Bt(xs=>{"use strict";Object.defineProperty(xs,"__esModule",{value:!0});var ys;(function(e){function t(r){return typeof r.delete=="number"?r.delete:typeof r.retain=="number"?r.retain:typeof r.retain=="object"&&r.retain!==null?1:typeof r.insert=="string"?r.insert.length:1}e.length=t})(ys||(ys={}));xs.default=ys});var ou=Bt(Ns=>{"use strict";Object.defineProperty(Ns,"__esModule",{value:!0});var iu=vs(),Es=class{constructor(t){this.ops=t,this.index=0,this.offset=0}hasNext(){return this.peekLength()<1/0}next(t){t||(t=1/0);let r=this.ops[this.index];if(r){let n=this.offset,s=iu.default.length(r);if(t>=s-n?(t=s-n,this.index+=1,this.offset=0):this.offset+=t,typeof r.delete=="number")return{delete:t};{let i={};return r.attributes&&(i.attributes=r.attributes),typeof r.retain=="number"?i.retain=t:typeof r.retain=="object"&&r.retain!==null?i.retain=r.retain:typeof r.insert=="string"?i.insert=r.insert.substr(n,t):i.insert=r.insert,i}}else return{retain:1/0}}peek(){return this.ops[this.index]}peekLength(){return this.ops[this.index]?iu.default.length(this.ops[this.index])-this.offset:1/0}peekType(){let t=this.ops[this.index];return t?typeof t.delete=="number"?"delete":typeof t.retain=="number"||typeof t.retain=="object"&&t.retain!==null?"retain":"insert":"retain"}rest(){if(this.hasNext()){if(this.offset===0)return this.ops.slice(this.index);{let t=this.offset,r=this.index,n=this.next(),s=this.ops.slice(this.index);return this.offset=t,this.index=r,[n].concat(s)}}else return[]}};Ns.default=Es});var bt=Bt((Lt,ln)=>{"use strict";Object.defineProperty(Lt,"__esModule",{value:!0});Lt.AttributeMap=Lt.OpIterator=Lt.Op=void 0;var an=ja(),ex=ns(),As=ms(),le=su();Lt.AttributeMap=le.default;var St=vs();Lt.Op=St.default;var nt=ou();Lt.OpIterator=nt.default;var rx="\0",au=(e,t)=>{if(typeof e!="object"||e===null)throw new Error(`cannot retain a ${typeof e}`);if(typeof t!="object"||t===null)throw new Error(`cannot retain a ${typeof t}`);let r=Object.keys(e)[0];if(!r||r!==Object.keys(t)[0])throw new Error(`embed types not matched: ${r} != ${Object.keys(t)[0]}`);return[r,e[r],t[r]]},Ct=class e{constructor(t){Array.isArray(t)?this.ops=t:t!=null&&Array.isArray(t.ops)?this.ops=t.ops:this.ops=[]}static registerEmbed(t,r){this.handlers[t]=r}static unregisterEmbed(t){delete this.handlers[t]}static getHandler(t){let r=this.handlers[t];if(!r)throw new Error(`no handlers for embed type "${t}"`);return r}insert(t,r){let n={};return typeof t=="string"&&t.length===0?this:(n.insert=t,r!=null&&typeof r=="object"&&Object.keys(r).length>0&&(n.attributes=r),this.push(n))}delete(t){return t<=0?this:this.push({delete:t})}retain(t,r){if(typeof t=="number"&&t<=0)return this;let n={retain:t};return r!=null&&typeof r=="object"&&Object.keys(r).length>0&&(n.attributes=r),this.push(n)}push(t){let r=this.ops.length,n=this.ops[r-1];if(t=ex(t),typeof n=="object"){if(typeof t.delete=="number"&&typeof n.delete=="number")return this.ops[r-1]={delete:n.delete+t.delete},this;if(typeof n.delete=="number"&&t.insert!=null&&(r-=1,n=this.ops[r-1],typeof n!="object"))return this.ops.unshift(t),this;if(As(t.attributes,n.attributes)){if(typeof t.insert=="string"&&typeof n.insert=="string")return this.ops[r-1]={insert:n.insert+t.insert},typeof t.attributes=="object"&&(this.ops[r-1].attributes=t.attributes),this;if(typeof t.retain=="number"&&typeof n.retain=="number")return this.ops[r-1]={retain:n.retain+t.retain},typeof t.attributes=="object"&&(this.ops[r-1].attributes=t.attributes),this}}return r===this.ops.length?this.ops.push(t):this.ops.splice(r,0,t),this}chop(){let t=this.ops[this.ops.length-1];return t&&typeof t.retain=="number"&&!t.attributes&&this.ops.pop(),this}filter(t){return this.ops.filter(t)}forEach(t){this.ops.forEach(t)}map(t){return this.ops.map(t)}partition(t){let r=[],n=[];return this.forEach(s=>{(t(s)?r:n).push(s)}),[r,n]}reduce(t,r){return this.ops.reduce(t,r)}changeLength(){return this.reduce((t,r)=>r.insert?t+St.default.length(r):r.delete?t-r.delete:t,0)}length(){return this.reduce((t,r)=>t+St.default.length(r),0)}slice(t=0,r=1/0){let n=[],s=new nt.default(this.ops),i=0;for(;i<r&&s.hasNext();){let o;i<t?o=s.next(t-i):(o=s.next(r-i),n.push(o)),i+=St.default.length(o)}return new e(n)}compose(t){let r=new nt.default(this.ops),n=new nt.default(t.ops),s=[],i=n.peek();if(i!=null&&typeof i.retain=="number"&&i.attributes==null){let a=i.retain;for(;r.peekType()==="insert"&&r.peekLength()<=a;)a-=r.peekLength(),s.push(r.next());i.retain-a>0&&n.next(i.retain-a)}let o=new e(s);for(;r.hasNext()||n.hasNext();)if(n.peekType()==="insert")o.push(n.next());else if(r.peekType()==="delete")o.push(r.next());else{let a=Math.min(r.peekLength(),n.peekLength()),l=r.next(a),u=n.next(a);if(u.retain){let f={};if(typeof l.retain=="number")f.retain=typeof u.retain=="number"?a:u.retain;else if(typeof u.retain=="number")l.retain==null?f.insert=l.insert:f.retain=l.retain;else{let h=l.retain==null?"insert":"retain",[d,m,y]=au(l[h],u.retain),x=e.getHandler(d);f[h]={[d]:x.compose(m,y,h==="retain")}}let c=le.default.compose(l.attributes,u.attributes,typeof l.retain=="number");if(c&&(f.attributes=c),o.push(f),!n.hasNext()&&As(o.ops[o.ops.length-1],f)){let h=new e(r.rest());return o.concat(h).chop()}}else typeof u.delete=="number"&&(typeof l.retain=="number"||typeof l.retain=="object"&&l.retain!==null)&&o.push(u)}return o.chop()}concat(t){let r=new e(this.ops.slice());return t.ops.length>0&&(r.push(t.ops[0]),r.ops=r.ops.concat(t.ops.slice(1))),r}diff(t,r){if(this.ops===t.ops)return new e;let n=[this,t].map(l=>l.map(u=>{if(u.insert!=null)return typeof u.insert=="string"?u.insert:rx;let f=l===t?"on":"with";throw new Error("diff() called "+f+" non-document")}).join("")),s=new e,i=an(n[0],n[1],r,!0),o=new nt.default(this.ops),a=new nt.default(t.ops);return i.forEach(l=>{let u=l[1].length;for(;u>0;){let f=0;switch(l[0]){case an.INSERT:f=Math.min(a.peekLength(),u),s.push(a.next(f));break;case an.DELETE:f=Math.min(u,o.peekLength()),o.next(f),s.delete(f);break;case an.EQUAL:f=Math.min(o.peekLength(),a.peekLength(),u);let c=o.next(f),h=a.next(f);As(c.insert,h.insert)?s.retain(f,le.default.diff(c.attributes,h.attributes)):s.push(h).delete(f);break}u-=f}}),s.chop()}eachLine(t,r=`
`){let n=new nt.default(this.ops),s=new e,i=0;for(;n.hasNext();){if(n.peekType()!=="insert")return;let o=n.peek(),a=St.default.length(o)-n.peekLength(),l=typeof o.insert=="string"?o.insert.indexOf(r,a)-a:-1;if(l<0)s.push(n.next());else if(l>0)s.push(n.next(l));else{if(t(s,n.next(1).attributes||{},i)===!1)return;i+=1,s=new e}}s.length()>0&&t(s,{},i)}invert(t){let r=new e;return this.reduce((n,s)=>{if(s.insert)r.delete(St.default.length(s));else{if(typeof s.retain=="number"&&s.attributes==null)return r.retain(s.retain),n+s.retain;if(s.delete||typeof s.retain=="number"){let i=s.delete||s.retain;return t.slice(n,n+i).forEach(a=>{s.delete?r.push(a):s.retain&&s.attributes&&r.retain(St.default.length(a),le.default.invert(s.attributes,a.attributes))}),n+i}else if(typeof s.retain=="object"&&s.retain!==null){let i=t.slice(n,n+1),o=new nt.default(i.ops).next(),[a,l,u]=au(s.retain,o.insert),f=e.getHandler(a);return r.retain({[a]:f.invert(l,u)},le.default.invert(s.attributes,o.attributes)),n+1}}return n},0),r.chop()}transform(t,r=!1){if(r=!!r,typeof t=="number")return this.transformPosition(t,r);let n=t,s=new nt.default(this.ops),i=new nt.default(n.ops),o=new e;for(;s.hasNext()||i.hasNext();)if(s.peekType()==="insert"&&(r||i.peekType()!=="insert"))o.retain(St.default.length(s.next()));else if(i.peekType()==="insert")o.push(i.next());else{let a=Math.min(s.peekLength(),i.peekLength()),l=s.next(a),u=i.next(a);if(l.delete)continue;if(u.delete)o.push(u);else{let f=l.retain,c=u.retain,h=typeof c=="object"&&c!==null?c:a;if(typeof f=="object"&&f!==null&&typeof c=="object"&&c!==null){let d=Object.keys(f)[0];if(d===Object.keys(c)[0]){let m=e.getHandler(d);m&&(h={[d]:m.transform(f[d],c[d],r)})}}o.retain(h,le.default.transform(l.attributes,u.attributes,r))}}return o.chop()}transformPosition(t,r=!1){r=!!r;let n=new nt.default(this.ops),s=0;for(;n.hasNext()&&s<=t;){let i=n.peekLength(),o=n.peekType();if(n.next(),o==="delete"){t-=Math.min(i,t-s);continue}else o==="insert"&&(s<t||!r)&&(t+=i);s+=i}return t}};Ct.Op=St.default;Ct.OpIterator=nt.default;Ct.AttributeMap=le.default;Ct.handlers={};Lt.default=Ct;typeof ln=="object"&&(ln.exports=Ct,ln.exports.default=Ct)});var fu=Bt((t1,Os)=>{"use strict";var ix=Object.prototype.hasOwnProperty,$="~";function ir(){}Object.create&&(ir.prototype=Object.create(null),new ir().__proto__||($=!1));function ox(e,t,r){this.fn=e,this.context=t,this.once=r||!1}function uu(e,t,r,n,s){if(typeof r!="function")throw new TypeError("The listener must be a function");var i=new ox(r,n||e,s),o=$?$+t:t;return e._events[o]?e._events[o].fn?e._events[o]=[e._events[o],i]:e._events[o].push(i):(e._events[o]=i,e._eventsCount++),e}function fn(e,t){--e._eventsCount===0?e._events=new ir:delete e._events[t]}function F(){this._events=new ir,this._eventsCount=0}F.prototype.eventNames=function(){var t=[],r,n;if(this._eventsCount===0)return t;for(n in r=this._events)ix.call(r,n)&&t.push($?n.slice(1):n);return Object.getOwnPropertySymbols?t.concat(Object.getOwnPropertySymbols(r)):t};F.prototype.listeners=function(t){var r=$?$+t:t,n=this._events[r];if(!n)return[];if(n.fn)return[n.fn];for(var s=0,i=n.length,o=new Array(i);s<i;s++)o[s]=n[s].fn;return o};F.prototype.listenerCount=function(t){var r=$?$+t:t,n=this._events[r];return n?n.fn?1:n.length:0};F.prototype.emit=function(t,r,n,s,i,o){var a=$?$+t:t;if(!this._events[a])return!1;var l=this._events[a],u=arguments.length,f,c;if(l.fn){switch(l.once&&this.removeListener(t,l.fn,void 0,!0),u){case 1:return l.fn.call(l.context),!0;case 2:return l.fn.call(l.context,r),!0;case 3:return l.fn.call(l.context,r,n),!0;case 4:return l.fn.call(l.context,r,n,s),!0;case 5:return l.fn.call(l.context,r,n,s,i),!0;case 6:return l.fn.call(l.context,r,n,s,i,o),!0}for(c=1,f=new Array(u-1);c<u;c++)f[c-1]=arguments[c];l.fn.apply(l.context,f)}else{var h=l.length,d;for(c=0;c<h;c++)switch(l[c].once&&this.removeListener(t,l[c].fn,void 0,!0),u){case 1:l[c].fn.call(l[c].context);break;case 2:l[c].fn.call(l[c].context,r);break;case 3:l[c].fn.call(l[c].context,r,n);break;case 4:l[c].fn.call(l[c].context,r,n,s);break;default:if(!f)for(d=1,f=new Array(u-1);d<u;d++)f[d-1]=arguments[d];l[c].fn.apply(l[c].context,f)}}return!0};F.prototype.on=function(t,r,n){return uu(this,t,r,n,!1)};F.prototype.once=function(t,r,n){return uu(this,t,r,n,!0)};F.prototype.removeListener=function(t,r,n,s){var i=$?$+t:t;if(!this._events[i])return this;if(!r)return fn(this,i),this;var o=this._events[i];if(o.fn)o.fn===r&&(!s||o.once)&&(!n||o.context===n)&&fn(this,i);else{for(var a=0,l=[],u=o.length;a<u;a++)(o[a].fn!==r||s&&!o[a].once||n&&o[a].context!==n)&&l.push(o[a]);l.length?this._events[i]=l.length===1?l[0]:l:fn(this,i)}return this};F.prototype.removeAllListeners=function(t){var r;return t?(r=$?$+t:t,this._events[r]&&fn(this,r)):(this._events=new ir,this._eventsCount=0),this};F.prototype.off=F.prototype.removeListener;F.prototype.addListener=F.prototype.on;F.prefixed=$;F.EventEmitter=F;typeof Os<"u"&&(Os.exports=F)});var af=typeof global=="object"&&global&&global.Object===Object&&global,hr=af;var lf=typeof self=="object"&&self&&self.Object===Object&&self,uf=hr||lf||Function("return this")(),R=uf;var ff=R.Symbol,et=ff;var hi=Object.prototype,cf=hi.hasOwnProperty,hf=hi.toString,Fe=et?et.toStringTag:void 0;function df(e){var t=cf.call(e,Fe),r=e[Fe];try{e[Fe]=void 0;var n=!0}catch{}var s=hf.call(e);return n&&(t?e[Fe]=r:delete e[Fe]),s}var di=df;var pf=Object.prototype,mf=pf.toString;function gf(e){return mf.call(e)}var pi=gf;var bf="[object Null]",yf="[object Undefined]",mi=et?et.toStringTag:void 0;function xf(e){return e==null?e===void 0?yf:bf:mi&&mi in Object(e)?di(e):pi(e)}var lt=xf;function vf(e){return e!=null&&typeof e=="object"}var k=vf;var Ef=Array.isArray,rt=Ef;function Nf(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var q=Nf;function Af(e){return e}var dr=Af;var Tf="[object AsyncFunction]",wf="[object Function]",_f="[object GeneratorFunction]",Of="[object Proxy]";function Sf(e){if(!q(e))return!1;var t=lt(e);return t==wf||t==_f||t==Tf||t==Of}var fe=Sf;var Lf=R["__core-js_shared__"],pr=Lf;var gi=(function(){var e=/[^.]+$/.exec(pr&&pr.keys&&pr.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""})();function Cf(e){return!!gi&&gi in e}var bi=Cf;var If=Function.prototype,Rf=If.toString;function Bf(e){if(e!=null){try{return Rf.call(e)}catch{}try{return e+""}catch{}}return""}var xt=Bf;var Df=/[\\^$.*+?()[\]{}|]/g,Mf=/^\[object .+?Constructor\]$/,jf=Function.prototype,kf=Object.prototype,Pf=jf.toString,qf=kf.hasOwnProperty,Uf=RegExp("^"+Pf.call(qf).replace(Df,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");function Ff(e){if(!q(e)||bi(e))return!1;var t=fe(e)?Uf:Mf;return t.test(xt(e))}var yi=Ff;function zf(e,t){return e?.[t]}var xi=zf;function Kf(e,t){var r=xi(e,t);return yi(r)?r:void 0}var V=Kf;var Hf=V(R,"WeakMap"),mr=Hf;var vi=Object.create,$f=(function(){function e(){}return function(t){if(!q(t))return{};if(vi)return vi(t);e.prototype=t;var r=new e;return e.prototype=void 0,r}})(),Ei=$f;function Gf(e,t,r){switch(r.length){case 0:return e.call(t);case 1:return e.call(t,r[0]);case 2:return e.call(t,r[0],r[1]);case 3:return e.call(t,r[0],r[1],r[2])}return e.apply(t,r)}var Ni=Gf;function Wf(e,t){var r=-1,n=e.length;for(t||(t=Array(n));++r<n;)t[r]=e[r];return t}var gr=Wf;var Vf=800,Xf=16,Yf=Date.now;function Qf(e){var t=0,r=0;return function(){var n=Yf(),s=Xf-(n-r);if(r=n,s>0){if(++t>=Vf)return arguments[0]}else t=0;return e.apply(void 0,arguments)}}var Ai=Qf;function Zf(e){return function(){return e}}var Ti=Zf;var Jf=(function(){try{var e=V(Object,"defineProperty");return e({},"",{}),e}catch{}})(),ce=Jf;var tc=ce?function(e,t){return ce(e,"toString",{configurable:!0,enumerable:!1,value:Ti(t),writable:!0})}:dr,wi=tc;var ec=Ai(wi),_i=ec;function rc(e,t){for(var r=-1,n=e==null?0:e.length;++r<n&&t(e[r],r,e)!==!1;);return e}var Oi=rc;var nc=9007199254740991,sc=/^(?:0|[1-9]\d*)$/;function ic(e,t){var r=typeof e;return t=t??nc,!!t&&(r=="number"||r!="symbol"&&sc.test(e))&&e>-1&&e%1==0&&e<t}var br=ic;function oc(e,t,r){t=="__proto__"&&ce?ce(e,t,{configurable:!0,enumerable:!0,value:r,writable:!0}):e[t]=r}var he=oc;function ac(e,t){return e===t||e!==e&&t!==t}var ht=ac;var lc=Object.prototype,uc=lc.hasOwnProperty;function fc(e,t,r){var n=e[t];(!(uc.call(e,t)&&ht(n,r))||r===void 0&&!(t in e))&&he(e,t,r)}var yr=fc;function cc(e,t,r,n){var s=!r;r||(r={});for(var i=-1,o=t.length;++i<o;){var a=t[i],l=n?n(r[a],e[a],a,r,e):void 0;l===void 0&&(l=e[a]),s?he(r,a,l):yr(r,a,l)}return r}var dt=cc;var Si=Math.max;function hc(e,t,r){return t=Si(t===void 0?e.length-1:t,0),function(){for(var n=arguments,s=-1,i=Si(n.length-t,0),o=Array(i);++s<i;)o[s]=n[t+s];s=-1;for(var a=Array(t+1);++s<t;)a[s]=n[s];return a[t]=r(o),Ni(e,this,a)}}var Li=hc;function dc(e,t){return _i(Li(e,t,dr),e+"")}var Ci=dc;var pc=9007199254740991;function mc(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=pc}var xr=mc;function gc(e){return e!=null&&xr(e.length)&&!fe(e)}var Dt=gc;function bc(e,t,r){if(!q(r))return!1;var n=typeof t;return(n=="number"?Dt(r)&&br(t,r.length):n=="string"&&t in r)?ht(r[t],e):!1}var Ii=bc;function yc(e){return Ci(function(t,r){var n=-1,s=r.length,i=s>1?r[s-1]:void 0,o=s>2?r[2]:void 0;for(i=e.length>3&&typeof i=="function"?(s--,i):void 0,o&&Ii(r[0],r[1],o)&&(i=s<3?void 0:i,s=1),t=Object(t);++n<s;){var a=r[n];a&&e(t,a,n,i)}return t})}var Ri=yc;var xc=Object.prototype;function vc(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||xc;return e===r}var de=vc;function Ec(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}var Bi=Ec;var Nc="[object Arguments]";function Ac(e){return k(e)&<(e)==Nc}var _n=Ac;var Di=Object.prototype,Tc=Di.hasOwnProperty,wc=Di.propertyIsEnumerable,_c=_n((function(){return arguments})())?_n:function(e){return k(e)&&Tc.call(e,"callee")&&!wc.call(e,"callee")},ze=_c;function Oc(){return!1}var Mi=Oc;var Pi=typeof exports=="object"&&exports&&!exports.nodeType&&exports,ji=Pi&&typeof module=="object"&&module&&!module.nodeType&&module,Sc=ji&&ji.exports===Pi,ki=Sc?R.Buffer:void 0,Lc=ki?ki.isBuffer:void 0,Cc=Lc||Mi,vt=Cc;var Ic="[object Arguments]",Rc="[object Array]",Bc="[object Boolean]",Dc="[object Date]",Mc="[object Error]",jc="[object Function]",kc="[object Map]",Pc="[object Number]",qc="[object Object]",Uc="[object RegExp]",Fc="[object Set]",zc="[object String]",Kc="[object WeakMap]",Hc="[object ArrayBuffer]",$c="[object DataView]",Gc="[object Float32Array]",Wc="[object Float64Array]",Vc="[object Int8Array]",Xc="[object Int16Array]",Yc="[object Int32Array]",Qc="[object Uint8Array]",Zc="[object Uint8ClampedArray]",Jc="[object Uint16Array]",th="[object Uint32Array]",O={};O[Gc]=O[Wc]=O[Vc]=O[Xc]=O[Yc]=O[Qc]=O[Zc]=O[Jc]=O[th]=!0;O[Ic]=O[Rc]=O[Hc]=O[Bc]=O[$c]=O[Dc]=O[Mc]=O[jc]=O[kc]=O[Pc]=O[qc]=O[Uc]=O[Fc]=O[zc]=O[Kc]=!1;function eh(e){return k(e)&&xr(e.length)&&!!O[lt(e)]}var qi=eh;function rh(e){return function(t){return e(t)}}var pe=rh;var Ui=typeof exports=="object"&&exports&&!exports.nodeType&&exports,Ke=Ui&&typeof module=="object"&&module&&!module.nodeType&&module,nh=Ke&&Ke.exports===Ui,On=nh&&hr.process,sh=(function(){try{var e=Ke&&Ke.require&&Ke.require("util").types;return e||On&&On.binding&&On.binding("util")}catch{}})(),Et=sh;var Fi=Et&&Et.isTypedArray,ih=Fi?pe(Fi):qi,me=ih;var oh=Object.prototype,ah=oh.hasOwnProperty;function lh(e,t){var r=rt(e),n=!r&&ze(e),s=!r&&!n&&vt(e),i=!r&&!n&&!s&&me(e),o=r||n||s||i,a=o?Bi(e.length,String):[],l=a.length;for(var u in e)(t||ah.call(e,u))&&!(o&&(u=="length"||s&&(u=="offset"||u=="parent")||i&&(u=="buffer"||u=="byteLength"||u=="byteOffset")||br(u,l)))&&a.push(u);return a}var vr=lh;function uh(e,t){return function(r){return e(t(r))}}var Er=uh;var fh=Er(Object.keys,Object),zi=fh;var ch=Object.prototype,hh=ch.hasOwnProperty;function dh(e){if(!de(e))return zi(e);var t=[];for(var r in Object(e))hh.call(e,r)&&r!="constructor"&&t.push(r);return t}var Ki=dh;function ph(e){return Dt(e)?vr(e):Ki(e)}var ge=ph;function mh(e){var t=[];if(e!=null)for(var r in Object(e))t.push(r);return t}var Hi=mh;var gh=Object.prototype,bh=gh.hasOwnProperty;function yh(e){if(!q(e))return Hi(e);var t=de(e),r=[];for(var n in e)n=="constructor"&&(t||!bh.call(e,n))||r.push(n);return r}var $i=yh;function xh(e){return Dt(e)?vr(e,!0):$i(e)}var pt=xh;var vh=V(Object,"create"),Nt=vh;function Eh(){this.__data__=Nt?Nt(null):{},this.size=0}var Gi=Eh;function Nh(e){var t=this.has(e)&&delete this.__data__[e];return this.size-=t?1:0,t}var Wi=Nh;var Ah="__lodash_hash_undefined__",Th=Object.prototype,wh=Th.hasOwnProperty;function _h(e){var t=this.__data__;if(Nt){var r=t[e];return r===Ah?void 0:r}return wh.call(t,e)?t[e]:void 0}var Vi=_h;var Oh=Object.prototype,Sh=Oh.hasOwnProperty;function Lh(e){var t=this.__data__;return Nt?t[e]!==void 0:Sh.call(t,e)}var Xi=Lh;var Ch="__lodash_hash_undefined__";function Ih(e,t){var r=this.__data__;return this.size+=this.has(e)?0:1,r[e]=Nt&&t===void 0?Ch:t,this}var Yi=Ih;function be(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}be.prototype.clear=Gi;be.prototype.delete=Wi;be.prototype.get=Vi;be.prototype.has=Xi;be.prototype.set=Yi;var Sn=be;function Rh(){this.__data__=[],this.size=0}var Qi=Rh;function Bh(e,t){for(var r=e.length;r--;)if(ht(e[r][0],t))return r;return-1}var Mt=Bh;var Dh=Array.prototype,Mh=Dh.splice;function jh(e){var t=this.__data__,r=Mt(t,e);if(r<0)return!1;var n=t.length-1;return r==n?t.pop():Mh.call(t,r,1),--this.size,!0}var Zi=jh;function kh(e){var t=this.__data__,r=Mt(t,e);return r<0?void 0:t[r][1]}var Ji=kh;function Ph(e){return Mt(this.__data__,e)>-1}var to=Ph;function qh(e,t){var r=this.__data__,n=Mt(r,e);return n<0?(++this.size,r.push([e,t])):r[n][1]=t,this}var eo=qh;function ye(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}ye.prototype.clear=Qi;ye.prototype.delete=Zi;ye.prototype.get=Ji;ye.prototype.has=to;ye.prototype.set=eo;var jt=ye;var Uh=V(R,"Map"),kt=Uh;function Fh(){this.size=0,this.__data__={hash:new Sn,map:new(kt||jt),string:new Sn}}var ro=Fh;function zh(e){var t=typeof e;return t=="string"||t=="number"||t=="symbol"||t=="boolean"?e!=="__proto__":e===null}var no=zh;function Kh(e,t){var r=e.__data__;return no(t)?r[typeof t=="string"?"string":"hash"]:r.map}var Pt=Kh;function Hh(e){var t=Pt(this,e).delete(e);return this.size-=t?1:0,t}var so=Hh;function $h(e){return Pt(this,e).get(e)}var io=$h;function Gh(e){return Pt(this,e).has(e)}var oo=Gh;function Wh(e,t){var r=Pt(this,e),n=r.size;return r.set(e,t),this.size+=r.size==n?0:1,this}var ao=Wh;function xe(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}xe.prototype.clear=ro;xe.prototype.delete=so;xe.prototype.get=io;xe.prototype.has=oo;xe.prototype.set=ao;var Nr=xe;function Vh(e,t){for(var r=-1,n=t.length,s=e.length;++r<n;)e[s+r]=t[r];return e}var Ar=Vh;var Xh=Er(Object.getPrototypeOf,Object),ve=Xh;var Yh="[object Object]",Qh=Function.prototype,Zh=Object.prototype,lo=Qh.toString,Jh=Zh.hasOwnProperty,td=lo.call(Object);function ed(e){if(!k(e)||lt(e)!=Yh)return!1;var t=ve(e);if(t===null)return!0;var r=Jh.call(t,"constructor")&&t.constructor;return typeof r=="function"&&r instanceof r&&lo.call(r)==td}var uo=ed;function rd(){this.__data__=new jt,this.size=0}var fo=rd;function nd(e){var t=this.__data__,r=t.delete(e);return this.size=t.size,r}var co=nd;function sd(e){return this.__data__.get(e)}var ho=sd;function id(e){return this.__data__.has(e)}var po=id;var od=200;function ad(e,t){var r=this.__data__;if(r instanceof jt){var n=r.__data__;if(!kt||n.length<od-1)return n.push([e,t]),this.size=++r.size,this;r=this.__data__=new Nr(n)}return r.set(e,t),this.size=r.size,this}var mo=ad;function Ee(e){var t=this.__data__=new jt(e);this.size=t.size}Ee.prototype.clear=fo;Ee.prototype.delete=co;Ee.prototype.get=ho;Ee.prototype.has=po;Ee.prototype.set=mo;var qt=Ee;function ld(e,t){return e&&dt(t,ge(t),e)}var go=ld;function ud(e,t){return e&&dt(t,pt(t),e)}var bo=ud;var Eo=typeof exports=="object"&&exports&&!exports.nodeType&&exports,yo=Eo&&typeof module=="object"&&module&&!module.nodeType&&module,fd=yo&&yo.exports===Eo,xo=fd?R.Buffer:void 0,vo=xo?xo.allocUnsafe:void 0;function cd(e,t){if(t)return e.slice();var r=e.length,n=vo?vo(r):new e.constructor(r);return e.copy(n),n}var Tr=cd;function hd(e,t){for(var r=-1,n=e==null?0:e.length,s=0,i=[];++r<n;){var o=e[r];t(o,r,e)&&(i[s++]=o)}return i}var No=hd;function dd(){return[]}var wr=dd;var pd=Object.prototype,md=pd.propertyIsEnumerable,Ao=Object.getOwnPropertySymbols,gd=Ao?function(e){return e==null?[]:(e=Object(e),No(Ao(e),function(t){return md.call(e,t)}))}:wr,Ne=gd;function bd(e,t){return dt(e,Ne(e),t)}var To=bd;var yd=Object.getOwnPropertySymbols,xd=yd?function(e){for(var t=[];e;)Ar(t,Ne(e)),e=ve(e);return t}:wr,_r=xd;function vd(e,t){return dt(e,_r(e),t)}var wo=vd;function Ed(e,t,r){var n=t(e);return rt(e)?n:Ar(n,r(e))}var Or=Ed;function Nd(e){return Or(e,ge,Ne)}var He=Nd;function Ad(e){return Or(e,pt,_r)}var _o=Ad;var Td=V(R,"DataView"),Sr=Td;var wd=V(R,"Promise"),Lr=wd;var _d=V(R,"Set"),Cr=_d;var Oo="[object Map]",Od="[object Object]",So="[object Promise]",Lo="[object Set]",Co="[object WeakMap]",Io="[object DataView]",Sd=xt(Sr),Ld=xt(kt),Cd=xt(Lr),Id=xt(Cr),Rd=xt(mr),Zt=lt;(Sr&&Zt(new Sr(new ArrayBuffer(1)))!=Io||kt&&Zt(new kt)!=Oo||Lr&&Zt(Lr.resolve())!=So||Cr&&Zt(new Cr)!=Lo||mr&&Zt(new mr)!=Co)&&(Zt=function(e){var t=lt(e),r=t==Od?e.constructor:void 0,n=r?xt(r):"";if(n)switch(n){case Sd:return Io;case Ld:return Oo;case Cd:return So;case Id:return Lo;case Rd:return Co}return t});var At=Zt;var Bd=Object.prototype,Dd=Bd.hasOwnProperty;function Md(e){var t=e.length,r=new e.constructor(t);return t&&typeof e[0]=="string"&&Dd.call(e,"index")&&(r.index=e.index,r.input=e.input),r}var Ro=Md;var jd=R.Uint8Array,Ae=jd;function kd(e){var t=new e.constructor(e.byteLength);return new Ae(t).set(new Ae(e)),t}var Te=kd;function Pd(e,t){var r=t?Te(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.byteLength)}var Bo=Pd;var qd=/\w*$/;function Ud(e){var t=new e.constructor(e.source,qd.exec(e));return t.lastIndex=e.lastIndex,t}var Do=Ud;var Mo=et?et.prototype:void 0,jo=Mo?Mo.valueOf:void 0;function Fd(e){return jo?Object(jo.call(e)):{}}var ko=Fd;function zd(e,t){var r=t?Te(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.length)}var Ir=zd;var Kd="[object Boolean]",Hd="[object Date]",$d="[object Map]",Gd="[object Number]",Wd="[object RegExp]",Vd="[object Set]",Xd="[object String]",Yd="[object Symbol]",Qd="[object ArrayBuffer]",Zd="[object DataView]",Jd="[object Float32Array]",tp="[object Float64Array]",ep="[object Int8Array]",rp="[object Int16Array]",np="[object Int32Array]",sp="[object Uint8Array]",ip="[object Uint8ClampedArray]",op="[object Uint16Array]",ap="[object Uint32Array]";function lp(e,t,r){var n=e.constructor;switch(t){case Qd:return Te(e);case Kd:case Hd:return new n(+e);case Zd:return Bo(e,r);case Jd:case tp:case ep:case rp:case np:case sp:case ip:case op:case ap:return Ir(e,r);case $d:return new n;case Gd:case Xd:return new n(e);case Wd:return Do(e);case Vd:return new n;case Yd:return ko(e)}}var Po=lp;function up(e){return typeof e.constructor=="function"&&!de(e)?Ei(ve(e)):{}}var Rr=up;var fp="[object Map]";function cp(e){return k(e)&&At(e)==fp}var qo=cp;var Uo=Et&&Et.isMap,hp=Uo?pe(Uo):qo,Fo=hp;var dp="[object Set]";function pp(e){return k(e)&&At(e)==dp}var zo=pp;var Ko=Et&&Et.isSet,mp=Ko?pe(Ko):zo,Ho=mp;var gp=1,bp=2,yp=4,$o="[object Arguments]",xp="[object Array]",vp="[object Boolean]",Ep="[object Date]",Np="[object Error]",Go="[object Function]",Ap="[object GeneratorFunction]",Tp="[object Map]",wp="[object Number]",Wo="[object Object]",_p="[object RegExp]",Op="[object Set]",Sp="[object String]",Lp="[object Symbol]",Cp="[object WeakMap]",Ip="[object ArrayBuffer]",Rp="[object DataView]",Bp="[object Float32Array]",Dp="[object Float64Array]",Mp="[object Int8Array]",jp="[object Int16Array]",kp="[object Int32Array]",Pp="[object Uint8Array]",qp="[object Uint8ClampedArray]",Up="[object Uint16Array]",Fp="[object Uint32Array]",w={};w[$o]=w[xp]=w[Ip]=w[Rp]=w[vp]=w[Ep]=w[Bp]=w[Dp]=w[Mp]=w[jp]=w[kp]=w[Tp]=w[wp]=w[Wo]=w[_p]=w[Op]=w[Sp]=w[Lp]=w[Pp]=w[qp]=w[Up]=w[Fp]=!0;w[Np]=w[Go]=w[Cp]=!1;function Br(e,t,r,n,s,i){var o,a=t&gp,l=t&bp,u=t&yp;if(r&&(o=s?r(e,n,s,i):r(e)),o!==void 0)return o;if(!q(e))return e;var f=rt(e);if(f){if(o=Ro(e),!a)return gr(e,o)}else{var c=At(e),h=c==Go||c==Ap;if(vt(e))return Tr(e,a);if(c==Wo||c==$o||h&&!s){if(o=l||h?{}:Rr(e),!a)return l?wo(e,bo(o,e)):To(e,go(o,e))}else{if(!w[c])return s?e:{};o=Po(e,c,a)}}i||(i=new qt);var d=i.get(e);if(d)return d;i.set(e,o),Ho(e)?e.forEach(function(x){o.add(Br(x,t,r,x,e,i))}):Fo(e)&&e.forEach(function(x,p){o.set(p,Br(x,t,r,p,e,i))});var m=u?l?_o:He:l?pt:ge,y=f?void 0:m(e);return Oi(y||e,function(x,p){y&&(p=x,x=e[p]),yr(o,p,Br(x,t,r,p,e,i))}),o}var Vo=Br;var zp=1,Kp=4;function Hp(e){return Vo(e,zp|Kp)}var mt=Hp;var $p="__lodash_hash_undefined__";function Gp(e){return this.__data__.set(e,$p),this}var Xo=Gp;function Wp(e){return this.__data__.has(e)}var Yo=Wp;function Dr(e){var t=-1,r=e==null?0:e.length;for(this.__data__=new Nr;++t<r;)this.add(e[t])}Dr.prototype.add=Dr.prototype.push=Xo;Dr.prototype.has=Yo;var Qo=Dr;function Vp(e,t){for(var r=-1,n=e==null?0:e.length;++r<n;)if(t(e[r],r,e))return!0;return!1}var Zo=Vp;function Xp(e,t){return e.has(t)}var Jo=Xp;var Yp=1,Qp=2;function Zp(e,t,r,n,s,i){var o=r&Yp,a=e.length,l=t.length;if(a!=l&&!(o&&l>a))return!1;var u=i.get(e),f=i.get(t);if(u&&f)return u==t&&f==e;var c=-1,h=!0,d=r&Qp?new Qo:void 0;for(i.set(e,t),i.set(t,e);++c<a;){var m=e[c],y=t[c];if(n)var x=o?n(y,m,c,t,e,i):n(m,y,c,e,t,i);if(x!==void 0){if(x)continue;h=!1;break}if(d){if(!Zo(t,function(p,v){if(!Jo(d,v)&&(m===p||s(m,p,r,n,i)))return d.push(v)})){h=!1;break}}else if(!(m===y||s(m,y,r,n,i))){h=!1;break}}return i.delete(e),i.delete(t),h}var Mr=Zp;function Jp(e){var t=-1,r=Array(e.size);return e.forEach(function(n,s){r[++t]=[s,n]}),r}var ta=Jp;function tm(e){var t=-1,r=Array(e.size);return e.forEach(function(n){r[++t]=n}),r}var ea=tm;var em=1,rm=2,nm="[object Boolean]",sm="[object Date]",im="[object Error]",om="[object Map]",am="[object Number]",lm="[object RegExp]",um="[object Set]",fm="[object String]",cm="[object Symbol]",hm="[object ArrayBuffer]",dm="[object DataView]",ra=et?et.prototype:void 0,Ln=ra?ra.valueOf:void 0;function pm(e,t,r,n,s,i,o){switch(r){case dm:if(e.byteLength!=t.byteLength||e.byteOffset!=t.byteOffset)return!1;e=e.buffer,t=t.buffer;case hm:return!(e.byteLength!=t.byteLength||!i(new Ae(e),new Ae(t)));case nm:case sm:case am:return ht(+e,+t);case im:return e.name==t.name&&e.message==t.message;case lm:case fm:return e==t+"";case om:var a=ta;case um:var l=n&em;if(a||(a=ea),e.size!=t.size&&!l)return!1;var u=o.get(e);if(u)return u==t;n|=rm,o.set(e,t);var f=Mr(a(e),a(t),n,s,i,o);return o.delete(e),f;case cm:if(Ln)return Ln.call(e)==Ln.call(t)}return!1}var na=pm;var mm=1,gm=Object.prototype,bm=gm.hasOwnProperty;function ym(e,t,r,n,s,i){var o=r&mm,a=He(e),l=a.length,u=He(t),f=u.length;if(l!=f&&!o)return!1;for(var c=l;c--;){var h=a[c];if(!(o?h in t:bm.call(t,h)))return!1}var d=i.get(e),m=i.get(t);if(d&&m)return d==t&&m==e;var y=!0;i.set(e,t),i.set(t,e);for(var x=o;++c<l;){h=a[c];var p=e[h],v=t[h];if(n)var N=o?n(v,p,h,t,e,i):n(p,v,h,e,t,i);if(!(N===void 0?p===v||s(p,v,r,n,i):N)){y=!1;break}x||(x=h=="constructor")}if(y&&!x){var A=e.constructor,T=t.constructor;A!=T&&"constructor"in e&&"constructor"in t&&!(typeof A=="function"&&A instanceof A&&typeof T=="function"&&T instanceof T)&&(y=!1)}return i.delete(e),i.delete(t),y}var sa=ym;var xm=1,ia="[object Arguments]",oa="[object Array]",jr="[object Object]",vm=Object.prototype,aa=vm.hasOwnProperty;function Em(e,t,r,n,s,i){var o=rt(e),a=rt(t),l=o?oa:At(e),u=a?oa:At(t);l=l==ia?jr:l,u=u==ia?jr:u;var f=l==jr,c=u==jr,h=l==u;if(h&&vt(e)){if(!vt(t))return!1;o=!0,f=!1}if(h&&!f)return i||(i=new qt),o||me(e)?Mr(e,t,r,n,s,i):na(e,t,l,r,n,s,i);if(!(r&xm)){var d=f&&aa.call(e,"__wrapped__"),m=c&&aa.call(t,"__wrapped__");if(d||m){var y=d?e.value():e,x=m?t.value():t;return i||(i=new qt),s(y,x,r,n,i)}}return h?(i||(i=new qt),sa(e,t,r,n,s,i)):!1}var la=Em;function ua(e,t,r,n,s){return e===t?!0:e==null||t==null||!k(e)&&!k(t)?e!==e&&t!==t:la(e,t,r,n,ua,s)}var fa=ua;function Nm(e){return function(t,r,n){for(var s=-1,i=Object(t),o=n(t),a=o.length;a--;){var l=o[e?a:++s];if(r(i[l],l,i)===!1)break}return t}}var ca=Nm;var Am=ca(),ha=Am;function Tm(e,t,r){(r!==void 0&&!ht(e[t],r)||r===void 0&&!(t in e))&&he(e,t,r)}var $e=Tm;function wm(e){return k(e)&&Dt(e)}var da=wm;function _m(e,t){if(!(t==="constructor"&&typeof e[t]=="function")&&t!="__proto__")return e[t]}var Ge=_m;function Om(e){return dt(e,pt(e))}var pa=Om;function Sm(e,t,r,n,s,i,o){var a=Ge(e,r),l=Ge(t,r),u=o.get(l);if(u){$e(e,r,u);return}var f=i?i(a,l,r+"",e,t,o):void 0,c=f===void 0;if(c){var h=rt(l),d=!h&&vt(l),m=!h&&!d&&me(l);f=l,h||d||m?rt(a)?f=a:da(a)?f=gr(a):d?(c=!1,f=Tr(l,!0)):m?(c=!1,f=Ir(l,!0)):f=[]:uo(l)||ze(l)?(f=a,ze(a)?f=pa(a):(!q(a)||fe(a))&&(f=Rr(l))):c=!1}c&&(o.set(l,f),s(f,l,n,i,o),o.delete(l)),$e(e,r,f)}var ma=Sm;function ga(e,t,r,n,s){e!==t&&ha(t,function(i,o){if(s||(s=new qt),q(i))ma(e,t,o,r,ga,n,s);else{var a=n?n(Ge(e,o),i,o+"",e,t,s):void 0;a===void 0&&(a=i),$e(e,o,a)}},pt)}var ba=ga;function Lm(e,t){return fa(e,t)}var Jt=Lm;var Cm=Ri(function(e,t,r){ba(e,t,r)}),Ut=Cm;var Pr={};sf(Pr,{Attributor:()=>K,AttributorStore:()=>We,BlockBlot:()=>te,ClassAttributor:()=>U,ContainerBlot:()=>Le,EmbedBlot:()=>D,InlineBlot:()=>kr,LeafBlot:()=>B,ParentBlot:()=>X,Registry:()=>Kt,Scope:()=>b,ScrollBlot:()=>Ve,StyleAttributor:()=>Y,TextBlot:()=>Ce});var b=(e=>(e[e.TYPE=3]="TYPE",e[e.LEVEL=12]="LEVEL",e[e.ATTRIBUTE=13]="ATTRIBUTE",e[e.BLOT=14]="BLOT",e[e.INLINE=7]="INLINE",e[e.BLOCK=11]="BLOCK",e[e.BLOCK_BLOT=10]="BLOCK_BLOT",e[e.INLINE_BLOT=6]="INLINE_BLOT",e[e.BLOCK_ATTRIBUTE=9]="BLOCK_ATTRIBUTE",e[e.INLINE_ATTRIBUTE=5]="INLINE_ATTRIBUTE",e[e.ANY=15]="ANY",e))(b||{}),K=class{constructor(t,r,n={}){this.attrName=t,this.keyName=r;let s=b.TYPE&b.ATTRIBUTE;this.scope=n.scope!=null?n.scope&b.LEVEL|s:b.ATTRIBUTE,n.whitelist!=null&&(this.whitelist=n.whitelist)}static keys(t){return Array.from(t.attributes).map(r=>r.name)}add(t,r){return this.canAdd(t,r)?(t.setAttribute(this.keyName,r),!0):!1}canAdd(t,r){return this.whitelist==null?!0:typeof r=="string"?this.whitelist.indexOf(r.replace(/["']/g,""))>-1:this.whitelist.indexOf(r)>-1}remove(t){t.removeAttribute(this.keyName)}value(t){let r=t.getAttribute(this.keyName);return this.canAdd(t,r)&&r?r:""}},zt=class extends Error{constructor(t){t="[Parchment] "+t,super(t),this.message=t,this.name=this.constructor.name}},va=class In{constructor(){this.attributes={},this.classes={},this.tags={},this.types={}}static find(t,r=!1){if(t==null)return null;if(this.blots.has(t))return this.blots.get(t)||null;if(r){let n=null;try{n=t.parentNode}catch{return null}return this.find(n,r)}return null}create(t,r,n){let s=this.query(r);if(s==null)throw new zt(`Unable to create ${r} blot`);let i=s,o=r instanceof Node||r.nodeType===Node.TEXT_NODE?r:i.create(n),a=new i(t,o,n);return In.blots.set(a.domNode,a),a}find(t,r=!1){return In.find(t,r)}query(t,r=b.ANY){let n;return typeof t=="string"?n=this.types[t]||this.attributes[t]:t instanceof Text||t.nodeType===Node.TEXT_NODE?n=this.types.text:typeof t=="number"?t&b.LEVEL&b.BLOCK?n=this.types.block:t&b.LEVEL&b.INLINE&&(n=this.types.inline):t instanceof Element&&((t.getAttribute("class")||"").split(/\s+/).some(s=>(n=this.classes[s],!!n)),n=n||this.tags[t.tagName]),n==null?null:"scope"in n&&r&b.LEVEL&n.scope&&r&b.TYPE&n.scope?n:null}register(...t){return t.map(r=>{let n="blotName"in r,s="attrName"in r;if(!n&&!s)throw new zt("Invalid definition");if(n&&r.blotName==="abstract")throw new zt("Cannot register abstract class");let i=n?r.blotName:s?r.attrName:void 0;return this.types[i]=r,s?typeof r.keyName=="string"&&(this.attributes[r.keyName]=r):n&&(r.className&&(this.classes[r.className]=r),r.tagName&&(Array.isArray(r.tagName)?r.tagName=r.tagName.map(o=>o.toUpperCase()):r.tagName=r.tagName.toUpperCase(),(Array.isArray(r.tagName)?r.tagName:[r.tagName]).forEach(o=>{(this.tags[o]==null||r.className==null)&&(this.tags[o]=r)}))),r})}};va.blots=new WeakMap;var Kt=va;function ya(e,t){return(e.getAttribute("class")||"").split(/\s+/).filter(r=>r.indexOf(`${t}-`)===0)}var Rn=class extends K{static keys(t){return(t.getAttribute("class")||"").split(/\s+/).map(r=>r.split("-").slice(0,-1).join("-"))}add(t,r){return this.canAdd(t,r)?(this.remove(t),t.classList.add(`${this.keyName}-${r}`),!0):!1}remove(t){ya(t,this.keyName).forEach(r=>{t.classList.remove(r)}),t.classList.length===0&&t.removeAttribute("class")}value(t){let r=(ya(t,this.keyName)[0]||"").slice(this.keyName.length+1);return this.canAdd(t,r)?r:""}},U=Rn;function Cn(e){let t=e.split("-"),r=t.slice(1).map(n=>n[0].toUpperCase()+n.slice(1)).join("");return t[0]+r}var Bn=class extends K{static keys(t){return(t.getAttribute("style")||"").split(";").map(r=>r.split(":")[0].trim())}add(t,r){return this.canAdd(t,r)?(t.style[Cn(this.keyName)]=r,!0):!1}remove(t){t.style[Cn(this.keyName)]="",t.getAttribute("style")||t.removeAttribute("style")}value(t){let r=t.style[Cn(this.keyName)];return this.canAdd(t,r)?r:""}},Y=Bn,Dn=class{constructor(t){this.attributes={},this.domNode=t,this.build()}attribute(t,r){r?t.add(this.domNode,r)&&(t.value(this.domNode)!=null?this.attributes[t.attrName]=t:delete this.attributes[t.attrName]):(t.remove(this.domNode),delete this.attributes[t.attrName])}build(){this.attributes={};let t=Kt.find(this.domNode);if(t==null)return;let r=K.keys(this.domNode),n=U.keys(this.domNode),s=Y.keys(this.domNode);r.concat(n).concat(s).forEach(i=>{let o=t.scroll.query(i,b.ATTRIBUTE);o instanceof K&&(this.attributes[o.attrName]=o)})}copy(t){Object.keys(this.attributes).forEach(r=>{let n=this.attributes[r].value(this.domNode);t.format(r,n)})}move(t){this.copy(t),Object.keys(this.attributes).forEach(r=>{this.attributes[r].remove(this.domNode)}),this.attributes={}}values(){return Object.keys(this.attributes).reduce((t,r)=>(t[r]=this.attributes[r].value(this.domNode),t),{})}},We=Dn,Ea=class{constructor(t,r){this.scroll=t,this.domNode=r,Kt.blots.set(r,this),this.prev=null,this.next=null}static create(t){if(this.tagName==null)throw new zt("Blot definition missing tagName");let r,n;return Array.isArray(this.tagName)?(typeof t=="string"?(n=t.toUpperCase(),parseInt(n,10).toString()===n&&(n=parseInt(n,10))):typeof t=="number"&&(n=t),typeof n=="number"?r=document.createElement(this.tagName[n-1]):n&&this.tagName.indexOf(n)>-1?r=document.createElement(n):r=document.createElement(this.tagName[0])):r=document.createElement(this.tagName),this.className&&r.classList.add(this.className),r}get statics(){return this.constructor}attach(){}clone(){let t=this.domNode.cloneNode(!1);return this.scroll.create(t)}detach(){this.parent!=null&&this.parent.removeChild(this),Kt.blots.delete(this.domNode)}deleteAt(t,r){this.isolate(t,r).remove()}formatAt(t,r,n,s){let i=this.isolate(t,r);if(this.scroll.query(n,b.BLOT)!=null&&s)i.wrap(n,s);else if(this.scroll.query(n,b.ATTRIBUTE)!=null){let o=this.scroll.create(this.statics.scope);i.wrap(o),o.format(n,s)}}insertAt(t,r,n){let s=n==null?this.scroll.create("text",r):this.scroll.create(r,n),i=this.split(t);this.parent.insertBefore(s,i||void 0)}isolate(t,r){let n=this.split(t);if(n==null)throw new Error("Attempt to isolate at end");return n.split(r),n}length(){return 1}offset(t=this.parent){return this.parent==null||this===t?0:this.parent.children.offset(this)+this.parent.offset(t)}optimize(t){this.statics.requiredContainer&&!(this.parent instanceof this.statics.requiredContainer)&&this.wrap(this.statics.requiredContainer.blotName)}remove(){this.domNode.parentNode!=null&&this.domNode.parentNode.removeChild(this.domNode),this.detach()}replaceWith(t,r){let n=typeof t=="string"?this.scroll.create(t,r):t;return this.parent!=null&&(this.parent.insertBefore(n,this.next||void 0),this.remove()),n}split(t,r){return t===0?this:this.next}update(t,r){}wrap(t,r){let n=typeof t=="string"?this.scroll.create(t,r):t;if(this.parent!=null&&this.parent.insertBefore(n,this.next||void 0),typeof n.appendChild!="function")throw new zt(`Cannot wrap ${t}`);return n.appendChild(this),n}};Ea.blotName="abstract";var Na=Ea,Aa=class extends Na{static value(t){return!0}index(t,r){return this.domNode===t||this.domNode.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_CONTAINED_BY?Math.min(r,1):-1}position(t,r){let n=Array.from(this.parent.domNode.childNodes).indexOf(this.domNode);return t>0&&(n+=1),[this.parent.domNode,n]}value(){return{[this.statics.blotName]:this.statics.value(this.domNode)||!0}}};Aa.scope=b.INLINE_BLOT;var Im=Aa,B=Im,Mn=class{constructor(){this.head=null,this.tail=null,this.length=0}append(...t){if(this.insertBefore(t[0],null),t.length>1){let r=t.slice(1);this.append(...r)}}at(t){let r=this.iterator(),n=r();for(;n&&t>0;)t-=1,n=r();return n}contains(t){let r=this.iterator(),n=r();for(;n;){if(n===t)return!0;n=r()}return!1}indexOf(t){let r=this.iterator(),n=r(),s=0;for(;n;){if(n===t)return s;s+=1,n=r()}return-1}insertBefore(t,r){t!=null&&(this.remove(t),t.next=r,r!=null?(t.prev=r.prev,r.prev!=null&&(r.prev.next=t),r.prev=t,r===this.head&&(this.head=t)):this.tail!=null?(this.tail.next=t,t.prev=this.tail,this.tail=t):(t.prev=null,this.head=this.tail=t),this.length+=1)}offset(t){let r=0,n=this.head;for(;n!=null;){if(n===t)return r;r+=n.length(),n=n.next}return-1}remove(t){this.contains(t)&&(t.prev!=null&&(t.prev.next=t.next),t.next!=null&&(t.next.prev=t.prev),t===this.head&&(this.head=t.next),t===this.tail&&(this.tail=t.prev),this.length-=1)}iterator(t=this.head){return()=>{let r=t;return t!=null&&(t=t.next),r}}find(t,r=!1){let n=this.iterator(),s=n();for(;s;){let i=s.length();if(t<i||r&&t===i&&(s.next==null||s.next.length()!==0))return[s,t];t-=i,s=n()}return[null,0]}forEach(t){let r=this.iterator(),n=r();for(;n;)t(n),n=r()}forEachAt(t,r,n){if(r<=0)return;let[s,i]=this.find(t),o=t-i,a=this.iterator(s),l=a();for(;l&&o<t+r;){let u=l.length();t>o?n(l,t-o,Math.min(r,o+u-t)):n(l,0,Math.min(u,t+r-o)),o+=u,l=a()}}map(t){return this.reduce((r,n)=>(r.push(t(n)),r),[])}reduce(t,r){let n=this.iterator(),s=n();for(;s;)r=t(r,s),s=n();return r}};function xa(e,t){let r=t.find(e);if(r)return r;try{return t.create(e)}catch{let n=t.create(b.INLINE);return Array.from(e.childNodes).forEach(s=>{n.domNode.appendChild(s)}),e.parentNode&&e.parentNode.replaceChild(n.domNode,e),n.attach(),n}}var Ta=class Ft extends Na{constructor(t,r){super(t,r),this.uiNode=null,this.build()}appendChild(t){this.insertBefore(t)}attach(){super.attach(),this.children.forEach(t=>{t.attach()})}attachUI(t){this.uiNode!=null&&this.uiNode.remove(),this.uiNode=t,Ft.uiClass&&this.uiNode.classList.add(Ft.uiClass),this.uiNode.setAttribute("contenteditable","false"),this.domNode.insertBefore(this.uiNode,this.domNode.firstChild)}build(){this.children=new Mn,Array.from(this.domNode.childNodes).filter(t=>t!==this.uiNode).reverse().forEach(t=>{try{let r=xa(t,this.scroll);this.insertBefore(r,this.children.head||void 0)}catch(r){if(r instanceof zt)return;throw r}})}deleteAt(t,r){if(t===0&&r===this.length())return this.remove();this.children.forEachAt(t,r,(n,s,i)=>{n.deleteAt(s,i)})}descendant(t,r=0){let[n,s]=this.children.find(r);return t.blotName==null&&t(n)||t.blotName!=null&&n instanceof t?[n,s]:n instanceof Ft?n.descendant(t,s):[null,-1]}descendants(t,r=0,n=Number.MAX_VALUE){let s=[],i=n;return this.children.forEachAt(r,n,(o,a,l)=>{(t.blotName==null&&t(o)||t.blotName!=null&&o instanceof t)&&s.push(o),o instanceof Ft&&(s=s.concat(o.descendants(t,a,i))),i-=l}),s}detach(){this.children.forEach(t=>{t.detach()}),super.detach()}enforceAllowedChildren(){let t=!1;this.children.forEach(r=>{t||this.statics.allowedChildren.some(n=>r instanceof n)||(r.statics.scope===b.BLOCK_BLOT?(r.next!=null&&this.splitAfter(r),r.prev!=null&&this.splitAfter(r.prev),r.parent.unwrap(),t=!0):r instanceof Ft?r.unwrap():r.remove())})}formatAt(t,r,n,s){this.children.forEachAt(t,r,(i,o,a)=>{i.formatAt(o,a,n,s)})}insertAt(t,r,n){let[s,i]=this.children.find(t);if(s)s.insertAt(i,r,n);else{let o=n==null?this.scroll.create("text",r):this.scroll.create(r,n);this.appendChild(o)}}insertBefore(t,r){t.parent!=null&&t.parent.children.remove(t);let n=null;this.children.insertBefore(t,r||null),t.parent=this,r!=null&&(n=r.domNode),(this.domNode.parentNode!==t.domNode||this.domNode.nextSibling!==n)&&this.domNode.insertBefore(t.domNode,n),t.attach()}length(){return this.children.reduce((t,r)=>t+r.length(),0)}moveChildren(t,r){this.children.forEach(n=>{t.insertBefore(n,r)})}optimize(t){if(super.optimize(t),this.enforceAllowedChildren(),this.uiNode!=null&&this.uiNode!==this.domNode.firstChild&&this.domNode.insertBefore(this.uiNode,this.domNode.firstChild),this.children.length===0)if(this.statics.defaultChild!=null){let r=this.scroll.create(this.statics.defaultChild.blotName);this.appendChild(r)}else this.remove()}path(t,r=!1){let[n,s]=this.children.find(t,r),i=[[this,t]];return n instanceof Ft?i.concat(n.path(s,r)):(n!=null&&i.push([n,s]),i)}removeChild(t){this.children.remove(t)}replaceWith(t,r){let n=typeof t=="string"?this.scroll.create(t,r):t;return n instanceof Ft&&this.moveChildren(n),super.replaceWith(n)}split(t,r=!1){if(!r){if(t===0)return this;if(t===this.length())return this.next}let n=this.clone();return this.parent&&this.parent.insertBefore(n,this.next||void 0),this.children.forEachAt(t,this.length(),(s,i,o)=>{let a=s.split(i,r);a!=null&&n.appendChild(a)}),n}splitAfter(t){let r=this.clone();for(;t.next!=null;)r.appendChild(t.next);return this.parent&&this.parent.insertBefore(r,this.next||void 0),r}unwrap(){this.parent&&this.moveChildren(this.parent,this.next||void 0),this.remove()}update(t,r){let n=[],s=[];t.forEach(i=>{i.target===this.domNode&&i.type==="childList"&&(n.push(...i.addedNodes),s.push(...i.removedNodes))}),s.forEach(i=>{if(i.parentNode!=null&&i.tagName!=="IFRAME"&&document.body.compareDocumentPosition(i)&Node.DOCUMENT_POSITION_CONTAINED_BY)return;let o=this.scroll.find(i);o!=null&&(o.domNode.parentNode==null||o.domNode.parentNode===this.domNode)&&o.detach()}),n.filter(i=>i.parentNode===this.domNode&&i!==this.uiNode).sort((i,o)=>i===o?0:i.compareDocumentPosition(o)&Node.DOCUMENT_POSITION_FOLLOWING?1:-1).forEach(i=>{let o=null;i.nextSibling!=null&&(o=this.scroll.find(i.nextSibling));let a=xa(i,this.scroll);(a.next!==o||a.next==null)&&(a.parent!=null&&a.parent.removeChild(this),this.insertBefore(a,o||void 0))}),this.enforceAllowedChildren()}};Ta.uiClass="";var Rm=Ta,X=Rm;function Bm(e,t){if(Object.keys(e).length!==Object.keys(t).length)return!1;for(let r in e)if(e[r]!==t[r])return!1;return!0}var we=class _e extends X{static create(t){return super.create(t)}static formats(t,r){let n=r.query(_e.blotName);if(!(n!=null&&t.tagName===n.tagName)){if(typeof this.tagName=="string")return!0;if(Array.isArray(this.tagName))return t.tagName.toLowerCase()}}constructor(t,r){super(t,r),this.attributes=new We(this.domNode)}format(t,r){if(t===this.statics.blotName&&!r)this.children.forEach(n=>{n instanceof _e||(n=n.wrap(_e.blotName,!0)),this.attributes.copy(n)}),this.unwrap();else{let n=this.scroll.query(t,b.INLINE);if(n==null)return;n instanceof K?this.attributes.attribute(n,r):r&&(t!==this.statics.blotName||this.formats()[t]!==r)&&this.replaceWith(t,r)}}formats(){let t=this.attributes.values(),r=this.statics.formats(this.domNode,this.scroll);return r!=null&&(t[this.statics.blotName]=r),t}formatAt(t,r,n,s){this.formats()[n]!=null||this.scroll.query(n,b.ATTRIBUTE)?this.isolate(t,r).format(n,s):super.formatAt(t,r,n,s)}optimize(t){super.optimize(t);let r=this.formats();if(Object.keys(r).length===0)return this.unwrap();let n=this.next;n instanceof _e&&n.prev===this&&Bm(r,n.formats())&&(n.moveChildren(this),n.remove())}replaceWith(t,r){let n=super.replaceWith(t,r);return this.attributes.copy(n),n}update(t,r){super.update(t,r),t.some(n=>n.target===this.domNode&&n.type==="attributes")&&this.attributes.build()}wrap(t,r){let n=super.wrap(t,r);return n instanceof _e&&this.attributes.move(n),n}};we.allowedChildren=[we,B],we.blotName="inline",we.scope=b.INLINE_BLOT,we.tagName="SPAN";var Dm=we,kr=Dm,Oe=class jn extends X{static create(t){return super.create(t)}static formats(t,r){let n=r.query(jn.blotName);if(!(n!=null&&t.tagName===n.tagName)){if(typeof this.tagName=="string")return!0;if(Array.isArray(this.tagName))return t.tagName.toLowerCase()}}constructor(t,r){super(t,r),this.attributes=new We(this.domNode)}format(t,r){let n=this.scroll.query(t,b.BLOCK);n!=null&&(n instanceof K?this.attributes.attribute(n,r):t===this.statics.blotName&&!r?this.replaceWith(jn.blotName):r&&(t!==this.statics.blotName||this.formats()[t]!==r)&&this.replaceWith(t,r))}formats(){let t=this.attributes.values(),r=this.statics.formats(this.domNode,this.scroll);return r!=null&&(t[this.statics.blotName]=r),t}formatAt(t,r,n,s){this.scroll.query(n,b.BLOCK)!=null?this.format(n,s):super.formatAt(t,r,n,s)}insertAt(t,r,n){if(n==null||this.scroll.query(r,b.INLINE)!=null)super.insertAt(t,r,n);else{let s=this.split(t);if(s!=null){let i=this.scroll.create(r,n);s.parent.insertBefore(i,s)}else throw new Error("Attempt to insertAt after block boundaries")}}replaceWith(t,r){let n=super.replaceWith(t,r);return this.attributes.copy(n),n}update(t,r){super.update(t,r),t.some(n=>n.target===this.domNode&&n.type==="attributes")&&this.attributes.build()}};Oe.blotName="block",Oe.scope=b.BLOCK_BLOT,Oe.tagName="P",Oe.allowedChildren=[kr,Oe,B];var Mm=Oe,te=Mm,kn=class extends X{checkMerge(){return this.next!==null&&this.next.statics.blotName===this.statics.blotName}deleteAt(t,r){super.deleteAt(t,r),this.enforceAllowedChildren()}formatAt(t,r,n,s){super.formatAt(t,r,n,s),this.enforceAllowedChildren()}insertAt(t,r,n){super.insertAt(t,r,n),this.enforceAllowedChildren()}optimize(t){super.optimize(t),this.children.length>0&&this.next!=null&&this.checkMerge()&&(this.next.moveChildren(this),this.next.remove())}};kn.blotName="container",kn.scope=b.BLOCK_BLOT;var jm=kn,Le=jm,Pn=class extends B{static formats(t,r){}format(t,r){super.formatAt(0,this.length(),t,r)}formatAt(t,r,n,s){t===0&&r===this.length()?this.format(n,s):super.formatAt(t,r,n,s)}formats(){return this.statics.formats(this.domNode,this.scroll)}},D=Pn,km={attributes:!0,characterData:!0,characterDataOldValue:!0,childList:!0,subtree:!0},Pm=100,Se=class extends X{constructor(t,r){super(null,r),this.registry=t,this.scroll=this,this.build(),this.observer=new MutationObserver(n=>{this.update(n)}),this.observer.observe(this.domNode,km),this.attach()}create(t,r){return this.registry.create(this,t,r)}find(t,r=!1){let n=this.registry.find(t,r);return n?n.scroll===this?n:r?this.find(n.scroll.domNode.parentNode,!0):null:null}query(t,r=b.ANY){return this.registry.query(t,r)}register(...t){return this.registry.register(...t)}build(){this.scroll!=null&&super.build()}detach(){super.detach(),this.observer.disconnect()}deleteAt(t,r){this.update(),t===0&&r===this.length()?this.children.forEach(n=>{n.remove()}):super.deleteAt(t,r)}formatAt(t,r,n,s){this.update(),super.formatAt(t,r,n,s)}insertAt(t,r,n){this.update(),super.insertAt(t,r,n)}optimize(t=[],r={}){super.optimize(r);let n=r.mutationsMap||new WeakMap,s=Array.from(this.observer.takeRecords());for(;s.length>0;)t.push(s.pop());let i=(l,u=!0)=>{l==null||l===this||l.domNode.parentNode!=null&&(n.has(l.domNode)||n.set(l.domNode,[]),u&&i(l.parent))},o=l=>{n.has(l.domNode)&&(l instanceof X&&l.children.forEach(o),n.delete(l.domNode),l.optimize(r))},a=t;for(let l=0;a.length>0;l+=1){if(l>=Pm)throw new Error("[Parchment] Maximum optimize iterations reached");for(a.forEach(u=>{let f=this.find(u.target,!0);f!=null&&(f.domNode===u.target&&(u.type==="childList"?(i(this.find(u.previousSibling,!1)),Array.from(u.addedNodes).forEach(c=>{let h=this.find(c,!1);i(h,!1),h instanceof X&&h.children.forEach(d=>{i(d,!1)})})):u.type==="attributes"&&i(f.prev)),i(f))}),this.children.forEach(o),a=Array.from(this.observer.takeRecords()),s=a.slice();s.length>0;)t.push(s.pop())}}update(t,r={}){t=t||this.observer.takeRecords();let n=new WeakMap;t.map(s=>{let i=this.find(s.target,!0);return i==null?null:n.has(i.domNode)?(n.get(i.domNode).push(s),null):(n.set(i.domNode,[s]),i)}).forEach(s=>{s!=null&&s!==this&&n.has(s.domNode)&&s.update(n.get(s.domNode)||[],r)}),r.mutationsMap=n,n.has(this.domNode)&&super.update(n.get(this.domNode),r),this.optimize(t,r)}};Se.blotName="scroll",Se.defaultChild=te,Se.allowedChildren=[te,Le],Se.scope=b.BLOCK_BLOT,Se.tagName="DIV";var qm=Se,Ve=qm,qn=class wa extends B{static create(t){return document.createTextNode(t)}static value(t){return t.data}constructor(t,r){super(t,r),this.text=this.statics.value(this.domNode)}deleteAt(t,r){this.domNode.data=this.text=this.text.slice(0,t)+this.text.slice(t+r)}index(t,r){return this.domNode===t?r:-1}insertAt(t,r,n){n==null?(this.text=this.text.slice(0,t)+r+this.text.slice(t),this.domNode.data=this.text):super.insertAt(t,r,n)}length(){return this.text.length}optimize(t){super.optimize(t),this.text=this.statics.value(this.domNode),this.text.length===0?this.remove():this.next instanceof wa&&this.next.prev===this&&(this.insertAt(this.length(),this.next.value()),this.next.remove())}position(t,r=!1){return[this.domNode,t]}split(t,r=!1){if(!r){if(t===0)return this;if(t===this.length())return this.next}let n=this.scroll.create(this.domNode.splitText(t));return this.parent.insertBefore(n,this.next||void 0),this.text=this.statics.value(this.domNode),n}update(t,r){t.some(n=>n.type==="characterData"&&n.target===this.domNode)&&(this.text=this.statics.value(this.domNode))}value(){return this.text}};qn.blotName="text",qn.scope=b.INLINE_BLOT;var Um=qn,Ce=Um;var Wt=ct(bt(),1);var I=ct(bt(),1);var ws=ct(bt(),1);var sr=class extends D{static value(){}optimize(){(this.prev||this.next)&&this.remove()}length(){return 0}value(){return""}};sr.blotName="break";sr.tagName="BR";var Q=sr;var j=class extends Ce{},nx={"&":"&","<":"<",">":">",'"':""","'":"'"};function un(e){return e.replace(/[&<>"']/g,t=>nx[t])}var Ts=class e extends kr{static allowedChildren=[e,Q,D,j];static order=["cursor","inline","link","underline","strike","italic","bold","script","code"];static compare(t,r){let n=e.order.indexOf(t),s=e.order.indexOf(r);return n>=0||s>=0?n-s:t===r?0:t<r?-1:1}formatAt(t,r,n,s){if(e.compare(this.statics.blotName,n)<0&&this.scroll.query(n,b.BLOT)){let i=this.isolate(t,r);s&&i.wrap(n,s)}else super.formatAt(t,r,n,s)}optimize(t){if(super.optimize(t),this.parent instanceof e&&e.compare(this.statics.blotName,this.parent.statics.blotName)>0){let r=this.parent.isolate(this.offset(),this.length());this.moveChildren(r),r.wrap(this)}}},st=Ts;var lu=1,L=class extends te{cache={};delta(){return this.cache.delta==null&&(this.cache.delta=sx(this)),this.cache.delta}deleteAt(t,r){super.deleteAt(t,r),this.cache={}}formatAt(t,r,n,s){r<=0||(this.scroll.query(n,b.BLOCK)?t+r===this.length()&&this.format(n,s):super.formatAt(t,Math.min(r,this.length()-t-1),n,s),this.cache={})}insertAt(t,r,n){if(n!=null){super.insertAt(t,r,n),this.cache={};return}if(r.length===0)return;let s=r.split(`
`),i=s.shift();i.length>0&&(t<this.length()-1||this.children.tail==null?super.insertAt(Math.min(t,this.length()-1),i):this.children.tail.insertAt(this.children.tail.length(),i),this.cache={});let o=this;s.reduce((a,l)=>(o=o.split(a,!0),o.insertAt(0,l),l.length),t+i.length)}insertBefore(t,r){let{head:n}=this.children;super.insertBefore(t,r),n instanceof Q&&n.remove(),this.cache={}}length(){return this.cache.length==null&&(this.cache.length=super.length()+lu),this.cache.length}moveChildren(t,r){super.moveChildren(t,r),this.cache={}}optimize(t){super.optimize(t),this.cache={}}path(t){return super.path(t,!0)}removeChild(t){super.removeChild(t),this.cache={}}split(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;if(r&&(t===0||t>=this.length()-lu)){let s=this.clone();return t===0?(this.parent.insertBefore(s,this),this):(this.parent.insertBefore(s,this.next),s)}let n=super.split(t,r);return this.cache={},n}};L.blotName="block";L.tagName="P";L.defaultChild=Q;L.allowedChildren=[Q,st,D,j];var P=class extends D{attach(){super.attach(),this.attributes=new We(this.domNode)}delta(){return new ws.default().insert(this.value(),{...this.formats(),...this.attributes.values()})}format(t,r){let n=this.scroll.query(t,b.BLOCK_ATTRIBUTE);n!=null&&this.attributes.attribute(n,r)}formatAt(t,r,n,s){this.format(n,s)}insertAt(t,r,n){if(n!=null){super.insertAt(t,r,n);return}let s=r.split(`
`),i=s.pop(),o=s.map(l=>{let u=this.scroll.create(L.blotName);return u.insertAt(0,l),u}),a=this.split(t);o.forEach(l=>{this.parent.insertBefore(l,a)}),i&&this.parent.insertBefore(this.scroll.create("text",i),a)}};P.scope=b.BLOCK_BLOT;function sx(e){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!0;return e.descendants(B).reduce((r,n)=>n.length()===0?r:r.insert(n.value(),Z(n,{},t)),new ws.default).insert(`
`,Z(e))}function Z(e){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},r=arguments.length>2&&arguments[2]!==void 0?arguments[2]:!0;return e==null||("formats"in e&&typeof e.formats=="function"&&(t={...t,...e.formats()},r&&delete t["code-token"]),e.parent==null||e.parent.statics.blotName==="scroll"||e.parent.statics.scope!==e.statics.scope)?t:Z(e.parent,t,r)}var _s=class e extends D{static blotName="cursor";static className="ql-cursor";static tagName="span";static CONTENTS="\uFEFF";static value(){}constructor(t,r,n){super(t,r),this.selection=n,this.textNode=document.createTextNode(e.CONTENTS),this.domNode.appendChild(this.textNode),this.savedLength=0}detach(){this.parent!=null&&this.parent.removeChild(this)}format(t,r){if(this.savedLength!==0){super.format(t,r);return}let n=this,s=0;for(;n!=null&&n.statics.scope!==b.BLOCK_BLOT;)s+=n.offset(n.parent),n=n.parent;n!=null&&(this.savedLength=e.CONTENTS.length,n.optimize(),n.formatAt(s,e.CONTENTS.length,t,r),this.savedLength=0)}index(t,r){return t===this.textNode?0:super.index(t,r)}length(){return this.savedLength}position(){return[this.textNode,this.textNode.data.length]}remove(){super.remove(),this.parent=null}restore(){if(this.selection.composing||this.parent==null)return null;let t=this.selection.getNativeRange();for(;this.domNode.lastChild!=null&&this.domNode.lastChild!==this.textNode;)this.domNode.parentNode.insertBefore(this.domNode.lastChild,this.domNode);let r=this.prev instanceof j?this.prev:null,n=r?r.length():0,s=this.next instanceof j?this.next:null,i=s?s.text:"",{textNode:o}=this,a=o.data.split(e.CONTENTS).join("");o.data=e.CONTENTS;let l;if(r)l=r,(a||s)&&(r.insertAt(r.length(),a+i),s&&s.remove());else if(s)l=s,s.insertAt(0,a);else{let u=document.createTextNode(a);l=this.scroll.create(u),this.parent.insertBefore(l,this)}if(this.remove(),t){let u=(h,d)=>r&&h===r.domNode?d:h===o?n+d-1:s&&h===s.domNode?n+a.length+d:null,f=u(t.start.node,t.start.offset),c=u(t.end.node,t.end.offset);if(f!==null&&c!==null)return{startNode:l.domNode,startOffset:f,endNode:l.domNode,endOffset:c}}return null}update(t,r){if(t.some(n=>n.type==="characterData"&&n.target===this.textNode)){let n=this.restore();n&&(r.range=n)}}optimize(t){super.optimize(t);let{parent:r}=this;for(;r;){if(r.domNode.tagName==="A"){this.savedLength=e.CONTENTS.length,r.isolate(this.offset(r),this.length()).unwrap(),this.savedLength=0;break}r=r.parent}}value(){return""}},Pe=_s;var Ss=ct(fu(),1);var or=new WeakMap;var Ls=["error","warn","log","info"],Cs="warn";function cu(e){if(Cs&&Ls.indexOf(e)<=Ls.indexOf(Cs)){for(var t=arguments.length,r=new Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];console[e](...r)}}function Is(e){return Ls.reduce((t,r)=>(t[r]=cu.bind(console,r,e),t),{})}Is.level=e=>{Cs=e};cu.level=Is.level;var ut=Is;var Rs=ut("quill:events"),ax=["selectionchange","mousedown","mouseup","click"];ax.forEach(e=>{document.addEventListener(e,function(){for(var t=arguments.length,r=new Array(t),n=0;n<t;n++)r[n]=arguments[n];Array.from(document.querySelectorAll(".ql-container")).forEach(s=>{let i=or.get(s);i&&i.emitter&&i.emitter.handleDOM(...r)})})});var Bs=class extends Ss.default{static events={EDITOR_CHANGE:"editor-change",SCROLL_BEFORE_UPDATE:"scroll-before-update",SCROLL_BLOT_MOUNT:"scroll-blot-mount",SCROLL_BLOT_UNMOUNT:"scroll-blot-unmount",SCROLL_OPTIMIZE:"scroll-optimize",SCROLL_UPDATE:"scroll-update",SCROLL_EMBED_UPDATE:"scroll-embed-update",SELECTION_CHANGE:"selection-change",TEXT_CHANGE:"text-change",COMPOSITION_BEFORE_START:"composition-before-start",COMPOSITION_START:"composition-start",COMPOSITION_BEFORE_END:"composition-before-end",COMPOSITION_END:"composition-end"};static sources={API:"api",SILENT:"silent",USER:"user"};constructor(){super(),this.domListeners={},this.on("error",Rs.error)}emit(){for(var t=arguments.length,r=new Array(t),n=0;n<t;n++)r[n]=arguments[n];return Rs.log.call(Rs,...r),super.emit(...r)}handleDOM(t){for(var r=arguments.length,n=new Array(r>1?r-1:0),s=1;s<r;s++)n[s-1]=arguments[s];(this.domListeners[t.type]||[]).forEach(i=>{let{node:o,handler:a}=i;(t.target===o||o.contains(t.target))&&a(t,...n)})}listenDOM(t,r,n){this.domListeners[t]||(this.domListeners[t]=[]),this.domListeners[t].push({node:r,handler:n})}},E=Bs;var Ds=ut("quill:selection"),yt=class{constructor(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;this.index=t,this.length=r}},js=class{constructor(t,r){this.emitter=r,this.scroll=t,this.composing=!1,this.mouseDown=!1,this.root=this.scroll.domNode,this.cursor=this.scroll.create("cursor",this),this.savedRange=new yt(0,0),this.lastRange=this.savedRange,this.lastNative=null,this.handleComposition(),this.handleDragging(),this.emitter.listenDOM("selectionchange",document,()=>{!this.mouseDown&&!this.composing&&setTimeout(this.update.bind(this,E.sources.USER),1)}),this.emitter.on(E.events.SCROLL_BEFORE_UPDATE,()=>{if(!this.hasFocus())return;let n=this.getNativeRange();n!=null&&n.start.node!==this.cursor.textNode&&this.emitter.once(E.events.SCROLL_UPDATE,(s,i)=>{try{this.root.contains(n.start.node)&&this.root.contains(n.end.node)&&this.setNativeRange(n.start.node,n.start.offset,n.end.node,n.end.offset);let o=i.some(a=>a.type==="characterData"||a.type==="childList"||a.type==="attributes"&&a.target===this.root);this.update(o?E.sources.SILENT:s)}catch{}})}),this.emitter.on(E.events.SCROLL_OPTIMIZE,(n,s)=>{if(s.range){let{startNode:i,startOffset:o,endNode:a,endOffset:l}=s.range;this.setNativeRange(i,o,a,l),this.update(E.sources.SILENT)}}),this.update(E.sources.SILENT)}handleComposition(){this.emitter.on(E.events.COMPOSITION_BEFORE_START,()=>{this.composing=!0}),this.emitter.on(E.events.COMPOSITION_END,()=>{if(this.composing=!1,this.cursor.parent){let t=this.cursor.restore();if(!t)return;setTimeout(()=>{this.setNativeRange(t.startNode,t.startOffset,t.endNode,t.endOffset)},1)}})}handleDragging(){this.emitter.listenDOM("mousedown",document.body,()=>{this.mouseDown=!0}),this.emitter.listenDOM("mouseup",document.body,()=>{this.mouseDown=!1,this.update(E.sources.USER)})}focus(){this.hasFocus()||(this.root.focus({preventScroll:!0}),this.setRange(this.savedRange))}format(t,r){this.scroll.update();let n=this.getNativeRange();if(!(n==null||!n.native.collapsed||this.scroll.query(t,b.BLOCK))){if(n.start.node!==this.cursor.textNode){let s=this.scroll.find(n.start.node,!1);if(s==null)return;if(s instanceof B){let i=s.split(n.start.offset);s.parent.insertBefore(this.cursor,i)}else s.insertBefore(this.cursor,n.start.node);this.cursor.attach()}this.cursor.format(t,r),this.scroll.optimize(),this.setNativeRange(this.cursor.textNode,this.cursor.textNode.data.length),this.update()}}getBounds(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,n=this.scroll.length();t=Math.min(t,n-1),r=Math.min(t+r,n-1)-t;let s,[i,o]=this.scroll.leaf(t);if(i==null)return null;if(r>0&&o===i.length()){let[f]=this.scroll.leaf(t+1);if(f){let[c]=this.scroll.line(t),[h]=this.scroll.line(t+1);c===h&&(i=f,o=0)}}[s,o]=i.position(o,!0);let a=document.createRange();if(r>0)return a.setStart(s,o),[i,o]=this.scroll.leaf(t+r),i==null?null:([s,o]=i.position(o,!0),a.setEnd(s,o),a.getBoundingClientRect());let l="left",u;if(s instanceof Text){if(!s.data.length)return null;o<s.data.length?(a.setStart(s,o),a.setEnd(s,o+1)):(a.setStart(s,o-1),a.setEnd(s,o),l="right"),u=a.getBoundingClientRect()}else{if(!(i.domNode instanceof Element))return null;u=i.domNode.getBoundingClientRect(),o>0&&(l="right")}return{bottom:u.top+u.height,height:u.height,left:u[l],right:u[l],top:u.top,width:0}}getNativeRange(){let t=document.getSelection();if(t==null||t.rangeCount<=0)return null;let r=t.getRangeAt(0);if(r==null)return null;let n=this.normalizeNative(r);return Ds.info("getNativeRange",n),n}getRange(){let t=this.scroll.domNode;if("isConnected"in t&&!t.isConnected)return[null,null];let r=this.getNativeRange();return r==null?[null,null]:[this.normalizedToRange(r),r]}hasFocus(){return document.activeElement===this.root||document.activeElement!=null&&Ms(this.root,document.activeElement)}normalizedToRange(t){let r=[[t.start.node,t.start.offset]];t.native.collapsed||r.push([t.end.node,t.end.offset]);let n=r.map(o=>{let[a,l]=o,u=this.scroll.find(a,!0),f=u.offset(this.scroll);return l===0?f:u instanceof B?f+u.index(a,l):f+u.length()}),s=Math.min(Math.max(...n),this.scroll.length()-1),i=Math.min(s,...n);return new yt(i,s-i)}normalizeNative(t){if(!Ms(this.root,t.startContainer)||!t.collapsed&&!Ms(this.root,t.endContainer))return null;let r={start:{node:t.startContainer,offset:t.startOffset},end:{node:t.endContainer,offset:t.endOffset},native:t};return[r.start,r.end].forEach(n=>{let{node:s,offset:i}=n;for(;!(s instanceof Text)&&s.childNodes.length>0;)if(s.childNodes.length>i)s=s.childNodes[i],i=0;else if(s.childNodes.length===i)s=s.lastChild,s instanceof Text?i=s.data.length:s.childNodes.length>0?i=s.childNodes.length:i=s.childNodes.length+1;else break;n.node=s,n.offset=i}),r}rangeToNative(t){let r=this.scroll.length(),n=(s,i)=>{s=Math.min(r-1,s);let[o,a]=this.scroll.leaf(s);return o?o.position(a,i):[null,-1]};return[...n(t.index,!1),...n(t.index+t.length,!0)]}setNativeRange(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:t,s=arguments.length>3&&arguments[3]!==void 0?arguments[3]:r,i=arguments.length>4&&arguments[4]!==void 0?arguments[4]:!1;if(Ds.info("setNativeRange",t,r,n,s),t!=null&&(this.root.parentNode==null||t.parentNode==null||n.parentNode==null))return;let o=document.getSelection();if(o!=null)if(t!=null){this.hasFocus()||this.root.focus({preventScroll:!0});let{native:a}=this.getNativeRange()||{};if(a==null||i||t!==a.startContainer||r!==a.startOffset||n!==a.endContainer||s!==a.endOffset){t instanceof Element&&t.tagName==="BR"&&(r=Array.from(t.parentNode.childNodes).indexOf(t),t=t.parentNode),n instanceof Element&&n.tagName==="BR"&&(s=Array.from(n.parentNode.childNodes).indexOf(n),n=n.parentNode);let l=document.createRange();l.setStart(t,r),l.setEnd(n,s),o.removeAllRanges(),o.addRange(l)}}else o.removeAllRanges(),this.root.blur()}setRange(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1,n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:E.sources.API;if(typeof r=="string"&&(n=r,r=!1),Ds.info("setRange",t),t!=null){let s=this.rangeToNative(t);this.setNativeRange(...s,r)}else this.setNativeRange(null);this.update(n)}update(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:E.sources.USER,r=this.lastRange,[n,s]=this.getRange();if(this.lastRange=n,this.lastNative=s,this.lastRange!=null&&(this.savedRange=this.lastRange),!Jt(r,this.lastRange)){if(!this.composing&&s!=null&&s.native.collapsed&&s.start.node!==this.cursor.textNode){let o=this.cursor.restore();o&&this.setNativeRange(o.startNode,o.startOffset,o.endNode,o.endOffset)}let i=[E.events.SELECTION_CHANGE,mt(this.lastRange),mt(r),t];this.emitter.emit(E.events.EDITOR_CHANGE,...i),t!==E.sources.SILENT&&this.emitter.emit(...i)}}};function Ms(e,t){try{t.parentNode}catch{return!1}return e.contains(t)}var hu=js;var lx=/^[ -~]*$/,Ps=class{constructor(t){this.scroll=t,this.delta=this.getDelta()}applyDelta(t){this.scroll.update();let r=this.scroll.length();this.scroll.batchStart();let n=du(t),s=new I.default;return fx(n.ops.slice()).reduce((o,a)=>{let l=I.Op.length(a),u=a.attributes||{},f=!1,c=!1;if(a.insert!=null){if(s.retain(l),typeof a.insert=="string"){let m=a.insert;c=!m.endsWith(`
`)&&(r<=o||!!this.scroll.descendant(P,o)[0]),this.scroll.insertAt(o,m);let[y,x]=this.scroll.line(o),p=Ut({},Z(y));if(y instanceof L){let[v]=y.descendant(B,x);v&&(p=Ut(p,Z(v)))}u=I.AttributeMap.diff(p,u)||{}}else if(typeof a.insert=="object"){let m=Object.keys(a.insert)[0];if(m==null)return o;let y=this.scroll.query(m,b.INLINE)!=null;if(y)(r<=o||this.scroll.descendant(P,o)[0])&&(c=!0);else if(o>0){let[x,p]=this.scroll.descendant(B,o-1);x instanceof j?x.value()[p]!==`
`&&(f=!0):x instanceof D&&x.statics.scope===b.INLINE_BLOT&&(f=!0)}if(this.scroll.insertAt(o,m,a.insert[m]),y){let[x]=this.scroll.descendant(B,o);if(x){let p=Ut({},Z(x));u=I.AttributeMap.diff(p,u)||{}}}}r+=l}else if(s.push(a),a.retain!==null&&typeof a.retain=="object"){let m=Object.keys(a.retain)[0];if(m==null)return o;this.scroll.updateEmbedAt(o,m,a.retain[m])}Object.keys(u).forEach(m=>{this.scroll.formatAt(o,l,m,u[m])});let h=f?1:0,d=c?1:0;return r+=h+d,s.retain(h),s.delete(d),o+l+h+d},0),s.reduce((o,a)=>typeof a.delete=="number"?(this.scroll.deleteAt(o,a.delete),o):o+I.Op.length(a),0),this.scroll.batchEnd(),this.scroll.optimize(),this.update(n)}deleteText(t,r){return this.scroll.deleteAt(t,r),this.update(new I.default().retain(t).delete(r))}formatLine(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};this.scroll.update(),Object.keys(n).forEach(i=>{this.scroll.lines(t,Math.max(r,1)).forEach(o=>{o.format(i,n[i])})}),this.scroll.optimize();let s=new I.default().retain(t).retain(r,mt(n));return this.update(s)}formatText(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};Object.keys(n).forEach(i=>{this.scroll.formatAt(t,r,i,n[i])});let s=new I.default().retain(t).retain(r,mt(n));return this.update(s)}getContents(t,r){return this.delta.slice(t,t+r)}getDelta(){return this.scroll.lines().reduce((t,r)=>t.concat(r.delta()),new I.default)}getFormat(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,n=[],s=[];r===0?this.scroll.path(t).forEach(a=>{let[l]=a;l instanceof L?n.push(l):l instanceof B&&s.push(l)}):(n=this.scroll.lines(t,r),s=this.scroll.descendants(B,t,r));let[i,o]=[n,s].map(a=>{let l=a.shift();if(l==null)return{};let u=Z(l);for(;Object.keys(u).length>0;){let f=a.shift();if(f==null)return u;u=ux(Z(f),u)}return u});return{...i,...o}}getHTML(t,r){let[n,s]=this.scroll.line(t);if(n){let i=n.length();return n.length()>=s+r&&!(s===0&&r===i)?ar(n,s,r,!0):ar(this.scroll,t,r,!0)}return""}getText(t,r){return this.getContents(t,r).filter(n=>typeof n.insert=="string").map(n=>n.insert).join("")}insertContents(t,r){let n=du(r),s=new I.default().retain(t).concat(n);return this.scroll.insertContents(t,n),this.update(s)}insertEmbed(t,r,n){return this.scroll.insertAt(t,r,n),this.update(new I.default().retain(t).insert({[r]:n}))}insertText(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};return r=r.replace(/\r\n/g,`
`).replace(/\r/g,`
`),this.scroll.insertAt(t,r),Object.keys(n).forEach(s=>{this.scroll.formatAt(t,r.length,s,n[s])}),this.update(new I.default().retain(t).insert(r,mt(n)))}isBlank(){if(this.scroll.children.length===0)return!0;if(this.scroll.children.length>1)return!1;let t=this.scroll.children.head;if(t?.statics.blotName!==L.blotName)return!1;let r=t;return r.children.length>1?!1:r.children.head instanceof Q}removeFormat(t,r){let n=this.getText(t,r),[s,i]=this.scroll.line(t+r),o=0,a=new I.default;s!=null&&(o=s.length()-i,a=s.delta().slice(i,i+o-1).insert(`
`));let u=this.getContents(t,r+o).diff(new I.default().insert(n).concat(a)),f=new I.default().retain(t).concat(u);return this.applyDelta(f)}update(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:[],n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:void 0,s=this.delta;if(r.length===1&&r[0].type==="characterData"&&r[0].target.data.match(lx)&&this.scroll.find(r[0].target)){let i=this.scroll.find(r[0].target),o=Z(i),a=i.offset(this.scroll),l=r[0].oldValue.replace(Pe.CONTENTS,""),u=new I.default().insert(l),f=new I.default().insert(i.value()),c=n&&{oldRange:pu(n.oldRange,-a),newRange:pu(n.newRange,-a)};t=new I.default().retain(a).concat(u.diff(f,c)).reduce((d,m)=>m.insert?d.insert(m.insert,o):d.push(m),new I.default),this.delta=s.compose(t)}else this.delta=this.getDelta(),(!t||!Jt(s.compose(t),this.delta))&&(t=s.diff(this.delta,n));return t}};function qe(e,t,r){if(e.length===0){let[d]=ks(r.pop());return t<=0?`</li></${d}>`:`</li></${d}>${qe([],t-1,r)}`}let[{child:n,offset:s,length:i,indent:o,type:a},...l]=e,[u,f]=ks(a);if(o>t)return r.push(a),o===t+1?`<${u}><li${f}>${ar(n,s,i)}${qe(l,o,r)}`:`<${u}><li>${qe(e,t+1,r)}`;let c=r[r.length-1];if(o===t&&a===c)return`</li><li${f}>${ar(n,s,i)}${qe(l,o,r)}`;let[h]=ks(r.pop());return`</li></${h}>${qe(e,t-1,r)}`}function ar(e,t,r){let n=arguments.length>3&&arguments[3]!==void 0?arguments[3]:!1;if("html"in e&&typeof e.html=="function")return e.html(t,r);if(e instanceof j)return un(e.value().slice(t,t+r)).replaceAll(" "," ");if(e instanceof X){if(e.statics.blotName==="list-container"){let u=[];return e.children.forEachAt(t,r,(f,c,h)=>{let d="formats"in f&&typeof f.formats=="function"?f.formats():{};u.push({child:f,offset:c,length:h,indent:d.indent||0,type:d.list})}),qe(u,-1,[])}let s=[];if(e.children.forEachAt(t,r,(u,f,c)=>{s.push(ar(u,f,c))}),n||e.statics.blotName==="list")return s.join("");let{outerHTML:i,innerHTML:o}=e.domNode,[a,l]=i.split(`>${o}<`);return a==="<table"?`<table style="border: 1px solid #000;">${s.join("")}<${l}`:`${a}>${s.join("")}<${l}`}return e.domNode instanceof Element?e.domNode.outerHTML:""}function ux(e,t){return Object.keys(t).reduce((r,n)=>{if(e[n]==null)return r;let s=t[n];return s===e[n]?r[n]=s:Array.isArray(s)?s.indexOf(e[n])<0?r[n]=s.concat([e[n]]):r[n]=s:r[n]=[s,e[n]],r},{})}function ks(e){let t=e==="ordered"?"ol":"ul";switch(e){case"checked":return[t,' data-list="checked"'];case"unchecked":return[t,' data-list="unchecked"'];default:return[t,""]}}function du(e){return e.reduce((t,r)=>{if(typeof r.insert=="string"){let n=r.insert.replace(/\r\n/g,`
`).replace(/\r/g,`
`);return t.insert(n,r.attributes)}return t.push(r)},new I.default)}function pu(e,t){let{index:r,length:n}=e;return new yt(r+t,n)}function fx(e){let t=[];return e.forEach(r=>{typeof r.insert=="string"?r.insert.split(`
`).forEach((s,i)=>{i&&t.push({insert:`
`,attributes:r.attributes}),s&&t.push({insert:s,attributes:r.attributes})}):t.push(r)}),t}var mu=Ps;var qs=class{static DEFAULTS={};constructor(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};this.quill=t,this.options=r}},G=qs;var cn="\uFEFF",Us=class extends D{constructor(t,r){super(t,r),this.contentNode=document.createElement("span"),this.contentNode.setAttribute("contenteditable","false"),Array.from(this.domNode.childNodes).forEach(n=>{this.contentNode.appendChild(n)}),this.leftGuard=document.createTextNode(cn),this.rightGuard=document.createTextNode(cn),this.domNode.appendChild(this.leftGuard),this.domNode.appendChild(this.contentNode),this.domNode.appendChild(this.rightGuard)}index(t,r){return t===this.leftGuard?0:t===this.rightGuard?1:super.index(t,r)}restore(t){let r=null,n,s=t.data.split(cn).join("");if(t===this.leftGuard)if(this.prev instanceof j){let i=this.prev.length();this.prev.insertAt(i,s),r={startNode:this.prev.domNode,startOffset:i+s.length}}else n=document.createTextNode(s),this.parent.insertBefore(this.scroll.create(n),this),r={startNode:n,startOffset:s.length};else t===this.rightGuard&&(this.next instanceof j?(this.next.insertAt(0,s),r={startNode:this.next.domNode,startOffset:s.length}):(n=document.createTextNode(s),this.parent.insertBefore(this.scroll.create(n),this.next),r={startNode:n,startOffset:s.length}));return t.data=cn,r}update(t,r){t.forEach(n=>{if(n.type==="characterData"&&(n.target===this.leftGuard||n.target===this.rightGuard)){let s=this.restore(n.target);s&&(r.range=s)}})}},hn=Us;var Fs=class{isComposing=!1;constructor(t,r){this.scroll=t,this.emitter=r,this.setupListeners()}setupListeners(){this.scroll.domNode.addEventListener("compositionstart",t=>{this.isComposing||this.handleCompositionStart(t)}),this.scroll.domNode.addEventListener("compositionend",t=>{this.isComposing&&queueMicrotask(()=>{this.handleCompositionEnd(t)})})}handleCompositionStart(t){let r=t.target instanceof Node?this.scroll.find(t.target,!0):null;r&&!(r instanceof hn)&&(this.emitter.emit(E.events.COMPOSITION_BEFORE_START,t),this.scroll.batchStart(),this.emitter.emit(E.events.COMPOSITION_START,t),this.isComposing=!0)}handleCompositionEnd(t){this.emitter.emit(E.events.COMPOSITION_BEFORE_END,t),this.scroll.batchEnd(),this.emitter.emit(E.events.COMPOSITION_END,t),this.isComposing=!1}},gu=Fs;var zs=class e{static DEFAULTS={modules:{}};static themes={default:e};modules={};constructor(t,r){this.quill=t,this.options=r}init(){Object.keys(this.options.modules).forEach(t=>{this.modules[t]==null&&this.addModule(t)})}addModule(t){let r=this.quill.constructor.import(`modules/${t}`);return this.modules[t]=new r(this.quill,this.options.modules[t]||{}),this.modules[t]}},Ks=zs;var cx=e=>e.parentElement||e.getRootNode().host||null,hx=e=>{let t=e.getBoundingClientRect(),r="offsetWidth"in e&&Math.abs(t.width)/e.offsetWidth||1,n="offsetHeight"in e&&Math.abs(t.height)/e.offsetHeight||1;return{top:t.top,right:t.left+e.clientWidth*r,bottom:t.top+e.clientHeight*n,left:t.left}},dn=e=>{let t=parseInt(e,10);return Number.isNaN(t)?0:t},bu=(e,t,r,n,s,i)=>e<r&&t>n?0:e<r?-(r-e+s):t>n?t-e>n-r?e+s-r:t-n+i:0,dx=(e,t)=>{let r=e.ownerDocument,n=t,s=e;for(;s;){let i=s===r.body,o=i?{top:0,right:window.visualViewport?.width??r.documentElement.clientWidth,bottom:window.visualViewport?.height??r.documentElement.clientHeight,left:0}:hx(s),a=getComputedStyle(s),l=bu(n.left,n.right,o.left,o.right,dn(a.scrollPaddingLeft),dn(a.scrollPaddingRight)),u=bu(n.top,n.bottom,o.top,o.bottom,dn(a.scrollPaddingTop),dn(a.scrollPaddingBottom));if(l||u)if(i)r.defaultView?.scrollBy(l,u);else{let{scrollLeft:f,scrollTop:c}=s;u&&(s.scrollTop+=u),l&&(s.scrollLeft+=l);let h=s.scrollLeft-f,d=s.scrollTop-c;n={left:n.left-h,top:n.top-d,right:n.right-h,bottom:n.bottom-d}}s=i||a.position==="fixed"?null:cx(s)}},yu=dx;var px=100,mx=["block","break","cursor","inline","scroll","text"],gx=(e,t,r)=>{let n=new Kt;return mx.forEach(s=>{let i=t.query(s);i&&n.register(i)}),e.forEach(s=>{let i=t.query(s);i||r.error(`Cannot register "${s}" specified in "formats" config. Are you sure it was registered?`);let o=0;for(;i;)if(n.register(i),i="blotName"in i?i.requiredContainer??null:null,o+=1,o>px){r.error(`Cycle detected in registering blot requiredContainer: "${s}"`);break}}),n},xu=gx;var Ue=ut("quill"),pn=new Kt;X.uiClass="ql-ui";var g=class e{static DEFAULTS={bounds:null,modules:{clipboard:!0,keyboard:!0,history:!0,uploader:!0},placeholder:"",readOnly:!1,registry:pn,theme:"default"};static events=E.events;static sources=E.sources;static version="2.0.3";static imports={delta:Wt.default,parchment:Pr,"core/module":G,"core/theme":Ks};static debug(t){t===!0&&(t="log"),ut.level(t)}static find(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;return or.get(t)||pn.find(t,r)}static import(t){return this.imports[t]==null&&Ue.error(`Cannot import ${t}. Are you sure it was registered?`),this.imports[t]}static register(){if(typeof(arguments.length<=0?void 0:arguments[0])!="string"){let t=arguments.length<=0?void 0:arguments[0],r=!!(!(arguments.length<=1)&&arguments[1]),n="attrName"in t?t.attrName:t.blotName;typeof n=="string"?this.register(`formats/${n}`,t,r):Object.keys(t).forEach(s=>{this.register(s,t[s],r)})}else{let t=arguments.length<=0?void 0:arguments[0],r=arguments.length<=1?void 0:arguments[1],n=!!(!(arguments.length<=2)&&arguments[2]);this.imports[t]!=null&&!n&&Ue.warn(`Overwriting ${t} with`,r),this.imports[t]=r,(t.startsWith("blots/")||t.startsWith("formats/"))&&r&&typeof r!="boolean"&&r.blotName!=="abstract"&&pn.register(r),typeof r.register=="function"&&r.register(pn)}}constructor(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};if(this.options=bx(t,r),this.container=this.options.container,this.container==null){Ue.error("Invalid Quill container",t);return}this.options.debug&&e.debug(this.options.debug);let n=this.container.innerHTML.trim();this.container.classList.add("ql-container"),this.container.innerHTML="",or.set(this.container,this),this.root=this.addContainer("ql-editor"),this.root.classList.add("ql-blank"),this.emitter=new E;let s=Ve.blotName,i=this.options.registry.query(s);if(!i||!("blotName"in i))throw new Error(`Cannot initialize Quill without "${s}" blot`);if(this.scroll=new i(this.options.registry,this.root,{emitter:this.emitter}),this.editor=new mu(this.scroll),this.selection=new hu(this.scroll,this.emitter),this.composition=new gu(this.scroll,this.emitter),this.theme=new this.options.theme(this,this.options),this.keyboard=this.theme.addModule("keyboard"),this.clipboard=this.theme.addModule("clipboard"),this.history=this.theme.addModule("history"),this.uploader=this.theme.addModule("uploader"),this.theme.addModule("input"),this.theme.addModule("uiNode"),this.theme.init(),this.emitter.on(E.events.EDITOR_CHANGE,o=>{o===E.events.TEXT_CHANGE&&this.root.classList.toggle("ql-blank",this.editor.isBlank())}),this.emitter.on(E.events.SCROLL_UPDATE,(o,a)=>{let l=this.selection.lastRange,[u]=this.selection.getRange(),f=l&&u?{oldRange:l,newRange:u}:void 0;ft.call(this,()=>this.editor.update(null,a,f),o)}),this.emitter.on(E.events.SCROLL_EMBED_UPDATE,(o,a)=>{let l=this.selection.lastRange,[u]=this.selection.getRange(),f=l&&u?{oldRange:l,newRange:u}:void 0;ft.call(this,()=>{let c=new Wt.default().retain(o.offset(this)).retain({[o.statics.blotName]:a});return this.editor.update(c,[],f)},e.sources.USER)}),n){let o=this.clipboard.convert({html:`${n}<p><br></p>`,text:`
`});this.setContents(o)}this.history.clear(),this.options.placeholder&&this.root.setAttribute("data-placeholder",this.options.placeholder),this.options.readOnly&&this.disable(),this.allowReadOnlyEdits=!1}addContainer(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:null;if(typeof t=="string"){let n=t;t=document.createElement("div"),t.classList.add(n)}return this.container.insertBefore(t,r),t}blur(){this.selection.setRange(null)}deleteText(t,r,n){return[t,r,,n]=It(t,r,n),ft.call(this,()=>this.editor.deleteText(t,r),n,t,-1*r)}disable(){this.enable(!1)}editReadOnly(t){this.allowReadOnlyEdits=!0;let r=t();return this.allowReadOnlyEdits=!1,r}enable(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:!0;this.scroll.enable(t),this.container.classList.toggle("ql-disabled",!t)}focus(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.selection.focus(),t.preventScroll||this.scrollSelectionIntoView()}format(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:E.sources.API;return ft.call(this,()=>{let s=this.getSelection(!0),i=new Wt.default;if(s==null)return i;if(this.scroll.query(t,b.BLOCK))i=this.editor.formatLine(s.index,s.length,{[t]:r});else{if(s.length===0)return this.selection.format(t,r),i;i=this.editor.formatText(s.index,s.length,{[t]:r})}return this.setSelection(s,E.sources.SILENT),i},n)}formatLine(t,r,n,s,i){let o;return[t,r,o,i]=It(t,r,n,s,i),ft.call(this,()=>this.editor.formatLine(t,r,o),i,t,0)}formatText(t,r,n,s,i){let o;return[t,r,o,i]=It(t,r,n,s,i),ft.call(this,()=>this.editor.formatText(t,r,o),i,t,0)}getBounds(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,n=null;if(typeof t=="number"?n=this.selection.getBounds(t,r):n=this.selection.getBounds(t.index,t.length),!n)return null;let s=this.container.getBoundingClientRect();return{bottom:n.bottom-s.top,height:n.height,left:n.left-s.left,right:n.right-s.left,top:n.top-s.top,width:n.width}}getContents(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this.getLength()-t;return[t,r]=It(t,r),this.editor.getContents(t,r)}getFormat(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.getSelection(!0),r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;return typeof t=="number"?this.editor.getFormat(t,r):this.editor.getFormat(t.index,t.length)}getIndex(t){return t.offset(this.scroll)}getLength(){return this.scroll.length()}getLeaf(t){return this.scroll.leaf(t)}getLine(t){return this.scroll.line(t)}getLines(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Number.MAX_VALUE;return typeof t!="number"?this.scroll.lines(t.index,t.length):this.scroll.lines(t,r)}getModule(t){return this.theme.modules[t]}getSelection(){return(arguments.length>0&&arguments[0]!==void 0?arguments[0]:!1)&&this.focus(),this.update(),this.selection.getRange()[0]}getSemanticHTML(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,r=arguments.length>1?arguments[1]:void 0;return typeof t=="number"&&(r=r??this.getLength()-t),[t,r]=It(t,r),this.editor.getHTML(t,r)}getText(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,r=arguments.length>1?arguments[1]:void 0;return typeof t=="number"&&(r=r??this.getLength()-t),[t,r]=It(t,r),this.editor.getText(t,r)}hasFocus(){return this.selection.hasFocus()}insertEmbed(t,r,n){let s=arguments.length>3&&arguments[3]!==void 0?arguments[3]:e.sources.API;return ft.call(this,()=>this.editor.insertEmbed(t,r,n),s,t)}insertText(t,r,n,s,i){let o;return[t,,o,i]=It(t,0,n,s,i),ft.call(this,()=>this.editor.insertText(t,r,o),i,t,r.length)}isEnabled(){return this.scroll.isEnabled()}off(){return this.emitter.off(...arguments)}on(){return this.emitter.on(...arguments)}once(){return this.emitter.once(...arguments)}removeFormat(t,r,n){return[t,r,,n]=It(t,r,n),ft.call(this,()=>this.editor.removeFormat(t,r),n,t)}scrollRectIntoView(t){yu(this.root,t)}scrollIntoView(){console.warn("Quill#scrollIntoView() has been deprecated and will be removed in the near future. Please use Quill#scrollSelectionIntoView() instead."),this.scrollSelectionIntoView()}scrollSelectionIntoView(){let t=this.selection.lastRange,r=t&&this.selection.getBounds(t.index,t.length);r&&this.scrollRectIntoView(r)}setContents(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:E.sources.API;return ft.call(this,()=>{t=new Wt.default(t);let n=this.getLength(),s=this.editor.deleteText(0,n),i=this.editor.insertContents(0,t),o=this.editor.deleteText(this.getLength()-1,1);return s.compose(i).compose(o)},r)}setSelection(t,r,n){t==null?this.selection.setRange(null,r||e.sources.API):([t,r,,n]=It(t,r,n),this.selection.setRange(new yt(Math.max(0,t),r),n),n!==E.sources.SILENT&&this.scrollSelectionIntoView())}setText(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:E.sources.API,n=new Wt.default().insert(t);return this.setContents(n,r)}update(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:E.sources.USER,r=this.scroll.update(t);return this.selection.update(t),r}updateContents(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:E.sources.API;return ft.call(this,()=>(t=new Wt.default(t),this.editor.applyDelta(t)),r,!0)}};function vu(e){return typeof e=="string"?document.querySelector(e):e}function Hs(e){return Object.entries(e??{}).reduce((t,r)=>{let[n,s]=r;return{...t,[n]:s===!0?{}:s}},{})}function Eu(e){return Object.fromEntries(Object.entries(e).filter(t=>t[1]!==void 0))}function bx(e,t){let r=vu(e);if(!r)throw new Error("Invalid Quill container");let s=!t.theme||t.theme===g.DEFAULTS.theme?Ks:g.import(`themes/${t.theme}`);if(!s)throw new Error(`Invalid theme ${t.theme}. Did you register it?`);let{modules:i,...o}=g.DEFAULTS,{modules:a,...l}=s.DEFAULTS,u=Hs(t.modules);u!=null&&u.toolbar&&u.toolbar.constructor!==Object&&(u={...u,toolbar:{container:u.toolbar}});let f=Ut({},Hs(i),Hs(a),u),c={...o,...Eu(l),...Eu(t)},h=t.registry;return h?t.formats&&Ue.warn('Ignoring "formats" option because "registry" is specified'):h=t.formats?xu(t.formats,c.registry,Ue):c.registry,{...c,registry:h,container:r,theme:s,modules:Object.entries(f).reduce((d,m)=>{let[y,x]=m;if(!x)return d;let p=g.import(`modules/${y}`);return p==null?(Ue.error(`Cannot load ${y} module. Are you sure you registered it?`),d):{...d,[y]:Ut({},p.DEFAULTS||{},x)}},{}),bounds:vu(c.bounds)}}function ft(e,t,r,n){if(!this.isEnabled()&&t===E.sources.USER&&!this.allowReadOnlyEdits)return new Wt.default;let s=r==null?null:this.getSelection(),i=this.editor.delta,o=e();if(s!=null&&(r===!0&&(r=s.index),n==null?s=Nu(s,o,t):n!==0&&(s=Nu(s,r,n,t)),this.setSelection(s,E.sources.SILENT)),o.length()>0){let a=[E.events.TEXT_CHANGE,o,i,t];this.emitter.emit(E.events.EDITOR_CHANGE,...a),t!==E.sources.SILENT&&this.emitter.emit(...a)}return o}function It(e,t,r,n,s){let i={};return typeof e.index=="number"&&typeof e.length=="number"?typeof t!="number"?(s=n,n=r,r=t,t=e.length,e=e.index):(t=e.length,e=e.index):typeof t!="number"&&(s=n,n=r,r=t,t=0),typeof r=="object"?(i=r,s=n):typeof r=="string"&&(n!=null?i[r]=n:s=r),s=s||E.sources.API,[e,t,i,s]}function Nu(e,t,r,n){let s=typeof r=="number"?r:0;if(e==null)return null;let i,o;return t&&typeof t.transformPosition=="function"?[i,o]=[e.index,e.index+e.length].map(a=>t.transformPosition(a,n!==E.sources.USER)):[i,o]=[e.index,e.index+e.length].map(a=>a<t||a===t&&n===E.sources.USER?a:s>=0?a+s:Math.max(t,a+s)),new yt(i,o-i)}var $s=class extends Le{},Vt=$s;var it=ct(bt(),1);function Au(e){return e instanceof L||e instanceof P}function Tu(e){return typeof e.updateContent=="function"}var Ws=class extends Ve{static blotName="scroll";static className="ql-editor";static tagName="DIV";static defaultChild=L;static allowedChildren=[L,P,Vt];constructor(t,r,n){let{emitter:s}=n;super(t,r),this.emitter=s,this.batch=!1,this.optimize(),this.enable(),this.domNode.addEventListener("dragstart",i=>this.handleDragStart(i))}batchStart(){Array.isArray(this.batch)||(this.batch=[])}batchEnd(){if(!this.batch)return;let t=this.batch;this.batch=!1,this.update(t)}emitMount(t){this.emitter.emit(E.events.SCROLL_BLOT_MOUNT,t)}emitUnmount(t){this.emitter.emit(E.events.SCROLL_BLOT_UNMOUNT,t)}emitEmbedUpdate(t,r){this.emitter.emit(E.events.SCROLL_EMBED_UPDATE,t,r)}deleteAt(t,r){let[n,s]=this.line(t),[i]=this.line(t+r);if(super.deleteAt(t,r),i!=null&&n!==i&&s>0){if(n instanceof P||i instanceof P){this.optimize();return}let o=i.children.head instanceof Q?null:i.children.head;n.moveChildren(i,o),n.remove()}this.optimize()}enable(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:!0;this.domNode.setAttribute("contenteditable",t?"true":"false")}formatAt(t,r,n,s){super.formatAt(t,r,n,s),this.optimize()}insertAt(t,r,n){if(t>=this.length())if(n==null||this.scroll.query(r,b.BLOCK)==null){let s=this.scroll.create(this.statics.defaultChild.blotName);this.appendChild(s),n==null&&r.endsWith(`
`)?s.insertAt(0,r.slice(0,-1),n):s.insertAt(0,r,n)}else{let s=this.scroll.create(r,n);this.appendChild(s)}else super.insertAt(t,r,n);this.optimize()}insertBefore(t,r){if(t.statics.scope===b.INLINE_BLOT){let n=this.scroll.create(this.statics.defaultChild.blotName);n.appendChild(t),super.insertBefore(n,r)}else super.insertBefore(t,r)}insertContents(t,r){let n=this.deltaToRenderBlocks(r.concat(new it.default().insert(`
`))),s=n.pop();if(s==null)return;this.batchStart();let i=n.shift();if(i){let l=i.type==="block"&&(i.delta.length()===0||!this.descendant(P,t)[0]&&t<this.length()),u=i.type==="block"?i.delta:new it.default().insert({[i.key]:i.value});Gs(this,t,u);let f=i.type==="block"?1:0,c=t+u.length()+f;l&&this.insertAt(c-1,`
`);let h=Z(this.line(t)[0]),d=it.AttributeMap.diff(h,i.attributes)||{};Object.keys(d).forEach(m=>{this.formatAt(c-1,1,m,d[m])}),t=c}let[o,a]=this.children.find(t);if(n.length&&(o&&(o=o.split(a),a=0),n.forEach(l=>{if(l.type==="block"){let u=this.createBlock(l.attributes,o||void 0);Gs(u,0,l.delta)}else{let u=this.create(l.key,l.value);this.insertBefore(u,o||void 0),Object.keys(l.attributes).forEach(f=>{u.format(f,l.attributes[f])})}})),s.type==="block"&&s.delta.length()){let l=o?o.offset(o.scroll)+a:this.length();Gs(this,l,s.delta)}this.batchEnd(),this.optimize()}isEnabled(){return this.domNode.getAttribute("contenteditable")==="true"}leaf(t){let r=this.path(t).pop();if(!r)return[null,-1];let[n,s]=r;return n instanceof B?[n,s]:[null,-1]}line(t){return t===this.length()?this.line(t-1):this.descendant(Au,t)}lines(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Number.MAX_VALUE,n=(s,i,o)=>{let a=[],l=o;return s.children.forEachAt(i,o,(u,f,c)=>{Au(u)?a.push(u):u instanceof Le&&(a=a.concat(n(u,f,l))),l-=c}),a};return n(this,t,r)}optimize(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};this.batch||(super.optimize(t,r),t.length>0&&this.emitter.emit(E.events.SCROLL_OPTIMIZE,t,r))}path(t){return super.path(t).slice(1)}remove(){}update(t){if(this.batch){Array.isArray(t)&&(this.batch=this.batch.concat(t));return}let r=E.sources.USER;typeof t=="string"&&(r=t),Array.isArray(t)||(t=this.observer.takeRecords()),t=t.filter(n=>{let{target:s}=n,i=this.find(s,!0);return i&&!Tu(i)}),t.length>0&&this.emitter.emit(E.events.SCROLL_BEFORE_UPDATE,r,t),super.update(t.concat([])),t.length>0&&this.emitter.emit(E.events.SCROLL_UPDATE,r,t)}updateEmbedAt(t,r,n){let[s]=this.descendant(i=>i instanceof P,t);s&&s.statics.blotName===r&&Tu(s)&&s.updateContent(n)}handleDragStart(t){t.preventDefault()}deltaToRenderBlocks(t){let r=[],n=new it.default;return t.forEach(s=>{let i=s?.insert;if(i)if(typeof i=="string"){let o=i.split(`
`);o.slice(0,-1).forEach(l=>{n.insert(l,s.attributes),r.push({type:"block",delta:n,attributes:s.attributes??{}}),n=new it.default});let a=o[o.length-1];a&&n.insert(a,s.attributes)}else{let o=Object.keys(i)[0];if(!o)return;this.query(o,b.INLINE)?n.push(s):(n.length()&&r.push({type:"block",delta:n,attributes:{}}),n=new it.default,r.push({type:"blockEmbed",key:o,value:i[o],attributes:s.attributes??{}}))}}),n.length()&&r.push({type:"block",delta:n,attributes:{}}),r}createBlock(t,r){let n,s={};Object.entries(t).forEach(a=>{let[l,u]=a;this.query(l,b.BLOCK&b.BLOT)!=null?n=l:s[l]=u});let i=this.create(n||this.statics.defaultChild.blotName,n?t[n]:void 0);this.insertBefore(i,r||void 0);let o=i.length();return Object.entries(s).forEach(a=>{let[l,u]=a;i.formatAt(0,o,l,u)}),i}};function Gs(e,t,r){r.reduce((n,s)=>{let i=it.Op.length(s),o=s.attributes||{};if(s.insert!=null){if(typeof s.insert=="string"){let a=s.insert;e.insertAt(n,a);let[l]=e.descendant(B,n),u=Z(l);o=it.AttributeMap.diff(u,o)||{}}else if(typeof s.insert=="object"){let a=Object.keys(s.insert)[0];if(a==null)return n;if(e.insertAt(n,a,s.insert[a]),e.scroll.query(a,b.INLINE)!=null){let[u]=e.descendant(B,n),f=Z(u);o=it.AttributeMap.diff(f,o)||{}}}}return Object.keys(o).forEach(a=>{e.formatAt(n,i,a,o[a])}),n+i},t)}var wu=Ws;var J=ct(bt(),1);var Vs={scope:b.BLOCK,whitelist:["right","center","justify"]},_u=new K("align","align",Vs),J1=new U("align","ql-align",Vs),Ou=new Y("align","text-align",Vs);var lr=class extends Y{value(t){let r=super.value(t);return r.startsWith("rgb(")?(r=r.replace(/^[^\d]+/,"").replace(/[^\d]+$/,""),`#${r.split(",").map(s=>`00${parseInt(s,10).toString(16)}`.slice(-2)).join("")}`):r}},rO=new U("color","ql-color",{scope:b.INLINE}),Su=new lr("color","color",{scope:b.INLINE});var oO=new U("background","ql-bg",{scope:b.INLINE}),Lu=new lr("background","background-color",{scope:b.INLINE});var Xt=class extends Vt{static create(t){let r=super.create(t);return r.setAttribute("spellcheck","false"),r}code(t,r){return this.children.map(n=>n.length()<=1?"":n.domNode.innerText).join(`
`).slice(t,t+r)}html(t,r){return`<pre>
${un(this.code(t,r))}
</pre>`}},ot=class extends L{static TAB=" ";static register(){g.register(Xt)}},mn=class extends st{};mn.blotName="code";mn.tagName="CODE";ot.blotName="code-block";ot.className="ql-code-block";ot.tagName="DIV";Xt.blotName="code-block-container";Xt.className="ql-code-block-container";Xt.tagName="DIV";Xt.allowedChildren=[ot];ot.allowedChildren=[j,Q,Pe];ot.requiredContainer=Xt;var Xs={scope:b.BLOCK,whitelist:["rtl"]},Cu=new K("direction","dir",Xs),bO=new U("direction","ql-direction",Xs),Iu=new Y("direction","direction",Xs);var Ru={scope:b.INLINE,whitelist:["serif","monospace"]},vO=new U("font","ql-font",Ru),Ys=class extends Y{value(t){return super.value(t).replace(/["']/g,"")}},Bu=new Ys("font","font-family",Ru);var AO=new U("size","ql-size",{scope:b.INLINE,whitelist:["small","large","huge"]}),Du=new Y("size","font-size",{scope:b.INLINE,whitelist:["10px","18px","32px"]});var z=ct(bt(),1);var yx=ut("quill:keyboard"),xx=/Mac/i.test(navigator.platform)?"metaKey":"ctrlKey",ur=class e extends G{static match(t,r){return["altKey","ctrlKey","metaKey","shiftKey"].some(n=>!!r[n]!==t[n]&&r[n]!==null)?!1:r.key===t.key||r.key===t.which}constructor(t,r){super(t,r),this.bindings={},Object.keys(this.options.bindings).forEach(n=>{this.options.bindings[n]&&this.addBinding(this.options.bindings[n])}),this.addBinding({key:"Enter",shiftKey:null},this.handleEnter),this.addBinding({key:"Enter",metaKey:null,ctrlKey:null,altKey:null},()=>{}),/Firefox/i.test(navigator.userAgent)?(this.addBinding({key:"Backspace"},{collapsed:!0},this.handleBackspace),this.addBinding({key:"Delete"},{collapsed:!0},this.handleDelete)):(this.addBinding({key:"Backspace"},{collapsed:!0,prefix:/^.?$/},this.handleBackspace),this.addBinding({key:"Delete"},{collapsed:!0,suffix:/^.?$/},this.handleDelete)),this.addBinding({key:"Backspace"},{collapsed:!1},this.handleDeleteRange),this.addBinding({key:"Delete"},{collapsed:!1},this.handleDeleteRange),this.addBinding({key:"Backspace",altKey:null,ctrlKey:null,metaKey:null,shiftKey:null},{collapsed:!0,offset:0},this.handleBackspace),this.listen()}addBinding(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{},s=Ex(t);if(s==null){yx.warn("Attempted to add invalid keyboard binding",s);return}typeof r=="function"&&(r={handler:r}),typeof n=="function"&&(n={handler:n}),(Array.isArray(s.key)?s.key:[s.key]).forEach(o=>{let a={...s,key:o,...r,...n};this.bindings[a.key]=this.bindings[a.key]||[],this.bindings[a.key].push(a)})}listen(){this.quill.root.addEventListener("keydown",t=>{if(t.defaultPrevented||t.isComposing||t.keyCode===229&&(t.key==="Enter"||t.key==="Backspace"))return;let s=(this.bindings[t.key]||[]).concat(this.bindings[t.which]||[]).filter(p=>e.match(t,p));if(s.length===0)return;let i=g.find(t.target,!0);if(i&&i.scroll!==this.quill.scroll)return;let o=this.quill.getSelection();if(o==null||!this.quill.hasFocus())return;let[a,l]=this.quill.getLine(o.index),[u,f]=this.quill.getLeaf(o.index),[c,h]=o.length===0?[u,f]:this.quill.getLeaf(o.index+o.length),d=u instanceof Ce?u.value().slice(0,f):"",m=c instanceof Ce?c.value().slice(h):"",y={collapsed:o.length===0,empty:o.length===0&&a.length()<=1,format:this.quill.getFormat(o),line:a,offset:l,prefix:d,suffix:m,event:t};s.some(p=>{if(p.collapsed!=null&&p.collapsed!==y.collapsed||p.empty!=null&&p.empty!==y.empty||p.offset!=null&&p.offset!==y.offset)return!1;if(Array.isArray(p.format)){if(p.format.every(v=>y.format[v]==null))return!1}else if(typeof p.format=="object"&&!Object.keys(p.format).every(v=>p.format[v]===!0?y.format[v]!=null:p.format[v]===!1?y.format[v]==null:Jt(p.format[v],y.format[v])))return!1;return p.prefix!=null&&!p.prefix.test(y.prefix)||p.suffix!=null&&!p.suffix.test(y.suffix)?!1:p.handler.call(this,o,y,p)!==!0})&&t.preventDefault()})}handleBackspace(t,r){let n=/[\uD800-\uDBFF][\uDC00-\uDFFF]$/.test(r.prefix)?2:1;if(t.index===0||this.quill.getLength()<=1)return;let s={},[i]=this.quill.getLine(t.index),o=new z.default().retain(t.index-n).delete(n);if(r.offset===0){let[a]=this.quill.getLine(t.index-1);if(a&&!(a.statics.blotName==="block"&&a.length()<=1)){let u=i.formats(),f=this.quill.getFormat(t.index-1,1);if(s=z.AttributeMap.diff(u,f)||{},Object.keys(s).length>0){let c=new z.default().retain(t.index+i.length()-2).retain(1,s);o=o.compose(c)}}}this.quill.updateContents(o,g.sources.USER),this.quill.focus()}handleDelete(t,r){let n=/^[\uD800-\uDBFF][\uDC00-\uDFFF]/.test(r.suffix)?2:1;if(t.index>=this.quill.getLength()-n)return;let s={},[i]=this.quill.getLine(t.index),o=new z.default().retain(t.index).delete(n);if(r.offset>=i.length()-1){let[a]=this.quill.getLine(t.index+1);if(a){let l=i.formats(),u=this.quill.getFormat(t.index,1);s=z.AttributeMap.diff(l,u)||{},Object.keys(s).length>0&&(o=o.retain(a.length()-1).retain(1,s))}}this.quill.updateContents(o,g.sources.USER),this.quill.focus()}handleDeleteRange(t){fr({range:t,quill:this.quill}),this.quill.focus()}handleEnter(t,r){let n=Object.keys(r.format).reduce((i,o)=>(this.quill.scroll.query(o,b.BLOCK)&&!Array.isArray(r.format[o])&&(i[o]=r.format[o]),i),{}),s=new z.default().retain(t.index).delete(t.length).insert(`
`,n);this.quill.updateContents(s,g.sources.USER),this.quill.setSelection(t.index+1,g.sources.SILENT),this.quill.focus()}},vx={bindings:{bold:Qs("bold"),italic:Qs("italic"),underline:Qs("underline"),indent:{key:"Tab",format:["blockquote","indent","list"],handler(e,t){return t.collapsed&&t.offset!==0?!0:(this.quill.format("indent","+1",g.sources.USER),!1)}},outdent:{key:"Tab",shiftKey:!0,format:["blockquote","indent","list"],handler(e,t){return t.collapsed&&t.offset!==0?!0:(this.quill.format("indent","-1",g.sources.USER),!1)}},"outdent backspace":{key:"Backspace",collapsed:!0,shiftKey:null,metaKey:null,ctrlKey:null,altKey:null,format:["indent","list"],offset:0,handler(e,t){t.format.indent!=null?this.quill.format("indent","-1",g.sources.USER):t.format.list!=null&&this.quill.format("list",!1,g.sources.USER)}},"indent code-block":Mu(!0),"outdent code-block":Mu(!1),"remove tab":{key:"Tab",shiftKey:!0,collapsed:!0,prefix:/\t$/,handler(e){this.quill.deleteText(e.index-1,1,g.sources.USER)}},tab:{key:"Tab",handler(e,t){if(t.format.table)return!0;this.quill.history.cutoff();let r=new z.default().retain(e.index).delete(e.length).insert(" ");return this.quill.updateContents(r,g.sources.USER),this.quill.history.cutoff(),this.quill.setSelection(e.index+1,g.sources.SILENT),!1}},"blockquote empty enter":{key:"Enter",collapsed:!0,format:["blockquote"],empty:!0,handler(){this.quill.format("blockquote",!1,g.sources.USER)}},"list empty enter":{key:"Enter",collapsed:!0,format:["list"],empty:!0,handler(e,t){let r={list:!1};t.format.indent&&(r.indent=!1),this.quill.formatLine(e.index,e.length,r,g.sources.USER)}},"checklist enter":{key:"Enter",collapsed:!0,format:{list:"checked"},handler(e){let[t,r]=this.quill.getLine(e.index),n={...t.formats(),list:"checked"},s=new z.default().retain(e.index).insert(`
`,n).retain(t.length()-r-1).retain(1,{list:"unchecked"});this.quill.updateContents(s,g.sources.USER),this.quill.setSelection(e.index+1,g.sources.SILENT),this.quill.scrollSelectionIntoView()}},"header enter":{key:"Enter",collapsed:!0,format:["header"],suffix:/^$/,handler(e,t){let[r,n]=this.quill.getLine(e.index),s=new z.default().retain(e.index).insert(`
`,t.format).retain(r.length()-n-1).retain(1,{header:null});this.quill.updateContents(s,g.sources.USER),this.quill.setSelection(e.index+1,g.sources.SILENT),this.quill.scrollSelectionIntoView()}},"table backspace":{key:"Backspace",format:["table"],collapsed:!0,offset:0,handler(){}},"table delete":{key:"Delete",format:["table"],collapsed:!0,suffix:/^$/,handler(){}},"table enter":{key:"Enter",shiftKey:null,format:["table"],handler(e){let t=this.quill.getModule("table");if(t){let[r,n,s,i]=t.getTable(e),o=Nx(r,n,s,i);if(o==null)return;let a=r.offset();if(o<0){let l=new z.default().retain(a).insert(`
`);this.quill.updateContents(l,g.sources.USER),this.quill.setSelection(e.index+1,e.length,g.sources.SILENT)}else if(o>0){a+=r.length();let l=new z.default().retain(a).insert(`
`);this.quill.updateContents(l,g.sources.USER),this.quill.setSelection(a,g.sources.USER)}}}},"table tab":{key:"Tab",shiftKey:null,format:["table"],handler(e,t){let{event:r,line:n}=t,s=n.offset(this.quill.scroll);r.shiftKey?this.quill.setSelection(s-1,g.sources.USER):this.quill.setSelection(s+n.length(),g.sources.USER)}},"list autofill":{key:" ",shiftKey:null,collapsed:!0,format:{"code-block":!1,blockquote:!1,table:!1},prefix:/^\s*?(\d+\.|-|\*|\[ ?\]|\[x\])$/,handler(e,t){if(this.quill.scroll.query("list")==null)return!0;let{length:r}=t.prefix,[n,s]=this.quill.getLine(e.index);if(s>r)return!0;let i;switch(t.prefix.trim()){case"[]":case"[ ]":i="unchecked";break;case"[x]":i="checked";break;case"-":case"*":i="bullet";break;default:i="ordered"}this.quill.insertText(e.index," ",g.sources.USER),this.quill.history.cutoff();let o=new z.default().retain(e.index-s).delete(r+1).retain(n.length()-2-s).retain(1,{list:i});return this.quill.updateContents(o,g.sources.USER),this.quill.history.cutoff(),this.quill.setSelection(e.index-r,g.sources.SILENT),!1}},"code exit":{key:"Enter",collapsed:!0,format:["code-block"],prefix:/^$/,suffix:/^\s*$/,handler(e){let[t,r]=this.quill.getLine(e.index),n=2,s=t;for(;s!=null&&s.length()<=1&&s.formats()["code-block"];)if(s=s.prev,n-=1,n<=0){let i=new z.default().retain(e.index+t.length()-r-2).retain(1,{"code-block":null}).delete(1);return this.quill.updateContents(i,g.sources.USER),this.quill.setSelection(e.index-1,g.sources.SILENT),!1}return!0}},"embed left":gn("ArrowLeft",!1),"embed left shift":gn("ArrowLeft",!0),"embed right":gn("ArrowRight",!1),"embed right shift":gn("ArrowRight",!0),"table down":ju(!1),"table up":ju(!0)}};ur.DEFAULTS=vx;function Mu(e){return{key:"Tab",shiftKey:!e,format:{"code-block":!0},handler(t,r){let{event:n}=r,s=this.quill.scroll.query("code-block"),{TAB:i}=s;if(t.length===0&&!n.shiftKey){this.quill.insertText(t.index,i,g.sources.USER),this.quill.setSelection(t.index+i.length,g.sources.SILENT);return}let o=t.length===0?this.quill.getLines(t.index,1):this.quill.getLines(t),{index:a,length:l}=t;o.forEach((u,f)=>{e?(u.insertAt(0,i),f===0?a+=i.length:l+=i.length):u.domNode.textContent.startsWith(i)&&(u.deleteAt(0,i.length),f===0?a-=i.length:l-=i.length)}),this.quill.update(g.sources.USER),this.quill.setSelection(a,l,g.sources.SILENT)}}}function gn(e,t){return{key:e,shiftKey:t,altKey:null,[e==="ArrowLeft"?"prefix":"suffix"]:/^$/,handler(n){let{index:s}=n;e==="ArrowRight"&&(s+=n.length+1);let[i]=this.quill.getLeaf(s);return i instanceof D?(e==="ArrowLeft"?t?this.quill.setSelection(n.index-1,n.length+1,g.sources.USER):this.quill.setSelection(n.index-1,g.sources.USER):t?this.quill.setSelection(n.index,n.length+1,g.sources.USER):this.quill.setSelection(n.index+n.length+1,g.sources.USER),!1):!0}}}function Qs(e){return{key:e[0],shortKey:!0,handler(t,r){this.quill.format(e,!r.format[e],g.sources.USER)}}}function ju(e){return{key:e?"ArrowUp":"ArrowDown",collapsed:!0,format:["table"],handler(t,r){let n=e?"prev":"next",s=r.line,i=s.parent[n];if(i!=null){if(i.statics.blotName==="table-row"){let o=i.children.head,a=s;for(;a.prev!=null;)a=a.prev,o=o.next;let l=o.offset(this.quill.scroll)+Math.min(r.offset,o.length()-1);this.quill.setSelection(l,0,g.sources.USER)}}else{let o=s.table()[n];o!=null&&(e?this.quill.setSelection(o.offset(this.quill.scroll)+o.length()-1,0,g.sources.USER):this.quill.setSelection(o.offset(this.quill.scroll),0,g.sources.USER))}return!1}}}function Ex(e){if(typeof e=="string"||typeof e=="number")e={key:e};else if(typeof e=="object")e=mt(e);else return null;return e.shortKey&&(e[xx]=e.shortKey,delete e.shortKey),e}function fr(e){let{quill:t,range:r}=e,n=t.getLines(r),s={};if(n.length>1){let i=n[0].formats(),o=n[n.length-1].formats();s=z.AttributeMap.diff(o,i)||{}}t.deleteText(r,g.sources.USER),Object.keys(s).length>0&&t.formatLine(r.index,1,s,g.sources.USER),t.setSelection(r.index,g.sources.SILENT)}function Nx(e,t,r,n){return t.prev==null&&t.next==null?r.prev==null&&r.next==null?n===0?-1:1:r.prev==null?-1:1:t.prev==null?-1:t.next==null?1:null}var Ax=/font-weight:\s*normal/,Tx=["P","OL","UL"],ku=e=>e&&Tx.includes(e.tagName),wx=e=>{Array.from(e.querySelectorAll("br")).filter(t=>ku(t.previousElementSibling)&&ku(t.nextElementSibling)).forEach(t=>{t.parentNode?.removeChild(t)})},_x=e=>{Array.from(e.querySelectorAll('b[style*="font-weight"]')).filter(t=>t.getAttribute("style")?.match(Ax)).forEach(t=>{let r=e.createDocumentFragment();r.append(...t.childNodes),t.parentNode?.replaceChild(r,t)})};function Zs(e){e.querySelector('[id^="docs-internal-guid-"]')&&(_x(e),wx(e))}var Ox=/\bmso-list:[^;]*ignore/i,Sx=/\bmso-list:[^;]*\bl(\d+)/i,Lx=/\bmso-list:[^;]*\blevel(\d+)/i,Cx=(e,t)=>{let r=e.getAttribute("style"),n=r?.match(Sx);if(!n)return null;let s=Number(n[1]),i=r?.match(Lx),o=i?Number(i[1]):1,a=new RegExp(`@list l${s}:level${o}\\s*\\{[^\\}]*mso-level-number-format:\\s*([\\w-]+)`,"i"),l=t.match(a),u=l&&l[1]==="bullet"?"bullet":"ordered";return{id:s,indent:o,type:u,element:e}},Ix=e=>{let t=Array.from(e.querySelectorAll("[style*=mso-list]")),r=[],n=[];t.forEach(o=>{(o.getAttribute("style")||"").match(Ox)?r.push(o):n.push(o)}),r.forEach(o=>o.parentNode?.removeChild(o));let s=e.documentElement.innerHTML,i=n.map(o=>Cx(o,s)).filter(o=>o);for(;i.length;){let o=[],a=i.shift();for(;a;)o.push(a),a=i.length&&i[0]?.element===a.element.nextElementSibling&&i[0].id===a.id?i.shift():null;let l=document.createElement("ul");o.forEach(c=>{let h=document.createElement("li");h.setAttribute("data-list",c.type),c.indent>1&&h.setAttribute("class",`ql-indent-${c.indent-1}`),h.innerHTML=c.element.innerHTML,l.appendChild(h)});let u=o[0]?.element,{parentNode:f}=u??{};u&&f?.replaceChild(l,u),o.slice(1).forEach(c=>{let{element:h}=c;f?.removeChild(h)})}};function Js(e){e.documentElement.getAttribute("xmlns:w")==="urn:schemas-microsoft-com:office:word"&&Ix(e)}var Rx=[Js,Zs],Bx=e=>{e.documentElement&&Rx.forEach(t=>{t(e)})},Pu=Bx;var Dx=ut("quill:clipboard"),Mx=[[Node.TEXT_NODE,Wx],[Node.TEXT_NODE,Uu],["br",Ux],[Node.ELEMENT_NODE,Uu],[Node.ELEMENT_NODE,qx],[Node.ELEMENT_NODE,Px],[Node.ELEMENT_NODE,$x],["li",Kx],["ol, ul",Hx],["pre",Fx],["tr",Gx],["b",ti("bold")],["i",ti("italic")],["strike",ti("strike")],["style",zx]],jx=[_u,Cu].reduce((e,t)=>(e[t.keyName]=t,e),{}),qu=[Ou,Lu,Su,Iu,Bu,Du].reduce((e,t)=>(e[t.keyName]=t,e),{}),yn=class extends G{static DEFAULTS={matchers:[]};constructor(t,r){super(t,r),this.quill.root.addEventListener("copy",n=>this.onCaptureCopy(n,!1)),this.quill.root.addEventListener("cut",n=>this.onCaptureCopy(n,!0)),this.quill.root.addEventListener("paste",this.onCapturePaste.bind(this)),this.matchers=[],Mx.concat(this.options.matchers??[]).forEach(n=>{let[s,i]=n;this.addMatcher(s,i)})}addMatcher(t,r){this.matchers.push([t,r])}convert(t){let{html:r,text:n}=t,s=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};if(s[ot.blotName])return new J.default().insert(n||"",{[ot.blotName]:s[ot.blotName]});if(!r)return new J.default().insert(n||"",s);let i=this.convertHTML(r);return cr(i,`
`)&&(i.ops[i.ops.length-1].attributes==null||s.table)?i.compose(new J.default().retain(i.length()-1).delete(1)):i}normalizeHTML(t){Pu(t)}convertHTML(t){let r=new DOMParser().parseFromString(t,"text/html");this.normalizeHTML(r);let n=r.body,s=new WeakMap,[i,o]=this.prepareMatching(n,s);return zu(this.quill.scroll,n,i,o,s)}dangerouslyPasteHTML(t,r){let n=arguments.length>2&&arguments[2]!==void 0?arguments[2]:g.sources.API;if(typeof t=="string"){let s=this.convert({html:t,text:""});this.quill.setContents(s,r),this.quill.setSelection(0,g.sources.SILENT)}else{let s=this.convert({html:r,text:""});this.quill.updateContents(new J.default().retain(t).concat(s),n),this.quill.setSelection(t+s.length(),g.sources.SILENT)}}onCaptureCopy(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:!1;if(t.defaultPrevented)return;t.preventDefault();let[n]=this.quill.selection.getRange();if(n==null)return;let{html:s,text:i}=this.onCopy(n,r);t.clipboardData?.setData("text/plain",i),t.clipboardData?.setData("text/html",s),r&&fr({range:n,quill:this.quill})}normalizeURIList(t){return t.split(/\r?\n/).filter(r=>r[0]!=="#").join(`
`)}onCapturePaste(t){if(t.defaultPrevented||!this.quill.isEnabled())return;t.preventDefault();let r=this.quill.getSelection(!0);if(r==null)return;let n=t.clipboardData?.getData("text/html"),s=t.clipboardData?.getData("text/plain");if(!n&&!s){let o=t.clipboardData?.getData("text/uri-list");o&&(s=this.normalizeURIList(o))}let i=Array.from(t.clipboardData?.files||[]);if(!n&&i.length>0){this.quill.uploader.upload(r,i);return}if(n&&i.length>0){let o=new DOMParser().parseFromString(n,"text/html");if(o.body.childElementCount===1&&o.body.firstElementChild?.tagName==="IMG"){this.quill.uploader.upload(r,i);return}}this.onPaste(r,{html:n,text:s})}onCopy(t){let r=this.quill.getText(t);return{html:this.quill.getSemanticHTML(t),text:r}}onPaste(t,r){let{text:n,html:s}=r,i=this.quill.getFormat(t.index),o=this.convert({text:n,html:s},i);Dx.log("onPaste",o,{text:n,html:s});let a=new J.default().retain(t.index).delete(t.length).concat(o);this.quill.updateContents(a,g.sources.USER),this.quill.setSelection(a.length()-t.length,g.sources.SILENT),this.quill.scrollSelectionIntoView()}prepareMatching(t,r){let n=[],s=[];return this.matchers.forEach(i=>{let[o,a]=i;switch(o){case Node.TEXT_NODE:s.push(a);break;case Node.ELEMENT_NODE:n.push(a);break;default:Array.from(t.querySelectorAll(o)).forEach(l=>{r.has(l)?r.get(l)?.push(a):r.set(l,[a])});break}}),[n,s]}};function ue(e,t,r,n){return n.query(t)?e.reduce((s,i)=>{if(!i.insert)return s;if(i.attributes&&i.attributes[t])return s.push(i);let o=r?{[t]:r}:{};return s.insert(i.insert,{...o,...i.attributes})},new J.default):e}function cr(e,t){let r="";for(let n=e.ops.length-1;n>=0&&r.length<t.length;--n){let s=e.ops[n];if(typeof s.insert!="string")break;r=s.insert+r}return r.slice(-1*t.length)===t}function Yt(e,t){if(!(e instanceof Element))return!1;let r=t.query(e);return r&&r.prototype instanceof D?!1:["address","article","blockquote","canvas","dd","div","dl","dt","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","header","iframe","li","main","nav","ol","output","p","pre","section","table","td","tr","ul","video"].includes(e.tagName.toLowerCase())}function kx(e,t){return e.previousElementSibling&&e.nextElementSibling&&!Yt(e.previousElementSibling,t)&&!Yt(e.nextElementSibling,t)}var bn=new WeakMap;function Fu(e){return e==null?!1:(bn.has(e)||(e.tagName==="PRE"?bn.set(e,!0):bn.set(e,Fu(e.parentNode))),bn.get(e))}function zu(e,t,r,n,s){return t.nodeType===t.TEXT_NODE?n.reduce((i,o)=>o(t,i,e),new J.default):t.nodeType===t.ELEMENT_NODE?Array.from(t.childNodes||[]).reduce((i,o)=>{let a=zu(e,o,r,n,s);return o.nodeType===t.ELEMENT_NODE&&(a=r.reduce((l,u)=>u(o,l,e),a),a=(s.get(o)||[]).reduce((l,u)=>u(o,l,e),a)),i.concat(a)},new J.default):new J.default}function ti(e){return(t,r,n)=>ue(r,e,!0,n)}function Px(e,t,r){let n=K.keys(e),s=U.keys(e),i=Y.keys(e),o={};return n.concat(s).concat(i).forEach(a=>{let l=r.query(a,b.ATTRIBUTE);l!=null&&(o[l.attrName]=l.value(e),o[l.attrName])||(l=jx[a],l!=null&&(l.attrName===a||l.keyName===a)&&(o[l.attrName]=l.value(e)||void 0),l=qu[a],l!=null&&(l.attrName===a||l.keyName===a)&&(l=qu[a],o[l.attrName]=l.value(e)||void 0))}),Object.entries(o).reduce((a,l)=>{let[u,f]=l;return ue(a,u,f,r)},t)}function qx(e,t,r){let n=r.query(e);if(n==null)return t;if(n.prototype instanceof D){let s={},i=n.value(e);if(i!=null)return s[n.blotName]=i,new J.default().insert(s,n.formats(e,r))}else if(n.prototype instanceof te&&!cr(t,`
`)&&t.insert(`
`),"blotName"in n&&"formats"in n&&typeof n.formats=="function")return ue(t,n.blotName,n.formats(e,r),r);return t}function Ux(e,t){return cr(t,`
`)||t.insert(`
`),t}function Fx(e,t,r){let n=r.query("code-block"),s=n&&"formats"in n&&typeof n.formats=="function"?n.formats(e,r):!0;return ue(t,"code-block",s,r)}function zx(){return new J.default}function Kx(e,t,r){let n=r.query(e);if(n==null||n.blotName!=="list"||!cr(t,`
`))return t;let s=-1,i=e.parentNode;for(;i!=null;)["OL","UL"].includes(i.tagName)&&(s+=1),i=i.parentNode;return s<=0?t:t.reduce((o,a)=>a.insert?a.attributes&&typeof a.attributes.indent=="number"?o.push(a):o.insert(a.insert,{indent:s,...a.attributes||{}}):o,new J.default)}function Hx(e,t,r){let n=e,s=n.tagName==="OL"?"ordered":"bullet",i=n.getAttribute("data-checked");return i&&(s=i==="true"?"checked":"unchecked"),ue(t,"list",s,r)}function Uu(e,t,r){if(!cr(t,`
`)){if(Yt(e,r)&&(e.childNodes.length>0||e instanceof HTMLParagraphElement))return t.insert(`
`);if(t.length()>0&&e.nextSibling){let n=e.nextSibling;for(;n!=null;){if(Yt(n,r))return t.insert(`
`);let s=r.query(n);if(s&&s.prototype instanceof P)return t.insert(`
`);n=n.firstChild}}}return t}function $x(e,t,r){let n={},s=e.style||{};return s.fontStyle==="italic"&&(n.italic=!0),s.textDecoration==="underline"&&(n.underline=!0),s.textDecoration==="line-through"&&(n.strike=!0),(s.fontWeight?.startsWith("bold")||parseInt(s.fontWeight,10)>=700)&&(n.bold=!0),t=Object.entries(n).reduce((i,o)=>{let[a,l]=o;return ue(i,a,l,r)},t),parseFloat(s.textIndent||0)>0?new J.default().insert(" ").concat(t):t}function Gx(e,t,r){let n=e.parentElement?.tagName==="TABLE"?e.parentElement:e.parentElement?.parentElement;if(n!=null){let i=Array.from(n.querySelectorAll("tr")).indexOf(e)+1;return ue(t,"table",i,r)}return t}function Wx(e,t,r){let n=e.data;if(e.parentElement?.tagName==="O:P")return t.insert(n.trim());if(!Fu(e)){if(n.trim().length===0&&n.includes(`
`)&&!kx(e,r))return t;n=n.replace(/[^\S\u00a0]/g," "),n=n.replace(/ {2,}/g," "),(e.previousSibling==null&&e.parentElement!=null&&Yt(e.parentElement,r)||e.previousSibling instanceof Element&&Yt(e.previousSibling,r))&&(n=n.replace(/^ /,"")),(e.nextSibling==null&&e.parentElement!=null&&Yt(e.parentElement,r)||e.nextSibling instanceof Element&&Yt(e.nextSibling,r))&&(n=n.replace(/ $/,"")),n=n.replaceAll("\xA0"," ")}return t.insert(n)}var xn=class extends G{static DEFAULTS={delay:1e3,maxStack:100,userOnly:!1};lastRecorded=0;ignoreChange=!1;stack={undo:[],redo:[]};currentRange=null;constructor(t,r){super(t,r),this.quill.on(g.events.EDITOR_CHANGE,(n,s,i,o)=>{n===g.events.SELECTION_CHANGE?s&&o!==g.sources.SILENT&&(this.currentRange=s):n===g.events.TEXT_CHANGE&&(this.ignoreChange||(!this.options.userOnly||o===g.sources.USER?this.record(s,i):this.transform(s)),this.currentRange=ei(this.currentRange,s))}),this.quill.keyboard.addBinding({key:"z",shortKey:!0},this.undo.bind(this)),this.quill.keyboard.addBinding({key:["z","Z"],shortKey:!0,shiftKey:!0},this.redo.bind(this)),/Win/i.test(navigator.platform)&&this.quill.keyboard.addBinding({key:"y",shortKey:!0},this.redo.bind(this)),this.quill.root.addEventListener("beforeinput",n=>{n.inputType==="historyUndo"?(this.undo(),n.preventDefault()):n.inputType==="historyRedo"&&(this.redo(),n.preventDefault())})}change(t,r){if(this.stack[t].length===0)return;let n=this.stack[t].pop();if(!n)return;let s=this.quill.getContents(),i=n.delta.invert(s);this.stack[r].push({delta:i,range:ei(n.range,i)}),this.lastRecorded=0,this.ignoreChange=!0,this.quill.updateContents(n.delta,g.sources.USER),this.ignoreChange=!1,this.restoreSelection(n)}clear(){this.stack={undo:[],redo:[]}}cutoff(){this.lastRecorded=0}record(t,r){if(t.ops.length===0)return;this.stack.redo=[];let n=t.invert(r),s=this.currentRange,i=Date.now();if(this.lastRecorded+this.options.delay>i&&this.stack.undo.length>0){let o=this.stack.undo.pop();o&&(n=n.compose(o.delta),s=o.range)}else this.lastRecorded=i;n.length()!==0&&(this.stack.undo.push({delta:n,range:s}),this.stack.undo.length>this.options.maxStack&&this.stack.undo.shift())}redo(){this.change("redo","undo")}transform(t){Ku(this.stack.undo,t),Ku(this.stack.redo,t)}undo(){this.change("undo","redo")}restoreSelection(t){if(t.range)this.quill.setSelection(t.range,g.sources.USER);else{let r=Xx(this.quill.scroll,t.delta);this.quill.setSelection(r,g.sources.USER)}}};function Ku(e,t){let r=t;for(let n=e.length-1;n>=0;n-=1){let s=e[n];e[n]={delta:r.transform(s.delta,!0),range:s.range&&ei(s.range,r)},r=s.delta.transform(r),e[n].delta.length()===0&&e.splice(n,1)}}function Vx(e,t){let r=t.ops[t.ops.length-1];return r==null?!1:r.insert!=null?typeof r.insert=="string"&&r.insert.endsWith(`
`):r.attributes!=null?Object.keys(r.attributes).some(n=>e.query(n,b.BLOCK)!=null):!1}function Xx(e,t){let r=t.reduce((s,i)=>s+(i.delete||0),0),n=t.length()-r;return Vx(e,t)&&(n-=1),n}function ei(e,t){if(!e)return e;let r=t.transformPosition(e.index),n=t.transformPosition(e.index+e.length);return{index:r,length:n-r}}var Hu=ct(bt(),1);var vn=class extends G{constructor(t,r){super(t,r),t.root.addEventListener("drop",n=>{n.preventDefault();let s=null;if(document.caretRangeFromPoint)s=document.caretRangeFromPoint(n.clientX,n.clientY);else if(document.caretPositionFromPoint){let o=document.caretPositionFromPoint(n.clientX,n.clientY);s=document.createRange(),s.setStart(o.offsetNode,o.offset),s.setEnd(o.offsetNode,o.offset)}let i=s&&t.selection.normalizeNative(s);if(i){let o=t.selection.normalizedToRange(i);n.dataTransfer?.files&&this.upload(o,n.dataTransfer.files)}})}upload(t,r){let n=[];Array.from(r).forEach(s=>{s&&this.options.mimetypes?.includes(s.type)&&n.push(s)}),n.length>0&&this.options.handler.call(this,t,n)}};vn.DEFAULTS={mimetypes:["image/png","image/jpeg"],handler(e,t){if(!this.quill.scroll.query("image"))return;let r=t.map(n=>new Promise(s=>{let i=new FileReader;i.onload=()=>{s(i.result)},i.readAsDataURL(n)}));Promise.all(r).then(n=>{let s=n.reduce((i,o)=>i.insert({image:o}),new Hu.default().retain(e.index).delete(e.length));this.quill.updateContents(s,E.sources.USER),this.quill.setSelection(e.index+n.length,E.sources.SILENT)})}};var $u=vn;var En=ct(bt(),1);var Gu=ct(bt(),1);var Yx=["insertText","insertReplacementText"],ri=class extends G{constructor(t,r){super(t,r),t.root.addEventListener("beforeinput",n=>{this.handleBeforeInput(n)}),/Android/i.test(navigator.userAgent)||t.on(g.events.COMPOSITION_BEFORE_START,()=>{this.handleCompositionStart()})}deleteRange(t){fr({range:t,quill:this.quill})}replaceText(t){let r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:"";if(t.length===0)return!1;if(r){let n=this.quill.getFormat(t.index,1);this.deleteRange(t),this.quill.updateContents(new Gu.default().retain(t.index).insert(r,n),g.sources.USER)}else this.deleteRange(t);return this.quill.setSelection(t.index+r.length,0,g.sources.SILENT),!0}handleBeforeInput(t){if(this.quill.composition.isComposing||t.defaultPrevented||!Yx.includes(t.inputType))return;let r=t.getTargetRanges?t.getTargetRanges()[0]:null;if(!r||r.collapsed===!0)return;let n=Qx(t);if(n==null)return;let s=this.quill.selection.normalizeNative(r),i=s?this.quill.selection.normalizedToRange(s):null;i&&this.replaceText(i,n)&&t.preventDefault()}handleCompositionStart(){let t=this.quill.getSelection();t&&this.replaceText(t)}};function Qx(e){return typeof e.data=="string"?e.data:e.dataTransfer?.types.includes("text/plain")?e.dataTransfer.getData("text/plain"):null}var Wu=ri;var Zx=/Mac/i.test(navigator.platform),Jx=100,tv=e=>!!(e.key==="ArrowLeft"||e.key==="ArrowRight"||e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="Home"||Zx&&e.key==="a"&&e.ctrlKey===!0),ni=class extends G{isListening=!1;selectionChangeDeadline=0;constructor(t,r){super(t,r),this.handleArrowKeys(),this.handleNavigationShortcuts()}handleArrowKeys(){this.quill.keyboard.addBinding({key:["ArrowLeft","ArrowRight"],offset:0,shiftKey:null,handler(t,r){let{line:n,event:s}=r;if(!(n instanceof X)||!n.uiNode)return!0;let i=getComputedStyle(n.domNode).direction==="rtl";return i&&s.key!=="ArrowRight"||!i&&s.key!=="ArrowLeft"?!0:(this.quill.setSelection(t.index-1,t.length+(s.shiftKey?1:0),g.sources.USER),!1)}})}handleNavigationShortcuts(){this.quill.root.addEventListener("keydown",t=>{!t.defaultPrevented&&tv(t)&&this.ensureListeningToSelectionChange()})}ensureListeningToSelectionChange(){if(this.selectionChangeDeadline=Date.now()+Jx,this.isListening)return;this.isListening=!0;let t=()=>{this.isListening=!1,Date.now()<=this.selectionChangeDeadline&&this.handleSelectionChange()};document.addEventListener("selectionchange",t,{once:!0})}handleSelectionChange(){let t=document.getSelection();if(!t)return;let r=t.getRangeAt(0);if(r.collapsed!==!0||r.startOffset!==0)return;let n=this.quill.scroll.find(r.startContainer);if(!(n instanceof X)||!n.uiNode)return;let s=document.createRange();s.setStartAfter(n.uiNode),s.setEndAfter(n.uiNode),t.removeAllRanges(),t.addRange(s)}},Vu=ni;g.register({"blots/block":L,"blots/block/embed":P,"blots/break":Q,"blots/container":Vt,"blots/cursor":Pe,"blots/embed":hn,"blots/inline":st,"blots/scroll":wu,"blots/text":j,"modules/clipboard":yn,"modules/history":xn,"modules/keyboard":ur,"modules/uploader":$u,"modules/input":Wu,"modules/uiNode":Vu});var si=g;var ii=class extends L{static blotName="blockquote";static tagName="blockquote"},Xu=ii;var oi=class extends st{static blotName="bold";static tagName=["STRONG","B"];static create(){return super.create()}static formats(){return!0}optimize(t){super.optimize(t),this.domNode.tagName!==this.statics.tagName[0]&&this.replaceWith(this.statics.blotName)}},Nn=oi;var ai=class extends L{static blotName="header";static tagName=["H1","H2","H3","H4","H5","H6"];static formats(t){return this.tagName.indexOf(t.tagName)+1}},Yu=ai;var li=class extends Nn{static blotName="italic";static tagName=["EM","I"]},Qu=li;var An=class extends st{static blotName="link";static tagName="A";static SANITIZED_URL="about:blank";static PROTOCOL_WHITELIST=["http","https","mailto","tel","sms"];static create(t){let r=super.create(t);return r.setAttribute("href",this.sanitize(t)),r.setAttribute("rel","noopener noreferrer"),r.setAttribute("target","_blank"),r}static formats(t){return t.getAttribute("href")}static sanitize(t){return ev(t,this.PROTOCOL_WHITELIST)?t:this.SANITIZED_URL}format(t,r){t!==this.statics.blotName||!r?super.format(t,r):this.domNode.setAttribute("href",this.constructor.sanitize(r))}};function ev(e,t){let r=document.createElement("a");r.href=e;let n=r.href.slice(0,r.href.indexOf(":"));return t.indexOf(n)>-1}var Rt=class extends Vt{};Rt.blotName="list-container";Rt.tagName="OL";var Qt=class extends L{static create(t){let r=super.create();return r.setAttribute("data-list",t),r}static formats(t){return t.getAttribute("data-list")||void 0}static register(){g.register(Rt)}constructor(t,r){super(t,r);let n=r.ownerDocument.createElement("span"),s=i=>{if(!t.isEnabled())return;let o=this.statics.formats(r,t);o==="checked"?(this.format("list","unchecked"),i.preventDefault()):o==="unchecked"&&(this.format("list","checked"),i.preventDefault())};n.addEventListener("mousedown",s),n.addEventListener("touchstart",s),this.attachUI(n)}format(t,r){t===this.statics.blotName&&r?this.domNode.setAttribute("data-list",r):super.format(t,r)}};Qt.blotName="list";Qt.tagName="LI";Rt.allowedChildren=[Qt];Qt.requiredContainer=Rt;var ui=class extends st{static blotName="underline";static tagName="U"},Zu=ui;si.register({"formats/blockquote":Xu,"formats/bold":Nn,"formats/header":Yu,"formats/italic":Qu,"formats/link":An,"formats/list":Qt,"formats/list/container":Rt,"formats/underline":Zu},!0);var fi={bold:["bold",!0],italic:["italic",!0],underline:["underline",!0],h2:["header",2],h3:["header",3],ul:["list","bullet"],ol:["list","ordered"],quote:["blockquote",!0],link:["link",!0]},ci={key:"Tab",handler:()=>!0},rv=e=>{let t=e.querySelector("textarea"),r=e.querySelector(".adm-richtext__toolbar"),n=r?[...r.querySelectorAll("[data-adm-rt]")]:[],s=n.map(p=>p.dataset.admRt),i=document.createElement("div");i.className="adm-richtext__editor",t.after(i);let o=new si(i,{formats:[...new Set(s.map(p=>fi[p]?.[0]).filter(Boolean))],modules:{keyboard:{bindings:{tab:ci,indent:ci,outdent:ci}},uploader:{mimetypes:[],handler(){}}},placeholder:t.placeholder}),a=o.root,l=t.id&&document.querySelector(`label[for="${CSS.escape(t.id)}"]`);a.setAttribute("role","textbox"),a.setAttribute("aria-multiline","true"),l?a.setAttribute("aria-label",l.textContent.trim()):t.getAttribute("aria-label")&&a.setAttribute("aria-label",t.getAttribute("aria-label"));for(let p of["aria-describedby","aria-invalid"])t.hasAttribute(p)&&a.setAttribute(p,t.getAttribute(p));let u=()=>{o.setContents(o.clipboard.convert({html:t.value}),"silent"),o.history.clear()},f=()=>o.getText().trim()===""?"":o.getSemanticHTML().replace(/ | /g," ");u(),e.dataset.ready="",r?.removeAttribute("hidden"),t.tabIndex=-1,t.setAttribute("aria-hidden","true"),t.addEventListener("focus",()=>o.focus()),l?.addEventListener("click",()=>o.focus()),t.addEventListener("adm-sync",u);let c=()=>{let p=o.getSelection(),v=p?o.getFormat(p):{};for(let N of n){let[A,T]=fi[N.dataset.admRt]??[];N.setAttribute("aria-pressed",String(A==="link"?!!v[A]:v[A]===T))}};o.on("text-change",()=>{t.value=f(),t.dispatchEvent(new Event("input",{bubbles:!0})),c()}),o.on("selection-change",p=>{p&&c()}),c();let h=e.querySelector(".adm-richtext__link"),d=h?.querySelector("input"),m=null,y=p=>{h.hidden=!0,p&&o.setSelection(m??o.getLength()-1,0)},x=()=>{let p=d.value.trim();m&&o.setSelection(m,"silent"),o.format("link",p||!1,"user"),y(!0)};h?.querySelector("[data-adm-rt-apply]")?.addEventListener("click",x),h?.querySelector("[data-adm-rt-cancel]")?.addEventListener("click",()=>y(!0)),d?.addEventListener("keydown",p=>{p.key==="Enter"?(p.preventDefault(),x()):p.key==="Escape"&&(p.stopPropagation(),y(!0))}),r?.addEventListener("mousedown",p=>{p.target.closest("[data-adm-rt]")&&p.preventDefault()}),r?.addEventListener("click",p=>{let v=p.target.closest("[data-adm-rt]");if(!v)return;let[N,A]=fi[v.dataset.admRt]??[];if(N==="link"){if(!h)return;m=o.getSelection(!0),d.value=o.getFormat(m).link??"",h.hidden=!1,d.focus();return}o.focus(),o.format(N,o.getFormat()[N]===A?!1:A,"user"),c()})},Tn=(e=document)=>e.querySelectorAll?.("[data-adm-richtext]:not([data-ready], [data-adm-wait])").forEach(t=>rv(t));typeof document<"u"&&(window.AdmiralUI=window.AdmiralUI||{},window.AdmiralUI.richtext=Tn,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>Tn()):Tn(),new MutationObserver(()=>Tn()).observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-adm-wait"]}));})();
</script>
<span class="adm-hint" id="g_body-hint">Shown to members in the portal.</span> </div>
Prose
Blade
<x-admin::prose html="<h2>Early entry</h2><p>For <strong>club members</strong>. <a href='https://example.com'>Read more</a>.</p><ul><li>10% off</li><li>Any 2027 race</li></ul><script>alert(1)</script>" />
HTML, for other stacks
<div class="adm-prose"><h2>Early entry</h2><p>For <strong>club members</strong>. <a href="https://example.com" rel="noopener noreferrer">Read more</a>.</p><ul><li>10% off</li><li>Any 2027 race</li></ul></div>
Select
Blade
<x-admin::select name="g_platform" label="Platform" placeholder="Choose…" :options="['sf' => 'Salesforce', 'mc' => 'Mailchimp']" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_platform">Platform</label>
<select
name="g_platform" id="g_platform" class="adm-select"
>
<option value="">Choose…</option> <option value="sf" >Salesforce</option>
<option value="mc" >Mailchimp</option>
</select>
</div>
Combobox
Blade
<x-admin::form-grid>
<x-admin::combobox name="g_country" label="Country" placeholder="Search countries" value="nz"
:options="['nz' => 'New Zealand', 'sg' => 'Singapore', 'gb' => 'United Kingdom', 'us' => 'United States']" />
<x-admin::combobox name="g_platforms[]" label="Destinations" multiple placeholder="Add a destination" :value="['sf']"
:options="['sf' => 'Salesforce', 'mc' => 'Mailchimp', 'gs' => 'Google Sheets']" />
</x-admin::form-grid>
HTML, for other stacks
<div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_country">Country</label>
<div class="adm-combobox" data-adm-combobox >
<select
name="g_country" id="g_country" class="adm-select"
>
<option value="">Search countries</option> <option value="nz" selected>New Zealand</option>
<option value="sg" >Singapore</option>
<option value="gb" >United Kingdom</option>
<option value="us" >United States</option>
</select>
</div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_platforms">Destinations</label>
<div class="adm-combobox" data-adm-combobox >
<select
name="g_platforms[]" id="g_platforms" multiple data-placeholder="Add a destination" class="adm-select"
>
<option value="sf" selected>Salesforce</option>
<option value="mc" >Mailchimp</option>
<option value="gs" >Google Sheets</option>
</select>
</div>
</div></div>
Autocomplete
Blade
<x-admin::autocomplete name="g_city" label="City" hint="Type anything, or pick a suggestion." :suggestions="['Singapore', 'London', 'San Francisco', 'Las Vegas']" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_city">City</label>
<div data-adm-autocomplete data-min="1" data-suggestions="["Singapore","London","San Francisco","Las Vegas"]" >
<input
type="text"
name="g_city" id="g_city" aria-describedby="g_city-hint" class="adm-input"
>
</div>
<span class="adm-hint" id="g_city-hint">Type anything, or pick a suggestion.</span> </div>
Tag input
vip
press
Blade
<x-admin::tag-input name="g_tags" label="Tags" :value="['vip', 'press']" hint="Press Enter or type a comma to add a tag." />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_tags">Tags</label>
<div class="adm-combobox" data-adm-tags data-name="g_tags[]" >
<div class="adm-control" >
<span class="adm-chip"><span>vip</span><button type="button" aria-label="Remove vip"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"/></svg></button><input type="hidden" name="g_tags[]" value="vip"></span>
<span class="adm-chip"><span>press</span><button type="button" aria-label="Remove press"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"/></svg></button><input type="hidden" name="g_tags[]" value="press"></span>
<input class="adm-control__input" type="text" id="g_tags" placeholder="Type, then press Enter" aria-describedby="g_tags-hint" >
</div>
</div>
<span class="adm-hint" id="g_tags-hint">Press Enter or type a comma to add a tag.</span> </div>
Date picker
UTC
Blade
<x-admin::form-grid>
<x-admin::date-picker name="g_starts" label="Starts on" value="2026-11-15" />
<x-admin::date-range-picker from="g_from" to="g_to" label="Season" from-value="2026-03-01" to-value="2026-11-30" />
<x-admin::date-picker name="g_opens" mode="datetime" label="Opens at" value="2026-11-15T09:30" :step="15" timezone="UTC" />
<x-admin::date-picker name="g_daily" mode="time" label="Daily send time" value="08:00" :step="30" />
</x-admin::form-grid>
HTML, for other stacks
<div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_starts">Starts on</label>
<div class="adm-date" data-adm-date >
<div class="adm-input-group">
<input
type="date"
name="g_starts" id="g_starts" value="2026-11-15" class="adm-input"
>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm adm-input-group__action" data-adm-date-open aria-label="Choose date"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M16 3v4M8 3v4M3 11h18"/></svg></button>
</div>
</div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_from">Season</label>
<div class="adm-date" data-adm-date>
<div class="adm-input-group">
<input type="date" class="adm-input" name="g_from" id="g_from" aria-label="Start date" value="2026-03-01" >
<span class="adm-date__sep" aria-hidden="true">–</span>
<input type="date" class="adm-input" name="g_to" aria-label="End date" value="2026-11-30" >
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm adm-input-group__action" data-adm-date-open aria-label="Choose dates"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M16 3v4M8 3v4M3 11h18"/></svg></button>
</div>
</div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_opens">Opens at</label>
<div class="adm-date" data-adm-date >
<div class="adm-input-group">
<input
type="datetime-local"
name="g_opens" id="g_opens" value="2026-11-15T09:30" step="900" aria-describedby="g_opens-timezone" class="adm-input"
>
<span class="adm-input-group__addon" id="g_opens-timezone" >UTC</span> <button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm adm-input-group__action" data-adm-date-open aria-label="Choose date"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M16 3v4M8 3v4M3 11h18"/></svg></button>
</div>
</div>
</div>
<div class="adm-field">
<label class="adm-label" for="g_daily">Daily send time</label>
<div class="adm-date" >
<div class="adm-input-group">
<input
type="time"
name="g_daily" id="g_daily" value="08:00" step="1800" class="adm-input"
>
</div>
</div>
</div></div>
Calendar
Blade
<x-admin::calendar name="g_race_day" label="Race day" value="2026-11-15" min="2026-11-03" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_race_day">Race day</label>
<div class="adm-calendar-field" data-adm-calendar >
<input
type="date"
name="g_race_day" id="g_race_day" value="2026-11-15" min="2026-11-03" class="adm-input"
>
</div>
</div>
Checkbox, switch, radio
Blade
<x-admin::form-grid>
<x-admin::stack gap="2">
<x-admin::checkbox name="g_notify" label="Email owners when a run fails" checked />
<x-admin::switch name="g_live" label="Sync is live" checked />
<x-admin::radio name="g_single" value="a" label="A radio on its own" />
</x-admin::stack>
<x-admin::radio-group name="g_division" label="Division" value="pro" :options="['pro' => 'Professional', 'age' => 'Age group']" />
</x-admin::form-grid>
HTML, for other stacks
<div class="adm-form-grid"><div class="adm-stack" style="gap:var(--ad-space-2)"><div class="adm-field">
<label class="adm-check">
<input type="checkbox" name="g_notify" id="g_notify" value="1" checked >
<span>Email owners when a run fails</span>
</label>
</div>
<div class="adm-field">
<input type="hidden" name="g_live" value="0"> <label class="adm-check">
<input type="checkbox" role="switch" class="adm-switch" name="g_live" id="g_live" value="1" checked >
<span>Sync is live</span>
</label>
</div>
<label class="adm-check">
<input type="radio" name="g_single" value="a" >
<span>A radio on its own</span>
</label></div>
<fieldset class="adm-fieldset">
<legend class="adm-label">Division</legend>
<div class="adm-radios">
<label class="adm-check">
<input type="radio" name="g_division" id="g_division_0" value="pro" checked >
<span>Professional</span>
</label>
<label class="adm-check">
<input type="radio" name="g_division" id="g_division_1" value="age" >
<span>Age group</span>
</label>
</div>
</fieldset></div>
Choice cards
Blade
<x-admin::choice-cards name="g_type" label="Perk type" value="percent" :options="[
'percent' => ['label' => 'Percentage discount', 'description' => 'A share off the entry price.', 'icon' => 'gift'],
'fixed' => ['label' => 'Fixed amount', 'description' => 'A set amount off.'],
'free' => ['label' => 'Free entry', 'description' => 'No charge for the event.'],
]" />
<x-admin::choice-cards name="g_channels" type="checkbox" label="Notify by" class="mt" :value="['email']" :options="['email' => 'Email', 'slack' => 'Slack', 'webhook' => 'Webhook']" min="9rem" />
HTML, for other stacks
<fieldset class="adm-fieldset adm-choice-cards">
<legend class="adm-label">Perk type</legend>
<div class="adm-choice-cards__grid" style="--_min:13rem">
<label class="adm-choice">
<input type="radio" class="adm-choice__input" name="g_type" id="g_type_0" value="percent" checked aria-describedby="g_type_0-description" >
<span class="adm-choice__body">
<svg class="adm-icon adm-choice__icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="8" width="18" height="4" rx="1"/><path d="M12 8v13M5 12v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-8M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5"/></svg> <span class="adm-choice__label">Percentage discount</span>
<span class="adm-choice__description" id="g_type_0-description">A share off the entry price.</span> </span>
</label>
<label class="adm-choice">
<input type="radio" class="adm-choice__input" name="g_type" id="g_type_1" value="fixed" aria-describedby="g_type_1-description" >
<span class="adm-choice__body">
<span class="adm-choice__label">Fixed amount</span>
<span class="adm-choice__description" id="g_type_1-description">A set amount off.</span> </span>
</label>
<label class="adm-choice">
<input type="radio" class="adm-choice__input" name="g_type" id="g_type_2" value="free" aria-describedby="g_type_2-description" >
<span class="adm-choice__body">
<span class="adm-choice__label">Free entry</span>
<span class="adm-choice__description" id="g_type_2-description">No charge for the event.</span> </span>
</label>
</div>
</fieldset>
<fieldset class="adm-fieldset adm-choice-cards mt">
<legend class="adm-label">Notify by</legend>
<div class="adm-choice-cards__grid" style="--_min:9rem">
<label class="adm-choice">
<input type="checkbox" class="adm-choice__input" name="g_channels[]" id="g_channels_0" value="email" checked >
<span class="adm-choice__body">
<span class="adm-choice__label">Email</span>
</span>
</label>
<label class="adm-choice">
<input type="checkbox" class="adm-choice__input" name="g_channels[]" id="g_channels_1" value="slack" >
<span class="adm-choice__body">
<span class="adm-choice__label">Slack</span>
</span>
</label>
<label class="adm-choice">
<input type="checkbox" class="adm-choice__input" name="g_channels[]" id="g_channels_2" value="webhook" >
<span class="adm-choice__body">
<span class="adm-choice__label">Webhook</span>
</span>
</label>
</div>
</fieldset>
Filterable checkbox list
Blade
<x-admin::checkbox-list name="g_segments" id="g_segments" label="Linked segments" :value="['s2']" :options="[
's1' => ['label' => 'Early entry', 'description' => '1,204 members'],
's2' => ['label' => 'Lapsed 2025', 'description' => '312 members'],
's3' => 'Club members',
's4' => 'Race kit buyers',
's5' => 'Recovery sessions',
]" />
HTML, for other stacks
<fieldset class="adm-fieldset adm-checkbox-list" data-adm-checkbox-list >
<legend class="adm-label">Linked segments</legend>
<div class="adm-checkbox-list__tools">
<input type="search" class="adm-input adm-checkbox-list__filter" data-adm-list-filter placeholder="Filter the list" aria-label="Filter the list" autocomplete="off"> <button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" data-adm-list-all="data-adm-list-all" >Select all</button>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" data-adm-list-none="data-adm-list-none" >Clear</button>
<span class="adm-checkbox-list__count adm-small adm-subtle" aria-live="polite" data-adm-list-count></span> </div>
<div class="adm-checkbox-list__items" style="max-height:16rem">
<label class="adm-check adm-checkbox-list__item">
<input type="checkbox" name="g_segments[]" id="g_segments_0" value="s1" >
<span><span>Early entry</span><span class="adm-checkbox-list__description">1,204 members</span></span>
</label>
<label class="adm-check adm-checkbox-list__item">
<input type="checkbox" name="g_segments[]" id="g_segments_1" value="s2" checked >
<span><span>Lapsed 2025</span><span class="adm-checkbox-list__description">312 members</span></span>
</label>
<label class="adm-check adm-checkbox-list__item">
<input type="checkbox" name="g_segments[]" id="g_segments_2" value="s3" >
<span><span>Club members</span></span>
</label>
<label class="adm-check adm-checkbox-list__item">
<input type="checkbox" name="g_segments[]" id="g_segments_3" value="s4" >
<span><span>Race kit buyers</span></span>
</label>
<label class="adm-check adm-checkbox-list__item">
<input type="checkbox" name="g_segments[]" id="g_segments_4" value="s5" >
<span><span>Recovery sessions</span></span>
</label>
<p class="adm-subtle adm-small" data-adm-list-empty hidden>No results</p>
</div>
</fieldset>
Repeater
Blade
<x-admin::repeater id="g-repeater" label="Notification channels" :max="4" add-label="Add channel" reorder hint="Up to 4 channels.">
<x-admin::repeater-row reorder>
<x-admin::form-grid>
<x-admin::select name="g_channels2[0][type]" label="Type" :options="['email' => 'Email', 'slack' => 'Slack']" />
<x-admin::input name="g_channels2[0][to]" label="Send to" value="ops@example.com" />
</x-admin::form-grid>
</x-admin::repeater-row>
<x-slot:template>
<x-admin::form-grid>
<x-admin::select name="g_channels2[__INDEX__][type]" label="Type" :options="['email' => 'Email', 'slack' => 'Slack']" />
<x-admin::input name="g_channels2[__INDEX__][to]" label="Send to" />
</x-admin::form-grid>
</x-slot:template>
</x-admin::repeater>
HTML, for other stacks
<fieldset class="adm-fieldset adm-repeater" id="g-repeater" data-adm-repeater data-min="0" data-max="4" >
<legend class="adm-label">Notification channels</legend>
<div class="adm-repeater__rows" data-adm-repeater-rows><div class="adm-repeater__row">
<div class="adm-repeater__fields"><div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_channels2_0_type">Type</label>
<select
name="g_channels2[0][type]" id="g_channels2_0_type" class="adm-select"
>
<option value="email" >Email</option>
<option value="slack" >Slack</option>
</select>
</div>
<div class="adm-field">
<label class="adm-label" for="g_channels2_0_to">Send to</label>
<input
type="text"
name="g_channels2[0][to]" id="g_channels2_0_to" value="ops@example.com" class="adm-input"
>
</div></div></div>
<div class="adm-repeater__actions">
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-up aria-label="Move up"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 19V5M5 12l7-7 7 7"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-down aria-label="Move down"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12l7 7 7-7"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-remove aria-label="Remove row"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg></button>
</div>
</div></div>
<template data-adm-repeater-template><div class="adm-repeater__row">
<div class="adm-repeater__fields"><div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_channels2___INDEX___type">Type</label>
<select
name="g_channels2[__INDEX__][type]" id="g_channels2___INDEX___type" class="adm-select"
>
<option value="email" >Email</option>
<option value="slack" >Slack</option>
</select>
</div>
<div class="adm-field">
<label class="adm-label" for="g_channels2___INDEX___to">Send to</label>
<input
type="text"
name="g_channels2[__INDEX__][to]" id="g_channels2___INDEX___to" class="adm-input"
>
</div></div></div>
<div class="adm-repeater__actions">
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-up aria-label="Move up"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 19V5M5 12l7-7 7 7"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-down aria-label="Move down"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12l7 7 7-7"/></svg></button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" data-adm-repeater-remove aria-label="Remove row"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg></button>
</div>
</div>
</template>
<div><button type="button" class="adm-btn adm-btn--secondary adm-btn--sm adm-repeater__add" data-adm-repeater-add="data-adm-repeater-add" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>Add channel</button>
</div>
<span class="adm-sr-only" aria-live="polite" data-adm-repeater-live></span>
<span class="adm-hint">Up to 4 channels.</span> </fieldset>
Condition builder layout
Group 1
Blade
<x-admin::condition-group match="all" match-name="g_match" label="Group 1">
<x-admin::condition-row>
<x-admin::select name="g_field" label="Field" :options="['country' => 'Country', 'age' => 'Age']" />
<x-admin::select name="g_op" label="Operator" :options="['is' => 'is', 'not' => 'is not']" />
<x-admin::input name="g_value" label="Value" value="NZ" />
<x-slot:actions><x-admin::button shape="square" icon="trash" aria-label="Remove condition" /></x-slot:actions>
</x-admin::condition-row>
<x-slot:actions><x-admin::button size="sm" icon="plus">Add condition</x-admin::button><x-admin::button size="sm" variant="ghost" icon="plus">Add group</x-admin::button></x-slot:actions>
</x-admin::condition-group>
HTML, for other stacks
<div class="adm-condition-group" role="group" aria-label="Group 1" >
<div class="adm-condition-group__head">
<span class="adm-condition-group__label">Group 1</span> <select
name="g_match" id="g_match" class="adm-select" style="width:auto;" aria-label="Match"
>
<option value="all" selected>All of these</option>
<option value="any" >Any of these</option>
</select>
</div>
<div class="adm-condition-group__rows"><div class="adm-condition-row">
<div class="adm-condition-row__fields"><div class="adm-field">
<label class="adm-label" for="g_field">Field</label>
<select
name="g_field" id="g_field" class="adm-select"
>
<option value="country" >Country</option>
<option value="age" >Age</option>
</select>
</div>
<div class="adm-field">
<label class="adm-label" for="g_op">Operator</label>
<select
name="g_op" id="g_op" class="adm-select"
>
<option value="is" >is</option>
<option value="not" >is not</option>
</select>
</div>
<div class="adm-field">
<label class="adm-label" for="g_value">Value</label>
<input
type="text"
name="g_value" id="g_value" value="NZ" class="adm-input"
>
</div></div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--secondary adm-btn--square" aria-label="Remove condition" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg></button></div></div></div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>Add condition</button>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--sm" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>Add group</button></div></div>
File input
Blade
<x-admin::file-input name="g_portrait" label="Portrait" accept="image/*" hint="Pick an image to see the thumbnail." />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_portrait">Portrait</label>
<div class="adm-file">
<img class="adm-file__preview" data-adm-file-preview alt="" hidden >
<input
type="file"
name="g_portrait" id="g_portrait" accept="image/*" aria-describedby="g_portrait-hint" class="adm-file__input"
>
</div>
<span class="adm-hint" id="g_portrait-hint">Pick an image to see the thumbnail.</span> </div>
Sensitive input
Blade
<x-admin::sensitive-input name="g_key" label="API key" stored hint="Never printed back to the page." />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_key">API key</label>
<div class="adm-input-group">
<input
type="password"
autocomplete="new-password"
spellcheck="false"
name="g_key" id="g_key" placeholder="Saved. Leave blank to keep it." aria-describedby="g_key-hint" class="adm-input"
>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm adm-input-group__action" data-adm-reveal aria-pressed="false" aria-label="Show value"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/></svg></button>
</div>
<span class="adm-hint" id="g_key-hint">Never printed back to the page.</span> </div>
Slider
Blade
<x-admin::slider name="g_retries" label="Retries" value="3" min="0" max="10" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_retries">Retries</label>
<div class="adm-slider" data-adm-slider>
<input type="range" name="g_retries" id="g_retries" value="3" min="0" max="10" step="1" >
<output for="g_retries" >3</output>
</div>
</div>
One-time code
Blade
<x-admin::otp name="g_code" label="Enter the 6-digit code" />
<x-admin::otp-resend action="#" :after="30" class="mt" id="g-resend" />
HTML, for other stacks
<div class="adm-field">
<label class="adm-label" for="g_code">Enter the 6-digit code</label>
<input
type="text"
name="g_code"
id="g_code" autocomplete="one-time-code"
maxlength="6"
inputmode="numeric" pattern="[0-9]*" required class="adm-input adm-otp" style="--_len:6;"
>
</div>
<form method="POST" action="#" class="adm-otp-resend mt" id="g-resend">
<input type="hidden" name="_token" value="NoOq1NDOSaxETp57KkznvPzdMYClXXpNNbaDv1LY" autocomplete="off"> <button type="submit" class="adm-btn adm-btn--link" data-adm-countdown="30" ><span class="adm-countdown__label">Resend code</span></button>
<span class="adm-sr-only" aria-live="polite" data-adm-countdown-live></span>
</form>
Label and field
field wraps any control with a hint and an error.
Blade
<x-admin::stack gap="2">
<x-admin::label for="g_custom" optional>A label on its own</x-admin::label>
<x-admin::field for="g_custom" hint="field wraps any control with a hint and an error.">
<input class="adm-input" id="g_custom">
</x-admin::field>
</x-admin::stack>
HTML, for other stacks
<div class="adm-stack" style="gap:var(--ad-space-2)"><label class="adm-label" for="g_custom">A label on its own <span class="adm-label__optional">(optional)</span></label>
<div class="adm-field">
<input class="adm-input" id="g_custom">
<span class="adm-hint" id="g_custom-hint">field wraps any control with a hint and an error.</span> </div></div>
Form, form grid, form actions
Blade
<x-admin::form action="/segments" method="PUT" files>
<x-admin::form-grid>
<x-admin::input name="g_first" label="First name" />
<x-admin::input name="g_last" label="Last name" />
</x-admin::form-grid>
<x-admin::form-actions class="mt">
<x-admin::button>Cancel</x-admin::button>
<x-admin::button variant="primary" type="button">Save changes</x-admin::button>
</x-admin::form-actions>
</x-admin::form>
HTML, for other stacks
<form method="POST" action="/segments" enctype="multipart/form-data" >
<input type="hidden" name="_token" value="NoOq1NDOSaxETp57KkznvPzdMYClXXpNNbaDv1LY" autocomplete="off"> <input type="hidden" name="_method" value="PUT"> <div class="adm-form-grid"><div class="adm-field">
<label class="adm-label" for="g_first">First name</label>
<input
type="text"
name="g_first" id="g_first" class="adm-input"
>
</div>
<div class="adm-field">
<label class="adm-label" for="g_last">Last name</label>
<input
type="text"
name="g_last" id="g_last" class="adm-input"
>
</div></div>
<div class="adm-form-actions mt"><button type="button" class="adm-btn adm-btn--secondary" >Cancel</button>
<button type="button" class="adm-btn adm-btn--primary" >Save changes</button></div>
</form>
Save bar
Blade
<form>
<x-admin::input name="g_edit_me" label="Edit this field to see the status change" />
<x-admin::save-bar status="Saving keeps a draft." class="mt" style="position:static">
<x-admin::button variant="primary" type="button">Save draft</x-admin::button>
</x-admin::save-bar>
</form>
HTML, for other stacks
<form>
<div class="adm-field">
<label class="adm-label" for="g_edit_me">Edit this field to see the status change</label>
<input
type="text"
name="g_edit_me" id="g_edit_me" class="adm-input"
>
</div>
<div class="adm-save-bar mt" style="position:static;">
<span class="adm-save-bar__status" data-adm-dirty-text="Unsaved changes">Saving keeps a draft.</span>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--primary" >Save draft</button></div>
</div>
</form>
Data
Table with sorting and bulk actions
Blade
<div data-adm-selectable>
<x-admin::table>
<x-slot:toolbar>
<x-admin::input name="g_q" type="search" icon="search" placeholder="Filter by name" aria-label="Filter by name" />
<x-admin::select name="g_status" aria-label="Status" placeholder="All statuses" :options="['Synced', 'Failing']" style="width:auto" />
</x-slot:toolbar>
<x-admin::bulk-actions>
<x-admin::button size="sm">Rebuild</x-admin::button>
<x-admin::button size="sm" variant="destructive">Delete</x-admin::button>
</x-admin::bulk-actions>
<x-slot:head>
<x-admin::select-all />
<x-admin::th sort="name">Name</x-admin::th>
<x-admin::th sort="members" numeric>Members</x-admin::th>
<x-admin::th>Status</x-admin::th>
<th class="adm-shrink"><span class="adm-sr-only">Actions</span></th>
</x-slot:head>
<tr>
<x-admin::row-checkbox value="1" label="Select Lapsed members" />
<td>Lapsed members</td><td class="adm-num">8,412</td>
<td><x-admin::badge variant="success" dot>Synced</x-admin::badge></td>
<td class="adm-shrink"></td>
</tr>
<tr>
<x-admin::row-checkbox value="2" label="Select Volunteers" />
<td>Volunteers</td><td class="adm-num">642</td>
<td><x-admin::badge variant="destructive" dot>Failing</x-admin::badge></td>
<td class="adm-shrink">
<x-admin::dropdown sr-label="Actions for Volunteers" data-row-menu>
<x-admin::dropdown-item href="#" icon="edit">Edit rule</x-admin::dropdown-item>
<x-admin::dropdown-item icon="trash" destructive>Delete</x-admin::dropdown-item>
</x-admin::dropdown>
</td>
</tr>
<x-slot:footer><x-admin::pagination :paginator="$paginator" numbers :per-page="[10, 20, 50, 100]" per-page-auto-submit /></x-slot:footer>
</x-admin::table>
</div>
HTML, for other stacks
<div data-adm-selectable>
<div class="adm-card adm-card--flush">
<div class="adm-table-toolbar"><div class="adm-input-group"> <span class="adm-input-group__addon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg></span> <input
type="search"
name="g_q" id="g_q" class="adm-input" placeholder="Filter by name" aria-label="Filter by name"
>
</div>
<select
name="g_status" id="g_status" class="adm-select" style="width:auto;" aria-label="Status"
>
<option value="">All statuses</option> <option value="Synced" >Synced</option>
<option value="Failing" >Failing</option>
</select></div> <div class="adm-table-wrap">
<table class="adm-table">
<thead><tr><th class="adm-shrink" scope="col"><label class="adm-check"><input type="checkbox" data-adm-select-all aria-label="Select all rows" ></label></th>
<th class="" scope="col">
<a href="?sort=name&direction=asc">Name<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></a>
</th>
<th class="adm-num" scope="col">
<a href="?sort=members&direction=asc">Members<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></a>
</th>
<th class="" scope="col">
Status
</th>
<th class="adm-shrink"><span class="adm-sr-only">Actions</span></th></tr></thead> <tbody><div class="adm-bulk" data-adm-bulk hidden>
<span class="adm-bulk__count"><span data-adm-selected-count>0</span> selected</span>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" >Rebuild</button>
<button type="button" class="adm-btn adm-btn--destructive adm-btn--sm" >Delete</button>
</div>
<tr>
<td class="adm-shrink"><label class="adm-check"><input type="checkbox" name="ids[]" value="1" data-adm-row-check aria-label="Select Lapsed members" ></label></td>
<td>Lapsed members</td><td class="adm-num">8,412</td>
<td><span class="adm-badge adm-badge--success adm-badge--dot">Synced</span>
</td>
<td class="adm-shrink"></td>
</tr>
<tr>
<td class="adm-shrink"><label class="adm-check"><input type="checkbox" name="ids[]" value="2" data-adm-row-check aria-label="Select Volunteers" ></label></td>
<td>Volunteers</td><td class="adm-num">642</td>
<td><span class="adm-badge adm-badge--destructive adm-badge--dot">Failing</span>
</td>
<td class="adm-shrink">
<details class="adm-dropdown" data-row-menu="data-row-menu">
<summary class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm" aria-label="Actions for Volunteers"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="5" cy="12" r="1.2" fill="currentColor"/><circle cx="12" cy="12" r="1.2" fill="currentColor"/><circle cx="19" cy="12" r="1.2" fill="currentColor"/></svg></summary>
<div class="adm-menu"><a href="#" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg>Edit rule</a>
<button type="button" class="adm-menu__item adm-menu__item--destructive"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg>Delete</button></div>
</details>
</td>
</tr></tbody>
</table>
</div>
<nav class="adm-pagination" aria-label="Pagination">
<span>
Showing 21–40 of 240
</span>
<form method="GET" class="adm-pagination__size" data-adm-autosubmit >
<label class="adm-small" for="per_page-size">Rows per page</label>
<select class="adm-select adm-select--sm" id="per_page-size" name="per_page">
<option value="10" >10</option><option value="20" selected>20</option><option value="50" >50</option><option value="100" >100</option> </select>
<button type="submit" class="adm-btn adm-btn--sm" data-adm-autosubmit-apply>Apply</button>
</form>
<div class="adm-btn-group">
<a class="adm-btn adm-btn--sm" href="/segments?page=1" rel="prev">Previous</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=1" >1</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=2" aria-current="page" >2</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=3" >3</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=4" >4</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=5" >5</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=6" >6</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=7" >7</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=8" >8</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=9" >9</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=10" >10</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=11" >11</a> <a class="adm-btn adm-btn--sm adm-pagination__page" href="/segments?page=12" >12</a> <a class="adm-btn adm-btn--sm" href="/segments?page=3" rel="next">Next</a> </div>
</nav></div>
</div>
Empty table
No segments yet
Segments group members and push them to your platforms.
Blade
<x-admin::table :is-empty="true">
<x-slot:empty><x-admin::empty title="No segments yet" description="Segments group members and push them to your platforms." icon="layers"><x-slot:actions><x-admin::button variant="primary" icon="plus">New segment</x-admin::button></x-slot:actions></x-admin::empty></x-slot:empty>
</x-admin::table>
HTML, for other stacks
<div class="adm-card adm-card--flush">
<div class="adm-table-wrap">
<div class="adm-empty">
<div class="adm-empty__icon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 3 9 5-9 5-9-5z"/><path d="m3 13 9 5 9-5"/></svg></div>
<div class="adm-empty__text">
<h3 class="adm-heading">No segments yet</h3>
<p>Segments group members and push them to your platforms.</p> </div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--primary" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>New segment</button></div></div> </div>
</div>
Expandable table rows
| Platform | Status | |
|---|---|---|
| Njuko | Active | |
| Last synced 4 minutes ago. Sends entry_granted. | ||
Blade
<x-admin::table>
<x-slot:head><th class="adm-shrink"></th><th>Platform</th><th>Status</th></x-slot:head>
<tr>
<td class="adm-shrink"><x-admin::row-toggle for="g-row-1" label="Show details for Njuko" /></td>
<td>Njuko</td>
<td><x-admin::badge variant="success" dot>Active</x-admin::badge></td>
</tr>
<x-admin::row-details id="g-row-1" :colspan="3">Last synced 4 minutes ago. Sends entry_granted.</x-admin::row-details>
</x-admin::table>
HTML, for other stacks
<div class="adm-card adm-card--flush">
<div class="adm-table-wrap">
<table class="adm-table">
<thead><tr><th class="adm-shrink"></th><th>Platform</th><th>Status</th></tr></thead> <tbody><tr>
<td class="adm-shrink"><button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--sm adm-row-toggle" data-adm-expand="g-row-1" aria-expanded="false" aria-controls="g-row-1" aria-label="Show details for Njuko"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg></button>
</td>
<td>Njuko</td>
<td><span class="adm-badge adm-badge--success adm-badge--dot">Active</span>
</td>
</tr>
<tr id="g-row-1" class="adm-table__details" ><td colspan="3">Last synced 4 minutes ago. Sends entry_granted.</td></tr></tbody>
</table>
</div>
</div>
Rule summary
All of these
-
SSoT
user.countryis NZ -
Any of these
-
user.ageover 40 -
entries.countat least 3
-
Blade
<x-admin::rule-summary :rules="['match' => 'all', 'conditions' => [
['source' => 'SSoT', 'field' => 'user.country', 'operator' => 'is', 'value' => 'NZ'],
['match' => 'any', 'conditions' => [
['field' => 'user.age', 'operator' => 'over', 'value' => 40],
['field' => 'entries.count', 'operator' => 'at least', 'value' => 3],
]],
]]" />
HTML, for other stacks
<div class="adm-rule-summary">
<span class="adm-badge adm-badge--neutral">All of these</span>
<ul class="adm-rule-summary__list">
<li>
<span class="adm-rule-summary__condition">
<span class="adm-badge adm-badge--outline">SSoT</span>
<code class="adm-code">user.country</code>
<span class="adm-subtle">is</span>
<strong class="adm-rule-summary__value">NZ</strong> </span>
</li>
<li>
<div class="adm-rule-summary adm-rule-summary--nested">
<span class="adm-badge adm-badge--neutral">Any of these</span>
<ul class="adm-rule-summary__list">
<li>
<span class="adm-rule-summary__condition">
<code class="adm-code">user.age</code>
<span class="adm-subtle">over</span>
<strong class="adm-rule-summary__value">40</strong> </span>
</li>
<li>
<span class="adm-rule-summary__condition">
<code class="adm-code">entries.count</code>
<span class="adm-subtle">at least</span>
<strong class="adm-rule-summary__value">3</strong> </span>
</li>
</ul>
</div>
</li>
</ul>
</div>
Before and after
| Field | Before | After |
|---|---|---|
| Status | Active | |
| owner | Dan | |
| note | - | |
| budget | - | 500 |
Blade
<x-admin::diff id="g-diff" :labels="['status' => 'Status', 'priority' => 'Priority']" :before="['status' => 'Draft', 'priority' => 80, 'owner' => 'Rina', 'note' => 'Old note']" :after="['status' => 'Active', 'priority' => 80, 'owner' => 'Dan', 'budget' => 500]" />
HTML, for other stacks
<div class="adm-table-wrap adm-diff" id="g-diff">
<table class="adm-table">
<thead><tr><th scope="col">Field</th><th scope="col">Before</th><th scope="col">After</th></tr></thead>
<tbody>
<tr>
<th scope="row">Status</th>
<td><del class="adm-diff__old">Draft</del></td>
<td><ins class="adm-diff__new">Active</ins></td>
</tr>
<tr>
<th scope="row">owner</th>
<td><del class="adm-diff__old">Rina</del></td>
<td><ins class="adm-diff__new">Dan</ins></td>
</tr>
<tr>
<th scope="row">note</th>
<td><del class="adm-diff__old">Old note</del></td>
<td> - </td>
</tr>
<tr>
<th scope="row">budget</th>
<td> - </td>
<td><ins class="adm-diff__new">500</ins></td>
</tr>
</tbody>
</table>
</div>
Detail list
- ID
- seg_lapsed_2025
- Owner
- Example Admin
- Notes
- -
- Per-user limit
- 1
- Global limit
- 500
- Scope
- Once per event
- Track redemption
- On
Blade
<x-admin::dl :items="['ID' => 'seg_lapsed_2025', 'Owner' => 'Example Admin', 'Notes' => null]" />
<x-admin::dl :columns="2" class="mt" :items="['Per-user limit' => '1', 'Global limit' => '500', 'Scope' => 'Once per event', 'Track redemption' => 'On']" />
HTML, for other stacks
<dl class="adm-dl">
<dt>ID</dt>
<dd>seg_lapsed_2025</dd>
<dt>Owner</dt>
<dd>Example Admin</dd>
<dt>Notes</dt>
<dd>-</dd>
</dl>
<dl class="adm-dl adm-dl--cols-2 mt">
<dt>Per-user limit</dt>
<dd>1</dd>
<dt>Global limit</dt>
<dd>500</dd>
<dt>Scope</dt>
<dd>Once per event</dd>
<dt>Track redemption</dt>
<dd>On</dd>
</dl>
Item list
Salesforce
Last synced 4 minutes ago
Healthy
Google Sheets
Quota exceeded
Degraded
Blade
<x-admin::item title="Salesforce" description="Last synced 4 minutes ago" icon="plug">
<x-slot:actions><x-admin::badge variant="success" dot>Healthy</x-admin::badge></x-slot:actions>
</x-admin::item>
<x-admin::item title="Google Sheets" description="Quota exceeded" icon="plug" href="#">
<x-slot:actions><x-admin::badge variant="warning" dot>Degraded</x-admin::badge></x-slot:actions>
</x-admin::item>
HTML, for other stacks
<div class="adm-item">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0zM12 18v4"/></svg> <span class="adm-item__text">
<span class="adm-item__title">Salesforce</span>
<span class="adm-item__description">Last synced 4 minutes ago</span>
</span>
<span class="adm-row"><span class="adm-badge adm-badge--success adm-badge--dot">Healthy</span></span></div>
<a class="adm-item" href="#">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0zM12 18v4"/></svg> <span class="adm-item__text">
<span class="adm-item__title">Google Sheets</span>
<span class="adm-item__description">Quota exceeded</span>
</span>
<span class="adm-row"><span class="adm-badge adm-badge--warning adm-badge--dot">Degraded</span></span></a>
Stat
Active members
48,213
Failed runs
3
Blade
<x-admin::grid min="11rem" equal>
<x-admin::stat label="Active members" value="48,213" delta="+2.4%" trend="up" meta="vs last week" />
<x-admin::stat label="Failed runs" value="3" delta="+3" trend="down" meta="in 24 hours" />
<x-admin::stat label="Admins" value="6" icon="users" tone="brand" />
<x-admin::stat label="Alert events" value="3" icon="alert" tone="danger" meta="last 24 hours" />
</x-admin::grid>
HTML, for other stacks
<div style="--_min:11rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid adm-grid--equal"><div class="adm-card adm-stat">
<span class="adm-stat__label">Active members</span>
<span class="adm-stat__value">48,213</span>
<span class="adm-stat__meta">
<span class="adm-delta--up">+2.4%</span> vs last week
</span>
</div>
<div class="adm-card adm-stat">
<span class="adm-stat__label">Failed runs</span>
<span class="adm-stat__value">3</span>
<span class="adm-stat__meta">
<span class="adm-delta--down">+3</span> in 24 hours
</span>
</div>
<div class="adm-card adm-stat adm-stat--icon">
<span class="adm-stat__icon adm-stat__icon--brand"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="9" cy="8" r="4"/><path d="M2 21a7 7 0 0 1 14 0M16 3.5a4 4 0 0 1 0 9M22 21a7 7 0 0 0-4-6.3"/></svg></span><span class="adm-stat__body"> <span class="adm-stat__label">Admins</span>
<span class="adm-stat__value">6</span>
</span></div>
<div class="adm-card adm-stat adm-stat--icon">
<span class="adm-stat__icon adm-stat__icon--danger"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg></span><span class="adm-stat__body"> <span class="adm-stat__label">Alert events</span>
<span class="adm-stat__value">3</span>
<span class="adm-stat__meta">
last 24 hours
</span>
</span></div></div>
Bar list
Blade
<x-admin::bar-list id="g-bars" :items="[
['label' => 'Early entry discount', 'value' => 812, 'href' => '#', 'meta' => 'Njuko'],
['label' => 'Race kit bundle', 'value' => 240, 'meta' => 'Webhook site'],
['label' => 'Recovery session', 'value' => 96],
]" />
HTML, for other stacks
<ul class="adm-bar-list" id="g-bars">
<li class="adm-bar-list__item">
<span class="adm-bar-list__row">
<a class="adm-bar-list__label" href="#">Early entry discount</a> <span class="adm-bar-list__value">812</span>
</span>
<span class="adm-bar-list__meta">Njuko</span> <span class="adm-bar-list__bar" aria-hidden="true"><span style="width:100%"></span></span>
</li>
<li class="adm-bar-list__item">
<span class="adm-bar-list__row">
<span class="adm-bar-list__label">Race kit bundle</span> <span class="adm-bar-list__value">240</span>
</span>
<span class="adm-bar-list__meta">Webhook site</span> <span class="adm-bar-list__bar" aria-hidden="true"><span style="width:29.6%"></span></span>
</li>
<li class="adm-bar-list__item">
<span class="adm-bar-list__row">
<span class="adm-bar-list__label">Recovery session</span> <span class="adm-bar-list__value">96</span>
</span>
<span class="adm-bar-list__bar" aria-hidden="true"><span style="width:11.8%"></span></span>
</li>
</ul>
Checklist
- Passed: Webhook URL set https://hooks.example.com/perks
- Warning: Event list is empty The API returns no events for this perk.
- Failed: Required field missing event_id
- Pending: Partner response
Blade
<x-admin::checklist :items="[
['label' => 'Webhook URL set', 'status' => 'pass', 'detail' => 'https://hooks.example.com/perks'],
['label' => 'Event list is empty', 'status' => 'warn', 'detail' => 'The API returns no events for this perk.'],
['label' => 'Required field missing', 'status' => 'fail', 'detail' => 'event_id'],
['label' => 'Partner response', 'status' => 'pending'],
]" />
HTML, for other stacks
<ul class="adm-checklist">
<li class="adm-checklist__item adm-checklist__item--pass">
<svg class="adm-icon adm-checklist__icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m8 12 3 3 5-6"/></svg> <span class="adm-checklist__text">
<span class="adm-sr-only">Passed:</span>
<span class="adm-checklist__label">Webhook URL set</span>
<span class="adm-checklist__detail">https://hooks.example.com/perks</span> </span>
</li>
<li class="adm-checklist__item adm-checklist__item--warn">
<svg class="adm-icon adm-checklist__icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg> <span class="adm-checklist__text">
<span class="adm-sr-only">Warning:</span>
<span class="adm-checklist__label">Event list is empty</span>
<span class="adm-checklist__detail">The API returns no events for this perk.</span> </span>
</li>
<li class="adm-checklist__item adm-checklist__item--fail">
<svg class="adm-icon adm-checklist__icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m15 9-6 6M9 9l6 6"/></svg> <span class="adm-checklist__text">
<span class="adm-sr-only">Failed:</span>
<span class="adm-checklist__label">Required field missing</span>
<span class="adm-checklist__detail">event_id</span> </span>
</li>
<li class="adm-checklist__item adm-checklist__item--pending">
<svg class="adm-icon adm-checklist__icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg> <span class="adm-checklist__text">
<span class="adm-sr-only">Pending:</span>
<span class="adm-checklist__label">Partner response</span>
</span>
</li>
</ul>
Timeline
-
Rebuild finished12,480 members, 312 more than before.
-
Sheet export failedQuota exceeded. Retrying in 15 minutes.
-
Segment created by Rina Halim
Blade
<x-admin::timeline>
<x-admin::timeline-item title="Rebuild finished" time="09:42" datetime="2026-11-06T09:42" icon="check" tone="success">12,480 members, 312 more than before.</x-admin::timeline-item>
<x-admin::timeline-item title="Sheet export failed" time="09:15" datetime="2026-11-06T09:15" icon="alert" tone="danger">Quota exceeded. Retrying in 15 minutes.</x-admin::timeline-item>
<x-admin::timeline-item title="Segment created by Rina Halim" time="Yesterday" />
</x-admin::timeline>
HTML, for other stacks
<ol class="adm-timeline"><li class="adm-timeline__item">
<span class="adm-timeline__marker adm-timeline__marker--success" aria-hidden="true"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m8 12 3 3 5-6"/></svg></span>
<div class="adm-timeline__body">
<div class="adm-timeline__head">
<span class="adm-timeline__title">Rebuild finished</span>
<time class="adm-timeline__time" datetime="2026-11-06T09:42" >09:42</time> </div>
<div class="adm-timeline__text">12,480 members, 312 more than before.</div> </div>
</li>
<li class="adm-timeline__item">
<span class="adm-timeline__marker adm-timeline__marker--danger" aria-hidden="true"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg></span>
<div class="adm-timeline__body">
<div class="adm-timeline__head">
<span class="adm-timeline__title">Sheet export failed</span>
<time class="adm-timeline__time" datetime="2026-11-06T09:15" >09:15</time> </div>
<div class="adm-timeline__text">Quota exceeded. Retrying in 15 minutes.</div> </div>
</li>
<li class="adm-timeline__item">
<span class="adm-timeline__marker adm-timeline__marker--neutral" aria-hidden="true"></span>
<div class="adm-timeline__body">
<div class="adm-timeline__head">
<span class="adm-timeline__title">Segment created by Rina Halim</span>
<time class="adm-timeline__time" >Yesterday</time> </div>
</div>
</li></ol>
Bar chart
View as table
| Value | |
|---|---|
| Mon | 120 |
| Tue | 180 |
| Wed | 150 |
| Thu | 210 |
| Fri | 95 |
Succeeded
Failed
View as table
| Succeeded | Failed | |
|---|---|---|
| Mon | 171 | 2 |
| Tue | 168 | 1 |
| Wed | 180 | 0 |
| Thu | 176 | 3 |
| Fri | 149 | 24 |
Blade
<x-admin::grid min="20rem">
<x-admin::bar-chart title="Sign-ups per day" :data="['Mon' => 120, 'Tue' => 180, 'Wed' => 150, 'Thu' => 210, 'Fri' => 95]" />
<x-admin::bar-chart title="Sync runs" :labels="['Mon', 'Tue', 'Wed', 'Thu', 'Fri']" :series="['Succeeded' => [171, 168, 180, 176, 149], 'Failed' => [2, 1, 0, 3, 24]]" />
</x-admin::grid>
HTML, for other stacks
<div style="--_min:20rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid"><figure class="adm-chart" style="--_h:10rem">
<div class="adm-chart__plot" role="img" tabindex="0" data-adm-chart aria-label="Sign-ups per day. 5 values from 95 to 210">
<div class="adm-chart__y" aria-hidden="true">
<span style="--_at:0%">0</span>
<span style="--_at:33.333%">100</span>
<span style="--_at:66.667%">200</span>
<span style="--_at:100%">300</span>
</div>
<div class="adm-chart__area">
<div class="adm-chart__grid" style="--_at:33.333%"></div> <div class="adm-chart__grid" style="--_at:66.667%"></div> <div class="adm-chart__grid" style="--_at:100%"></div> <div class="adm-chart__col" data-adm-hint="Mon: 120">
<div class="adm-chart__bar" style="height:40%;background-color:var(--ad-chart-brand)" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Tue: 180">
<div class="adm-chart__bar" style="height:60%;background-color:var(--ad-chart-brand)" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Wed: 150">
<div class="adm-chart__bar" style="height:50%;background-color:var(--ad-chart-brand)" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Thu: 210">
<div class="adm-chart__bar" style="height:70%;background-color:var(--ad-chart-brand)" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Fri: 95">
<div class="adm-chart__bar" style="height:31.667%;background-color:var(--ad-chart-brand)" ></div>
</div>
</div>
<div class="adm-chart__x" aria-hidden="true" data-dense >
<span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span> </div>
</div>
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Sign-ups per day</caption>
<thead><tr><th scope="col"></th><th scope="col" class="adm-num">Value</th></tr></thead>
<tbody>
<tr><th scope="row">Mon</th><td class="adm-num">120</td></tr>
<tr><th scope="row">Tue</th><td class="adm-num">180</td></tr>
<tr><th scope="row">Wed</th><td class="adm-num">150</td></tr>
<tr><th scope="row">Thu</th><td class="adm-num">210</td></tr>
<tr><th scope="row">Fri</th><td class="adm-num">95</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure>
<figure class="adm-chart" style="--_h:10rem">
<div class="adm-chart__legend">
<span class="adm-chart__key"><i style="background-color:var(--ad-chart-1)" ></i>Succeeded</span>
<span class="adm-chart__key"><i style="background-color:var(--ad-chart-2)" data-pattern="1" ></i>Failed</span>
</div>
<div class="adm-chart__plot" role="img" tabindex="0" data-adm-chart aria-label="Sync runs. 5 values from 169 to 180">
<div class="adm-chart__y" aria-hidden="true">
<span style="--_at:0%">0</span>
<span style="--_at:25%">50</span>
<span style="--_at:50%">100</span>
<span style="--_at:75%">150</span>
<span style="--_at:100%">200</span>
</div>
<div class="adm-chart__area">
<div class="adm-chart__grid" style="--_at:25%"></div> <div class="adm-chart__grid" style="--_at:50%"></div> <div class="adm-chart__grid" style="--_at:75%"></div> <div class="adm-chart__grid" style="--_at:100%"></div> <div class="adm-chart__col" data-adm-hint="Mon: Succeeded 171, Failed 2">
<div class="adm-chart__bar" style="height:85.5%;background-color:var(--ad-chart-1)" ></div>
<div class="adm-chart__bar" style="height:1%;background-color:var(--ad-chart-2)" data-pattern="1" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Tue: Succeeded 168, Failed 1">
<div class="adm-chart__bar" style="height:84%;background-color:var(--ad-chart-1)" ></div>
<div class="adm-chart__bar" style="height:0.5%;background-color:var(--ad-chart-2)" data-pattern="1" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Wed: Succeeded 180, Failed 0">
<div class="adm-chart__bar" style="height:90%;background-color:var(--ad-chart-1)" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Thu: Succeeded 176, Failed 3">
<div class="adm-chart__bar" style="height:88%;background-color:var(--ad-chart-1)" ></div>
<div class="adm-chart__bar" style="height:1.5%;background-color:var(--ad-chart-2)" data-pattern="1" ></div>
</div>
<div class="adm-chart__col" data-adm-hint="Fri: Succeeded 149, Failed 24">
<div class="adm-chart__bar" style="height:74.5%;background-color:var(--ad-chart-1)" ></div>
<div class="adm-chart__bar" style="height:12%;background-color:var(--ad-chart-2)" data-pattern="1" ></div>
</div>
</div>
<div class="adm-chart__x" aria-hidden="true" data-dense >
<span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span> </div>
</div>
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Sync runs</caption>
<thead><tr><th scope="col"></th><th scope="col" class="adm-num">Succeeded</th><th scope="col" class="adm-num">Failed</th></tr></thead>
<tbody>
<tr><th scope="row">Mon</th><td class="adm-num">171</td><td class="adm-num">2</td></tr>
<tr><th scope="row">Tue</th><td class="adm-num">168</td><td class="adm-num">1</td></tr>
<tr><th scope="row">Wed</th><td class="adm-num">180</td><td class="adm-num">0</td></tr>
<tr><th scope="row">Thu</th><td class="adm-num">176</td><td class="adm-num">3</td></tr>
<tr><th scope="row">Fri</th><td class="adm-num">149</td><td class="adm-num">24</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure></div>
Line chart
View as table
| Members | |
|---|---|
| Jan | 410 |
| Feb | 455 |
| Mar | 470 |
| Apr | 530 |
| May | 610 |
| Jun | 680 |
Sign-ups
Renewals
View as table
| Sign-ups | Renewals | |
|---|---|---|
| Jan | 120 | 80 |
| Feb | 180 | 95 |
| Mar | 150 | 110 |
| Apr | - | 105 |
| May | 210 | 130 |
| Jun | 240 | 150 |
Blade
<x-admin::grid min="20rem">
<x-admin::line-chart title="Members" area :data="['Jan' => 410, 'Feb' => 455, 'Mar' => 470, 'Apr' => 530, 'May' => 610, 'Jun' => 680]" />
<x-admin::line-chart title="Sign-ups and renewals" :labels="['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']" :series="['Sign-ups' => [120, 180, 150, null, 210, 240], 'Renewals' => [80, 95, 110, 105, 130, 150]]" />
</x-admin::grid>
HTML, for other stacks
<div style="--_min:20rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid"><figure class="adm-chart" style="--_h:10rem">
<div class="adm-chart__plot" role="img" tabindex="0" data-adm-chart aria-label="Members. 6 values from 410 to 680">
<div class="adm-chart__y" aria-hidden="true">
<span style="--_at:0%">0</span>
<span style="--_at:25%">200</span>
<span style="--_at:50%">400</span>
<span style="--_at:75%">600</span>
<span style="--_at:100%">800</span>
</div>
<div class="adm-chart__area adm-chart__area--line">
<div class="adm-chart__grid" style="--_at:25%"></div> <div class="adm-chart__grid" style="--_at:50%"></div> <div class="adm-chart__grid" style="--_at:75%"></div> <div class="adm-chart__grid" style="--_at:100%"></div> <svg class="adm-chart__lines" viewBox="0 0 100 100" preserveAspectRatio="none" aria-hidden="true">
<polygon points="0,100 0,48.75 20,43.125 40,41.25 60,33.75 80,23.75 100,15 100,100" fill="var(--ad-chart-brand)" fill-opacity="0.1" />
<polyline points="0,48.75 20,43.125 40,41.25 60,33.75 80,23.75 100,15" fill="none" stroke="var(--ad-chart-brand)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" vector-effect="non-scaling-stroke" />
</svg>
<span class="adm-chart__dot" style="left:100%;bottom:85%;background:var(--ad-chart-brand)"></span>
<div class="adm-chart__hit" style="left:0%;width:20%" data-adm-hint="Jan: 410"></div>
<div class="adm-chart__hit" style="left:20%;width:20%" data-adm-hint="Feb: 455"></div>
<div class="adm-chart__hit" style="left:40%;width:20%" data-adm-hint="Mar: 470"></div>
<div class="adm-chart__hit" style="left:60%;width:20%" data-adm-hint="Apr: 530"></div>
<div class="adm-chart__hit" style="left:80%;width:20%" data-adm-hint="May: 610"></div>
<div class="adm-chart__hit" style="left:100%;width:20%" data-adm-hint="Jun: 680"></div>
</div>
<div class="adm-chart__x" aria-hidden="true" data-sparse data-dense >
<span>Jan</span><span>Feb</span><span>Mar</span><span>Apr</span><span>May</span><span>Jun</span> </div>
</div>
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Members</caption>
<thead><tr><th scope="col"></th><th scope="col" class="adm-num">Members</th></tr></thead>
<tbody>
<tr><th scope="row">Jan</th><td class="adm-num">410</td></tr>
<tr><th scope="row">Feb</th><td class="adm-num">455</td></tr>
<tr><th scope="row">Mar</th><td class="adm-num">470</td></tr>
<tr><th scope="row">Apr</th><td class="adm-num">530</td></tr>
<tr><th scope="row">May</th><td class="adm-num">610</td></tr>
<tr><th scope="row">Jun</th><td class="adm-num">680</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure>
<figure class="adm-chart" style="--_h:10rem">
<div class="adm-chart__legend">
<span class="adm-chart__key"><svg width="20" height="4" viewBox="0 0 20 4" aria-hidden="true"><line x1="1" y1="2" x2="19" y2="2" stroke="var(--ad-chart-1)" stroke-width="2" stroke-linecap="round" /></svg>Sign-ups</span>
<span class="adm-chart__key"><svg width="20" height="4" viewBox="0 0 20 4" aria-hidden="true"><line x1="1" y1="2" x2="19" y2="2" stroke="var(--ad-chart-2)" stroke-width="2" stroke-linecap="round" stroke-dasharray="6 4" /></svg>Renewals</span>
</div>
<div class="adm-chart__plot" role="img" tabindex="0" data-adm-chart aria-label="Sign-ups and renewals. 6 values from 80 to 240">
<div class="adm-chart__y" aria-hidden="true">
<span style="--_at:0%">0</span>
<span style="--_at:33.333%">100</span>
<span style="--_at:66.667%">200</span>
<span style="--_at:100%">300</span>
</div>
<div class="adm-chart__area adm-chart__area--line">
<div class="adm-chart__grid" style="--_at:33.333%"></div> <div class="adm-chart__grid" style="--_at:66.667%"></div> <div class="adm-chart__grid" style="--_at:100%"></div> <svg class="adm-chart__lines" viewBox="0 0 100 100" preserveAspectRatio="none" aria-hidden="true">
<polyline points="0,60 20,40 40,50" fill="none" stroke="var(--ad-chart-1)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" vector-effect="non-scaling-stroke" />
<polyline points="80,30 100,20" fill="none" stroke="var(--ad-chart-1)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" vector-effect="non-scaling-stroke" />
<polyline points="0,73.333 20,68.333 40,63.333 60,65 80,56.667 100,50" fill="none" stroke="var(--ad-chart-2)" stroke-width="2" stroke-linejoin="round" stroke-linecap="round" vector-effect="non-scaling-stroke" stroke-dasharray="6 4" />
</svg>
<span class="adm-chart__dot" style="left:100%;bottom:80%;background:var(--ad-chart-1)"></span>
<span class="adm-chart__dot" style="left:100%;bottom:50%;background:var(--ad-chart-2)"></span>
<div class="adm-chart__hit" style="left:0%;width:20%" data-adm-hint="Jan: Sign-ups 120, Renewals 80"></div>
<div class="adm-chart__hit" style="left:20%;width:20%" data-adm-hint="Feb: Sign-ups 180, Renewals 95"></div>
<div class="adm-chart__hit" style="left:40%;width:20%" data-adm-hint="Mar: Sign-ups 150, Renewals 110"></div>
<div class="adm-chart__hit" style="left:60%;width:20%" data-adm-hint="Apr: Sign-ups -, Renewals 105"></div>
<div class="adm-chart__hit" style="left:80%;width:20%" data-adm-hint="May: Sign-ups 210, Renewals 130"></div>
<div class="adm-chart__hit" style="left:100%;width:20%" data-adm-hint="Jun: Sign-ups 240, Renewals 150"></div>
</div>
<div class="adm-chart__x" aria-hidden="true" data-sparse data-dense >
<span>Jan</span><span>Feb</span><span>Mar</span><span>Apr</span><span>May</span><span>Jun</span> </div>
</div>
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Sign-ups and renewals</caption>
<thead><tr><th scope="col"></th><th scope="col" class="adm-num">Sign-ups</th><th scope="col" class="adm-num">Renewals</th></tr></thead>
<tbody>
<tr><th scope="row">Jan</th><td class="adm-num">120</td><td class="adm-num">80</td></tr>
<tr><th scope="row">Feb</th><td class="adm-num">180</td><td class="adm-num">95</td></tr>
<tr><th scope="row">Mar</th><td class="adm-num">150</td><td class="adm-num">110</td></tr>
<tr><th scope="row">Apr</th><td class="adm-num">-</td><td class="adm-num">105</td></tr>
<tr><th scope="row">May</th><td class="adm-num">210</td><td class="adm-num">130</td></tr>
<tr><th scope="row">Jun</th><td class="adm-num">240</td><td class="adm-num">150</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure></div>
Pie chart
- Salesforce62%
- Mailchimp30%
- Google Sheets8%
View as table
| Salesforce | 620 | 62% |
|---|---|---|
| Mailchimp | 300 | 30% |
| Google Sheets | 80 | 8% |
- Early entry53%
- Merchandise33%
- Upgrades10%
- Other offers4%
View as table
| Early entry | 512 | 53% |
|---|---|---|
| Merchandise | 324 | 33% |
| Upgrades | 96 | 10% |
| Other offers | 42 | 4% |
Blade
<x-admin::grid min="20rem">
<x-admin::pie-chart title="Members by platform" :data="['Salesforce' => 620, 'Mailchimp' => 300, 'Google Sheets' => 80]" />
<x-admin::pie-chart title="Perk redemptions" donut :data="['Early entry' => 512, 'Merchandise' => 324, 'Upgrades' => 96, 'Other offers' => 42]" />
</x-admin::grid>
HTML, for other stacks
<div style="--_min:20rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid"><figure class="adm-chart adm-chart--pie">
<div class="adm-pie" role="img" tabindex="0" data-adm-chart aria-label="Members by platform. Salesforce 62%, Mailchimp 30%, Google Sheets 8%">
<svg viewBox="0 0 64 64" aria-hidden="true">
<circle class="adm-pie__slice" cx="32" cy="32" r="15.9155" fill="none" stroke="var(--ad-chart-1)" stroke-width="31.831" pathLength="100" stroke-dasharray="61.2 100" stroke-dashoffset="-0" transform="rotate(-90 32 32)" data-adm-hint="Salesforce: 620 (62%)" />
<circle class="adm-pie__slice" cx="32" cy="32" r="15.9155" fill="none" stroke="var(--ad-chart-2)" stroke-width="31.831" pathLength="100" stroke-dasharray="29.2 100" stroke-dashoffset="-62" transform="rotate(-90 32 32)" data-adm-hint="Mailchimp: 300 (30%)" />
<circle class="adm-pie__slice" cx="32" cy="32" r="15.9155" fill="none" stroke="var(--ad-chart-3)" stroke-width="31.831" pathLength="100" stroke-dasharray="7.2 100" stroke-dashoffset="-92" transform="rotate(-90 32 32)" data-adm-hint="Google Sheets: 80 (8%)" />
</svg>
</div>
<ul class="adm-pie__legend">
<li><i style="background:var(--ad-chart-1)"></i><span class="adm-pie__name">Salesforce</span><span class="adm-pie__value">62%</span></li>
<li><i style="background:var(--ad-chart-2)"></i><span class="adm-pie__name">Mailchimp</span><span class="adm-pie__value">30%</span></li>
<li><i style="background:var(--ad-chart-3)"></i><span class="adm-pie__name">Google Sheets</span><span class="adm-pie__value">8%</span></li>
</ul>
<details class="adm-collapsible adm-chart__table" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Members by platform</caption>
<tbody>
<tr><th scope="row">Salesforce</th><td class="adm-num">620</td><td class="adm-num">62%</td></tr>
<tr><th scope="row">Mailchimp</th><td class="adm-num">300</td><td class="adm-num">30%</td></tr>
<tr><th scope="row">Google Sheets</th><td class="adm-num">80</td><td class="adm-num">8%</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure>
<figure class="adm-chart adm-chart--pie">
<div class="adm-pie" role="img" tabindex="0" data-adm-chart aria-label="Perk redemptions. Early entry 53%, Merchandise 33%, Upgrades 10%, Other offers 4%">
<svg viewBox="0 0 42 42" aria-hidden="true">
<circle class="adm-pie__slice" cx="21" cy="21" r="15.9155" fill="none" stroke="var(--ad-chart-1)" stroke-width="6" pathLength="100" stroke-dasharray="51.767 100" stroke-dashoffset="-0" transform="rotate(-90 21 21)" data-adm-hint="Early entry: 512 (53%)" />
<circle class="adm-pie__slice" cx="21" cy="21" r="15.9155" fill="none" stroke="var(--ad-chart-2)" stroke-width="6" pathLength="100" stroke-dasharray="32.465 100" stroke-dashoffset="-52.567" transform="rotate(-90 21 21)" data-adm-hint="Merchandise: 324 (33%)" />
<circle class="adm-pie__slice" cx="21" cy="21" r="15.9155" fill="none" stroke="var(--ad-chart-3)" stroke-width="6" pathLength="100" stroke-dasharray="9.056 100" stroke-dashoffset="-85.832" transform="rotate(-90 21 21)" data-adm-hint="Upgrades: 96 (10%)" />
<circle class="adm-pie__slice" cx="21" cy="21" r="15.9155" fill="none" stroke="var(--ad-chart-4)" stroke-width="6" pathLength="100" stroke-dasharray="3.512 100" stroke-dashoffset="-95.688" transform="rotate(-90 21 21)" data-adm-hint="Other offers: 42 (4%)" />
</svg>
<div class="adm-pie__total" aria-hidden="true"><strong>974</strong><span>Total</span></div>
</div>
<ul class="adm-pie__legend">
<li><i style="background:var(--ad-chart-1)"></i><span class="adm-pie__name">Early entry</span><span class="adm-pie__value">53%</span></li>
<li><i style="background:var(--ad-chart-2)"></i><span class="adm-pie__name">Merchandise</span><span class="adm-pie__value">33%</span></li>
<li><i style="background:var(--ad-chart-3)"></i><span class="adm-pie__name">Upgrades</span><span class="adm-pie__value">10%</span></li>
<li><i style="background:var(--ad-chart-4)"></i><span class="adm-pie__name">Other offers</span><span class="adm-pie__value">4%</span></li>
</ul>
<details class="adm-collapsible adm-chart__table" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>View as table</summary>
<div class="adm-collapsible__content"><div class="adm-table-wrap">
<table class="adm-table">
<caption class="adm-sr-only">Perk redemptions</caption>
<tbody>
<tr><th scope="row">Early entry</th><td class="adm-num">512</td><td class="adm-num">53%</td></tr>
<tr><th scope="row">Merchandise</th><td class="adm-num">324</td><td class="adm-num">33%</td></tr>
<tr><th scope="row">Upgrades</th><td class="adm-num">96</td><td class="adm-num">10%</td></tr>
<tr><th scope="row">Other offers</th><td class="adm-num">42</td><td class="adm-num">4%</td></tr>
</tbody>
</table>
</div></div>
</details>
</figure></div>
Sparkline
Blade
<x-admin::sparkline label="Members over 8 weeks" :data="[40, 42, 41, 45, 47, 46, 50, 54]" />
HTML, for other stacks
<svg class="adm-sparkline" viewBox="0 0 120 36" role="img" aria-label="Members over 8 weeks. From 40 to 54">
<polyline points="5,30 20.71,26.57 36.43,28.29 52.14,21.43 67.86,18 83.57,19.71 99.29,12.86 115,6" fill="none" stroke="var(--ad-chart-brand)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<circle cx="115" cy="6" r="4" fill="var(--ad-chart-brand)" stroke="var(--ad-base)" stroke-width="2" />
</svg>
Progress and meter
Import64%
Run breakdown
Quota87 of 100 calls
Blade
<x-admin::grid min="14rem">
<x-admin::progress label="Import" value="64" />
<x-admin::progress label="Run breakdown" id="g-segments" :segments="[['label' => 'Completed', 'value' => 82, 'variant' => 'success'], ['label' => 'Failed', 'value' => 10, 'variant' => 'destructive'], ['label' => 'Running', 'value' => 8, 'variant' => 'info']]" />
<x-admin::meter label="Quota" value="87" max="100" warning="75" danger="95" display="87 of 100 calls" />
</x-admin::grid>
HTML, for other stacks
<div style="--_min:14rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid"><div class="adm-meter">
<div class="adm-meter__head"><span>Import</span><span class="adm-meter__value">64%</span></div> <div class="adm-progress" role="progressbar" aria-valuenow="64" aria-valuemin="0" aria-valuemax="100" aria-label="Import" ><span style="width:64%"></span></div>
</div>
<div class="adm-meter" id="g-segments">
<div class="adm-meter__head"><span>Run breakdown</span></div> <div class="adm-progress adm-progress--stacked" role="img" aria-label="Run breakdown: Completed 82, Failed 10, Running 8">
<span class="adm-progress__bar--success" style="width:82%"></span><span class="adm-progress__bar--destructive" style="width:10%"></span><span class="adm-progress__bar--info" style="width:8%"></span> </div>
<ul class="adm-legend" aria-hidden="true">
<li><span class="adm-legend__swatch adm-progress__bar--success"></span>Completed <span class="adm-meter__value">82</span></li><li><span class="adm-legend__swatch adm-progress__bar--destructive"></span>Failed <span class="adm-meter__value">10</span></li><li><span class="adm-legend__swatch adm-progress__bar--info"></span>Running <span class="adm-meter__value">8</span></li> </ul>
</div>
<div class="adm-meter">
<div class="adm-meter__head"><span>Quota</span><span class="adm-meter__value">87 of 100 calls</span></div> <div class="adm-progress" role="meter" aria-valuenow="87" aria-valuemin="0" aria-valuemax="100" aria-label="Quota" ><span class="adm-progress__bar--warning" style="width:87%"></span></div>
</div></div>
Avatar
Blade
<x-admin::toolbar>
<x-admin::avatar name="Rina Example" size="sm" />
<x-admin::avatar name="Rina Example" />
<x-admin::avatar name="Rina Example" size="lg" />
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><span class="adm-avatar adm-avatar--sm" role="img" aria-label="Rina Example" >RE</span>
<span class="adm-avatar" role="img" aria-label="Rina Example" >RE</span>
<span class="adm-avatar adm-avatar--lg" role="img" aria-label="Rina Example" >RE</span></div>
Copy text
seg_lapsed_2025
Blade
<x-admin::copy-text value="seg_lapsed_2025" />
HTML, for other stacks
<span class="adm-copy">
<span class="adm-copy__value">seg_lapsed_2025</span>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--xs" data-adm-copy="seg_lapsed_2025" aria-label="Copy seg_lapsed_2025"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg></button>
</span>
Code
Edit config/admin-ui.php
to continue.
php artisan admin-ui:install --brand=7c3aed
Blade
<x-admin::stack gap="2">
<p>Edit <x-admin::code>config/admin-ui.php</x-admin::code> to continue.</p>
<x-admin::code block copy>php artisan admin-ui:install --brand=7c3aed</x-admin::code>
</x-admin::stack>
HTML, for other stacks
<div class="adm-stack" style="gap:var(--ad-space-2)"><p>Edit <code class="adm-code">config/admin-ui.php</code>
to continue.</p>
<div class="adm-code-block">
<pre tabindex="0"><code>php artisan admin-ui:install --brand=7c3aed</code></pre>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--square adm-btn--xs adm-code-block__copy" data-adm-copy="php artisan admin-ui:install --brand=7c3aed" aria-label="Copy code"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg></button>
</div></div>
Keyboard key
⌘K
Blade
<x-admin::kbd>⌘K</x-admin::kbd>
HTML, for other stacks
<kbd class="adm-kbd">⌘K</kbd>
Feedback
Badge
Blade
<x-admin::toolbar>
<x-admin::badge>Draft</x-admin::badge>
<x-admin::badge variant="outline">Archived</x-admin::badge>
<x-admin::badge variant="primary">New</x-admin::badge>
<x-admin::badge variant="info" dot>Paused</x-admin::badge>
<x-admin::badge variant="success" dot>Synced</x-admin::badge>
<x-admin::badge variant="warning" dot>Degraded</x-admin::badge>
<x-admin::badge variant="destructive" dot>Failing</x-admin::badge>
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><span class="adm-badge adm-badge--neutral">Draft</span>
<span class="adm-badge adm-badge--outline">Archived</span>
<span class="adm-badge adm-badge--primary">New</span>
<span class="adm-badge adm-badge--info adm-badge--dot">Paused</span>
<span class="adm-badge adm-badge--success adm-badge--dot">Synced</span>
<span class="adm-badge adm-badge--warning adm-badge--dot">Degraded</span>
<span class="adm-badge adm-badge--destructive adm-badge--dot">Failing</span></div>
Badge list
Njuko
Webhook site
+3 more
Google Sheet Salesforce MailchimpBlade
<x-admin::badge-list id="g-badges" :max="2" :items="['Njuko', 'Webhook site', 'Google Sheet', 'Salesforce', 'Mailchimp']" />
HTML, for other stacks
<span class="adm-badge-list" id="g-badges">
<span class="adm-badge adm-badge--neutral">Njuko</span>
<span class="adm-badge adm-badge--neutral">Webhook site</span>
<details class="adm-badge-list__more">
<summary class="adm-badge adm-badge--outline">+3 more</summary>
<span class="adm-badge-list__rest"><span class="adm-badge adm-badge--neutral">Google Sheet</span>
<span class="adm-badge adm-badge--neutral">Salesforce</span>
<span class="adm-badge adm-badge--neutral">Mailchimp</span>
</span>
</details>
</span>
Banner
Blade
<x-admin::stack gap="2">
<x-admin::banner>Field mappings changed. The next rebuild uses them.</x-admin::banner>
<x-admin::banner variant="success" dismissible>All connectors passed their last health check.</x-admin::banner>
<x-admin::banner variant="warning" title="Google Sheets failed 3 runs">Runs retry every 15 minutes.<x-slot:actions><x-admin::button size="sm">View runs</x-admin::button></x-slot:actions></x-admin::banner>
<x-admin::banner variant="destructive" title="Mailchimp rejected the API key">Generate a new key, then paste it under Connectors.</x-admin::banner>
</x-admin::stack>
HTML, for other stacks
<div class="adm-stack" style="gap:var(--ad-space-2)"><div class="adm-banner" role="status">
<span class="adm-icon-line"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 16v-4M12 8h.01"/></svg></span>
<div class="adm-banner__body">
<span>Field mappings changed. The next rebuild uses them.</span> </div>
</div>
<div class="adm-banner adm-banner--success" role="status">
<span class="adm-icon-line"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m8 12 3 3 5-6"/></svg></span>
<div class="adm-banner__body">
<span>All connectors passed their last health check.</span> </div>
<button type="button" class="adm-btn adm-btn--ghost adm-btn--square adm-btn--xs" data-adm-dismiss aria-label="Dismiss"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"/></svg></button></div>
<div class="adm-banner adm-banner--warning" role="status">
<span class="adm-icon-line"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg></span>
<div class="adm-banner__body">
<span class="adm-banner__title">Google Sheets failed 3 runs</span> <span>Runs retry every 15 minutes.</span> </div>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" >View runs</button> </div>
<div class="adm-banner adm-banner--destructive" role="alert">
<span class="adm-icon-line"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg></span>
<div class="adm-banner__body">
<span class="adm-banner__title">Mailchimp rejected the API key</span> <span>Generate a new key, then paste it under Connectors.</span> </div>
</div></div>
Empty state
No perks yet
Create one, then pick which segments see it.
Blade
<x-admin::empty title="No perks yet" description="Create one, then pick which segments see it." icon="gift" />
HTML, for other stacks
<div class="adm-empty">
<div class="adm-empty__icon"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="8" width="18" height="4" rx="1"/><path d="M12 8v13M5 12v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-8M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5"/></svg></div>
<div class="adm-empty__text">
<h3 class="adm-heading">No perks yet</h3>
<p>Create one, then pick which segments see it.</p> </div>
</div>
Loading
Blade
<x-admin::grid min="12rem">
<x-admin::skeleton lines="3" />
<div><x-admin::spinner /></div>
</x-admin::grid>
HTML, for other stacks
<div style="--_min:12rem;--_gap:var(--ad-space-4);gap:var(--_gap)" class="adm-grid"><div class="adm-stack" aria-hidden="true">
<div class="adm-skeleton" style="height:0.875rem;width:100%"></div>
<div class="adm-skeleton" style="height:0.875rem;width:100%"></div>
<div class="adm-skeleton" style="height:0.875rem;width:60%"></div>
</div>
<div><span class="adm-spinner" role="status" aria-label="Loading"></span>
</div></div>
Toast
Blade
{{-- From PHP: return back()->with('success', 'Segment saved'); --}}
<x-admin::button onclick="AdmiralUI.toast('Segment saved')">Show toast</x-admin::button>
HTML, for other stacks
<button type="button" class="adm-btn adm-btn--secondary" onclick="AdmiralUI.toast('Segment saved')" >Show toast</button>
Toasts region
Blade
<x-admin::toasts />
Overlays
Context menu
Ibiza
Right-click the card, or focus it and press Shift+F10.
- Race day
- 15 Nov 2026
- Entries
- 1,204
Blade
<x-admin::context-menu label="Actions for Ibiza" tabindex="0">
<x-admin::card title="Ibiza" description="Right-click the card, or focus it and press Shift+F10.">
<x-admin::dl :items="['Race day' => '15 Nov 2026', 'Entries' => '1,204']" />
</x-admin::card>
<x-slot:menu>
<x-admin::dropdown-item icon="edit">Edit race</x-admin::dropdown-item>
<x-admin::dropdown-item icon="copy">Duplicate</x-admin::dropdown-item>
<x-admin::dropdown-separator />
<x-admin::dropdown-item icon="trash" destructive>Delete race</x-admin::dropdown-item>
</x-slot:menu>
</x-admin::context-menu>
HTML, for other stacks
<div class="adm-context" tabindex="0" data-adm-context>
<section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Ibiza</h2> <p class="adm-card__description">Right-click the card, or focus it and press Shift+F10.</p> </div>
</div>
<div class="adm-card__content"><dl class="adm-dl">
<dt>Race day</dt>
<dd>15 Nov 2026</dd>
<dt>Entries</dt>
<dd>1,204</dd>
</dl></div>
</section>
<div class="adm-menu adm-context__menu" popover="manual" aria-label="Actions for Ibiza"><button type="button" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg>Edit race</button>
<button type="button" class="adm-menu__item"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg>Duplicate</button>
<div class="adm-menu__sep" role="separator"></div>
<button type="button" class="adm-menu__item adm-menu__item--destructive"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg>Delete race</button></div>
</div>
Dialog
Blade
<x-admin::button data-adm-open="g-dialog">Open dialog</x-admin::button>
<x-admin::button data-adm-open="g-dialog-lg">Open a large dialog</x-admin::button>
<x-admin::dialog id="g-dialog-lg" size="lg" title="Preview members" description="The first 25 members who match.">
Wider, for tables and previews. Sizes: sm, md (default), lg, xl, full.
<x-slot:footer><x-admin::button data-adm-close>Close</x-admin::button></x-slot:footer>
</x-admin::dialog>
<x-admin::dialog id="g-dialog" title="New segment" description="Members are pushed on the next run.">
<x-admin::input name="g_dialog_name" label="Name" />
<x-slot:footer>
<x-admin::button data-adm-close>Cancel</x-admin::button>
<x-admin::button variant="primary">Create segment</x-admin::button>
</x-slot:footer>
</x-admin::dialog>
HTML, for other stacks
<button type="button" class="adm-btn adm-btn--secondary" data-adm-open="g-dialog" >Open dialog</button>
<button type="button" class="adm-btn adm-btn--secondary" data-adm-open="g-dialog-lg" >Open a large dialog</button>
<dialog id="g-dialog-lg" class="adm-dialog adm-dialog--lg" aria-labelledby="g-dialog-lg-title" >
<div class="adm-dialog__header">
<h2 class="adm-heading" id="g-dialog-lg-title">Preview members</h2> <p class="adm-subtle">The first 25 members who match.</p> </div>
<div class="adm-dialog__body">Wider, for tables and previews. Sizes: sm, md (default), lg, xl, full.</div> <div class="adm-dialog__footer"><button type="button" class="adm-btn adm-btn--secondary" data-adm-close="data-adm-close" >Close</button></div></dialog>
<dialog id="g-dialog" class="adm-dialog" aria-labelledby="g-dialog-title" >
<div class="adm-dialog__header">
<h2 class="adm-heading" id="g-dialog-title">New segment</h2> <p class="adm-subtle">Members are pushed on the next run.</p> </div>
<div class="adm-dialog__body"><div class="adm-field">
<label class="adm-label" for="g_dialog_name">Name</label>
<input
type="text"
name="g_dialog_name" id="g_dialog_name" class="adm-input"
>
</div></div> <div class="adm-dialog__footer"><button type="button" class="adm-btn adm-btn--secondary" data-adm-close="data-adm-close" >Cancel</button>
<button type="button" class="adm-btn adm-btn--primary" >Create segment</button></div></dialog>
Confirm
Blade
<x-admin::toolbar>
<x-admin::button data-adm-open="g-confirm">Publish</x-admin::button>
<x-admin::button variant="destructive" data-adm-open="g-delete">Delete</x-admin::button>
</x-admin::toolbar>
<x-admin::confirm id="g-confirm" action="/publish" title="Publish this profile?" confirm="Publish">The public site updates within a few minutes.</x-admin::confirm>
<x-admin::confirm-delete id="g-delete" action="/segments/1" title="Delete segment?" confirm="Delete segment">Members stay in the connected platforms.</x-admin::confirm-delete>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><button type="button" class="adm-btn adm-btn--secondary" data-adm-open="g-confirm" >Publish</button>
<button type="button" class="adm-btn adm-btn--destructive" data-adm-open="g-delete" >Delete</button></div>
<dialog id="g-confirm" class="adm-dialog" aria-labelledby="g-confirm-title" role="alertdialog">
<form method="POST" action="/publish" >
<input type="hidden" name="_token" value="NoOq1NDOSaxETp57KkznvPzdMYClXXpNNbaDv1LY" autocomplete="off"> <div class="adm-dialog__header">
<h2 class="adm-heading" id="g-confirm-title">Publish this profile?</h2>
<p class="adm-subtle">The public site updates within a few minutes.</p>
</div>
<div class="adm-dialog__footer">
<button type="button" class="adm-btn adm-btn--secondary" data-adm-close>Cancel</button>
<button type="submit" class="adm-btn adm-btn--primary" >Publish</button>
</div>
</form>
</dialog>
<dialog id="g-delete" class="adm-dialog" aria-labelledby="g-delete-title" role="alertdialog">
<form method="POST" action="/segments/1" >
<input type="hidden" name="_token" value="NoOq1NDOSaxETp57KkznvPzdMYClXXpNNbaDv1LY" autocomplete="off"> <input type="hidden" name="_method" value="DELETE"> <div class="adm-dialog__header">
<h2 class="adm-heading" id="g-delete-title">Delete segment?</h2>
<p class="adm-subtle">Members stay in the connected platforms.</p>
</div>
<div class="adm-dialog__footer">
<button type="button" class="adm-btn adm-btn--secondary" data-adm-close>Cancel</button>
<button type="submit" class="adm-btn adm-btn--destructive" >Delete segment</button>
</div>
</form>
</dialog>
Sheet
Blade
<x-admin::button data-adm-open="g-sheet">Open sheet</x-admin::button>
<x-admin::sheet id="g-sheet" title="Filters" description="Narrow down the list.">
<x-admin::select name="g_sheet_status" label="Status" :options="['Synced', 'Failing']" />
<x-slot:footer><x-admin::button variant="primary" data-adm-close>Apply</x-admin::button></x-slot:footer>
</x-admin::sheet>
HTML, for other stacks
<button type="button" class="adm-btn adm-btn--secondary" data-adm-open="g-sheet" >Open sheet</button>
<dialog id="g-sheet" class="adm-dialog adm-sheet" data-side="end" aria-labelledby="g-sheet-title" >
<div class="adm-dialog__header">
<h2 class="adm-heading" id="g-sheet-title">Filters</h2> <p class="adm-subtle">Narrow down the list.</p> </div>
<div class="adm-dialog__body"><div class="adm-field">
<label class="adm-label" for="g_sheet_status">Status</label>
<select
name="g_sheet_status" id="g_sheet_status" class="adm-select"
>
<option value="Synced" >Synced</option>
<option value="Failing" >Failing</option>
</select>
</div></div>
<div class="adm-dialog__footer"><button type="button" class="adm-btn adm-btn--primary" data-adm-close="data-adm-close" >Apply</button></div></dialog>
Popover
Click away or press Escape to close.
Blade
<x-admin::popover id="g-popover" label="Show details" icon="info">
<p>Click away or press Escape to close.</p>
</x-admin::popover>
HTML, for other stacks
<button type="button" class="adm-btn adm-btn--secondary" popovertarget="g-popover" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 16v-4M12 8h.01"/></svg>Show details</button>
<div id="g-popover" popover="auto" class="adm-popover"><p>Click away or press Escape to close.</p></div>
Tooltip
Rebuilds run every 15 minutes
Blade
<x-admin::tooltip text="Rebuilds run every 15 minutes"><x-admin::button>Hover or focus me</x-admin::button></x-admin::tooltip>
HTML, for other stacks
<span class="adm-tooltip-wrap" data-adm-tooltip><button type="button" class="adm-btn adm-btn--secondary" >Hover or focus me</button><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-ql6fmI0c">Rebuilds run every 15 minutes</span></span>
Command palette
Blade
<x-admin::command-trigger for="g-command" />
<x-admin::command-palette id="g-command" :groups="[['label' => 'Pages', 'items' => [
['label' => 'Segments', 'href' => '#', 'icon' => 'layers', 'keywords' => 'audience groups'],
['label' => 'Perks', 'href' => '#', 'icon' => 'gift'],
['label' => 'Settings', 'href' => '#', 'icon' => 'settings'],
]]]" />
HTML, for other stacks
<button type="button" class="adm-btn adm-btn--secondary adm-command-trigger" data-adm-open="g-command">
<span class="adm-row"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg><span class="adm-command-trigger__label">Search</span></span><kbd class="adm-kbd">⌘K</kbd>
</button>
<dialog id="g-command" class="adm-dialog adm-command" data-adm-command aria-label="Search">
<div class="adm-command__search">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg> <input class="adm-command__input" type="text" placeholder="Search pages…" aria-label="Search pages…" autocomplete="off" spellcheck="false">
<kbd class="adm-kbd">Esc</kbd>
</div>
<div class="adm-command__list">
<div class="adm-command__group">Pages</div> <a class="adm-command__item" href="#" data-keywords="audience groups" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 3 9 5-9 5-9-5z"/><path d="m3 13 9 5 9-5"/></svg> <span>Segments</span>
</a>
<a class="adm-command__item" href="#" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="8" width="18" height="4" rx="1"/><path d="M12 8v13M5 12v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-8M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5"/></svg> <span>Perks</span>
</a>
<a class="adm-command__item" href="#" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1"/></svg> <span>Settings</span>
</a>
<div class="adm-command__empty" hidden>Nothing found</div>
</div>
</dialog>
Layout
Page header and breadcrumbs
Segments
Rules that group members.
Perk module / detail
Early entry discount
Active Priority 90perk_early_entry_10 Blade
<x-admin::page-header title="Segments" description="Rules that group members." :breadcrumbs="['Audience' => '#', 'Segments' => null]">
<x-slot:actions><x-admin::button variant="primary" icon="plus">New segment</x-admin::button></x-slot:actions>
</x-admin::page-header>
<x-admin::page-header class="mt" eyebrow="Perk module / detail" title="Early entry discount" code="perk_early_entry_10">
<x-slot:meta><x-admin::badge variant="success" dot>Active</x-admin::badge><x-admin::badge>Priority 90</x-admin::badge></x-slot:meta>
<x-slot:actions><x-admin::button icon="edit">Edit perk</x-admin::button></x-slot:actions>
</x-admin::page-header>
HTML, for other stacks
<div class="adm-page-header">
<div class="adm-page-header__text">
<nav class="adm-breadcrumbs" aria-label="Breadcrumb">
<a href="#">Audience</a> <span class="adm-breadcrumbs__sep" aria-hidden="true">/</span>
<span aria-current="page">Segments</span>
</nav>
<h1 class="adm-title">Segments</h1>
<p>Rules that group members.</p>
</div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--primary" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>New segment</button></div>
</div>
<div class="adm-page-header mt">
<div class="adm-page-header__text">
<p class="adm-eyebrow">Perk module / detail</p> <div class="adm-page-header__title"><h1 class="adm-title">Early entry discount</h1><span class="adm-row"><span class="adm-badge adm-badge--success adm-badge--dot">Active</span>
<span class="adm-badge adm-badge--neutral">Priority 90</span></span></div>
<code class="adm-code adm-page-header__code">perk_early_entry_10</code> </div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--secondary" ><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg>Edit perk</button></div>
</div>
Breadcrumbs alone
Blade
<x-admin::breadcrumbs :items="['Athletes' => '#', 'Sam Example' => null]" />
HTML, for other stacks
<nav class="adm-breadcrumbs" aria-label="Breadcrumb">
<a href="#">Athletes</a> <span class="adm-breadcrumbs__sep" aria-hidden="true">/</span>
<span aria-current="page">Sam Example</span>
</nav>
Card
Connector health
Last 24 hours
Card content.
Blade
<x-admin::card title="Connector health" description="Last 24 hours">
<x-slot:actions><x-admin::button size="sm">Refresh</x-admin::button></x-slot:actions>
Card content.
<x-slot:footer>Updated 4 minutes ago</x-slot:footer>
</x-admin::card>
HTML, for other stacks
<section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Connector health</h2> <p class="adm-card__description">Last 24 hours</p> </div>
<div class="adm-row"><button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" >Refresh</button></div> </div>
<div class="adm-card__content">Card content.</div>
<div class="adm-card__footer">Updated 4 minutes ago</div>
</section>
Tabs that change the URL
Blade
<x-admin::tabs :items="[['label' => 'All', 'href' => '#', 'count' => 24, 'active' => true], ['label' => 'Synced', 'href' => '#', 'count' => 19, 'active' => false]]" />
HTML, for other stacks
<nav class="adm-tabs">
<a class="adm-tab" href="#" aria-current="page" >
All <span class="adm-subtle">24</span> </a>
<a class="adm-tab" href="#" >
Synced <span class="adm-subtle">19</span> </a>
</nav>
Tabs on the same page
Profile fields.
Media fields.
Blade
<x-admin::tab-group group="g-tabs" label="Athlete" :tabs="['profile' => 'Profile', 'media' => ['label' => 'Media', 'count' => 12]]">
<x-admin::tab-panel group="g-tabs" name="profile" active class="mt">Profile fields.</x-admin::tab-panel>
<x-admin::tab-panel group="g-tabs" name="media" class="mt">Media fields.</x-admin::tab-panel>
</x-admin::tab-group>
HTML, for other stacks
<div data-adm-tabs>
<div class="adm-tabs" role="tablist" aria-label="Athlete" >
<button type="button" class="adm-tab" role="tab" id="g-tabs-tab-profile" aria-controls="g-tabs-panel-profile" aria-selected="true" tabindex="0">Profile</button>
<button type="button" class="adm-tab" role="tab" id="g-tabs-tab-media" aria-controls="g-tabs-panel-media" aria-selected="false" tabindex="-1">Media <span class="adm-subtle">12</span></button>
</div>
<div class="adm-tab-panel mt" role="tabpanel" id="g-tabs-panel-profile" aria-labelledby="g-tabs-tab-profile" tabindex="0" >Profile fields.</div>
<div class="adm-tab-panel mt" role="tabpanel" id="g-tabs-panel-media" aria-labelledby="g-tabs-tab-media" tabindex="0" hidden >Media fields.</div>
</div>
Accordion
How often does it sync?
Every 15 minutes.
Can I pause a sync?
Yes, from the segment page.
Blade
<x-admin::accordion name="g-faq">
<x-admin::accordion-item title="How often does it sync?" open>Every 15 minutes.</x-admin::accordion-item>
<x-admin::accordion-item title="Can I pause a sync?">Yes, from the segment page.</x-admin::accordion-item>
</x-admin::accordion>
HTML, for other stacks
<div class="adm-accordion"><details class="adm-collapsible" name="g-faq" open >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>How often does it sync?</summary>
<div class="adm-collapsible__content">Every 15 minutes.</div>
</details>
<details class="adm-collapsible" name="g-faq" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>Can I pause a sync?</summary>
<div class="adm-collapsible__content">Yes, from the segment page.</div>
</details></div>
Collapsible
Advanced settings
Rarely used fields go here.
Blade
<x-admin::collapsible title="Advanced settings">Rarely used fields go here.</x-admin::collapsible>
HTML, for other stacks
<details class="adm-collapsible" >
<summary><svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg>Advanced settings</summary>
<div class="adm-collapsible__content">Rarely used fields go here.</div>
</details>
Table of contents
Blade
<x-admin::table-of-contents :items="['Identity' => '#identity', 'Biography' => '#biography']" />
HTML, for other stacks
<nav aria-label="On this page">
<ul class="adm-toc">
<li><a href="#identity">Identity</a></li>
<li><a href="#biography">Biography</a></li>
</ul>
</nav>
Section nav
Blade
<x-admin::section-nav label="Settings" :items="[
['label' => 'Segment owners', 'href' => '#', 'active' => true, 'icon' => 'users'],
['label' => 'Perk contact', 'href' => '#', 'icon' => 'mail'],
['label' => 'RaceCheck reviews', 'href' => '#', 'icon' => 'flag', 'count' => 4],
]" style="max-width:16rem" />
HTML, for other stacks
<nav class="adm-section-nav" style="max-width:16rem;" aria-label="Settings">
<ul>
<li>
<a class="adm-section-nav__item" href="#" aria-current="page" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="9" cy="8" r="4"/><path d="M2 21a7 7 0 0 1 14 0M16 3.5a4 4 0 0 1 0 9M22 21a7 7 0 0 0-4-6.3"/></svg> <span class="adm-section-nav__label">Segment owners</span>
</a>
</li>
<li>
<a class="adm-section-nav__item" href="#" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="14" rx="2"/><path d="m3 7 9 6 9-6"/></svg> <span class="adm-section-nav__label">Perk contact</span>
</a>
</li>
<li>
<a class="adm-section-nav__item" href="#" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 21V4M5 4h11l-2 4 2 4H5"/></svg> <span class="adm-section-nav__label">RaceCheck reviews</span>
<span class="adm-nav__count">4</span> </a>
</li>
</ul>
</nav>
Steps
Blade
<x-admin::steps :current="3" :items="[
['label' => 'Details', 'href' => '#', 'description' => 'Name and type'],
['label' => 'Audience', 'href' => '#', 'description' => 'Who gets it'],
['label' => 'Rules', 'description' => 'When it applies'],
['label' => 'Review', 'description' => 'Check and publish'],
]" />
HTML, for other stacks
<nav class="adm-steps" aria-label="Steps" >
<ol>
<li class="adm-steps__item" data-state="done">
<a class="adm-steps__link" href="#" >
<span class="adm-steps__mark" aria-hidden="true">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m5 12 5 5 9-10"/></svg> </span>
<span class="adm-steps__text">
<span class="adm-steps__label"><span class="adm-sr-only">Completed: </span>Details</span>
<span class="adm-steps__description">Name and type</span> </span>
</a>
</li>
<li class="adm-steps__item" data-state="done">
<a class="adm-steps__link" href="#" >
<span class="adm-steps__mark" aria-hidden="true">
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m5 12 5 5 9-10"/></svg> </span>
<span class="adm-steps__text">
<span class="adm-steps__label"><span class="adm-sr-only">Completed: </span>Audience</span>
<span class="adm-steps__description">Who gets it</span> </span>
</a>
</li>
<li class="adm-steps__item" data-state="current">
<span class="adm-steps__link" aria-current="step" >
<span class="adm-steps__mark" aria-hidden="true">
3 </span>
<span class="adm-steps__text">
<span class="adm-steps__label">Rules</span>
<span class="adm-steps__description">When it applies</span> </span>
</span>
</li>
<li class="adm-steps__item" data-state="todo">
<span class="adm-steps__link" >
<span class="adm-steps__mark" aria-hidden="true">
4 </span>
<span class="adm-steps__text">
<span class="adm-steps__label">Review</span>
<span class="adm-steps__description">Check and publish</span> </span>
</span>
</li>
</ol>
</nav>
Columns
Segment summary
- Owner
- Admiral
- Created
- 6 Nov 2026
- Refresh
- Every hour
- Members
- 12,480
Active build
Build 42 is live.
Rule
Fields for the rule.
Save
Blade
<x-admin::stack>
<x-admin::columns spans="8/4" equal id="g-columns">
<x-admin::card title="Segment summary">
<x-admin::dl :items="['Owner' => 'Admiral', 'Created' => '6 Nov 2026', 'Refresh' => 'Every hour', 'Members' => '12,480']" />
</x-admin::card>
<x-admin::card title="Active build">
<x-slot:actions>
<x-admin::dropdown label="Actions" id="g-columns-menu">
<x-admin::dropdown-item href="#">Rebuild now</x-admin::dropdown-item>
<x-admin::dropdown-item href="#">View build</x-admin::dropdown-item>
<x-admin::dropdown-item href="#">Field mappings</x-admin::dropdown-item>
<x-admin::dropdown-item href="#">Rebuild history</x-admin::dropdown-item>
</x-admin::dropdown>
</x-slot:actions>
Build 42 is live.
</x-admin::card>
</x-admin::columns>
<x-admin::columns spans="2:1" sticky="last" reverse stack-at="sm" id="g-columns-sticky">
<x-admin::card title="Rule">Fields for the rule.</x-admin::card>
<x-admin::card title="Save">
<x-admin::toolbar><x-admin::button variant="primary">Create rule</x-admin::button><x-admin::button>Cancel</x-admin::button></x-admin::toolbar>
</x-admin::card>
</x-admin::columns>
</x-admin::stack>
HTML, for other stacks
<div class="adm-stack" style="gap:var(--ad-space-4)"><div style="--_cols:minmax(0,8fr) minmax(0,4fr);--_gap:var(--ad-space-6);--_align:start" class="adm-columns adm-columns--stack-md adm-columns--equal" id="g-columns">
<div class="adm-columns__track"><section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Segment summary</h2> </div>
</div>
<div class="adm-card__content"><dl class="adm-dl">
<dt>Owner</dt>
<dd>Admiral</dd>
<dt>Created</dt>
<dd>6 Nov 2026</dd>
<dt>Refresh</dt>
<dd>Every hour</dd>
<dt>Members</dt>
<dd>12,480</dd>
</dl></div>
</section>
<section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Active build</h2> </div>
<div class="adm-row"><details class="adm-dropdown" id="g-columns-menu">
<summary class="adm-btn adm-btn--secondary"><span class="adm-dropdown__label">Actions</span><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></summary>
<div class="adm-menu"><a href="#" class="adm-menu__item">Rebuild now</a>
<a href="#" class="adm-menu__item">View build</a>
<a href="#" class="adm-menu__item">Field mappings</a>
<a href="#" class="adm-menu__item">Rebuild history</a></div>
</details></div> </div>
<div class="adm-card__content">Build 42 is live.</div>
</section></div>
</div>
<div style="--_cols:minmax(0,2fr) minmax(0,1fr);--_gap:var(--ad-space-6);--_align:start" class="adm-columns adm-columns--stack-sm adm-columns--reverse adm-columns--sticky-last" id="g-columns-sticky">
<div class="adm-columns__track"><section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Rule</h2> </div>
</div>
<div class="adm-card__content">Fields for the rule.</div>
</section>
<section class="adm-card">
<div class="adm-card__header">
<div class="adm-card__heading">
<h2 class="adm-card__title">Save</h2> </div>
</div>
<div class="adm-card__content"><div class="adm-toolbar" role="toolbar"><button type="button" class="adm-btn adm-btn--primary" >Create rule</button>
<button type="button" class="adm-btn adm-btn--secondary" >Cancel</button></div></div>
</section></div>
</div></div>
Toolbar, stack, grid, separator
A
B
Blade
<x-admin::stack gap="3">
<x-admin::toolbar><x-admin::button size="sm">One</x-admin::button><x-admin::separator vertical /><x-admin::button size="sm">Two</x-admin::button></x-admin::toolbar>
<x-admin::separator />
<x-admin::grid min="8rem" gap="2"><x-admin::badge>A</x-admin::badge><x-admin::badge>B</x-admin::badge></x-admin::grid>
</x-admin::stack>
HTML, for other stacks
<div class="adm-stack" style="gap:var(--ad-space-3)"><div class="adm-toolbar" role="toolbar"><button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" >One</button>
<div class="adm-separator adm-separator--vertical" role="separator" aria-orientation="vertical" ></div>
<button type="button" class="adm-btn adm-btn--secondary adm-btn--sm" >Two</button></div>
<div class="adm-separator" role="separator" ></div>
<div style="--_min:8rem;--_gap:var(--ad-space-2);gap:var(--_gap)" class="adm-grid"><span class="adm-badge adm-badge--neutral">A</span>
<span class="adm-badge adm-badge--neutral">B</span></div></div>
Text
A heading
Small supporting text.
seg_lapsed_2025Blade
<x-admin::text as="h3" variant="heading">A heading</x-admin::text>
<x-admin::text variant="subtle" size="small">Small supporting text.</x-admin::text>
<x-admin::text as="span" mono>seg_lapsed_2025</x-admin::text>
HTML, for other stacks
<h3 class="adm-heading">A heading</h3>
<p class="adm-subtle adm-small">Small supporting text.</p>
<span class="adm-mono">seg_lapsed_2025</span>
Icon
Blade
<x-admin::toolbar>
@foreach (\Admiral\UiKit\Icons::names() as $name)
<x-admin::tooltip :text="$name"><span tabindex="0"><x-admin::icon :name="$name" /></span></x-admin::tooltip>
@endforeach
</x-admin::toolbar>
HTML, for other stacks
<div class="adm-toolbar" role="toolbar"><span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-MFLaxVed">activity</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-QliI3c82">alert</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12l7 7 7-7"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-cm6wLJwv">arrow-down</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M19 12H5M12 19l-7-7 7-7"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-pAbDxznE">arrow-left</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-VYPJ6rOr">arrow-right</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 19V5M5 12l7-7 7 7"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-ujFPhpxa">arrow-up</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9M10.3 21a1.94 1.94 0 0 0 3.4 0"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-7YiztBgT">bell</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M7 5h6a3.5 3.5 0 0 1 0 7H7zM7 12h7a3.5 3.5 0 0 1 0 7H7z"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-CXYd6HBl">bold</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M4 19.5V5a2 2 0 0 1 2-2h14v16H6a2 2 0 0 0-2 2.5zM20 19v3H6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-ecgu2RSU">book</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M16 3v4M8 3v4M3 11h18"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-7QzNfSTM">calendar</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m8 12 3 3 5-6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-EuBgxykE">check</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m6 9 6 6 6-6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-fKn7ciUu">chevron-down</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m15 18-6-6 6-6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-piaQ0Ikw">chevron-left</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-53mBCKUF">chevron-right</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-upX1F5mL">clock</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="12" height="12" rx="2"/><path d="M5 15H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v1"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-EEtf9fRB">copy</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v12M7 10l5 5 5-5M5 21h14"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-W43I3tmd">download</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 20h9M16.5 3.5a2.1 2.1 0 1 1 3 3L7 19l-4 1 1-4z"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-UCtc4EPi">edit</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M14 4h6v6M20 4l-9 9M18 14v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-1AaGIVDq">external</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z"/><circle cx="12" cy="12" r="3"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-X4mOyzdw">eye</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M14 3H6a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8z"/><path d="M14 3v5h5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-WwVQgLEx">file</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 5h18l-7 8v6l-4 2v-8z"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-NDOy28xy">filter</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 21V4M5 4h11l-2 4 2 4H5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-9eZ2pjV8">flag</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="8" width="18" height="4" rx="1"/><path d="M12 8v13M5 12v8a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-8M7.5 8a2.5 2.5 0 0 1 0-5C10 3 12 8 12 8s2-5 4.5-5a2.5 2.5 0 0 1 0 5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-sRUdC0QU">gift</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-dpqJtXTZ">grid</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6h-6v6H4a1 1 0 0 1-1-1z"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-WcfqJhak">home</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-5-5L5 21"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-bsgamHWY">image</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M15 5h-5M14 19H9M14 5l-4 14"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-Ht1bJpOr">italic</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 16v-4M12 8h.01"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-NX1kLRqW">info</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 3 9 5-9 5-9-5z"/><path d="m3 13 9 5 9-5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-A8PUNKGH">layers</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10 14a4 4 0 0 0 6 .5l3-3a4 4 0 0 0-5.7-5.7l-1.5 1.5M14 10a4 4 0 0 0-6-.5l-3 3a4 4 0 0 0 5.7 5.7l1.5-1.5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-EipUq1F9">link</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-DTyiF55P">list</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M10 6h10M10 12h10M10 18h10M4 5l1.5-1v6M4 15.5a1.5 1.5 0 0 1 3 0c0 1-3 2-3 3.5h3"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-YVLNn1B9">list-ordered</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-OPoBtnZF">lock</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 21H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h4M16 17l5-5-5-5M21 12H9"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-YoSOT81x">logout</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="5" width="18" height="14" rx="2"/><path d="m3 7 9 6 9-6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-57NlczF5">mail</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M4 6h16M4 12h16M4 18h16"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-JOnR3FH9">menu</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="5" cy="12" r="1.2" fill="currentColor"/><circle cx="12" cy="12" r="1.2" fill="currentColor"/><circle cx="19" cy="12" r="1.2" fill="currentColor"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-iXhWdvdb">more</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0zM12 18v4"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-hyygrrPQ">plug</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-VGMGQWwB">plus</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 7H5v6h4v-6zM9 13c0 2-1 4-3 4M19 7h-4v6h4V7zM19 13c0 2-1 4-3 4"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-1fvfqlwO">quote</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M21 12a9 9 0 1 1-2.6-6.4L21 8M21 3v5h-5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-XLIOTNUv">refresh</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-xBtvAnTB">search</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="3"/><path d="M12 2v3M12 19v3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M2 12h3M19 12h3M4.9 19.1 7 17M17 7l2.1-2.1"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-xcS4PN28">settings</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="2"/><path d="M9 4v16"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-ds4aF569">sidebar</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M8 6V4h8v2M6 6l1 15h10l1-15"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-y508vif4">trash</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M7 5v6a5 5 0 0 0 10 0V5M5 20h14"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-3OAJLkeL">underline</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 21V9M7 14l5-5 5 5M5 3h14"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-NPfUAomk">upload</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="8" r="4"/><path d="M4 21a8 8 0 0 1 16 0"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-qcNsJe2q">user</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="9" cy="8" r="4"/><path d="M2 21a7 7 0 0 1 14 0M16 3.5a4 4 0 0 1 0 9M22 21a7 7 0 0 0-4-6.3"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-kjSrrFqf">users</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="m15 9-6 6M9 9l6 6"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-Ft2XuGCa">x-circle</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m5 12 5 5 9-10"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-8rrZVYEE">tick</span></span>
<span class="adm-tooltip-wrap" data-adm-tooltip><span tabindex="0"><svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M18 6 6 18M6 6l12 12"/></svg></span><span class="adm-tooltip" role="tooltip" popover="manual" id="adm-tip-UoxtXgQP">x</span></span></div>
Sidebar navigation
Audience
Segments 24Blade
<x-admin::nav :groups="[
['label' => null, 'items' => [['label' => 'Overview', 'href' => '#', 'icon' => 'home', 'active' => true]]],
['label' => 'Audience', 'collapsible' => true, 'open' => true, 'items' => [['label' => 'Segments', 'href' => '#', 'icon' => 'layers', 'count' => 24]]],
]" />
HTML, for other stacks
<nav class="adm-nav" >
<a class="adm-nav__item" href="#" aria-current="page" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6h-6v6H4a1 1 0 0 1-1-1z"/></svg> <span class="adm-nav__text">Overview</span>
</a>
</nav>
<details class="adm-nav" open >
<summary class="adm-nav__label adm-nav__summary">Audience<svg class="adm-icon adm-collapsible__chevron" viewBox="0 0 24 24" aria-hidden="true"><path d="m9 18 6-6-6-6"/></svg></summary>
<a class="adm-nav__item" href="#" >
<svg class="adm-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="m12 3 9 5-9 5-9-5z"/><path d="m3 13 9 5 9-5"/></svg> <span class="adm-nav__text">Segments</span>
<span class="adm-nav__count">24</span> </a>
</details>
Admin page
Blade
<x-admin::layout title="Segments">
<x-slot:topbarEnd><x-admin::avatar name="Rina Example" /></x-slot:topbarEnd>
<x-admin::page-header title="Segments" />
</x-admin::layout>
Sign-in page
Blade
<x-admin::auth-layout title="Sign in" description="Use your work email.">
<x-admin::form action="/login" class="adm-stack">
<x-admin::input name="email" type="email" label="Email" required />
<x-admin::sensitive-input name="password" label="Password" required />
<x-admin::button variant="primary" type="submit">Sign in</x-admin::button>
</x-admin::form>
</x-admin::auth-layout>
Your own layout
Blade
<head>
<x-admin::head />
</head>
<body class="adm-root">…</body>