bitwrench 2.0.14 → 2.0.16

package/dist/bitwrench-bccl.umd.min.js

@@ -0,0 +1,40 @@
+/*! bitwrench-bccl v2.0.16 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).bwBCCL={})}(this,function(e){"use strict";
+/**
+   * Bitwrench v2 Components
+   *
+   * TACO-based UI component library providing Bootstrap-inspired components
+   * as pure JavaScript objects. Every make* function returns a TACO object
+   * ({t, a, c, o}) that can be rendered with bw.html() or bw.DOM().
+   *
+   * Components included: Card, Button, Container, Row, Col, Nav, Navbar,
+   * Tabs, Alert, Badge, Progress, ListGroup, Breadcrumb, Form controls,
+   * Stack, Spinner, Hero, FeatureGrid, CardV2, CTA, Section, CodeDemo.
+   *
+   * Handle classes (CardHandle, TableHandle, NavbarHandle, TabsHandle)
+   * provide imperative DOM manipulation for rendered components.
+   *
+   * @module bitwrench-bccl
+   * @license BSD-2-Clause
+   * @author M A Chatterjee <deftio [at] deftio [dot] com>
+   */function t(e){return e?0===e.indexOf("outline")?"bw_btn_outline bw_"+e.replace(/^outline[_-]/,""):"bw_"+e:""}function a(e={}){const{title:a,subtitle:s,content:n,footer:c,header:i,image:o,imagePosition:r="top",variant:l,bordered:d=!0,shadow:_,hoverable:b=!1,className:u="",style:m,headerClass:p="",bodyClass:w="",footerClass:v=""}=e,f=["bw_card",t(l),_&&{none:"",sm:"bw_shadow_sm",md:"bw_shadow",lg:"bw_shadow_lg"}[_]||"",d?"":"bw_border_0",b?"bw_card_hoverable":"",u].filter(Boolean).join(" ").trim(),h=[i&&{t:"div",a:{class:`bw_card_header ${p}`.trim()},c:i},o&&("top"===r||"left"===r)&&{t:"img",a:{class:`bw_card_img_${r}`,src:o.src,alt:o.alt||""}},{t:"div",a:{class:`bw_card_body ${w}`.trim()},c:[a&&{t:"h5",a:{class:"bw_card_title"},c:a},s&&{t:"h6",a:{class:"bw_card_subtitle bw_mb_2 bw_text_muted"},c:s},n&&(Array.isArray(n)?n:[n])].flat().filter(Boolean)},o&&("bottom"===r||"right"===r)&&{t:"img",a:{class:`bw_card_img_${r}`,src:o.src,alt:o.alt||""}},c&&{t:"div",a:{class:`bw_card_footer ${v}`.trim()},c:c}].filter(Boolean);return!o||"left"!==r&&"right"!==r?{t:"div",a:{class:f,style:m},c:h,o:{type:"card",state:e.state||{}}}:{t:"div",a:{class:f,style:m},c:{t:"div",a:{class:"bw_row bw_g_0"},c:h},o:{type:"card",state:e.state||{}}}}function s(e={}){"string"==typeof e&&(e={text:e});const{text:a,variant:s="primary",size:n,disabled:c=!1,onclick:i,type:o="button",className:r="",style:l}=e;return{t:"button",a:{type:o,class:["bw_btn",t(s),n&&`bw_btn_${n}`,r].filter(Boolean).join(" "),disabled:c,onclick:i,style:l},c:a,o:{type:"button"}}}function n(e={}){const{fluid:t=!1,children:a,className:s=""}=e;return{t:"div",a:{class:`bw_container${t?"-fluid":""} ${s}`.trim()},c:a}}function c(e={}){const{children:t,className:a="",gap:s}=e;return{t:"div",a:{class:`bw_row ${s?`bw_g_${s}`:""} ${a}`.trim()},c:t}}function i(e={}){const{size:t,offset:a,push:s,pull:n,content:c,children:i,className:o=""}=e,r=[];return"object"==typeof t?Object.entries(t).forEach(([e,t])=>{"xs"===e?r.push(`bw_col_${t}`):r.push(`bw_col_${e}-${t}`)}):t?r.push(`bw_col_${t}`):r.push("bw_col"),a&&r.push(`bw_offset_${a}`),s&&r.push(`bw_push_${s}`),n&&r.push(`bw_pull_${n}`),{t:"div",a:{class:`${r.join(" ")} ${o}`.trim()},c:c||i}}function o(e={}){const{items:t=[],pills:a=!1,vertical:s=!1,className:n=""}=e;return{t:"ul",a:{class:`bw_nav ${a?"bw_nav_pills":"bw_nav_tabs"} ${s?"bw_nav_vertical":""} ${n}`.trim()},c:t.map(e=>({t:"li",a:{class:"bw_nav_item"},c:{t:"a",a:{href:e.href||"#",class:`bw_nav_link ${e.active?"active":""} ${e.disabled?"disabled":""}`.trim()},c:e.text}}))}}function r(e={}){const{brand:t,brandHref:a="#",items:s=[],dark:n=!0,className:c=""}=e;return{t:"nav",a:{class:`bw_navbar ${n?"bw_navbar_dark":"bw_navbar_light"} ${c}`.trim()},c:{t:"div",a:{class:"bw_container"},c:[t&&{t:"a",a:{href:a,class:"bw_navbar_brand"},c:t},s.length>0&&{t:"div",a:{class:"bw_navbar_nav"},c:s.map(e=>({t:"a",a:{href:e.href||"#",class:"bw_nav_link "+(e.active?"active":"")},c:e.text}))}].filter(Boolean)},o:{type:"navbar",state:{activeItem:s.findIndex(e=>e.active)}}}}function l(e={}){const{tabs:t=[],activeIndex:a=0}=e;let s=a;return t.forEach((e,t)=>{e.active&&(s=t)}),{t:"div",a:{class:"bw_tabs"},c:[{t:"ul",a:{class:"bw_nav bw_nav_tabs",role:"tablist"},c:t.map((e,t)=>({t:"li",a:{class:"bw_nav_item",role:"presentation"},c:{t:"button",a:{class:"bw_nav_link "+(t===s?"active":""),type:"button",role:"tab",tabindex:t===s?"0":"-1","aria-selected":t===s?"true":"false","data-tab-index":t,onclick:e=>{const t=e.target.closest(".bw_tabs"),a=t.querySelectorAll(".bw_nav_link"),s=t.querySelectorAll(".bw_tab_pane");a.forEach(e=>{e.classList.remove("active"),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")}),s.forEach(e=>e.classList.remove("active")),e.target.classList.add("active"),e.target.setAttribute("aria-selected","true"),e.target.setAttribute("tabindex","0");s[parseInt(e.target.getAttribute("data-tab-index"))].classList.add("active")}},c:e.label}}))},{t:"div",a:{class:"bw_tab_content"},c:t.map((e,t)=>({t:"div",a:{class:"bw_tab_pane "+(t===s?"active":""),role:"tabpanel"},c:e.content}))}],o:{type:"tabs",state:{activeIndex:s},mounted:function(e){var t=e.querySelector('[role="tablist"]');t&&t.addEventListener("keydown",function(e){for(var a=t.querySelectorAll('[role="tab"]'),s=-1,n=0;n<a.length;n++)if(a[n]===e.target){s=n;break}if(-1!==s){var c=-1;"ArrowLeft"===e.key||"ArrowUp"===e.key?(e.preventDefault(),c=s>0?s-1:a.length-1):"ArrowRight"===e.key||"ArrowDown"===e.key?(e.preventDefault(),c=s<a.length-1?s+1:0):"Home"===e.key?(e.preventDefault(),c=0):"End"===e.key&&(e.preventDefault(),c=a.length-1),c>=0&&(a[c].focus(),a[c].click())}})}}}}function d(e={}){"string"==typeof e&&(e={content:e});const{content:a,variant:s="info",dismissible:n=!1,className:c=""}=e;return{t:"div",a:{class:`bw_alert ${t(s)} ${n?"bw_alert_dismissible":""} ${c}`.trim(),role:"alert"},c:[a,n&&{t:"button",a:{type:"button",class:"bw_close","aria-label":"Close",onclick:function(e){var t=e.target.closest(".bw_alert");t&&t.remove()}},c:"×"}].filter(Boolean)}}function _(e={}){"string"==typeof e&&(e={text:e});const{text:a,variant:s="primary",size:n,pill:c=!1,className:i=""}=e,o="sm"===n?" bw_badge_sm":"lg"===n?" bw_badge_lg":"";return{t:"span",a:{class:`bw_badge ${t(s)}${o} ${c?"bw_badge_pill":""} ${i}`.trim()},c:a}}function b(e={}){const{value:a=0,max:s=100,variant:n="primary",striped:c=!1,animated:i=!1,label:o,height:r}=e,l=Math.round(a/s*100);return{t:"div",a:{class:"bw_progress",style:r?{height:`${r}px`}:void 0},c:{t:"div",a:{class:["bw_progress_bar",t(n),c&&"bw_progress_bar_striped",i&&"bw_progress_bar_animated"].filter(Boolean).join(" "),role:"progressbar",style:{width:`${l}%`},"aria-valuenow":a,"aria-valuemin":0,"aria-valuemax":s},c:o||`${l}%`}}}function u(e={}){const{items:t=[],flush:a=!1,interactive:s=!1}=e;return{t:"div",a:{class:("bw_list_group "+(a?"bw_list_group_flush":"")).trim()},c:t.map(e=>{const t="object"==typeof e,a=t?e.text:e,n=!!t&&e.active,c=!!t&&e.disabled,i=t?e.href:null,o=t?e.onclick:null;return s||i||o?{t:"a",a:{class:["bw_list_group_item",n&&"active",c&&"disabled"].filter(Boolean).join(" "),href:i||"#",onclick:o||(e=>{i||e.preventDefault()}),style:c?"pointer-events: none; opacity: 0.65;":""},c:a}:{t:"div",a:{class:["bw_list_group_item",n&&"active",c&&"disabled"].filter(Boolean).join(" ")},c:a}})}}function m(e={}){const{items:t=[]}=e;return{t:"nav",a:{"aria-label":"breadcrumb"},c:{t:"ol",a:{class:"bw_breadcrumb"},c:t.map((e,t)=>({t:"li",a:{class:"bw_breadcrumb_item "+(e.active?"active":""),"aria-current":e.active?"page":void 0},c:e.active?e.text:{t:"a",a:{href:e.href||"#"},c:e.text}}))}}}function p(e={}){const{children:t,onsubmit:a,className:s=""}=e;return{t:"form",a:{class:s,onsubmit:a||(e=>e.preventDefault())},c:t}}function w(e={}){var{label:t,input:a,help:s,id:n,validation:c,feedback:i,required:o}=e,r=a;if(c&&a&&a.a){r={t:a.t,a:Object.assign({},a.a),c:a.c,o:a.o};var l="valid"===c?"bw_is_valid":"invalid"===c?"bw_is_invalid":"";l&&(r.a.class=((r.a.class||"")+" "+l).trim())}return{t:"div",a:{class:"bw_form_group"},c:[t&&{t:"label",a:{for:n,class:"bw_form_label"},c:o?[t,{t:"span",a:{class:"bw_text_danger bw_ms_1"},c:"*"}]:t},r,i&&c&&{t:"div",a:{class:"valid"===c?"bw_valid_feedback":"bw_invalid_feedback"},c:i},s&&{t:"small",a:{class:"bw_form_text bw_text_muted"},c:s}].filter(Boolean)}}function v(e={}){const{type:t="text",placeholder:a,value:s,id:n,name:c,disabled:i=!1,readonly:o=!1,required:r=!1,className:l="",style:d,..._}=e;return{t:"input",a:{type:t,class:`bw_form_control ${l}`.trim(),placeholder:a,value:s,id:n,name:c,style:d,disabled:i,readonly:o,required:r,..._}}}function f(e={}){const{placeholder:t,value:a,rows:s=3,id:n,name:c,disabled:i=!1,readonly:o=!1,required:r=!1,className:l="",...d}=e;return{t:"textarea",a:{class:`bw_form_control ${l}`.trim(),placeholder:t,rows:s,id:n,name:c,disabled:i,readonly:o,required:r,...d},c:a}}function h(e={}){const{options:t=[],value:a,id:s,name:n,disabled:c=!1,required:i=!1,className:o="",...r}=e;return{t:"select",a:{class:`bw_form_control ${o}`.trim(),id:s,name:n,disabled:c,required:i,...r},c:t.map(e=>({t:"option",a:{value:e.value,selected:e.value===a},c:e.text||e.value}))}}function g(e={}){const{label:t,checked:a=!1,id:s,name:n,disabled:c=!1,value:i,className:o="",...r}=e;return{t:"div",a:{class:`bw_form_check ${o}`.trim()},c:[{t:"input",a:{type:"checkbox",class:"bw_form_check_input",checked:a,id:s,name:n,disabled:c,value:i,...r}},t&&{t:"label",a:{class:"bw_form_check_label",for:s},c:t}].filter(Boolean)}}function k(e={}){const{children:t,direction:a="vertical",gap:s=3,className:n=""}=e;return{t:"div",a:{class:`bw_${"vertical"===a?"vstack":"hstack"} bw_gap_${s} ${n}`.trim()},c:t}}function y(e={}){const{variant:a="primary",size:s="md",type:n="border"}=e;return{t:"div",a:{class:`bw_spinner_${n} bw_spinner_${n}-${s} ${t(a)}`,role:"status"},c:{t:"span",a:{class:"bw_visually_hidden"},c:"Loading..."}}}function x(e={}){const{title:a,subtitle:s,content:n,variant:c="primary",size:i="lg",centered:o=!0,overlay:r=!1,backgroundImage:l,actions:d,className:_=""}=e,b={sm:"bw_py_3",md:"bw_py_4",lg:"bw_py_5",xl:"bw_py_6"};return{t:"section",a:{class:`bw_hero ${t(c)} ${b[i]||b.lg} ${o?"bw_text_center":""} ${_}`.trim(),style:l?`background-image: url('${l}'); background-size: cover; background-position: center;`:void 0},c:[r&&{t:"div",a:{class:"bw_hero_overlay"}},{t:"div",a:{class:"bw_container"},c:{t:"div",a:{class:"bw_hero_content"},c:[a&&{t:"h1",a:{class:"bw_hero_title bw_display_4 bw_mb_3"},c:a},s&&{t:"p",a:{class:"bw_hero_subtitle bw_lead bw_mb_4"},c:s},n,d&&{t:"div",a:{class:"bw_hero_actions bw_mt_4"},c:d}].filter(Boolean)}}].filter(Boolean)}}function $(e={}){const{features:t=[],columns:a=3,centered:s=!0,iconSize:n="3rem",className:c=""}=e,i="bw_col_md_"+12/a;return{t:"div",a:{class:`bw_feature_grid ${c}`.trim()},c:{t:"div",a:{class:"bw_row bw_g_4"},c:t.map(e=>({t:"div",a:{class:i},c:{t:"div",a:{class:"bw_feature "+(s?"bw_text_center":"")},c:[e.icon&&{t:"div",a:{class:"bw_feature_icon bw_mb_3 bw_text_primary",style:`font-size: ${n};`},c:e.icon},e.title&&{t:"h3",a:{class:"bw_feature_title bw_h5 bw_mb_2"},c:e.title},e.description&&{t:"p",a:{class:"bw_feature_description bw_text_muted"},c:e.description}].filter(Boolean)}}))}}}function L(e={}){const{title:t,description:a,actions:s,variant:n="light",centered:c=!0,className:i=""}=e;return{t:"section",a:{class:`bw_cta bw_bg_${n} bw_py_5 ${i}`.trim()},c:{t:"div",a:{class:"bw_container"},c:{t:"div",a:{class:"bw_cta_content "+(c?"bw_text_center":"")},c:[t&&{t:"h2",a:{class:"bw_cta_title bw_mb_3"},c:t},a&&{t:"p",a:{class:"bw_cta_description bw_lead bw_mb_4"},c:a},s&&{t:"div",a:{class:"bw_cta_actions"},c:s}].filter(Boolean)}}}}function N(e={}){const{title:t,subtitle:a,content:s,variant:n="default",spacing:c="md",className:i=""}=e,o={sm:"bw_py_3",md:"bw_py_4",lg:"bw_py_5",xl:"bw_py_6"};return{t:"section",a:{class:`bw_section ${o[c]||o.md} ${"default"!==n?`bw_bg_${n}`:""} ${i}`.trim()},c:{t:"div",a:{class:"bw_container"},c:[(t||a)&&{t:"div",a:{class:"bw_section_header bw_text_center bw_mb_5"},c:[t&&{t:"h2",a:{class:"bw_section_title"},c:t},a&&{t:"p",a:{class:"bw_section_subtitle bw_text_muted"},c:a}].filter(Boolean)},s].filter(Boolean)}}}function C(e={}){const{title:t,description:a,code:s,result:n,language:c="javascript"}=e;Math.random().toString(36).substr(2,9);const i=[{label:"Result",active:!0,content:n}];s&&i.push({label:"Code",content:{t:"div",a:{style:"position: relative;"},c:[{t:"button",a:{class:"bw_copy_btn bw_code_copy_btn",onclick:function(e){navigator.clipboard.writeText(s).then(function(){var t=e.target,a=t.textContent;t.textContent="Copied!",t.classList.add("bw_code_copy_btn_copied"),setTimeout(function(){t.textContent=a,t.classList.remove("bw_code_copy_btn_copied")},2e3)})}},c:"Copy"},"undefined"!=typeof globalThis&&void 0!==globalThis.bw&&"function"==typeof globalThis.bw.codeEditor?globalThis.bw.codeEditor({code:s,lang:"javascript"===c?"js":c,readOnly:!0,height:"auto"}):{t:"pre",a:{class:"bw_code_pre"},c:{t:"code",a:{class:`bw_code_block language-${c}`},c:s}}]}});return{t:"div",a:{class:"bw_code_demo"},c:[t&&{t:"h3",c:t},a&&{t:"p",a:{class:"bw_text_muted bw_mb_3"},c:a},l({tabs:i})].filter(Boolean)}}function B(e={}){const{pages:t=1,currentPage:a=1,onPageChange:s,size:n,className:c=""}=e;function i(e){return function(n){n.preventDefault(),e<1||e>t||e===a||s&&s(e)}}const o=[];o.push({t:"li",a:{class:("bw_page_item "+(a<=1?"bw_disabled":"")).trim()},c:{t:"a",a:{class:"bw_page_link",href:"#",onclick:i(a-1),"aria-label":"Previous"},c:"‹"}});for(var r=1;r<=t;r++)(function(e){o.push({t:"li",a:{class:("bw_page_item "+(e===a?"bw_active":"")).trim()},c:{t:"a",a:{class:"bw_page_link",href:"#",onclick:i(e)},c:""+e}})})(r);return o.push({t:"li",a:{class:("bw_page_item "+(a>=t?"bw_disabled":"")).trim()},c:{t:"a",a:{class:"bw_page_link",href:"#",onclick:i(a+1),"aria-label":"Next"},c:"›"}}),{t:"nav",a:{"aria-label":"Pagination"},c:{t:"ul",a:{class:`bw_pagination ${n?"bw_pagination_"+n:""} ${c}`.trim()},c:o}}}function A(e={}){const{label:t,name:a,value:s,checked:n=!1,id:c,disabled:i=!1,className:o="",...r}=e;return{t:"div",a:{class:`bw_form_check ${o}`.trim()},c:[{t:"input",a:{type:"radio",class:"bw_form_check_input",name:a,value:s,checked:n,id:c,disabled:i,...r}},t&&{t:"label",a:{class:"bw_form_check_label",for:c},c:t}].filter(Boolean)}}function S(e={}){const{children:t,size:a,vertical:s=!1,className:n=""}=e;return{t:"div",a:{class:`${s?"bw_btn_group_vertical":"bw_btn_group"} ${a?"bw_btn_group_"+a:""} ${n}`.trim(),role:"group"},c:t}}function E(e={}){const{items:t=[],multiOpen:a=!1,className:s=""}=e;return{t:"div",a:{class:`bw_accordion ${s}`.trim()},c:t.map(function(e,t){return{t:"div",a:{class:"bw_accordion_item"},c:[{t:"h2",a:{class:"bw_accordion_header"},c:{t:"button",a:{class:("bw_accordion_button "+(e.open?"":"bw_collapsed")).trim(),type:"button","aria-expanded":e.open?"true":"false","data-accordion-index":t,onclick:function(e){var t=e.target.closest(".bw_accordion_button"),s=t.closest(".bw_accordion"),n=t.closest(".bw_accordion_item"),c=n.querySelector(".bw_accordion_collapse"),i=c.classList.contains("bw_collapse_show");if(!a)for(var o=s.querySelectorAll(".bw_accordion_item"),r=0;r<o.length;r++)if(o[r]!==n){var l=o[r].querySelector(".bw_accordion_collapse"),d=o[r].querySelector(".bw_accordion_button");l.classList.contains("bw_collapse_show")&&(l.style.maxHeight=l.scrollHeight+"px",l.offsetHeight,l.style.maxHeight="0px",l.classList.remove("bw_collapse_show"),d.classList.add("bw_collapsed"),d.setAttribute("aria-expanded","false"))}if(i)c.style.maxHeight=c.scrollHeight+"px",c.offsetHeight,c.style.maxHeight="0px",c.classList.remove("bw_collapse_show"),t.classList.add("bw_collapsed"),t.setAttribute("aria-expanded","false");else{c.classList.add("bw_collapse_show"),c.style.maxHeight="0px",c.offsetHeight,c.style.maxHeight=c.scrollHeight+"px",t.classList.remove("bw_collapsed"),t.setAttribute("aria-expanded","true");var _=function(e){"max-height"===e.propertyName&&c.classList.contains("bw_collapse_show")&&(c.style.maxHeight="none"),c.removeEventListener("transitionend",_)};c.addEventListener("transitionend",_)}}},c:e.title}},{t:"div",a:{class:("bw_accordion_collapse "+(e.open?"bw_collapse_show":"")).trim()},c:{t:"div",a:{class:"bw_accordion_body"},c:e.content},o:e.open?{mounted:function(e){e.style.maxHeight="none"}}:void 0}]}}),o:{type:"accordion",state:{multiOpen:a}}}}function I(e={}){const{title:t,content:a,footer:s,size:n,closeButton:c=!0,onClose:i,className:o=""}=e;function r(e){var t=e.closest(".bw_modal");t&&(t.classList.remove("bw_modal_show"),document.body.style.overflow=""),i&&i()}return{t:"div",a:{class:`bw_modal ${o}`.trim()},c:{t:"div",a:{class:("bw_modal_dialog "+(n?"bw_modal_"+n:"")).trim()},c:{t:"div",a:{class:"bw_modal_content"},c:[(t||c)&&{t:"div",a:{class:"bw_modal_header"},c:[t&&{t:"h5",a:{class:"bw_modal_title"},c:t},c&&{t:"button",a:{type:"button",class:"bw_close","aria-label":"Close",onclick:function(e){r(e.target)}},c:"×"}].filter(Boolean)},a&&{t:"div",a:{class:"bw_modal_body"},c:a},s&&{t:"div",a:{class:"bw_modal_footer"},c:s}].filter(Boolean)}},o:{type:"modal",mounted:function(e){e.addEventListener("click",function(t){t.target===e&&r(e)});var t=function(t){"Escape"===t.key&&e.classList.contains("bw_modal_show")&&r(e)};document.addEventListener("keydown",t),e._bw_escHandler=t},unmount:function(e){e._bw_escHandler&&document.removeEventListener("keydown",e._bw_escHandler),document.body.style.overflow=""}}}}function q(e={}){const{title:a,content:s,variant:n="info",autoDismiss:c=!0,delay:i=5e3,position:o="top-right",className:r=""}=e;return{t:"div",a:{class:`bw_toast ${t(n)} ${r}`.trim(),role:"alert","data-position":o},c:[a&&{t:"div",a:{class:"bw_toast_header"},c:[{t:"strong",c:a},{t:"button",a:{type:"button",class:"bw_close","aria-label":"Close",onclick:function(e){var t=e.target.closest(".bw_toast");t&&(t.classList.add("bw_toast_hiding"),setTimeout(function(){t.parentNode&&t.parentNode.removeChild(t)},300))}},c:"×"}]},s&&{t:"div",a:{class:"bw_toast_body"},c:s}].filter(Boolean),o:{type:"toast",mounted:function(e){requestAnimationFrame(function(){e.classList.add("bw_toast_show")}),c&&setTimeout(function(){e.classList.add("bw_toast_hiding"),setTimeout(function(){e.parentNode&&e.parentNode.removeChild(e)},300)},i)}}}}function H(e={}){const{trigger:a,items:s=[],align:n="start",variant:c="primary",className:i=""}=e;var o;return o="string"==typeof a||void 0===a?{t:"button",a:{class:`bw_btn ${t(c)} bw_dropdown_toggle`,type:"button",onclick:function(e){e.target.closest(".bw_dropdown").querySelector(".bw_dropdown_menu").classList.toggle("bw_dropdown_show")}},c:a||"Dropdown"}:a,{t:"div",a:{class:`bw_dropdown ${i}`.trim()},c:[o,{t:"div",a:{class:("bw_dropdown_menu "+("end"===n?"bw_dropdown_menu_end":"")).trim()},c:s.map(function(e){return e.divider?{t:"hr",a:{class:"bw_dropdown_divider"}}:{t:"a",a:{class:("bw_dropdown_item "+(e.disabled?"disabled":"")).trim(),href:e.href||"#",onclick:e.disabled?void 0:function(t){e.href||t.preventDefault(),t.target.closest(".bw_dropdown").querySelector(".bw_dropdown_menu").classList.remove("bw_dropdown_show"),e.onclick&&e.onclick(t)}},c:e.text}})}],o:{type:"dropdown",mounted:function(e){var t=function(t){if(!e.contains(t.target)){var a=e.querySelector(".bw_dropdown_menu");a&&a.classList.remove("bw_dropdown_show")}};document.addEventListener("click",t),e._bw_outsideHandler=t},unmount:function(e){e._bw_outsideHandler&&document.removeEventListener("click",e._bw_outsideHandler)}}}}function j(e={}){const{label:t,checked:a=!1,id:s,name:n,disabled:c=!1,className:i="",...o}=e;return{t:"div",a:{class:`bw_form_check bw_form_switch ${i}`.trim()},c:[{t:"input",a:{type:"checkbox",class:"bw_form_check_input bw_switch_input",role:"switch",checked:a,id:s,name:n,disabled:c,...o}},t&&{t:"label",a:{class:"bw_form_check_label",for:s},c:t}].filter(Boolean)}}function T(e={}){const{variant:t="text",width:a,height:s,count:n=1,className:c=""}=e;if("circle"===t){var i=a||s||"3rem";return{t:"div",a:{class:`bw_skeleton bw_skeleton_circle ${c}`.trim(),style:{width:i,height:i}}}}if("rect"===t)return{t:"div",a:{class:`bw_skeleton bw_skeleton_rect ${c}`.trim(),style:{width:a||"100%",height:s||"120px"}}};if(1===n)return{t:"div",a:{class:`bw_skeleton bw_skeleton_text ${c}`.trim(),style:{width:a||"100%",height:s||"1em"}}};for(var o=[],r=0;r<n;r++)o.push({t:"div",a:{class:"bw_skeleton bw_skeleton_text",style:{width:r===n-1?"75%":a||"100%",height:s||"1em"}}});return{t:"div",a:{class:`bw_skeleton_group ${c}`.trim()},c:o}}function D(e={}){const{src:a,alt:s="",initials:n,size:c="md",variant:i="primary",className:o=""}=e;return a?{t:"img",a:{class:`bw_avatar bw_avatar_${c} ${o}`.trim(),src:a,alt:s}}:{t:"div",a:{class:`bw_avatar bw_avatar_${c} ${t(i)} ${o}`.trim()},c:n||""}}function z(e={}){const{items:t=[],showControls:a=!0,showIndicators:s=!0,autoPlay:n=!1,interval:c=5e3,height:i="300px",startIndex:o=0,className:r=""}=e;function l(e,t){var a=e.querySelectorAll(".bw_carousel_slide").length;t<0&&(t=a-1),t>=a&&(t=0),e.setAttribute("data-carousel-index",t),e.querySelector(".bw_carousel_track").style.transform="translateX(-"+100*t+"%)";for(var s=e.querySelectorAll(".bw_carousel_indicator"),n=0;n<s.length;n++)n===t?s[n].classList.add("active"):s[n].classList.remove("active")}var d=t.map(function(e){var t=[e.content,e.caption&&{t:"div",a:{class:"bw_carousel_caption"},c:e.caption}].filter(Boolean);return{t:"div",a:{class:"bw_carousel_slide"},c:1===t.length?t[0]:t}}),_=[{t:"div",a:{class:"bw_carousel_track",style:"transform: translateX(-"+100*o+"%)"},c:d}];return a&&t.length>1&&(_.push({t:"button",a:{class:"bw_carousel_control bw_carousel_control_prev",type:"button","aria-label":"Previous slide",onclick:function(e){var t=e.target.closest(".bw_carousel"),a=parseInt(t.getAttribute("data-carousel-index")||"0");l(t,a-1)}},c:{t:"img",a:{src:"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e",alt:"",role:"presentation"}}}),_.push({t:"button",a:{class:"bw_carousel_control bw_carousel_control_next",type:"button","aria-label":"Next slide",onclick:function(e){var t=e.target.closest(".bw_carousel"),a=parseInt(t.getAttribute("data-carousel-index")||"0");l(t,a+1)}},c:{t:"img",a:{src:"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e",alt:"",role:"presentation"}}})),s&&t.length>1&&_.push({t:"div",a:{class:"bw_carousel_indicators"},c:t.map(function(e,t){return{t:"button",a:{class:"bw_carousel_indicator"+(t===o?" active":""),type:"button","aria-label":"Go to slide "+(t+1),"data-slide-index":t,onclick:function(e){l(e.target.closest(".bw_carousel"),parseInt(e.target.getAttribute("data-slide-index")))}}}})}),{t:"div",a:{class:("bw_carousel "+r).trim(),style:"height: "+i,tabindex:"0","aria-roledescription":"carousel","data-carousel-index":o},c:_,o:{type:"carousel",state:{activeIndex:o,autoPlay:n,interval:c},mounted:function(e){if(e.addEventListener("keydown",function(t){var a=parseInt(e.getAttribute("data-carousel-index")||"0");"ArrowLeft"===t.key?(t.preventDefault(),l(e,a-1)):"ArrowRight"===t.key&&(t.preventDefault(),l(e,a+1))}),n){var t=setInterval(function(){var t=parseInt(e.getAttribute("data-carousel-index")||"0");l(e,t+1)},c);e._bw_carouselInterval=t,e.addEventListener("mouseenter",function(){e._bw_carouselInterval&&clearInterval(e._bw_carouselInterval)}),e.addEventListener("mouseleave",function(){e._bw_carouselInterval=setInterval(function(){var t=parseInt(e.getAttribute("data-carousel-index")||"0");l(e,t+1)},c)})}},unmount:function(e){e._bw_carouselInterval&&clearInterval(e._bw_carouselInterval)}}}}function O(e={}){"string"==typeof e&&(e={label:e});var{value:a=0,label:s,change:n,format:c,prefix:i,suffix:o,icon:r,variant:l,className:d="",style:_}=e;var b=["bw_stat_card",t(l),d].filter(Boolean).join(" ").trim(),u=[];return r&&u.push({t:"div",a:{class:"bw_stat_icon"},c:r}),u.push({t:"div",a:{class:"bw_stat_value"},c:function(e,t){if(i||o)return(i||"")+e+(o||"");switch(t){case"currency":return"$"+Number(e).toLocaleString();case"percent":return e+"%";case"number":return Number(e).toLocaleString();default:return""+e}}(a,c)}),s&&u.push({t:"div",a:{class:"bw_stat_label"},c:s}),null!=n&&u.push({t:"div",a:{class:"bw_stat_change "+(n>=0?"bw_stat_change_up":"bw_stat_change_down")},c:(n>=0?"↑ +":"↓ ")+n+"%"}),{t:"div",a:{class:b,style:_},c:u,o:{type:"stat-card"}}}function P(e={}){var{content:t,text:a="",placement:s="top",className:n=""}=e;return{t:"span",a:{class:("bw_tooltip_wrapper "+n).trim()},c:[t,{t:"span",a:{class:"bw_tooltip bw_tooltip_"+s,role:"tooltip"},c:a}],o:{type:"tooltip",mounted:function(e){var t=e.querySelector(".bw_tooltip");e.addEventListener("mouseenter",function(){t.classList.add("bw_tooltip_show")}),e.addEventListener("mouseleave",function(){t.classList.remove("bw_tooltip_show")}),e.addEventListener("focusin",function(){t.classList.add("bw_tooltip_show")}),e.addEventListener("focusout",function(){t.classList.remove("bw_tooltip_show")})}}}}function G(e={}){var{trigger:t,title:a,content:s,placement:n="top",className:c=""}=e,i=[a&&{t:"div",a:{class:"bw_popover_header"},c:a},s&&{t:"div",a:{class:"bw_popover_body"},c:s}].filter(Boolean);return{t:"span",a:{class:("bw_popover_wrapper "+c).trim()},c:[{t:"span",a:{class:"bw_popover_trigger",onclick:function(e){e.target.closest(".bw_popover_wrapper").querySelector(".bw_popover").classList.toggle("bw_popover_show")}},c:t},{t:"div",a:{class:"bw_popover bw_popover_"+n},c:i}],o:{type:"popover",mounted:function(e){var t=function(t){if(!e.contains(t.target)){var a=e.querySelector(".bw_popover");a&&a.classList.remove("bw_popover_show")}};document.addEventListener("click",t),e._bw_outsideHandler=t},unmount:function(e){e._bw_outsideHandler&&document.removeEventListener("click",e._bw_outsideHandler)}}}}function R(e={}){"string"==typeof e&&(e={placeholder:e});var{placeholder:t="Search...",value:a,onSearch:s,onInput:n,id:c,name:i,className:o=""}=e;return{t:"div",a:{class:("bw_search_input "+o).trim()},c:[{t:"input",a:{type:"search",class:"bw_form_control bw_search_field",placeholder:t,value:a,id:c,name:i,onkeydown:function(e){"Enter"===e.key&&s&&(e.preventDefault(),s(e.target.value))},oninput:function(e){var t=e.target.closest(".bw_search_input").querySelector(".bw_search_clear");t&&(t.style.display=e.target.value?"flex":"none"),n&&n(e.target.value)}}},{t:"button",a:{type:"button",class:"bw_search_clear","aria-label":"Clear search",style:a?void 0:"display: none",onclick:function(e){var t=e.target.closest(".bw_search_input").querySelector(".bw_search_field");t.value="",e.target.style.display="none",t.focus(),n&&n(""),s&&s("")}},c:"×"}],o:{type:"search-input"}}}function M(e={}){var{min:t=0,max:a=100,step:s=1,value:n=50,label:c,showValue:i=!1,id:o,name:r,disabled:l=!1,className:d="",..._}=e,b=[];if(c||i){var u=[];c&&u.push({t:"span",c:c}),i&&u.push({t:"span",a:{class:"bw_range_value"},c:""+n}),b.push({t:"div",a:{class:"bw_range_label"},c:u})}var m=_.oninput;return i&&(_.oninput=function(e){var t=e.target.closest(".bw_range_wrapper").querySelector(".bw_range_value");t&&(t.textContent=e.target.value),m&&m(e)}),b.push({t:"input",a:{type:"range",class:"bw_range",min:t,max:a,step:s,value:n,id:o,name:r,disabled:l,..._}}),{t:"div",a:{class:("bw_range_wrapper "+d).trim()},c:b,o:{type:"range"}}}function F(e={}){var{src:t,alt:a="",title:s,content:n,reverse:c=!1,imageSize:i="3rem",className:o=""}=e,r=t?{t:"img",a:{class:"bw_media_img",src:t,alt:a,style:"width:"+i+";height:"+i}}:null,l={t:"div",a:{class:"bw_media_body"},c:[s&&{t:"h5",a:{class:"bw_media_title"},c:s},n].filter(Boolean)};return{t:"div",a:{class:("bw_media "+(c?"bw_media_reverse ":"")+o).trim()},c:c?[l,r].filter(Boolean):[r,l].filter(Boolean),o:{type:"media-object"}}}function U(e={}){var{accept:t,multiple:a=!1,onFiles:s,text:n="Drop files here or click to browse",id:c,className:i=""}=e;return{t:"div",a:{class:("bw_file_upload "+i).trim(),tabindex:"0",role:"button","aria-label":n},c:[{t:"div",a:{class:"bw_file_upload_icon"},c:"📁"},{t:"div",a:{class:"bw_file_upload_text"},c:n},{t:"input",a:{type:"file",class:"bw_file_upload_input",accept:t,multiple:a,id:c,onchange:function(e){s&&e.target.files.length&&s(e.target.files)}}}],o:{type:"file-upload",mounted:function(e){var t=e.querySelector(".bw_file_upload_input");e.addEventListener("click",function(e){e.target!==t&&t.click()}),e.addEventListener("keydown",function(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),t.click())}),e.addEventListener("dragover",function(t){t.preventDefault(),e.classList.add("bw_file_upload_active")}),e.addEventListener("dragleave",function(){e.classList.remove("bw_file_upload_active")}),e.addEventListener("drop",function(t){t.preventDefault(),e.classList.remove("bw_file_upload_active"),s&&t.dataTransfer.files.length&&s(t.dataTransfer.files)})}}}}function X(e={}){var{items:a=[],className:s=""}=e;return{t:"div",a:{class:("bw_timeline "+s).trim()},c:a.map(function(e){return{t:"div",a:{class:"bw_timeline_item"},c:[{t:"div",a:{class:"bw_timeline_marker "+t(e.variant||"primary")}},{t:"div",a:{class:"bw_timeline_content"},c:[e.date&&{t:"div",a:{class:"bw_timeline_date"},c:e.date},e.title&&{t:"h5",a:{class:"bw_timeline_title"},c:e.title},e.content&&("string"==typeof e.content?{t:"p",a:{class:"bw_timeline_text"},c:e.content}:e.content)].filter(Boolean)}]}}),o:{type:"timeline"}}}function V(e={}){var{steps:t=[],currentStep:a=0,className:s=""}=e;return{t:"div",a:{class:("bw_stepper "+s).trim(),role:"list"},c:t.map(function(e,t){var s=t<a?"completed":t===a?"active":"pending";return{t:"div",a:{class:"bw_step bw_step_"+s,role:"listitem","aria-current":"active"===s?"step":void 0},c:[{t:"div",a:{class:"bw_step_indicator"},c:"completed"===s?"✓":""+(t+1)},{t:"div",a:{class:"bw_step_body"},c:[{t:"div",a:{class:"bw_step_label"},c:e.label},e.description&&{t:"div",a:{class:"bw_step_description"},c:e.description}].filter(Boolean)}]}}),o:{type:"stepper"}}}function J(e={}){var{chips:t=[],placeholder:a="Add...",onAdd:s,onRemove:n,className:c=""}=e;return{t:"div",a:{class:("bw_chip_input "+c).trim()},c:[...t.map(function(e){return{t:"span",a:{class:"bw_chip","data-chip-value":e},c:[e,{t:"button",a:{type:"button",class:"bw_chip_remove","aria-label":"Remove "+e,onclick:function(e){var t=e.target.closest(".bw_chip"),a=t.getAttribute("data-chip-value");t.parentNode.removeChild(t),n&&n(a)}},c:"×"}]}}),{t:"input",a:{type:"text",class:"bw_chip_field",placeholder:a,onkeydown:function(e){if("Enter"===e.key&&e.target.value.trim()){e.preventDefault();var t=e.target.value.trim(),a=e.target.closest(".bw_chip_input"),c=document.createElement("span");c.className="bw_chip",c.setAttribute("data-chip-value",t),c.innerHTML="",c.textContent=t;var i=document.createElement("button");i.type="button",i.className="bw_chip_remove",i.setAttribute("aria-label","Remove "+t),i.textContent="×",i.onclick=function(){c.parentNode.removeChild(c),n&&n(t)},c.appendChild(i),a.insertBefore(c,e.target),e.target.value="",s&&s(t)}if("Backspace"===e.key&&!e.target.value){var o=(a=e.target.closest(".bw_chip_input")).querySelectorAll(".bw_chip");if(o.length){var r=o[o.length-1],l=r.getAttribute("data-chip-value");r.parentNode.removeChild(r),n&&n(l)}}}}}],o:{type:"chip-input"}}}var K={card:{make:a},button:{make:s},container:{make:n},row:{make:c},col:{make:i},nav:{make:o},navbar:{make:r},tabs:{make:l},alert:{make:d},badge:{make:_},progress:{make:b},listGroup:{make:u},breadcrumb:{make:m},form:{make:p},formGroup:{make:w},input:{make:v},textarea:{make:f},select:{make:h},checkbox:{make:g},stack:{make:k},spinner:{make:y},hero:{make:x},featureGrid:{make:$},cta:{make:L},section:{make:N},codeDemo:{make:C},pagination:{make:B},radio:{make:A},buttonGroup:{make:S},accordion:{make:E},modal:{make:I},toast:{make:q},dropdown:{make:H},switch:{make:j},skeleton:{make:T},avatar:{make:D},carousel:{make:z},statCard:{make:O},tooltip:{make:P},popover:{make:G},searchInput:{make:R},range:{make:M},mediaObject:{make:F},fileUpload:{make:U},timeline:{make:X},stepper:{make:V},chipInput:{make:J}};function Q(e,t){var a=K[e];if(!a)throw new Error('bw.make: unknown component type "'+e+'". Available: '+Object.keys(K).join(", "));return a.make(t||{})}var W=Object.freeze({__proto__:null,BCCL:K,make:Q,makeAccordion:E,makeAlert:d,makeAvatar:D,makeBadge:_,makeBreadcrumb:m,makeButton:s,makeButtonGroup:S,makeCTA:L,makeCard:a,makeCarousel:z,makeCheckbox:g,makeChipInput:J,makeCodeDemo:C,makeCol:i,makeContainer:n,makeDropdown:H,makeFeatureGrid:$,makeFileUpload:U,makeForm:p,makeFormGroup:w,makeHero:x,makeInput:v,makeListGroup:u,makeMediaObject:F,makeModal:I,makeNav:o,makeNavbar:r,makePagination:B,makePopover:G,makeProgress:b,makeRadio:A,makeRange:M,makeRow:c,makeSearchInput:R,makeSection:N,makeSelect:h,makeSkeleton:T,makeSpinner:y,makeStack:k,makeStatCard:O,makeStepper:V,makeSwitch:j,makeTabs:l,makeTextarea:f,makeTimeline:X,makeToast:q,makeTooltip:P,variantClass:t});
+/**
+   * bitwrench-bccl-entry.js — Standalone entry point for BCCL component library.
+   *
+   * Use this alongside bitwrench-lean when you want the core library and
+   * BCCL components as separate files. The UMD build auto-registers all
+   * make*() functions onto the global `bw` object if present.
+   *
+   * Usage (browser):
+   *   <script src="bitwrench-lean.umd.min.js"><\/script>
+   *   <script src="bitwrench-bccl.umd.min.js"></script>
+   *
+   * Usage (ESM):
+   *   import bw from 'bitwrench/lean';
+   *   import { registerBCCL } from 'bitwrench/bccl';
+   *   registerBCCL(bw);
+   *
+   * @module bitwrench-bccl
+   * @license BSD-2-Clause
+   */function Y(e){e&&(Object.entries(W).forEach(function(t){var a=t[0],s=t[1];0===a.indexOf("make")&&(e[a]=s)}),e.make=Q,e.BCCL=K,e.variantClass=t,"function"==typeof e.renderComponent&&Object.entries(W).forEach(function(t){var a=t[0],s=t[1];if(0===a.indexOf("make")){var n="create"+a.substring(4);e[n]=function(t){var a=s(t);return e.renderComponent(a)}}}))}"undefined"!=typeof window&&void 0!==window.bw?Y(window.bw):"undefined"!=typeof globalThis&&void 0!==globalThis.bw&&Y(globalThis.bw),e.BCCL=K,e.make=Q,e.registerBCCL=Y,e.variantClass=t});
+//# sourceMappingURL=bitwrench-bccl.umd.min.js.map

package/dist/bitwrench-code-edit.cjs.js

@@ -1,4 +1,4 @@
-/*! bitwrench v2.0.14 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
+/*! bitwrench v2.0.16 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -9,6 +9,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
  * Provides bw.highlight() for tokenizing JS/CSS/HTML into TACO spans,
  * and bw.codeEditor() for a live editable code block with syntax coloring.
  *
+ * Theme integration: The editor chrome (background, text color, font) reads
+ * from CSS custom properties --bw_code_bg, --bw_code_text, --bw_font_mono,
+ * falling back to built-in dark values when no theme is active. Syntax
+ * highlighting colors are intentionally fixed (they are a code color scheme,
+ * not brand colors). The bw_ce_light class is still supported for manual
+ * light-mode override.
+ *
  * Can be loaded standalone (browser script tag after bitwrench.umd.js),
  * or imported as an ES module / CJS module.
  *
@@ -19,53 +26,58 @@ Object.defineProperty(exports, '__esModule', { value: true });
 // -- CSS (injected once) ----------------------------------------------
 var _cssInjected = false;
 var CSS_TEXT =
-  '.bw-ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' +
-  '.bw-ce pre{margin:0;padding:0}' +
-  '.bw-ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' +
-  '.bw-ce code:empty::before{content:"\\200b"}' +
-  '.bw-ce .bw-ce-keyword{color:#c792ea}' +
-  '.bw-ce .bw-ce-string{color:#c3e88d}' +
-  '.bw-ce .bw-ce-comment{color:#546e7a;font-style:italic}' +
-  '.bw-ce .bw-ce-number{color:#f78c6c}' +
-  '.bw-ce .bw-ce-operator{color:#89ddff}' +
-  '.bw-ce .bw-ce-punctuation{color:#89ddff}' +
-  '.bw-ce .bw-ce-property{color:#82aaff}' +
-  '.bw-ce .bw-ce-function{color:#82aaff}' +
-  '.bw-ce .bw-ce-tag{color:#f07178}' +
-  '.bw-ce .bw-ce-attr-name{color:#ffcb6b}' +
-  '.bw-ce .bw-ce-attr-value{color:#c3e88d}' +
-  '.bw-ce .bw-ce-selector{color:#c792ea}' +
-  '.bw-ce .bw-ce-css-prop{color:#82aaff}' +
-  '.bw-ce .bw-ce-css-value{color:#f78c6c}' +
-  '.bw-ce .bw-ce-at-rule{color:#c792ea;font-style:italic}' +
-  '.bw-ce .bw-ce-color{color:#f78c6c}' +
-  '.bw-ce .bw-ce-template-interp{color:#89ddff}' +
+  '.bw_ce{background:var(--bw_code_bg,#1e293b);border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' +
+  '.bw_ce pre{margin:0;padding:0}' +
+  '.bw_ce code{font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;color:var(--bw_code_text,#e2e8f0);outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' +
+  '.bw_ce code:empty::before{content:"\\200b"}' +
+  '.bw_ce .bw_ce_keyword{color:#c792ea}' +
+  '.bw_ce .bw_ce_string{color:#c3e88d}' +
+  '.bw_ce .bw_ce_comment{color:#546e7a;font-style:italic}' +
+  '.bw_ce .bw_ce_number{color:#f78c6c}' +
+  '.bw_ce .bw_ce_operator{color:#89ddff}' +
+  '.bw_ce .bw_ce_punctuation{color:#89ddff}' +
+  '.bw_ce .bw_ce_property{color:#82aaff}' +
+  '.bw_ce .bw_ce_function{color:#82aaff}' +
+  '.bw_ce .bw_ce_tag{color:#f07178}' +
+  '.bw_ce .bw_ce_attr_name{color:#ffcb6b}' +
+  '.bw_ce .bw_ce_attr_value{color:#c3e88d}' +
+  '.bw_ce .bw_ce_selector{color:#c792ea}' +
+  '.bw_ce .bw_ce_css_prop{color:#82aaff}' +
+  '.bw_ce .bw_ce_css_value{color:#f78c6c}' +
+  '.bw_ce .bw_ce_at_rule{color:#c792ea;font-style:italic}' +
+  '.bw_ce .bw_ce_color{color:#f78c6c}' +
+  '.bw_ce .bw_ce_template_interp{color:#89ddff}' +
   // Light theme
-  '.bw-ce-light.bw-ce{background:#fafafa;border-color:#d8d8d8}' +
-  '.bw-ce-light.bw-ce code{color:#1a1a1a}' +
-  '.bw-ce-light.bw-ce .bw-ce-keyword{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-string{color:#16a34a}' +
-  '.bw-ce-light.bw-ce .bw-ce-comment{color:#9ca3af;font-style:italic}' +
-  '.bw-ce-light.bw-ce .bw-ce-number{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-operator{color:#0891b2}' +
-  '.bw-ce-light.bw-ce .bw-ce-punctuation{color:#6b7280}' +
-  '.bw-ce-light.bw-ce .bw-ce-property{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-function{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-tag{color:#dc2626}' +
-  '.bw-ce-light.bw-ce .bw-ce-attr-name{color:#d97706}' +
-  '.bw-ce-light.bw-ce .bw-ce-attr-value{color:#16a34a}' +
-  '.bw-ce-light.bw-ce .bw-ce-selector{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-css-prop{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-css-value{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-at-rule{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-color{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-template-interp{color:#0891b2}';
+  '.bw_ce_light.bw_ce{background:#fafafa;border-color:#d8d8d8}' +
+  '.bw_ce_light.bw_ce code{color:#1a1a1a}' +
+  '.bw_ce_light.bw_ce .bw_ce_keyword{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_string{color:#16a34a}' +
+  '.bw_ce_light.bw_ce .bw_ce_comment{color:#9ca3af;font-style:italic}' +
+  '.bw_ce_light.bw_ce .bw_ce_number{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_operator{color:#0891b2}' +
+  '.bw_ce_light.bw_ce .bw_ce_punctuation{color:#6b7280}' +
+  '.bw_ce_light.bw_ce .bw_ce_property{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_function{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_tag{color:#dc2626}' +
+  '.bw_ce_light.bw_ce .bw_ce_attr_name{color:#d97706}' +
+  '.bw_ce_light.bw_ce .bw_ce_attr_value{color:#16a34a}' +
+  '.bw_ce_light.bw_ce .bw_ce_selector{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_css_prop{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_css_value{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_at_rule{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_color{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_template_interp{color:#0891b2}' +
+  // Line number gutter (opt-in via lineNumbers option)
+  '.bw_ce_wrap{display:flex;flex-direction:row}' +
+  '.bw_ce_gutter{flex:0 0 auto;padding:0.75rem 0;text-align:right;user-select:none;-webkit-user-select:none;color:#546e7a;font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;border-right:1px solid rgba(255,255,255,0.08);overflow:hidden}' +
+  '.bw_ce_gutter span{display:block;padding:0 0.5rem 0 0.75rem}' +
+  '.bw_ce_light .bw_ce_gutter{color:#9ca3af;border-right-color:#d8d8d8}';
 
 function ensureCSS(bw) {
   if (_cssInjected) return;
   _cssInjected = true;
   if (bw && bw.injectCSS) {
-    bw.injectCSS(CSS_TEXT, { id: 'bw-code-edit-styles' });
+    bw.injectCSS(CSS_TEXT, { id: 'bw_code_edit_styles' });
   }
 }
 
@@ -488,7 +500,7 @@ function tokensToTACO(tokArr) {
     if (tok.type === 'plain') {
       result.push(tok.text);
     } else {
-      result.push({ t: 'span', a: { class: 'bw-ce-' + tok.type }, c: tok.text });
+      result.push({ t: 'span', a: { class: 'bw_ce_' + tok.type }, c: tok.text });
     }
   }
   return result;
@@ -542,46 +554,83 @@ function codeEditor(opts) {
   var lang = opts.lang || 'js';
   var height = opts.height || '180px';
   var readOnly = !!opts.readOnly;
-  var className = 'bw-ce' + (opts.className ? ' ' + opts.className : '');
+  var showLineNumbers = !!opts.lineNumbers;
+  var className = 'bw_ce' + (opts.className ? ' ' + opts.className : '');
 
   var highlighted = highlight(code, lang);
 
   var codeAttrs = {
     spellcheck: 'false',
-    class: 'bw-ce-code'
+    class: 'bw_ce_code'
   };
   if (!readOnly) {
     codeAttrs.contenteditable = 'true';
   }
 
+  // Build line number gutter TACO if requested
+  var gutterTaco = null;
+  if (showLineNumbers) {
+    var lineCount = (code.match(/\n/g) || []).length + 1;
+    var gutterLines = [];
+    for (var li = 1; li <= lineCount; li++) {
+      gutterLines.push({ t: 'span', c: String(li) });
+    }
+    gutterTaco = { t: 'div', a: { class: 'bw_ce_gutter' }, c: gutterLines };
+  }
+
+  var preBlock = { t: 'pre', a: { style: 'flex:1;min-width:0;margin:0' }, c: { t: 'code', a: codeAttrs, c: highlighted } };
+  var innerContent = showLineNumbers
+    ? { t: 'div', a: { class: 'bw_ce_wrap' }, c: [gutterTaco, preBlock] }
+    : preBlock;
+
   return {
     t: 'div',
     a: { class: className, style: 'max-height:' + height + ';overflow:auto' },
-    c: [
-      { t: 'pre', c: { t: 'code', a: codeAttrs, c: highlighted } }
-    ],
+    c: [innerContent],
     o: {
       mounted: function(el) {
-        var codeEl = el.querySelector('.bw-ce-code');
+        var codeEl = el.querySelector('.bw_ce_code');
         if (!codeEl) return;
 
         var currentCode = code;
         var debounceTimer = null;
+        var gutterEl = showLineNumbers ? el.querySelector('.bw_ce_gutter') : null;
 
         // Resolve bw from global or import context
         var bw = (typeof window !== 'undefined' && window.bw) || {};
 
         function getValue() { return codeEl.textContent || ''; }
 
+        function updateGutter(text) {
+          if (!gutterEl) return;
+          var count = (text.match(/\n/g) || []).length + 1;
+          var html = '';
+          for (var i = 1; i <= count; i++) html += '<span>' + i + '</span>';
+          gutterEl.innerHTML = html;
+        }
+
         function setValue(newCode) {
           currentCode = newCode;
           var tacos = highlight(newCode, lang);
           if (bw.html) codeEl.innerHTML = bw.html({ t: 'span', c: tacos });
+          updateGutter(newCode);
         }
 
         // Expose API on the element
         el._bwCodeEdit = { getValue: getValue, setValue: setValue };
 
+        // Scroll sync: keep gutter aligned with code
+        if (gutterEl) {
+          var scrollParent = codeEl.closest('.bw_ce') || el;
+          scrollParent.addEventListener('scroll', function() {
+            gutterEl.style.transform = 'translateY(' + (-scrollParent.scrollTop) + 'px)';
+          });
+          // If the outer .bw_ce has overflow, sync from there
+          el.addEventListener('scroll', function() {
+            gutterEl.style.transform = 'translateY(' + (-el.scrollTop) + 'px)';
+          });
+        }
+
         if (readOnly) return;
 
         function rehighlight() {
@@ -592,6 +641,7 @@ function codeEditor(opts) {
           var tacos = highlight(newCode, lang);
           if (bw.html) codeEl.innerHTML = bw.html({ t: 'span', c: tacos });
           setCaretOffset(codeEl, offset);
+          updateGutter(newCode);
           if (opts.onChange) opts.onChange(newCode);
         }
 

package/dist/bitwrench-code-edit.cjs.min.js

@@ -0,0 +1,23 @@
+/*! bitwrench v2.0.16 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
+/**
+ * bitwrench-code-edit.js - syntax-highlighted contenteditable code editor addon
+ *
+ * Provides bw.highlight() for tokenizing JS/CSS/HTML into TACO spans,
+ * and bw.codeEditor() for a live editable code block with syntax coloring.
+ *
+ * Theme integration: The editor chrome (background, text color, font) reads
+ * from CSS custom properties --bw_code_bg, --bw_code_text, --bw_font_mono,
+ * falling back to built-in dark values when no theme is active. Syntax
+ * highlighting colors are intentionally fixed (they are a code color scheme,
+ * not brand colors). The bw_ce_light class is still supported for manual
+ * light-mode override.
+ *
+ * Can be loaded standalone (browser script tag after bitwrench.umd.js),
+ * or imported as an ES module / CJS module.
+ *
+ * @module bitwrench-code-edit
+ * @license BSD-2-Clause
+ */
+var e=!1,t='.bw_ce{background:var(--bw_code_bg,#1e293b);border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}.bw_ce pre{margin:0;padding:0}.bw_ce code{font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;color:var(--bw_code_text,#e2e8f0);outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}.bw_ce code:empty::before{content:"\\200b"}.bw_ce .bw_ce_keyword{color:#c792ea}.bw_ce .bw_ce_string{color:#c3e88d}.bw_ce .bw_ce_comment{color:#546e7a;font-style:italic}.bw_ce .bw_ce_number{color:#f78c6c}.bw_ce .bw_ce_operator{color:#89ddff}.bw_ce .bw_ce_punctuation{color:#89ddff}.bw_ce .bw_ce_property{color:#82aaff}.bw_ce .bw_ce_function{color:#82aaff}.bw_ce .bw_ce_tag{color:#f07178}.bw_ce .bw_ce_attr_name{color:#ffcb6b}.bw_ce .bw_ce_attr_value{color:#c3e88d}.bw_ce .bw_ce_selector{color:#c792ea}.bw_ce .bw_ce_css_prop{color:#82aaff}.bw_ce .bw_ce_css_value{color:#f78c6c}.bw_ce .bw_ce_at_rule{color:#c792ea;font-style:italic}.bw_ce .bw_ce_color{color:#f78c6c}.bw_ce .bw_ce_template_interp{color:#89ddff}.bw_ce_light.bw_ce{background:#fafafa;border-color:#d8d8d8}.bw_ce_light.bw_ce code{color:#1a1a1a}.bw_ce_light.bw_ce .bw_ce_keyword{color:#7c3aed}.bw_ce_light.bw_ce .bw_ce_string{color:#16a34a}.bw_ce_light.bw_ce .bw_ce_comment{color:#9ca3af;font-style:italic}.bw_ce_light.bw_ce .bw_ce_number{color:#ea580c}.bw_ce_light.bw_ce .bw_ce_operator{color:#0891b2}.bw_ce_light.bw_ce .bw_ce_punctuation{color:#6b7280}.bw_ce_light.bw_ce .bw_ce_property{color:#2563eb}.bw_ce_light.bw_ce .bw_ce_function{color:#2563eb}.bw_ce_light.bw_ce .bw_ce_tag{color:#dc2626}.bw_ce_light.bw_ce .bw_ce_attr_name{color:#d97706}.bw_ce_light.bw_ce .bw_ce_attr_value{color:#16a34a}.bw_ce_light.bw_ce .bw_ce_selector{color:#7c3aed}.bw_ce_light.bw_ce .bw_ce_css_prop{color:#2563eb}.bw_ce_light.bw_ce .bw_ce_css_value{color:#ea580c}.bw_ce_light.bw_ce .bw_ce_at_rule{color:#7c3aed}.bw_ce_light.bw_ce .bw_ce_color{color:#ea580c}.bw_ce_light.bw_ce .bw_ce_template_interp{color:#0891b2}.bw_ce_wrap{display:flex;flex-direction:row}.bw_ce_gutter{flex:0 0 auto;padding:0.75rem 0;text-align:right;user-select:none;-webkit-user-select:none;color:#546e7a;font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;border-right:1px solid rgba(255,255,255,0.08);overflow:hidden}.bw_ce_gutter span{display:block;padding:0 0.5rem 0 0.75rem}.bw_ce_light .bw_ce_gutter{color:#9ca3af;border-right-color:#d8d8d8}';var o={};function r(e){var t=[],c=0,n=e.length,a="";function l(e){a.length&&(t.push({type:e,text:a}),a="")}for(;c<n;){var s=e[c],i=e[c+1];if("/"!==s||"/"!==i)if("/"!==s||"*"!==i){if("/"===s&&"/"!==i&&"*"!==i){var p=t.length?t[t.length-1]:null,_=!1;if(a.trim().length||p&&"operator"!==p.type&&"punctuation"!==p.type&&"keyword"!==p.type||(_=!0),_){l("plain");for(var u="/",f=c+1,b=!1,w=!1;f<n;){var d=e[f];if(b)u+=d,b=!1,f++;else if("\\"!==d)if("["!==d)if("]"!==d){if("/"===d&&!w){u+=d,f++;break}if("\n"===d)break;u+=d,f++}else w=!1,u+=d,f++;else w=!0,u+=d,f++;else b=!0,u+=d,f++}for(;f<n&&/[gimsuvy]/.test(e[f]);)u+=e[f],f++;t.push({type:"string",text:u}),c=f;continue}}if('"'!==s&&"'"!==s&&"`"!==s)if(/[0-9]/.test(s)||"."===s&&i&&/[0-9]/.test(i)){l("plain");var h="";if("0"===s&&i&&/[xXbBoO]/.test(i))for(h=s+i,c+=2;c<n&&/[0-9a-fA-F_]/.test(e[c]);)h+=e[c],c++;else for(;c<n&&/[0-9._eE]/.test(e[c]);)"e"!==e[c]&&"E"!==e[c]||!e[c+1]||!/[+\-0-9]/.test(e[c+1])?(h+=e[c],c++):(h+=e[c]+e[c+1],c+=2);t.push({type:"number",text:h})}else if(/[a-zA-Z_$]/.test(s)){l("plain");for(var g="";c<n&&/[a-zA-Z0-9_$]/.test(e[c]);)g+=e[c],c++;for(var v=c;v<n&&(" "===e[v]||"\t"===e[v]);)v++;var x=t.length?t[t.length-1]:null,y=x&&"punctuation"===x.type&&"."===x.text;o[g]?t.push({type:"keyword",text:g}):y?v<n&&"("===e[v]?t.push({type:"function",text:g}):t.push({type:"property",text:g}):v<n&&"("===e[v]?t.push({type:"function",text:g}):t.push({type:"plain",text:g})}else if(-1==="=+-*/%!<>&|^~?:".indexOf(s))-1==="(){}[];,.".indexOf(s)?(a+=s,c++):(l("plain"),t.push({type:"punctuation",text:s}),c++);else{l("plain");var m=s;++c<n&&-1!=="=+-*/%!<>&|^~?:".indexOf(e[c])&&(m+=e[c],++c<n&&-1!=="=>&|".indexOf(e[c])&&(m+=e[c],c++)),t.push({type:"operator",text:m})}else{l("plain");var k=s,C=s,S=c+1;if("`"===k){for(;S<n;){var T=e[S];if("\\"!==T)if("$"!==T||"{"!==e[S+1]){if("`"===T){C+=T,S++;break}C+=T,S++}else{C.length&&t.push({type:"string",text:C}),C="",t.push({type:"template-interp",text:"${"}),S+=2;for(var A=1,E="";S<n&&A>0;){if("{"===e[S])A++;else if("}"===e[S]&&0===--A)break;E+=e[S],S++}var z=r(E);(t=t.concat(z)).push({type:"template-interp",text:"}"}),S++}else C+=T+(e[S+1]||""),S+=2}C.length&&t.push({type:"string",text:C})}else{for(;S<n;){var O=e[S];if("\\"!==O){if(O===k){C+=O,S++;break}if("\n"===O)break;C+=O,S++}else C+=O+(e[S+1]||""),S+=2}t.push({type:"string",text:C})}c=S}}else{l("plain");var M=e.indexOf("*/",c+2);-1===M&&(M=n-2),t.push({type:"comment",text:e.substring(c,M+2)}),c=M+2}else{l("plain");var R=e.indexOf("\n",c);-1===R&&(R=n),t.push({type:"comment",text:e.substring(c,R)}),c=R}}return l("plain"),t}function c(e){var t=[],o=0,r=e.length,c="selector",n="";function a(e){n.length&&(t.push({type:e||"plain",text:n}),n="")}for(;o<r;){var l=e[o],s=e[o+1];if("/"!==l||"*"!==s)if('"'!==l&&"'"!==l||"value"!==c&&"selector"!==c)if("@"!==l||"selector"!==c)if("#"!==l||"value"!==c)if("value"===c&&/[0-9]/.test(l)){a("css-value");for(var i="";o<r&&/[0-9.]/.test(e[o]);)i+=e[o],o++;for(var p="";o<r&&/[a-zA-Z%]/.test(e[o]);)p+=e[o],o++;t.push({type:"number",text:i+p})}else"{"!==l?"}"!==l?":"!==l||"prop"!==c?";"!==l?","!==l?(n+=l,o++):(a("selector"===c?"selector":"value"===c?"css-value":"plain"),t.push({type:"punctuation",text:l}),o++):(a("value"===c?"css-value":"plain"),t.push({type:"punctuation",text:l}),c="prop",o++):(a("css-prop"),t.push({type:"punctuation",text:l}),c="value",o++):(a("prop"===c?"css-prop":"value"===c?"css-value":"plain"),t.push({type:"punctuation",text:l}),c="selector",o++):(a("selector"===c?"selector":"plain"),t.push({type:"punctuation",text:l}),c="prop",o++);else{a("css-value");var _="#";for(o++;o<r&&/[0-9a-fA-F]/.test(e[o]);)_+=e[o],o++;t.push({type:"color",text:_})}else{a("selector");var u="@";for(o++;o<r&&/[a-zA-Z\-]/.test(e[o]);)u+=e[o],o++;t.push({type:"at-rule",text:u})}else{a("selector"===c?"selector":"css-value");var f=l,b=l;for(o++;o<r;)if("\\"!==e[o]){if(e[o]===f){b+=e[o],o++;break}b+=e[o],o++}else b+=e[o]+(e[o+1]||""),o+=2;t.push({type:"string",text:b})}else{a("selector"===c?"selector":"prop"===c?"css-prop":"css-value");var w=e.indexOf("*/",o+2);-1===w&&(w=r-2),t.push({type:"comment",text:e.substring(o,w+2)}),o=w+2}}return a("selector"===c?"selector":"prop"===c?"css-prop":"css-value"),t}function n(e){var t=[],o=0,r=e.length,c="";function n(e){c.length&&(t.push({type:e,text:c}),c="")}for(;o<r;){var a=e[o];if("<"!==a||"\x3c!--"!==e.substring(o,o+4))if("<"!==a)if("&"!==a)c+=a,o++;else{n("plain");var l="&";for(o++;o<r&&";"!==e[o]&&/[a-zA-Z0-9#]/.test(e[o]);)l+=e[o],o++;o<r&&";"===e[o]&&(l+=";",o++),t.push({type:"string",text:l})}else{n("plain");var s="<";for(++o<r&&"/"===e[o]&&(s+="/",o++);o<r&&/[a-zA-Z0-9\-]/.test(e[o]);)s+=e[o],o++;for(t.push({type:"tag",text:s});o<r&&">"!==e[o]&&("/"!==e[o]||">"!==e[o+1]);)if(/\s/.test(e[o])){for(var i="";o<r&&/\s/.test(e[o]);)i+=e[o],o++;t.push({type:"plain",text:i})}else if(/[a-zA-Z_\-@:]/.test(e[o])){for(var p="";o<r&&/[a-zA-Z0-9_\-@:]/.test(e[o]);)p+=e[o],o++;if(t.push({type:"attr-name",text:p}),o<r&&"="===e[o])if(t.push({type:"punctuation",text:"="}),++o<r&&('"'===e[o]||"'"===e[o])){var _=e[o],u=_;for(o++;o<r&&e[o]!==_;)u+=e[o],o++;o<r&&(u+=e[o],o++),t.push({type:"attr-value",text:u})}else{for(var f="";o<r&&!/[\s>]/.test(e[o]);)f+=e[o],o++;t.push({type:"attr-value",text:f})}}else c+=e[o],o++,n("plain");var b="";o<r&&"/"===e[o]&&(b+="/",o++),o<r&&">"===e[o]&&(b+=">",o++),b&&t.push({type:"tag",text:b})}else{n("plain");var w=e.indexOf("--\x3e",o+4);-1===w&&(w=r-3),t.push({type:"comment",text:e.substring(o,w+3)}),o=w+3}}return n("plain"),t}"var,const,let,function,return,if,else,for,while,do,switch,case,break,continue,new,typeof,instanceof,this,class,extends,import,export,default,from,true,false,null,undefined,try,catch,throw,finally,async,await,yield,of,in,delete,void,with,super,static,get,set,debugger".split(",").forEach(function(e){o[e]=!0});var a={js:r,javascript:r,css:c,html:n};function l(e,t){return function(e){for(var t=[],o=0;o<e.length;o++){var r=e[o];"plain"===r.type?t.push(r.text):t.push({t:"span",a:{class:"bw_ce_"+r.type},c:r.text})}return t}((a[t]||r)(e))}function s(e){var t=(e=e||{}).code||"",o=e.lang||"js",r=e.height||"180px",c=!!e.readOnly,n=!!e.lineNumbers,a="bw_ce"+(e.className?" "+e.className:""),s=l(t,o),i={spellcheck:"false",class:"bw_ce_code"};c||(i.contenteditable="true");var p=null;if(n){for(var _=(t.match(/\n/g)||[]).length+1,u=[],f=1;f<=_;f++)u.push({t:"span",c:String(f)});p={t:"div",a:{class:"bw_ce_gutter"},c:u}}var b={t:"pre",a:{style:"flex:1;min-width:0;margin:0"},c:{t:"code",a:i,c:s}};return{t:"div",a:{class:a,style:"max-height:"+r+";overflow:auto"},c:[n?{t:"div",a:{class:"bw_ce_wrap"},c:[p,b]}:b],o:{mounted:function(r){var a=r.querySelector(".bw_ce_code");if(a){var s=t,i=null,p=n?r.querySelector(".bw_ce_gutter"):null,_="undefined"!=typeof window&&window.bw||{};if(r._bwCodeEdit={getValue:f,setValue:function(e){s=e;var t=l(e,o);_.html&&(a.innerHTML=_.html({t:"span",c:t})),b(e)}},p){var u=a.closest(".bw_ce")||r;u.addEventListener("scroll",function(){p.style.transform="translateY("+-u.scrollTop+"px)"}),r.addEventListener("scroll",function(){p.style.transform="translateY("+-r.scrollTop+"px)"})}c||(a.addEventListener("input",function(){clearTimeout(i),i=setTimeout(w,50)}),a.addEventListener("keydown",function(e){"Tab"===e.key&&(e.preventDefault(),document.execCommand("insertText",!1,"  "))}))}function f(){return a.textContent||""}function b(e){if(p){for(var t=(e.match(/\n/g)||[]).length+1,o="",r=1;r<=t;r++)o+="<span>"+r+"</span>";p.innerHTML=o}}function w(){var t=f();if(t!==s){s=t;var r=function(e){var t=window.getSelection();if(!t.rangeCount)return 0;var o=t.getRangeAt(0).cloneRange();return o.selectNodeContents(e),o.setEnd(t.getRangeAt(0).startContainer,t.getRangeAt(0).startOffset),o.toString().length}(a),c=l(t,o);_.html&&(a.innerHTML=_.html({t:"span",c:c})),function(e,t){for(var o,r=window.getSelection(),c=document.createRange(),n=document.createTreeWalker(e,NodeFilter.SHOW_TEXT,null,!1),a=0;o=n.nextNode();){var l=o.textContent.length;if(a+l>=t)return c.setStart(o,t-a),c.collapse(!0),r.removeAllRanges(),void r.addRange(c);a+=l}c.selectNodeContents(e),c.collapse(!1),r.removeAllRanges(),r.addRange(c)}(a,r),b(t),e.onChange&&e.onChange(t)}}}}}}function i(o){o&&(o.highlight=l,o.codeEditor=function(r){return function(o){e||(e=!0,o&&o.injectCSS&&o.injectCSS(t,{id:"bw_code_edit_styles"}))}(o),s(r)})}"undefined"!=typeof window&&window.bw&&i(window.bw);var p={highlight:l,codeEditor:s,install:i,CSS_TEXT:t};exports.CSS_TEXT=t,exports.codeEditor=s,exports.default=p,exports.highlight=l,exports.install=i,exports.tokenizeCSS=c,exports.tokenizeHTML=n,exports.tokenizeJS=r;
+//# sourceMappingURL=bitwrench-code-edit.cjs.min.js.map

package/dist/bitwrench-code-edit.es5.js

@@ -1,4 +1,4 @@
-/*! bitwrench v2.0.14 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
+/*! bitwrench v2.0.16 | BSD-2-Clause | https://deftio.github.com/bitwrench/pages */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
   typeof define === 'function' && define.amd ? define(['exports'], factory) :
@@ -11,6 +11,13 @@
    * Provides bw.highlight() for tokenizing JS/CSS/HTML into TACO spans,
    * and bw.codeEditor() for a live editable code block with syntax coloring.
    *
+   * Theme integration: The editor chrome (background, text color, font) reads
+   * from CSS custom properties --bw_code_bg, --bw_code_text, --bw_font_mono,
+   * falling back to built-in dark values when no theme is active. Syntax
+   * highlighting colors are intentionally fixed (they are a code color scheme,
+   * not brand colors). The bw_ce_light class is still supported for manual
+   * light-mode override.
+   *
    * Can be loaded standalone (browser script tag after bitwrench.umd.js),
    * or imported as an ES module / CJS module.
    *
@@ -20,15 +27,17 @@
 
   // -- CSS (injected once) ----------------------------------------------
   var _cssInjected = false;
-  var CSS_TEXT = '.bw-ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' + '.bw-ce pre{margin:0;padding:0}' + '.bw-ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' + '.bw-ce code:empty::before{content:"\\200b"}' + '.bw-ce .bw-ce-keyword{color:#c792ea}' + '.bw-ce .bw-ce-string{color:#c3e88d}' + '.bw-ce .bw-ce-comment{color:#546e7a;font-style:italic}' + '.bw-ce .bw-ce-number{color:#f78c6c}' + '.bw-ce .bw-ce-operator{color:#89ddff}' + '.bw-ce .bw-ce-punctuation{color:#89ddff}' + '.bw-ce .bw-ce-property{color:#82aaff}' + '.bw-ce .bw-ce-function{color:#82aaff}' + '.bw-ce .bw-ce-tag{color:#f07178}' + '.bw-ce .bw-ce-attr-name{color:#ffcb6b}' + '.bw-ce .bw-ce-attr-value{color:#c3e88d}' + '.bw-ce .bw-ce-selector{color:#c792ea}' + '.bw-ce .bw-ce-css-prop{color:#82aaff}' + '.bw-ce .bw-ce-css-value{color:#f78c6c}' + '.bw-ce .bw-ce-at-rule{color:#c792ea;font-style:italic}' + '.bw-ce .bw-ce-color{color:#f78c6c}' + '.bw-ce .bw-ce-template-interp{color:#89ddff}' +
+  var CSS_TEXT = '.bw_ce{background:var(--bw_code_bg,#1e293b);border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' + '.bw_ce pre{margin:0;padding:0}' + '.bw_ce code{font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;color:var(--bw_code_text,#e2e8f0);outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' + '.bw_ce code:empty::before{content:"\\200b"}' + '.bw_ce .bw_ce_keyword{color:#c792ea}' + '.bw_ce .bw_ce_string{color:#c3e88d}' + '.bw_ce .bw_ce_comment{color:#546e7a;font-style:italic}' + '.bw_ce .bw_ce_number{color:#f78c6c}' + '.bw_ce .bw_ce_operator{color:#89ddff}' + '.bw_ce .bw_ce_punctuation{color:#89ddff}' + '.bw_ce .bw_ce_property{color:#82aaff}' + '.bw_ce .bw_ce_function{color:#82aaff}' + '.bw_ce .bw_ce_tag{color:#f07178}' + '.bw_ce .bw_ce_attr_name{color:#ffcb6b}' + '.bw_ce .bw_ce_attr_value{color:#c3e88d}' + '.bw_ce .bw_ce_selector{color:#c792ea}' + '.bw_ce .bw_ce_css_prop{color:#82aaff}' + '.bw_ce .bw_ce_css_value{color:#f78c6c}' + '.bw_ce .bw_ce_at_rule{color:#c792ea;font-style:italic}' + '.bw_ce .bw_ce_color{color:#f78c6c}' + '.bw_ce .bw_ce_template_interp{color:#89ddff}' +
   // Light theme
-  '.bw-ce-light.bw-ce{background:#fafafa;border-color:#d8d8d8}' + '.bw-ce-light.bw-ce code{color:#1a1a1a}' + '.bw-ce-light.bw-ce .bw-ce-keyword{color:#7c3aed}' + '.bw-ce-light.bw-ce .bw-ce-string{color:#16a34a}' + '.bw-ce-light.bw-ce .bw-ce-comment{color:#9ca3af;font-style:italic}' + '.bw-ce-light.bw-ce .bw-ce-number{color:#ea580c}' + '.bw-ce-light.bw-ce .bw-ce-operator{color:#0891b2}' + '.bw-ce-light.bw-ce .bw-ce-punctuation{color:#6b7280}' + '.bw-ce-light.bw-ce .bw-ce-property{color:#2563eb}' + '.bw-ce-light.bw-ce .bw-ce-function{color:#2563eb}' + '.bw-ce-light.bw-ce .bw-ce-tag{color:#dc2626}' + '.bw-ce-light.bw-ce .bw-ce-attr-name{color:#d97706}' + '.bw-ce-light.bw-ce .bw-ce-attr-value{color:#16a34a}' + '.bw-ce-light.bw-ce .bw-ce-selector{color:#7c3aed}' + '.bw-ce-light.bw-ce .bw-ce-css-prop{color:#2563eb}' + '.bw-ce-light.bw-ce .bw-ce-css-value{color:#ea580c}' + '.bw-ce-light.bw-ce .bw-ce-at-rule{color:#7c3aed}' + '.bw-ce-light.bw-ce .bw-ce-color{color:#ea580c}' + '.bw-ce-light.bw-ce .bw-ce-template-interp{color:#0891b2}';
+  '.bw_ce_light.bw_ce{background:#fafafa;border-color:#d8d8d8}' + '.bw_ce_light.bw_ce code{color:#1a1a1a}' + '.bw_ce_light.bw_ce .bw_ce_keyword{color:#7c3aed}' + '.bw_ce_light.bw_ce .bw_ce_string{color:#16a34a}' + '.bw_ce_light.bw_ce .bw_ce_comment{color:#9ca3af;font-style:italic}' + '.bw_ce_light.bw_ce .bw_ce_number{color:#ea580c}' + '.bw_ce_light.bw_ce .bw_ce_operator{color:#0891b2}' + '.bw_ce_light.bw_ce .bw_ce_punctuation{color:#6b7280}' + '.bw_ce_light.bw_ce .bw_ce_property{color:#2563eb}' + '.bw_ce_light.bw_ce .bw_ce_function{color:#2563eb}' + '.bw_ce_light.bw_ce .bw_ce_tag{color:#dc2626}' + '.bw_ce_light.bw_ce .bw_ce_attr_name{color:#d97706}' + '.bw_ce_light.bw_ce .bw_ce_attr_value{color:#16a34a}' + '.bw_ce_light.bw_ce .bw_ce_selector{color:#7c3aed}' + '.bw_ce_light.bw_ce .bw_ce_css_prop{color:#2563eb}' + '.bw_ce_light.bw_ce .bw_ce_css_value{color:#ea580c}' + '.bw_ce_light.bw_ce .bw_ce_at_rule{color:#7c3aed}' + '.bw_ce_light.bw_ce .bw_ce_color{color:#ea580c}' + '.bw_ce_light.bw_ce .bw_ce_template_interp{color:#0891b2}' +
+  // Line number gutter (opt-in via lineNumbers option)
+  '.bw_ce_wrap{display:flex;flex-direction:row}' + '.bw_ce_gutter{flex:0 0 auto;padding:0.75rem 0;text-align:right;user-select:none;-webkit-user-select:none;color:#546e7a;font-family:var(--bw_font_mono,"SF Mono",Monaco,"Cascadia Code",Consolas,monospace);font-size:0.875rem;line-height:1.6;border-right:1px solid rgba(255,255,255,0.08);overflow:hidden}' + '.bw_ce_gutter span{display:block;padding:0 0.5rem 0 0.75rem}' + '.bw_ce_light .bw_ce_gutter{color:#9ca3af;border-right-color:#d8d8d8}';
   function ensureCSS(bw) {
     if (_cssInjected) return;
     _cssInjected = true;
     if (bw && bw.injectCSS) {
       bw.injectCSS(CSS_TEXT, {
-        id: 'bw-code-edit-styles'
+        id: 'bw_code_edit_styles'
       });
     }
   }
@@ -703,7 +712,7 @@
         result.push({
           t: 'span',
           a: {
-            "class": 'bw-ce-' + tok.type
+            "class": 'bw_ce_' + tok.type
           },
           c: tok.text
         });
@@ -759,41 +768,81 @@
     var lang = opts.lang || 'js';
     var height = opts.height || '180px';
     var readOnly = !!opts.readOnly;
-    var className = 'bw-ce' + (opts.className ? ' ' + opts.className : '');
+    var showLineNumbers = !!opts.lineNumbers;
+    var className = 'bw_ce' + (opts.className ? ' ' + opts.className : '');
     var highlighted = highlight(code, lang);
     var codeAttrs = {
       spellcheck: 'false',
-      "class": 'bw-ce-code'
+      "class": 'bw_ce_code'
     };
     if (!readOnly) {
       codeAttrs.contenteditable = 'true';
     }
+
+    // Build line number gutter TACO if requested
+    var gutterTaco = null;
+    if (showLineNumbers) {
+      var lineCount = (code.match(/\n/g) || []).length + 1;
+      var gutterLines = [];
+      for (var li = 1; li <= lineCount; li++) {
+        gutterLines.push({
+          t: 'span',
+          c: String(li)
+        });
+      }
+      gutterTaco = {
+        t: 'div',
+        a: {
+          "class": 'bw_ce_gutter'
+        },
+        c: gutterLines
+      };
+    }
+    var preBlock = {
+      t: 'pre',
+      a: {
+        style: 'flex:1;min-width:0;margin:0'
+      },
+      c: {
+        t: 'code',
+        a: codeAttrs,
+        c: highlighted
+      }
+    };
+    var innerContent = showLineNumbers ? {
+      t: 'div',
+      a: {
+        "class": 'bw_ce_wrap'
+      },
+      c: [gutterTaco, preBlock]
+    } : preBlock;
     return {
       t: 'div',
       a: {
         "class": className,
         style: 'max-height:' + height + ';overflow:auto'
       },
-      c: [{
-        t: 'pre',
-        c: {
-          t: 'code',
-          a: codeAttrs,
-          c: highlighted
-        }
-      }],
+      c: [innerContent],
       o: {
         mounted: function mounted(el) {
-          var codeEl = el.querySelector('.bw-ce-code');
+          var codeEl = el.querySelector('.bw_ce_code');
           if (!codeEl) return;
           var currentCode = code;
           var debounceTimer = null;
+          var gutterEl = showLineNumbers ? el.querySelector('.bw_ce_gutter') : null;
 
           // Resolve bw from global or import context
           var bw = typeof window !== 'undefined' && window.bw || {};
           function getValue() {
             return codeEl.textContent || '';
           }
+          function updateGutter(text) {
+            if (!gutterEl) return;
+            var count = (text.match(/\n/g) || []).length + 1;
+            var html = '';
+            for (var i = 1; i <= count; i++) html += '<span>' + i + '</span>';
+            gutterEl.innerHTML = html;
+          }
           function setValue(newCode) {
             currentCode = newCode;
             var tacos = highlight(newCode, lang);
@@ -801,6 +850,7 @@
               t: 'span',
               c: tacos
             });
+            updateGutter(newCode);
           }
 
           // Expose API on the element
@@ -808,6 +858,18 @@
             getValue: getValue,
             setValue: setValue
           };
+
+          // Scroll sync: keep gutter aligned with code
+          if (gutterEl) {
+            var scrollParent = codeEl.closest('.bw_ce') || el;
+            scrollParent.addEventListener('scroll', function () {
+              gutterEl.style.transform = 'translateY(' + -scrollParent.scrollTop + 'px)';
+            });
+            // If the outer .bw_ce has overflow, sync from there
+            el.addEventListener('scroll', function () {
+              gutterEl.style.transform = 'translateY(' + -el.scrollTop + 'px)';
+            });
+          }
           if (readOnly) return;
           function rehighlight() {
             var newCode = getValue();
@@ -820,6 +882,7 @@
               c: tacos
             });
             setCaretOffset(codeEl, offset);
+            updateGutter(newCode);
             if (opts.onChange) opts.onChange(newCode);
           }
           codeEl.addEventListener('input', function () {