@ethlete/components 1.0.0-next.77 → 1.0.0-next.79

package/src/lib/icon/headless/calendar-icon.ts

@@ -0,0 +1,21 @@
+import { IconDefinition } from './icon-definition';
+
+export const CALENDAR_ICON: IconDefinition = {
+  name: 'et-calendar',
+  data: `
+    <svg
+      width="100%"
+      height="100%"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.8"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <rect x="3.5" y="4.5" width="17" height="16.5" rx="3" />
+      <path d="M8 2.5v4M16 2.5v4M3.5 10h17" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/check-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const CHECK_ICON: IconDefinition = {
+  name: 'et-check',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
+      <path
+        fill="currentColor"
+        d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/chevron-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const CHEVRON_ICON: IconDefinition = {
+  name: 'et-chevron',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+      <path
+        fill="currentColor"
+        d="M244.7 116.7c6.2-6.2 16.4-6.2 22.6 0l192 192c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0L256 150.6 75.3 331.3c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l192-192z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/circle-check-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const CIRCLE_CHECK_ICON: IconDefinition = {
+  name: 'et-circle-check',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+      <path
+        fill="currentColor"
+        d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335.1 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/circle-info-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const CIRCLE_INFO_ICON: IconDefinition = {
+  name: 'et-circle-info',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+      <path
+        fill="currentColor"
+        d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/clipboard-check-icon.ts

@@ -0,0 +1,28 @@
+import { IconDefinition } from './icon-definition';
+
+export const CLIPBOARD_CHECK_ICON: IconDefinition = {
+  name: 'et-clipboard-check',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M9 4.5h6"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+      />
+      <path
+        d="M9 3h6a1.5 1.5 0 0 1 1.5 1.5V6H18a2 2 0 0 1 2 2v10.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 4 18.5V8a2 2 0 0 1 2-2h1.5V4.5A1.5 1.5 0 0 1 9 3z"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linejoin="round"
+      />
+      <path
+        d="M8.5 13l2.2 2.2 4.8-4.9"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/clock-icon.ts

@@ -0,0 +1,21 @@
+import { IconDefinition } from './icon-definition';
+
+export const CLOCK_ICON: IconDefinition = {
+  name: 'et-clock',
+  data: `
+    <svg
+      width="100%"
+      height="100%"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.8"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <circle cx="12" cy="12" r="8.75" />
+      <path d="M12 7.5V12l3 2" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/code-block-icon.ts

@@ -0,0 +1,15 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon: the inline-code chevrons inside a block, so it reads as a fenced block next to
+// `et-code` (the inline mark) in the same toolbar.
+export const CODE_BLOCK_ICON: IconDefinition = {
+  name: 'et-code-block',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none"
+      stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round">
+      <rect x="1.75" y="2.75" width="12.5" height="10.5" rx="2" />
+      <path d="M6.75 6.5 5 8l1.75 1.5" />
+      <path d="M9.25 6.5 11 8 9.25 9.5" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/code-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const CODE_ICON: IconDefinition = {
+  name: 'et-code',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none"
+      stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
+      <path d="M5.5 5 2.5 8l3 3" />
+      <path d="M10.5 5l3 3-3 3" />
+      <path d="M9 3.5 7 12.5" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/ellipsis-icon.ts

@@ -0,0 +1,13 @@
+import { IconDefinition } from './icon-definition';
+
+/** Horizontal three-dot glyph - the breadcrumb's "show the hidden levels" trigger. */
+export const ELLIPSIS_ICON: IconDefinition = {
+  name: 'et-ellipsis',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <circle cx="5" cy="12" r="1.75" fill="currentColor" />
+      <circle cx="12" cy="12" r="1.75" fill="currentColor" />
+      <circle cx="19" cy="12" r="1.75" fill="currentColor" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/ellipsis-vertical-icon.ts

@@ -0,0 +1,13 @@
+import { IconDefinition } from './icon-definition';
+
+/** Vertical three-dot "more actions" glyph - the table's column menu trigger. */
+export const ELLIPSIS_VERTICAL_ICON: IconDefinition = {
+  name: 'et-ellipsis-vertical',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <circle cx="12" cy="5" r="1.75" fill="currentColor" />
+      <circle cx="12" cy="12" r="1.75" fill="currentColor" />
+      <circle cx="12" cy="19" r="1.75" fill="currentColor" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/eye-icons.ts

@@ -0,0 +1,27 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const EYE_ICON: IconDefinition = {
+  name: 'et-eye',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512">
+      <path
+        fill="currentColor"
+        d="M288 32c-80.8 0-145.5 36.8-192.6 80.6C48.6 156 17.3 208 2.5 243.7c-3.3 7.9-3.3 16.7 0 24.6C17.3 304 48.6 356 95.4 399.4C142.5 443.2 207.2 480 288 480s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C433.5 68.8 368.8 32 288 32zM144 256a144 144 0 1 1 288 0 144 144 0 1 1 -288 0zm144-64c0 35.3-28.7 64-64 64c-7.1 0-13.9-1.2-20.3-3.3c-5.5-1.8-11.9 1.6-11.7 7.4c.3 6.9 1.3 13.8 3.2 20.7c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3z"
+      />
+    </svg>
+  `,
+};
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const EYE_SLASH_ICON: IconDefinition = {
+  name: 'et-eye-slash',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512">
+      <path
+        fill="currentColor"
+        d="M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zM223.1 149.5C248.6 126.2 282.7 112 320 112c79.5 0 144 64.5 144 144c0 24.9-6.3 48.3-17.4 68.7L408 294.5c8.4-19.3 10.6-41.4 4.8-63.3c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3c0 10.2-2.4 19.8-6.6 28.3l-90.3-70.8zM373 389.9c-16.4 6.5-34.3 10.1-53 10.1c-79.5 0-144-64.5-144-144c0-6.9 .5-13.6 1.4-20.2L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5L373 389.9z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/eyedropper-icon.ts

@@ -0,0 +1,22 @@
+import { IconDefinition } from './icon-definition';
+
+export const EYEDROPPER_ICON: IconDefinition = {
+  name: 'et-eyedropper',
+  data: `
+    <svg
+      width="100%"
+      height="100%"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.8"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="m3 21 1-1h3l8.5-8.5" />
+      <path d="M4 20v-3l8.5-8.5" />
+      <path d="m15 6 2.9-2.9a2.05 2.05 0 0 1 2.9 2.9L17.9 8.9l.4.4a2.05 2.05 0 0 1-2.9 2.9l-3.6-3.6a2.05 2.05 0 0 1 2.9-2.9l.3.3Z" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/file-icon.ts

@@ -0,0 +1,16 @@
+import { IconDefinition } from './icon-definition';
+
+export const FILE_ICON: IconDefinition = {
+  name: 'et-file',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M13 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V9m-6-6 6 6m-6-6v6h6"
+        stroke="currentColor"
+        stroke-width="1.5"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/filter-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+/** Funnel glyph for a column's filter menu trigger. */
+export const FILTER_ICON: IconDefinition = {
+  name: 'et-filter',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <path fill="currentColor" d="M1 2h14l-5.5 6.5V14L6.5 12V8.5z" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/floppy-disk-icon.ts

@@ -0,0 +1,27 @@
+import { IconDefinition } from './icon-definition';
+
+export const FLOPPY_DISK_ICON: IconDefinition = {
+  name: 'et-floppy-disk',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M5 3h11l3 3v13a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V3z"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linejoin="round"
+      />
+      <path
+        d="M8 3v6h7V3"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linejoin="round"
+      />
+      <path
+        d="M8 17h8"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/focus-frame-icon.ts

@@ -0,0 +1,16 @@
+import { IconDefinition } from './icon-definition';
+
+export const FOCUS_FRAME_ICON: IconDefinition = {
+  name: 'et-focus-frame',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <path
+        fill="currentColor"
+        fill-rule="evenodd"
+        d="M5.75 4A1.75 1.75 0 0 0 4 5.75v12.5C4 19.216 4.784 20 5.75 20h12.5A1.75 1.75 0 0 0 20 18.25V5.75A1.75 1.75 0 0 0 18.25 4H5.75Zm0 1.5a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V5.75a.25.25 0 0 0-.25-.25H5.75Z"
+        clip-rule="evenodd"
+      />
+      <rect x="8" y="8" width="8" height="8" rx="1.25" fill="currentColor" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/grid-2x2-icon.ts

@@ -0,0 +1,17 @@
+import { IconDefinition } from './icon-definition';
+
+export const GRID_2X2_ICON: IconDefinition = {
+  name: 'et-grid-2x2',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <path
+        fill="currentColor"
+        fill-rule="evenodd"
+        d="M5.75 4A1.75 1.75 0 0 0 4 5.75v12.5C4 19.216 4.784 20 5.75 20h12.5A1.75 1.75 0 0 0 20 18.25V5.75A1.75 1.75 0 0 0 18.25 4H5.75Zm0 1.5a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25V5.75a.25.25 0 0 0-.25-.25H5.75Z"
+        clip-rule="evenodd"
+      />
+      <rect x="11.25" y="5.5" width="1.5" height="13" fill="currentColor" />
+      <rect x="5.5" y="11.25" width="13" height="1.5" fill="currentColor" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/heading-1-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const HEADING_1_ICON: IconDefinition = {
+  name: 'et-heading-1',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <text x="8" y="12" font-size="11" font-weight="700" text-anchor="middle" fill="currentColor">H1</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/heading-2-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const HEADING_2_ICON: IconDefinition = {
+  name: 'et-heading-2',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <text x="8" y="12" font-size="11" font-weight="700" text-anchor="middle" fill="currentColor">H2</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/heading-3-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const HEADING_3_ICON: IconDefinition = {
+  name: 'et-heading-3',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <text x="8" y="12" font-size="11" font-weight="700" text-anchor="middle" fill="currentColor">H3</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/icon-definition.ts

@@ -0,0 +1,14 @@
+export type IconDefinition = {
+  name: string;
+  /**
+   * Optional style variant (e.g. `'solid'`, `'light'`, `'regular'`). Lets the same icon
+   * `name` exist in several styles without encoding the style into the name. Icons
+   * registered without a variant are matched by their bare name.
+   */
+  variant?: string;
+  /**
+   * The SVG markup. It is rendered as-is without sanitising, so it must be trusted, build-time markup -
+   * never a string from a CMS, an API or user input.
+   */
+  data: string;
+};

package/src/lib/icon/headless/image-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const IMAGE_ICON: IconDefinition = {
+  name: 'et-image',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+      <path
+        fill="currentColor"
+        d="M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/italic-icon.ts

@@ -0,0 +1,19 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const ITALIC_ICON: IconDefinition = {
+  name: 'et-italic',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <text
+        x="8"
+        y="12"
+        font-size="12"
+        font-style="italic"
+        font-family="serif"
+        text-anchor="middle"
+        fill="currentColor"
+      >I</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/link-icon.ts

@@ -0,0 +1,17 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const LINK_ICON: IconDefinition = {
+  name: 'et-link',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none">
+      <path
+        d="M6.5 9.5l3-3M7 4.5l1-1a2.5 2.5 0 013.5 3.5l-1 1M9 11.5l-1 1A2.5 2.5 0 014.5 9l1-1"
+        stroke="currentColor"
+        stroke-width="1.4"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/list-bulleted-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const LIST_BULLETED_ICON: IconDefinition = {
+  name: 'et-list-bulleted',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none">
+      <circle cx="2.5" cy="4" r="1.2" fill="currentColor" />
+      <circle cx="2.5" cy="8" r="1.2" fill="currentColor" />
+      <circle cx="2.5" cy="12" r="1.2" fill="currentColor" />
+      <path d="M6 4h8M6 8h8M6 12h8" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/list-numbered-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const LIST_NUMBERED_ICON: IconDefinition = {
+  name: 'et-list-numbered',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none">
+      <path d="M6 4h8M6 8h8M6 12h8" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" />
+      <text x="1" y="5.4" font-size="5" fill="currentColor">1</text>
+      <text x="1" y="9.6" font-size="5" fill="currentColor">2</text>
+      <text x="1" y="13.8" font-size="5" fill="currentColor">3</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/location-icon.ts

@@ -0,0 +1,21 @@
+import { IconDefinition } from './icon-definition';
+
+export const LOCATION_ICON: IconDefinition = {
+  name: 'et-location',
+  data: `
+    <svg
+      width="100%"
+      height="100%"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="1.8"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <path d="M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z" />
+      <circle cx="12" cy="9.5" r="2.25" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/lock-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const LOCK_ICON: IconDefinition = {
+  name: 'et-lock',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
+      <path
+        fill="currentColor"
+        d="M144 144l0 48 160 0 0-48c0-44.2-35.8-80-80-80s-80 35.8-80 80zM80 192l0-48C80 64.5 144.5 0 224 0s144 64.5 144 144l0 48 48 0c26.5 0 48 21.5 48 48l0 224c0 26.5-21.5 48-48 48L32 512c-26.5 0-48-21.5-48-48L-16 240c0-26.5 21.5-48 48-48l48 0zm144 184c22.1 0 40-17.9 40-40s-17.9-40-40-40s-40 17.9-40 40s17.9 40 40 40z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/minus-icon.ts

@@ -0,0 +1,14 @@
+import { IconDefinition } from './icon-definition';
+
+// Font Awesome Pro 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2024 Fonticons, Inc.
+export const MINUS_ICON: IconDefinition = {
+  name: 'et-minus',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
+      <path
+        fill="currentColor"
+        d="M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/paragraph-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+// Custom icon.
+export const PARAGRAPH_ICON: IconDefinition = {
+  name: 'et-paragraph',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+      <text x="8" y="12" font-size="12" font-weight="700" text-anchor="middle" fill="currentColor">¶</text>
+    </svg>
+  `,
+};

package/src/lib/icon/headless/pause-icon.ts

@@ -0,0 +1,11 @@
+import { IconDefinition } from './icon-definition';
+
+export const PAUSE_ICON: IconDefinition = {
+  name: 'et-pause',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <path fill="currentColor" d="M7 4h3.5a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z" />
+      <path fill="currentColor" d="M13.5 4H17a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3.5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/pencil-icon.ts

@@ -0,0 +1,21 @@
+import { IconDefinition } from './icon-definition';
+
+export const PENCIL_ICON: IconDefinition = {
+  name: 'et-pencil',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M4 20l4.2-1 9.3-9.3a1.8 1.8 0 0 0 0-2.5l-.7-.7a1.8 1.8 0 0 0-2.5 0L5 15.8 4 20z"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linejoin="round"
+      />
+      <path
+        d="M12.8 7.2l4 4"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/play-icon.ts

@@ -0,0 +1,10 @@
+import { IconDefinition } from './icon-definition';
+
+export const PLAY_ICON: IconDefinition = {
+  name: 'et-play',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+      <path fill="currentColor" d="M8 5.14a1 1 0 0 1 1.52-.85l10 6.86a1 1 0 0 1 0 1.7l-10 6.86A1 1 0 0 1 8 18.86z" />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/plus-icon.ts

@@ -0,0 +1,21 @@
+import { IconDefinition } from './icon-definition';
+
+export const PLUS_ICON: IconDefinition = {
+  name: 'et-plus',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M12 5v14"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+      />
+      <path
+        d="M5 12h14"
+        stroke="currentColor"
+        stroke-width="1.8"
+        stroke-linecap="round"
+      />
+    </svg>
+  `,
+};

package/src/lib/icon/headless/quote-icon.ts

@@ -0,0 +1,15 @@
+import { IconDefinition } from './icon-definition';
+
+// Two filled quotation marks - the block-quote tool's mark, drawn rather than typeset so it doesn't
+// depend on the font's glyph.
+export const QUOTE_ICON: IconDefinition = {
+  name: 'et-quote',
+  data: `
+    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none">
+      <path
+        d="M10 6.5C7 7.5 5.5 10 5.5 13v4.5h5V12H8c0-2 .7-3.3 2-4zm9 0c-3 1-4.5 3.5-4.5 6.5v4.5h5V12H17c0-2 .7-3.3 2-4z"
+        fill="currentColor"
+      />
+    </svg>
+  `,
+};