bareframe 0.1.2 → 0.1.3

package/dist/index.js

@@ -150,9 +150,6 @@ var BfActionList = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "action list";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -177,9 +174,6 @@ var BfAnchor = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "anchor";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -473,9 +467,6 @@ var BfBottomNavigation = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "bottom navigation";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -592,10 +583,6 @@ var BfBreadcrumb = class extends HTMLElement {
     this._root.setAttribute("data-variant", this._variant());
     this._list.replaceChildren();
     if (!items.length) {
-      const fallback = document.createElement("li");
-      fallback.className = "item";
-      fallback.textContent = "breadcrumb";
-      this._list.append(fallback);
       return;
     }
     items.forEach((item, index) => {
@@ -646,7 +633,7 @@ var BfButton = class extends HTMLElement {
       return;
     }
     this._initialized = true;
-    const label = this.getAttribute("label") || "Button";
+    const label = this.getAttribute("label") || "";
     const cssUrl = new URL("data:text/css;charset=utf-8,%3Ahost%20%7B%0A%09--bf-button-font%3A%20var(--bf-theme-font-family%2C%20inherit)%3B%0A%09--bf-button-border-width%3A%20var(--bf-theme-border-width%2C%201px)%3B%0A%09--bf-button-border-style%3A%20var(--bf-theme-border-style%2C%20solid)%3B%0A%09--bf-button-border-radius%3A%20var(--bf-theme-radius-md%2C%206px)%3B%0A%09--bf-button-padding-y%3A%20var(--bf-theme-space-2%2C%200.5rem)%3B%0A%09--bf-button-padding-x%3A%20var(--bf-theme-space-3%2C%200.9rem)%3B%0A%09--bf-button-cursor%3A%20var(--bf-theme-cursor-button%2C%20pointer)%3B%0A%09--bf-button-opacity-hover%3A%20var(--bf-theme-opacity-hover%2C%200.95)%3B%0A%09--bf-button-active-translate-y%3A%20var(--bf-theme-active-translate-y%2C%201px)%3B%0A%09--bf-button-focus-outline-width%3A%20var(--bf-theme-focus-ring-width%2C%202px)%3B%0A%09--bf-button-focus-outline-style%3A%20var(--bf-theme-focus-ring-style%2C%20solid)%3B%0A%09--bf-button-focus-outline-color%3A%20var(--bf-theme-focus-ring-color%2C%20%2393c5fd)%3B%0A%09--bf-button-focus-outline-offset%3A%20var(--bf-theme-focus-ring-offset%2C%202px)%3B%0A%09--bf-button-transition%3A%0A%09%09var(--bf-theme-transition-transform%2C%20transform%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-opacity%2C%20opacity%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-bg%2C%20background-color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-color%2C%20color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-border%2C%20border-color%20120ms%20ease)%3B%0A%0A%09--bf-button-primary-bg%3A%20var(--bf-theme-button-primary-bg%2C%20%231d4ed8)%3B%0A%09--bf-button-primary-color%3A%20var(--bf-theme-button-primary-color%2C%20%23ffffff)%3B%0A%09--bf-button-primary-border-color%3A%20var(%0A%09%09--bf-theme-button-primary-border-color%2C%0A%09%09transparent%0A%09)%3B%0A%09--bf-button-primary-hover-bg%3A%20var(--bf-button-primary-bg)%3B%0A%09--bf-button-primary-hover-color%3A%20var(--bf-button-primary-color)%3B%0A%09--bf-button-primary-hover-border-color%3A%20var(--bf-button-primary-border-color)%3B%0A%09--bf-button-primary-active-bg%3A%20var(--bf-button-primary-bg)%3B%0A%09--bf-button-primary-active-color%3A%20var(--bf-button-primary-color)%3B%0A%09--bf-button-primary-active-border-color%3A%20var(%0A%09%09--bf-button-primary-border-color%0A%09)%3B%0A%0A%09--bf-button-secondary-bg%3A%20var(--bf-theme-button-secondary-bg%2C%20%23ffffff)%3B%0A%09--bf-button-secondary-color%3A%20var(--bf-theme-button-secondary-color%2C%20%231d4ed8)%3B%0A%09--bf-button-secondary-border-color%3A%20var(%0A%09%09--bf-theme-button-secondary-border-color%2C%0A%09%09%231d4ed8%0A%09)%3B%0A%09--bf-button-secondary-hover-bg%3A%20var(--bf-button-secondary-bg)%3B%0A%09--bf-button-secondary-hover-color%3A%20var(--bf-button-secondary-color)%3B%0A%09--bf-button-secondary-hover-border-color%3A%20var(%0A%09%09--bf-button-secondary-border-color%0A%09)%3B%0A%09--bf-button-secondary-active-bg%3A%20var(--bf-button-secondary-bg)%3B%0A%09--bf-button-secondary-active-color%3A%20var(--bf-button-secondary-color)%3B%0A%09--bf-button-secondary-active-border-color%3A%20var(%0A%09%09--bf-button-secondary-border-color%0A%09)%3B%0A%0A%09display%3A%20inline-block%3B%0A%7D%0A%0Abutton%20%7B%0A%09--_bf-button-bg%3A%20var(--bf-button-primary-bg)%3B%0A%09--_bf-button-color%3A%20var(--bf-button-primary-color)%3B%0A%09--_bf-button-border-color%3A%20var(--bf-button-primary-border-color)%3B%0A%09--_bf-button-hover-bg%3A%20var(--bf-button-primary-hover-bg)%3B%0A%09--_bf-button-hover-color%3A%20var(--bf-button-primary-hover-color)%3B%0A%09--_bf-button-hover-border-color%3A%20var(--bf-button-primary-hover-border-color)%3B%0A%09--_bf-button-active-bg%3A%20var(--bf-button-primary-active-bg)%3B%0A%09--_bf-button-active-color%3A%20var(--bf-button-primary-active-color)%3B%0A%09--_bf-button-active-border-color%3A%20var(%0A%09%09--bf-button-primary-active-border-color%0A%09)%3B%0A%0A%09font%3A%20var(--bf-button-font)%3B%0A%09border-width%3A%20var(--bf-button-border-width)%3B%0A%09border-style%3A%20var(--bf-button-border-style)%3B%0A%09border-color%3A%20var(--_bf-button-border-color)%3B%0A%09border-radius%3A%20var(--bf-button-border-radius)%3B%0A%09cursor%3A%20var(--bf-button-cursor)%3B%0A%09padding%3A%20var(--bf-button-padding-y)%20var(--bf-button-padding-x)%3B%0A%09transition%3A%20var(--bf-button-transition)%3B%0A%09background%3A%20var(--_bf-button-bg)%3B%0A%09color%3A%20var(--_bf-button-color)%3B%0A%7D%0A%0Abutton%3Ahover%20%7B%0A%09opacity%3A%20var(--bf-button-opacity-hover)%3B%0A%09background%3A%20var(--_bf-button-hover-bg)%3B%0A%09color%3A%20var(--_bf-button-hover-color)%3B%0A%09border-color%3A%20var(--_bf-button-hover-border-color)%3B%0A%7D%0A%0Abutton%3Aactive%20%7B%0A%09transform%3A%20translateY(var(--bf-button-active-translate-y))%3B%0A%09background%3A%20var(--_bf-button-active-bg)%3B%0A%09color%3A%20var(--_bf-button-active-color)%3B%0A%09border-color%3A%20var(--_bf-button-active-border-color)%3B%0A%7D%0A%0Abutton%3Afocus-visible%20%7B%0A%09outline-width%3A%20var(--bf-button-focus-outline-width)%3B%0A%09outline-style%3A%20var(--bf-button-focus-outline-style)%3B%0A%09outline-color%3A%20var(--bf-button-focus-outline-color)%3B%0A%09outline-offset%3A%20var(--bf-button-focus-outline-offset)%3B%0A%7D%0A%0Abutton%3Adisabled%20%7B%0A%09opacity%3A%20var(--bf-button-disabled-opacity%2C%200.55)%3B%0A%09cursor%3A%20var(--bf-button-disabled-cursor%2C%20not-allowed)%3B%0A%7D%0A%0Abutton.primary%20%7B%0A%09--_bf-button-bg%3A%20var(--bf-button-primary-bg)%3B%0A%09--_bf-button-color%3A%20var(--bf-button-primary-color)%3B%0A%09--_bf-button-border-color%3A%20var(--bf-button-primary-border-color)%3B%0A%09--_bf-button-hover-bg%3A%20var(--bf-button-primary-hover-bg)%3B%0A%09--_bf-button-hover-color%3A%20var(--bf-button-primary-hover-color)%3B%0A%09--_bf-button-hover-border-color%3A%20var(--bf-button-primary-hover-border-color)%3B%0A%09--_bf-button-active-bg%3A%20var(--bf-button-primary-active-bg)%3B%0A%09--_bf-button-active-color%3A%20var(--bf-button-primary-active-color)%3B%0A%09--_bf-button-active-border-color%3A%20var(%0A%09%09--bf-button-primary-active-border-color%0A%09)%3B%0A%7D%0A%0Abutton.secondary%20%7B%0A%09--_bf-button-bg%3A%20var(--bf-button-secondary-bg)%3B%0A%09--_bf-button-color%3A%20var(--bf-button-secondary-color)%3B%0A%09--_bf-button-border-color%3A%20var(--bf-button-secondary-border-color)%3B%0A%09--_bf-button-hover-bg%3A%20var(--bf-button-secondary-hover-bg)%3B%0A%09--_bf-button-hover-color%3A%20var(--bf-button-secondary-hover-color)%3B%0A%09--_bf-button-hover-border-color%3A%20var(%0A%09%09--bf-button-secondary-hover-border-color%0A%09)%3B%0A%09--_bf-button-active-bg%3A%20var(--bf-button-secondary-active-bg)%3B%0A%09--_bf-button-active-color%3A%20var(--bf-button-secondary-active-color)%3B%0A%09--_bf-button-active-border-color%3A%20var(%0A%09%09--bf-button-secondary-active-border-color%0A%09)%3B%0A%7D%0A%0Abutton.is-selected%20%7B%0A%09box-shadow%3A%20inset%200%200%200%202px%20var(--bf-theme-focus-ring-color%2C%20%2393c5fd)%3B%0A%7D%0A", import.meta.url);
     this.shadowRoot.innerHTML = "";
     const link = document.createElement("link");
@@ -677,7 +664,7 @@ var BfButton = class extends HTMLElement {
   }
   _onClick() {
     this._applyGroupSelection();
-    const label = this.getAttribute("label") || "Button";
+    const label = this.getAttribute("label") || "";
     const variant = this.getAttribute("variant") || "primary";
     this.dispatchEvent(
       new CustomEvent("bf-click", {
@@ -759,9 +746,6 @@ var BfCalendar = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "calendar";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -786,9 +770,6 @@ var BfCanvas = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "canvas";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -813,9 +794,6 @@ var BfCard = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "card";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -840,9 +818,6 @@ var BfCarousel = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "carousel";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1037,33 +1012,6 @@ var BfCheckbox = class extends HTMLElement {
 __publicField(BfCheckbox, "observedAttributes", ["checked", "disabled", "label", "value"]);
 customElements.define("bf-checkbox", BfCheckbox);
 
-// src/code-block/code-block.js
-var BfCodeBlock = class extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: "open" });
-  }
-  connectedCallback() {
-    if (this._initialized) {
-      return;
-    }
-    this._initialized = true;
-    const cssUrl = new URL("data:text/css;charset=utf-8,%3Ahost%20%7B%0A%09--bf-code-block-font%3A%20var(--bf-theme-font-family%2C%20inherit)%3B%0A%09--bf-code-block-radius%3A%20var(--bf-theme-radius-md%2C%208px)%3B%0A%09--bf-code-block-border-width%3A%20var(--bf-theme-border-width%2C%201px)%3B%0A%09--bf-code-block-border-style%3A%20var(--bf-theme-border-style%2C%20solid)%3B%0A%09--bf-code-block-border-color%3A%20var(--bf-theme-code-block-border-color%2C%20var(--bf-theme-border-1%2C%20%23cbd5e1))%3B%0A%09--bf-code-block-bg%3A%20var(--bf-theme-code-block-bg%2C%20var(--bf-theme-surface-1%2C%20%23ffffff))%3B%0A%09--bf-code-block-color%3A%20var(--bf-theme-code-block-color%2C%20var(--bf-theme-text-1%2C%20%230f172a))%3B%0A%09--bf-code-block-padding-y%3A%20var(--bf-theme-space-2%2C%200.6rem)%3B%0A%09--bf-code-block-padding-x%3A%20var(--bf-theme-space-3%2C%200.9rem)%3B%0A%09--bf-code-block-transition%3A%0A%09%09var(--bf-theme-transition-bg%2C%20background-color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-color%2C%20color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-border%2C%20border-color%20120ms%20ease)%3B%0A%0A%09display%3A%20block%3B%0A%09font%3A%20var(--bf-code-block-font)%3B%0A%09color%3A%20var(--bf-code-block-color)%3B%0A%7D%0A%0A.root%20%7B%0A%09background%3A%20var(--bf-code-block-bg)%3B%0A%09color%3A%20var(--bf-code-block-color)%3B%0A%09border-width%3A%20var(--bf-code-block-border-width)%3B%0A%09border-style%3A%20var(--bf-code-block-border-style)%3B%0A%09border-color%3A%20var(--bf-code-block-border-color)%3B%0A%09border-radius%3A%20var(--bf-code-block-radius)%3B%0A%09padding%3A%20var(--bf-code-block-padding-y)%20var(--bf-code-block-padding-x)%3B%0A%09transition%3A%20var(--bf-code-block-transition)%3B%0A%7D%0A", import.meta.url);
-    const link = document.createElement("link");
-    link.rel = "stylesheet";
-    link.href = cssUrl.href;
-    const root = document.createElement("div");
-    root.className = "root";
-    root.setAttribute("part", "root");
-    root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "code block";
-    }
-    this.shadowRoot.replaceChildren(link, root);
-  }
-};
-customElements.define("bf-code-block", BfCodeBlock);
-
 // src/combobox/combobox.js
 var BfCombobox = class extends HTMLElement {
   constructor() {
@@ -1083,9 +1031,6 @@ var BfCombobox = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "combobox";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1110,9 +1055,6 @@ var BfCommandPalette = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "command palette";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1137,9 +1079,6 @@ var BfCountdown = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "countdown";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1164,9 +1103,6 @@ var BfDataGrid = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "data grid";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1191,9 +1127,6 @@ var BfDatePicker = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "date picker";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1218,9 +1151,6 @@ var BfDateRangePicker = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "date range picker";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1255,9 +1185,6 @@ var BfDialog = class extends HTMLElement {
     this._backdrop = root.querySelector(".backdrop");
     this._panel = root.querySelector(".panel");
     this._backdrop.addEventListener("click", this._onBackdropClick);
-    if (!this.textContent?.trim()) {
-      this.textContent = "dialog";
-    }
     this._sync();
   }
   attributeChangedCallback() {
@@ -1478,9 +1405,6 @@ var BfDrawer = class extends HTMLElement {
     this._root = root;
     this._backdrop = root.querySelector(".backdrop");
     this._backdrop.addEventListener("click", this._onBackdropClick);
-    if (!this.textContent?.trim()) {
-      this.textContent = "drawer";
-    }
     this._sync();
   }
   attributeChangedCallback() {
@@ -1565,9 +1489,6 @@ var BfDropdown = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "dropdown";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1593,9 +1514,6 @@ var BfEdge = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "edge";
-    }
     this.shadowRoot.replaceChildren(link, root);
     this._syncPosition();
   }
@@ -1620,6 +1538,157 @@ var BfEdge = class extends HTMLElement {
 __publicField(BfEdge, "observedAttributes", ["position", "sticky", "fixed", "header", "footer"]);
 customElements.define("bf-edge", BfEdge);
 
+// src/editor/editor.js
+var BfEditor = class extends HTMLElement {
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+    this._onInput = this._onInput.bind(this);
+    this._onToolbarClick = this._onToolbarClick.bind(this);
+  }
+  connectedCallback() {
+    if (this._initialized) {
+      this._sync();
+      return;
+    }
+    this._initialized = true;
+    const cssUrl = new URL("data:text/css;charset=utf-8,%3Ahost%20%7B%0A%09--bf-editor-font%3A%20var(--bf-theme-font-family%2C%20inherit)%3B%0A%09--bf-editor-radius%3A%20var(--bf-theme-radius-md%2C%208px)%3B%0A%09--bf-editor-border-width%3A%20var(--bf-theme-border-width%2C%201px)%3B%0A%09--bf-editor-border-style%3A%20var(--bf-theme-border-style%2C%20solid)%3B%0A%09--bf-editor-border-color%3A%20var(--bf-theme-editor-border-color%2C%20var(--bf-theme-border-1%2C%20%23cbd5e1))%3B%0A%09--bf-editor-bg%3A%20var(--bf-theme-editor-bg%2C%20var(--bf-theme-surface-1%2C%20%23ffffff))%3B%0A%09--bf-editor-color%3A%20var(--bf-theme-editor-color%2C%20var(--bf-theme-text-1%2C%20%230f172a))%3B%0A%09--bf-editor-muted%3A%20var(--bf-theme-text-2%2C%20%2364748b)%3B%0A%09--bf-editor-code-bg%3A%20color-mix(in%20srgb%2C%20var(--bf-editor-bg)%2086%25%2C%20%230f172a%2014%25)%3B%0A%09--bf-editor-code-color%3A%20%23e2e8f0%3B%0A%0A%09display%3A%20block%3B%0A%09font%3A%20var(--bf-editor-font)%3B%0A%09color%3A%20var(--bf-editor-color)%3B%0A%7D%0A%0A.root%20%7B%0A%09background%3A%20var(--bf-editor-bg)%3B%0A%09color%3A%20var(--bf-editor-color)%3B%0A%09border-width%3A%20var(--bf-editor-border-width)%3B%0A%09border-style%3A%20var(--bf-editor-border-style)%3B%0A%09border-color%3A%20var(--bf-editor-border-color)%3B%0A%09border-radius%3A%20var(--bf-editor-radius)%3B%0A%09overflow%3A%20hidden%3B%0A%7D%0A%0A.toolbar%20%7B%0A%09display%3A%20none%3B%0A%09gap%3A%200.35rem%3B%0A%09padding%3A%200.5rem%3B%0A%09border-bottom%3A%201px%20solid%20var(--bf-editor-border-color)%3B%0A%09background%3A%20color-mix(in%20srgb%2C%20var(--bf-editor-bg)%2092%25%2C%20var(--bf-editor-border-color))%3B%0A%7D%0A%0A.toolbar%20button%20%7B%0A%09border%3A%201px%20solid%20var(--bf-editor-border-color)%3B%0A%09background%3A%20var(--bf-editor-bg)%3B%0A%09color%3A%20var(--bf-editor-color)%3B%0A%09border-radius%3A%206px%3B%0A%09padding%3A%200.22rem%200.45rem%3B%0A%09cursor%3A%20pointer%3B%0A%09font%3A%20inherit%3B%0A%09font-size%3A%200.85rem%3B%0A%7D%0A%0A.code-wrap%20%7B%0A%09display%3A%20grid%3B%0A%09grid-template-columns%3A%20auto%201fr%3B%0A%09min-height%3A%20220px%3B%0A%09background%3A%20var(--bf-editor-code-bg)%3B%0A%7D%0A%0A.line-numbers%20%7B%0A%09padding%3A%200.8rem%200.55rem%3B%0A%09margin%3A%200%3B%0A%09white-space%3A%20pre%3B%0A%09line-height%3A%201.45%3B%0A%09font-family%3A%20ui-monospace%2C%20SFMono-Regular%2C%20Menlo%2C%20Monaco%2C%20Consolas%2C%20'Liberation%20Mono'%2C%20'Courier%20New'%2C%20monospace%3B%0A%09font-size%3A%200.85rem%3B%0A%09color%3A%20color-mix(in%20srgb%2C%20var(--bf-editor-code-color)%2055%25%2C%20transparent)%3B%0A%09border-right%3A%201px%20solid%20color-mix(in%20srgb%2C%20var(--bf-editor-border-color)%2080%25%2C%20transparent)%3B%0A%09user-select%3A%20none%3B%0A%7D%0A%0A.code%20%7B%0A%09width%3A%20100%25%3B%0A%09min-height%3A%20220px%3B%0A%09resize%3A%20vertical%3B%0A%09padding%3A%200.8rem%3B%0A%09border%3A%200%3B%0A%09outline%3A%200%3B%0A%09background%3A%20transparent%3B%0A%09color%3A%20var(--bf-editor-code-color)%3B%0A%09font-family%3A%20ui-monospace%2C%20SFMono-Regular%2C%20Menlo%2C%20Monaco%2C%20Consolas%2C%20'Liberation%20Mono'%2C%20'Courier%20New'%2C%20monospace%3B%0A%09font-size%3A%200.9rem%3B%0A%09line-height%3A%201.45%3B%0A%7D%0A%0A.rich%20%7B%0A%09display%3A%20none%3B%0A%09min-height%3A%20220px%3B%0A%09padding%3A%200.8rem%3B%0A%09outline%3A%20none%3B%0A%09line-height%3A%201.5%3B%0A%7D%0A%0A.rich%3Aempty%3A%3Abefore%20%7B%0A%09content%3A%20attr(data-placeholder)%3B%0A%09color%3A%20var(--bf-editor-muted)%3B%0A%7D%0A%0A.root%5Bdata-variant%3D'richtext'%5D%20.toolbar%20%7B%0A%09display%3A%20flex%3B%0A%7D%0A%0A.root%5Bdata-variant%3D'richtext'%5D%20.code-wrap%20%7B%0A%09display%3A%20none%3B%0A%7D%0A%0A.root%5Bdata-variant%3D'richtext'%5D%20.rich%20%7B%0A%09display%3A%20block%3B%0A%7D%0A%0A%3Ahost(%5Bdisabled%5D)%20%7B%0A%09opacity%3A%200.72%3B%0A%7D%0A%0A%3Ahost(%5Bdisabled%5D)%20.toolbar%20button%20%7B%0A%09cursor%3A%20not-allowed%3B%0A%7D%0A", import.meta.url);
+    const link = document.createElement("link");
+    link.rel = "stylesheet";
+    link.href = cssUrl.href;
+    const root = document.createElement("div");
+    root.className = "root";
+    root.setAttribute("part", "root");
+    root.innerHTML = `
+			<div class="toolbar" part="toolbar">
+				<button type="button" data-cmd="bold" title="Bold"><b>B</b></button>
+				<button type="button" data-cmd="italic" title="Italic"><i>I</i></button>
+				<button type="button" data-cmd="underline" title="Underline"><u>U</u></button>
+				<button type="button" data-cmd="insertUnorderedList" title="Bullet List">\u2022 List</button>
+				<button type="button" data-cmd="insertOrderedList" title="Numbered List">1. List</button>
+			</div>
+			<div class="code-wrap" part="code-wrap">
+				<div class="line-numbers" part="line-numbers"></div>
+				<textarea class="code" part="code"></textarea>
+			</div>
+			<div class="rich" part="rich" contenteditable="true"></div>
+		</div>
+		`;
+    this.shadowRoot.replaceChildren(link, root);
+    this._root = root;
+    this._toolbar = root.querySelector(".toolbar");
+    this._codeWrap = root.querySelector(".code-wrap");
+    this._lineNumbers = root.querySelector(".line-numbers");
+    this._code = root.querySelector(".code");
+    this._rich = root.querySelector(".rich");
+    this._code.addEventListener("input", this._onInput);
+    this._rich.addEventListener("input", this._onInput);
+    this._toolbar.addEventListener("click", this._onToolbarClick);
+    this._sync();
+  }
+  disconnectedCallback() {
+    if (!this._code || !this._rich || !this._toolbar) {
+      return;
+    }
+    this._code.removeEventListener("input", this._onInput);
+    this._rich.removeEventListener("input", this._onInput);
+    this._toolbar.removeEventListener("click", this._onToolbarClick);
+  }
+  attributeChangedCallback() {
+    this._sync();
+  }
+  _variant() {
+    const explicit = (this.getAttribute("variant") || "").toLowerCase();
+    if (explicit === "richtext" || this.hasAttribute("richtext")) {
+      return "richtext";
+    }
+    if (explicit === "code" || this.hasAttribute("code")) {
+      return "code";
+    }
+    return "code";
+  }
+  _sync() {
+    if (!this._root || !this._code || !this._rich || !this._toolbar) {
+      return;
+    }
+    const variant = this._variant();
+    this._root.dataset.variant = variant;
+    const disabled = this.hasAttribute("disabled");
+    this._code.disabled = disabled;
+    this._rich.setAttribute("contenteditable", disabled ? "false" : "true");
+    const placeholder = this.getAttribute("placeholder") || (variant === "richtext" ? "Write rich content\u2026" : "Write code\u2026");
+    this._code.placeholder = placeholder;
+    this._rich.dataset.placeholder = placeholder;
+    const value = this.getAttribute("value");
+    if (value != null && this._lastSyncedValue !== value) {
+      if (variant === "richtext") {
+        this._rich.innerHTML = value;
+      } else {
+        this._code.value = value;
+        this._renderLineNumbers();
+      }
+      this._lastSyncedValue = value;
+    } else if (value == null && !this._hasUserInput) {
+      const initial = this.textContent.trim();
+      if (initial) {
+        if (variant === "richtext") {
+          this._rich.innerHTML = initial;
+        } else {
+          this._code.value = initial;
+          this._renderLineNumbers();
+        }
+        this._hasUserInput = true;
+      }
+    }
+    if (variant === "code") {
+      this._renderLineNumbers();
+    }
+  }
+  _onInput() {
+    const variant = this._variant();
+    this._hasUserInput = true;
+    if (variant === "code") {
+      this._renderLineNumbers();
+      this.setAttribute("value", this._code.value);
+      this._lastSyncedValue = this._code.value;
+      this._emitChange(this._code.value, "code");
+      return;
+    }
+    this.setAttribute("value", this._rich.innerHTML);
+    this._lastSyncedValue = this._rich.innerHTML;
+    this._emitChange(this._rich.innerHTML, "richtext");
+  }
+  _renderLineNumbers() {
+    const lineCount = Math.max(1, this._code.value.split("\n").length);
+    const text = Array.from({ length: lineCount }, (_, i) => String(i + 1)).join("\n");
+    this._lineNumbers.textContent = text;
+  }
+  _onToolbarClick(event) {
+    const button = event.target instanceof Element ? event.target.closest("button[data-cmd]") : null;
+    if (!button || this._variant() !== "richtext" || this.hasAttribute("disabled")) {
+      return;
+    }
+    const command = button.getAttribute("data-cmd");
+    if (!command) {
+      return;
+    }
+    this._rich.focus();
+    document.execCommand(command, false);
+    this._onInput();
+  }
+  _emitChange(value, mode) {
+    this.dispatchEvent(
+      new CustomEvent("bf-change", {
+        bubbles: true,
+        composed: true,
+        detail: { value, mode }
+      })
+    );
+  }
+};
+__publicField(BfEditor, "observedAttributes", ["variant", "code", "richtext", "placeholder", "value", "disabled"]);
+customElements.define("bf-editor", BfEditor);
+
 // src/empty-state/empty-state.js
 var BfEmptyState = class extends HTMLElement {
   constructor() {
@@ -1639,9 +1708,6 @@ var BfEmptyState = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "empty state";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1666,9 +1732,6 @@ var BfErrorSummary = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "error summary";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1693,9 +1756,6 @@ var BfFab = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "fab";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1894,9 +1954,6 @@ var BfFilterBar = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "filter bar";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1921,9 +1978,6 @@ var BfFormField = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "form field";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1948,9 +2002,6 @@ var BfGrid = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "grid";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -1975,9 +2026,6 @@ var BfHero = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "hero";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2002,9 +2050,6 @@ var BfIcon = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "icon";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2029,9 +2074,6 @@ var BfImage = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "image";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2411,9 +2453,6 @@ var BfKeyValueList = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "key-value list";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2438,9 +2477,6 @@ var BfLink = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "link";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2466,9 +2502,6 @@ var BfList = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "list";
-    }
     this.shadowRoot.replaceChildren(link, root);
     this._slot = root.querySelector("slot");
     this._slot.addEventListener("slotchange", this._onSlotChange);
@@ -2532,9 +2565,6 @@ var BfLoadingIndicator = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "loading indicator";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2559,9 +2589,6 @@ var BfMap = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "map";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2590,9 +2617,6 @@ var BfMenu = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "menu";
-    }
     this.shadowRoot.replaceChildren(link, root);
     this._root = root;
     this._slot = root.querySelector("slot");
@@ -2742,9 +2766,6 @@ var BfMessage = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "message";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2769,9 +2790,6 @@ var BfMetricCard = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "metric card";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2805,9 +2823,6 @@ var BfModal = class extends HTMLElement {
     this._root = root;
     this._backdrop = root.querySelector(".backdrop");
     this._backdrop.addEventListener("click", this._onBackdropClick);
-    if (!this.textContent?.trim()) {
-      this.textContent = "modal";
-    }
     this._sync();
   }
   attributeChangedCallback() {
@@ -2876,9 +2891,6 @@ var BfNav = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "nav";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2903,9 +2915,6 @@ var BfNumberField = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "number field";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2930,9 +2939,6 @@ var BfOtpInput = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "otp input";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -2957,9 +2963,6 @@ var BfPagination = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "pagination";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -3253,9 +3256,6 @@ var BfQuickActions = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "quick actions";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -3597,9 +3597,6 @@ var BfSearch = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "search";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -3624,9 +3621,6 @@ var BfSegmentedControl = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "segmented control";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -3969,9 +3963,6 @@ var BfSplitButton = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "split button";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -3996,9 +3987,6 @@ var BfSplitter = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "splitter";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4023,9 +4011,6 @@ var BfStack = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "stack";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4053,9 +4038,6 @@ var BfTab = class extends HTMLElement {
     root.setAttribute("part", "root");
     root.type = "button";
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "tab";
-    }
     this.shadowRoot.replaceChildren(link, root);
     this._button = root;
     root.addEventListener("click", this._onClick);
@@ -4134,9 +4116,6 @@ var BfTable = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "table";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4162,9 +4141,6 @@ var BfTag = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "tag";
-    }
     this.shadowRoot.replaceChildren(link, root);
     this._root = root;
     this._sync();
@@ -4195,33 +4171,6 @@ var BfTag = class extends HTMLElement {
 __publicField(BfTag, "observedAttributes", ["variant", "badge", "chip", "pill", "size"]);
 customElements.define("bf-tag", BfTag);
 
-// src/textarea/textarea.js
-var BfTextarea = class extends HTMLElement {
-  constructor() {
-    super();
-    this.attachShadow({ mode: "open" });
-  }
-  connectedCallback() {
-    if (this._initialized) {
-      return;
-    }
-    this._initialized = true;
-    const cssUrl = new URL("data:text/css;charset=utf-8,%3Ahost%20%7B%0A%09--bf-textarea-font%3A%20var(--bf-theme-font-family%2C%20inherit)%3B%0A%09--bf-textarea-radius%3A%20var(--bf-theme-radius-md%2C%208px)%3B%0A%09--bf-textarea-border-width%3A%20var(--bf-theme-border-width%2C%201px)%3B%0A%09--bf-textarea-border-style%3A%20var(--bf-theme-border-style%2C%20solid)%3B%0A%09--bf-textarea-border-color%3A%20var(--bf-theme-textarea-border-color%2C%20var(--bf-theme-border-1%2C%20%23cbd5e1))%3B%0A%09--bf-textarea-bg%3A%20var(--bf-theme-textarea-bg%2C%20var(--bf-theme-surface-1%2C%20%23ffffff))%3B%0A%09--bf-textarea-color%3A%20var(--bf-theme-textarea-color%2C%20var(--bf-theme-text-1%2C%20%230f172a))%3B%0A%09--bf-textarea-padding-y%3A%20var(--bf-theme-space-2%2C%200.6rem)%3B%0A%09--bf-textarea-padding-x%3A%20var(--bf-theme-space-3%2C%200.9rem)%3B%0A%09--bf-textarea-transition%3A%0A%09%09var(--bf-theme-transition-bg%2C%20background-color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-color%2C%20color%20120ms%20ease)%2C%0A%09%09var(--bf-theme-transition-border%2C%20border-color%20120ms%20ease)%3B%0A%0A%09display%3A%20block%3B%0A%09font%3A%20var(--bf-textarea-font)%3B%0A%09color%3A%20var(--bf-textarea-color)%3B%0A%7D%0A%0A.root%20%7B%0A%09background%3A%20var(--bf-textarea-bg)%3B%0A%09color%3A%20var(--bf-textarea-color)%3B%0A%09border-width%3A%20var(--bf-textarea-border-width)%3B%0A%09border-style%3A%20var(--bf-textarea-border-style)%3B%0A%09border-color%3A%20var(--bf-textarea-border-color)%3B%0A%09border-radius%3A%20var(--bf-textarea-radius)%3B%0A%09padding%3A%20var(--bf-textarea-padding-y)%20var(--bf-textarea-padding-x)%3B%0A%09transition%3A%20var(--bf-textarea-transition)%3B%0A%7D%0A", import.meta.url);
-    const link = document.createElement("link");
-    link.rel = "stylesheet";
-    link.href = cssUrl.href;
-    const root = document.createElement("div");
-    root.className = "root";
-    root.setAttribute("part", "root");
-    root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "textarea";
-    }
-    this.shadowRoot.replaceChildren(link, root);
-  }
-};
-customElements.define("bf-textarea", BfTextarea);
-
 // src/timeline/timeline.js
 var BfTimeline = class extends HTMLElement {
   constructor() {
@@ -4241,9 +4190,6 @@ var BfTimeline = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "timeline";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4279,9 +4225,6 @@ var BfToast = class extends HTMLElement {
     this._icon = root.querySelector(".icon");
     this._close = root.querySelector(".close");
     this._close.addEventListener("click", this._onCloseClick);
-    if (!this.textContent?.trim()) {
-      this.textContent = "toast";
-    }
     this._syncState();
   }
   disconnectedCallback() {
@@ -4521,9 +4464,6 @@ var BfToggle = class extends HTMLElement {
     this._root = root;
     this._text = root.querySelector(".text");
     this._root.addEventListener("click", this._onClick);
-    if (!this.textContent?.trim()) {
-      this.textContent = "toggle";
-    }
     this._sync();
   }
   attributeChangedCallback() {
@@ -4600,9 +4540,6 @@ var BfToolbar = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "toolbar";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4627,9 +4564,6 @@ var BfTreeView = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "tree view";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4654,9 +4588,6 @@ var BfVideoPlayer = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "video player";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };
@@ -4681,9 +4612,6 @@ var BfVirtualList = class extends HTMLElement {
     root.className = "root";
     root.setAttribute("part", "root");
     root.innerHTML = "<slot></slot>";
-    if (!this.innerHTML.trim()) {
-      root.textContent = "virtual list";
-    }
     this.shadowRoot.replaceChildren(link, root);
   }
 };