@brightspot/ui 5.0.3-toggleable-fix.0 → 5.1.0

package/dist/storybook/assets/{index-BZyp3DsT.js → index-CpksO7cK.js}

@@ -1 +1 @@
-import{R as e}from"./iframe-C3TUQi31.js";import"./preload-helper-PPVm8Dsz.js";const o={},c=e.createContext(o);function u(n){const t=e.useContext(c);return e.useMemo(function(){return typeof n=="function"?n(t):{...t,...n}},[t,n])}function r(n){let t;return n.disableParentContext?t=typeof n.components=="function"?n.components(o):n.components||o:t=u(n.components),e.createElement(c.Provider,{value:t},n.children)}export{r as MDXProvider,u as useMDXComponents};
+import{R as e}from"./iframe-BqpRijx3.js";import"./preload-helper-PPVm8Dsz.js";const o={},c=e.createContext(o);function u(n){const t=e.useContext(c);return e.useMemo(function(){return typeof n=="function"?n(t):{...t,...n}},[t,n])}function r(n){let t;return n.disableParentContext?t=typeof n.components=="function"?n.components(o):n.components||o:t=u(n.components),e.createElement(c.Provider,{value:t},n.children)}export{r as MDXProvider,u as useMDXComponents};

package/dist/storybook/assets/onFind-C_VPLxg8.js

@@ -0,0 +1 @@
+import{Q as W}from"./iframe-BqpRijx3.js";var L={exports:{}},K=L.exports,I;function V(){return I||(I=1,(function(s){(function(t,e){s.exports?s.exports=e():t.log=e()})(K,function(){var t=function(){},e="undefined",c=typeof window!==e&&typeof window.navigator!==e&&/Trident\/|MSIE /.test(window.navigator.userAgent),o=["trace","debug","info","warn","error"],n={},a=null;function v(i,u){var r=i[u];if(typeof r.bind=="function")return r.bind(i);try{return Function.prototype.bind.call(r,i)}catch{return function(){return Function.prototype.apply.apply(r,[i,arguments])}}}function U(){console.log&&(console.log.apply?console.log.apply(console,arguments):Function.prototype.apply.apply(console.log,[console,arguments])),console.trace&&console.trace()}function P(i){return i==="debug"&&(i="log"),typeof console===e?!1:i==="trace"&&c?U:console[i]!==void 0?v(console,i):console.log!==void 0?v(console,"log"):t}function y(){for(var i=this.getLevel(),u=0;u<o.length;u++){var r=o[u];this[r]=u<i?t:this.methodFactory(r,i,this.name)}if(this.log=this.debug,typeof console===e&&i<this.levels.SILENT)return"No console available for logging"}function q(i){return function(){typeof console!==e&&(y.call(this),this[i].apply(this,arguments))}}function z(i,u,r){return P(i)||q.apply(this,arguments)}function T(i,u){var r=this,m,k,h,g="loglevel";typeof i=="string"?g+=":"+i:typeof i=="symbol"&&(g=void 0);function D(l){var f=(o[l]||"silent").toUpperCase();if(!(typeof window===e||!g)){try{window.localStorage[g]=f;return}catch{}try{window.document.cookie=encodeURIComponent(g)+"="+f+";"}catch{}}}function x(){var l;if(!(typeof window===e||!g)){try{l=window.localStorage[g]}catch{}if(typeof l===e)try{var f=window.document.cookie,w=encodeURIComponent(g),C=f.indexOf(w+"=");C!==-1&&(l=/^([^;]+)/.exec(f.slice(C+w.length+1))[1])}catch{}return r.levels[l]===void 0&&(l=void 0),l}}function $(){if(!(typeof window===e||!g)){try{window.localStorage.removeItem(g)}catch{}try{window.document.cookie=encodeURIComponent(g)+"=; expires=Thu, 01 Jan 1970 00:00:00 UTC"}catch{}}}function b(l){var f=l;if(typeof f=="string"&&r.levels[f.toUpperCase()]!==void 0&&(f=r.levels[f.toUpperCase()]),typeof f=="number"&&f>=0&&f<=r.levels.SILENT)return f;throw new TypeError("log.setLevel() called with invalid level: "+l)}r.name=i,r.levels={TRACE:0,DEBUG:1,INFO:2,WARN:3,ERROR:4,SILENT:5},r.methodFactory=u||z,r.getLevel=function(){return h??k??m},r.setLevel=function(l,f){return h=b(l),f!==!1&&D(h),y.call(r)},r.setDefaultLevel=function(l){k=b(l),x()||r.setLevel(l,!1)},r.resetLevel=function(){h=null,$(),y.call(r)},r.enableAll=function(l){r.setLevel(r.levels.TRACE,l)},r.disableAll=function(l){r.setLevel(r.levels.SILENT,l)},r.rebuild=function(){if(a!==r&&(m=b(a.getLevel())),y.call(r),a===r)for(var l in n)n[l].rebuild()},m=b(a?a.getLevel():"WARN");var F=x();F!=null&&(h=b(F)),y.call(r)}a=new T,a.getLogger=function(u){if(typeof u!="symbol"&&typeof u!="string"||u==="")throw new TypeError("You must supply a name when creating a logger.");var r=n[u];return r||(r=n[u]=new T(u,a.methodFactory)),r};var _=typeof window!==e?window.log:void 0;return a.noConflict=function(){return typeof window!==e&&window.log===a&&(window.log=_),a},a.getLoggers=function(){return n},a.default=a,a})})(L)),L.exports}var Y=V();const G=W(Y),R=Symbol.for("brightspot.onFind");let p;function d(){return p||(p=globalThis[R],p||(p={calledIndex:0,callbacks:[],blacklist:[],triggerPaused:!1,triggerOnResume:!1,triggerAll:!1,triggerElements:[],triggerFrame:0,initialized:!1},globalThis[R]=p),p)}class J{#r;#e;#t;#i;#n;constructor(t,e,c){this.#r=t,this.#e=`data-ofc${d().calledIndex++}`,Array.isArray(e)||(e=[e]),this.#t=e.map(e.some(n=>n.indexOf(",")>-1)?n=>n:n=>`${n}:not([${this.#e}])`).join(","),this.#i=c;const o=e.map(n=>n.trim()).filter(n=>n.indexOf(" ")<0&&n.indexOf(",")<0);o.length===e.length&&(this.#n=o)}addTriggerElements(t,e){if(this.#r.contains(e)){e.matches(this.#t)&&t.push(e);for(const c of e.querySelectorAll(this.#t))t.push(c)}}trigger(t){if(document.readyState!=="loading")if(this.#n&&Array.isArray(t))for(const e of t)this.#n.some(c=>e.matches(c))&&this.#o(e);else for(const e of this.#r.querySelectorAll(this.#t))this.#o(e)}#o(t){if(!N(t)&&!t.hasAttribute(this.#e)){t.setAttribute(this.#e,"");try{this.#i(t)}catch(e){G.error("Failed callback!",t,e)}}}}function N(s){if(!(s instanceof Element))return!1;const{blacklist:t}=d();return t.length>0&&t.some(e=>s.closest(e)!==null)}const S=Array.prototype.every,O=s=>s.nodeType===Node.TEXT_NODE;function A(s){const t=d();if(t.triggerPaused){t.triggerOnResume=!0;return}const e=Array.isArray(s),c=[];if(e){for(const o of s){const n=o.target;if(!N(n))switch(o.type){case"attributes":o.oldValue!==n.getAttribute(o.attributeName)&&c.push(o);break;case"childList":(!S.call(o.addedNodes,O)||!S.call(o.removedNodes,O))&&c.push(o);break}}if(c.length===0)return}if(c.length>500&&(t.triggerAll=!0),!t.triggerAll)if(e)for(const o of c){const n=o.target;switch(o.type){case"attributes":t.triggerElements.push(n);break;case"childList":for(const a of t.callbacks)a.addTriggerElements(t.triggerElements,n);break}}else t.triggerAll=!0;(t.triggerAll||t.triggerElements.length>0)&&!t.triggerFrame&&(t.triggerFrame=window.requestAnimationFrame(()=>{const o=t.triggerAll?void 0:t.triggerElements;t.triggerAll=!1,t.triggerElements=[],t.triggerFrame=0,t.callbacks.forEach(n=>n.trigger(o))}))}function M(){A(),new MutationObserver(A).observe(document,{attributes:!0,attributeFilter:["class","data-bsp-autosubmit","data-chart-type","data-code-type","data-internal-name","data-tab","name","rel","target"],attributeOldValue:!0,childList:!0,subtree:!0})}function Q(){const s=d();s.initialized||(s.initialized=!0,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",M):M())}function E(s,t,e){Q();let c,o;typeof e<"u"?(c=s,o=t):(c=document,o=s,e=t);const n=new J(c,o,e);return n.trigger(),d().callbacks.push(n),()=>{const{callbacks:a}=d(),v=a.indexOf(n);v!==-1&&a.splice(v,1)}}E.triggerCallbacks=A;E.pause=()=>{d().triggerPaused=!0};E.resume=()=>{const s=d();s.triggerPaused=!1,s.triggerOnResume&&(s.triggerOnResume=!1,setTimeout(A,100))};E.ignore=(...s)=>{const{blacklist:t}=d();for(const e of s){try{document.querySelector(e)}catch{continue}t.includes(e)||t.push(e)}};export{G as l,E as o};

package/dist/storybook/assets/{onFind.stories-BvaTMiWN.js → onFind.stories-BuZMC3tk.js}

@@ -1,4 +1,4 @@
-import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPhEfV5.js";import"./preload-helper-PPVm8Dsz.js";const F=Symbol.for("brightspot.onFind");let y;function v(){return y||(y=globalThis[F],y||(y={calledIndex:0,callbacks:[],blacklist:[],triggerPaused:!1,triggerOnResume:!1,triggerAll:!1,triggerElements:[],triggerFrame:0,initialized:!1},globalThis[F]=y),y)}class O{#n;#e;#t;#a;#s;constructor(t,e,n){this.#n=t,this.#e=`data-ofc${v().calledIndex++}`,Array.isArray(e)||(e=[e]),this.#t=e.map(e.some(o=>o.indexOf(",")>-1)?o=>o:o=>`${o}:not([${this.#e}])`).join(","),this.#a=n;const a=e.map(o=>o.trim()).filter(o=>o.indexOf(" ")<0&&o.indexOf(",")<0);a.length===e.length&&(this.#s=a)}addTriggerElements(t,e){if(this.#n.contains(e)){e.matches(this.#t)&&t.push(e);for(const n of e.querySelectorAll(this.#t))t.push(n)}}trigger(t){if(document.readyState!=="loading")if(this.#s&&Array.isArray(t))for(const e of t)this.#s.some(n=>e.matches(n))&&this.#o(e);else for(const e of this.#n.querySelectorAll(this.#t))this.#o(e)}#o(t){if(!H(t)&&!t.hasAttribute(this.#e)){t.setAttribute(this.#e,"");try{this.#a(t)}catch(e){P.error("Failed callback!",t,e)}}}}function H(s){if(!(s instanceof Element))return!1;const{blacklist:t}=v();return t.length>0&&t.some(e=>s.closest(e)!==null)}const $=Array.prototype.every,S=s=>s.nodeType===Node.TEXT_NODE;function C(s){const t=v();if(t.triggerPaused){t.triggerOnResume=!0;return}const e=Array.isArray(s),n=[];if(e){for(const a of s){const o=a.target;if(!H(o))switch(a.type){case"attributes":a.oldValue!==o.getAttribute(a.attributeName)&&n.push(a);break;case"childList":(!$.call(a.addedNodes,S)||!$.call(a.removedNodes,S))&&n.push(a);break}}if(n.length===0)return}if(n.length>500&&(t.triggerAll=!0),!t.triggerAll)if(e)for(const a of n){const o=a.target;switch(a.type){case"attributes":t.triggerElements.push(o);break;case"childList":for(const r of t.callbacks)r.addTriggerElements(t.triggerElements,o);break}}else t.triggerAll=!0;(t.triggerAll||t.triggerElements.length>0)&&!t.triggerFrame&&(t.triggerFrame=window.requestAnimationFrame(()=>{const a=t.triggerAll?void 0:t.triggerElements;t.triggerAll=!1,t.triggerElements=[],t.triggerFrame=0,t.callbacks.forEach(o=>o.trigger(a))}))}function z(){C(),new MutationObserver(C).observe(document,{attributes:!0,attributeFilter:["class","data-bsp-autosubmit","data-chart-type","data-code-type","data-internal-name","data-tab","name","rel","target"],attributeOldValue:!0,childList:!0,subtree:!0})}function D(){const s=v();s.initialized||(s.initialized=!0,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",z):z())}function m(s,t,e){D();let n,a;typeof e<"u"?(n=s,a=t):(n=document,a=s,e=t);const o=new O(n,a,e);o.trigger(),v().callbacks.push(o)}m.triggerCallbacks=C;m.pause=()=>{v().triggerPaused=!0};m.resume=()=>{const s=v();s.triggerPaused=!1,s.triggerOnResume&&(s.triggerOnResume=!1,setTimeout(C,100))};m.ignore=(...s)=>{const{blacklist:t}=v();for(const e of s){try{document.querySelector(e)}catch{continue}t.includes(e)||t.push(e)}};const{expect:d,userEvent:c,waitFor:u,within:k}=__STORYBOOK_MODULE_TEST__,R={title:"Utilities/onFind",tags:["autodocs"],parameters:{docs:{subtitle:"The `onFind` utility observes DOM mutations and executes callbacks when elements matching specified selectors appear. Uses MutationObserver internally to efficiently track element additions and attribute changes."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector to watch for"}},args:{selector:".dynamic-item"}},x={render:s=>{const t=`onfind-${Math.random().toString(36).substring(2,9)}`,e=`.dynamic-item-${t}`;let n=0,a=0;const o=()=>{const i=document.getElementById(`${t}-items-count`),l=document.getElementById(`${t}-found-count`);i&&(i.textContent=String(n)),l&&(l.textContent=String(a))};return b(e,i=>{a++,o(),i.classList.add("ring-2","ring-success-500")}),f`
+import{x as f}from"./iframe-BqpRijx3.js";import{l as P,o as p}from"./onFind-C_VPLxg8.js";import"./preload-helper-PPVm8Dsz.js";const F=Symbol.for("brightspot.onFind");let y;function v(){return y||(y=globalThis[F],y||(y={calledIndex:0,callbacks:[],blacklist:[],triggerPaused:!1,triggerOnResume:!1,triggerAll:!1,triggerElements:[],triggerFrame:0,initialized:!1},globalThis[F]=y),y)}class O{#n;#e;#t;#a;#s;constructor(t,e,n){this.#n=t,this.#e=`data-ofc${v().calledIndex++}`,Array.isArray(e)||(e=[e]),this.#t=e.map(e.some(o=>o.indexOf(",")>-1)?o=>o:o=>`${o}:not([${this.#e}])`).join(","),this.#a=n;const a=e.map(o=>o.trim()).filter(o=>o.indexOf(" ")<0&&o.indexOf(",")<0);a.length===e.length&&(this.#s=a)}addTriggerElements(t,e){if(this.#n.contains(e)){e.matches(this.#t)&&t.push(e);for(const n of e.querySelectorAll(this.#t))t.push(n)}}trigger(t){if(document.readyState!=="loading")if(this.#s&&Array.isArray(t))for(const e of t)this.#s.some(n=>e.matches(n))&&this.#o(e);else for(const e of this.#n.querySelectorAll(this.#t))this.#o(e)}#o(t){if(!H(t)&&!t.hasAttribute(this.#e)){t.setAttribute(this.#e,"");try{this.#a(t)}catch(e){P.error("Failed callback!",t,e)}}}}function H(s){if(!(s instanceof Element))return!1;const{blacklist:t}=v();return t.length>0&&t.some(e=>s.closest(e)!==null)}const $=Array.prototype.every,S=s=>s.nodeType===Node.TEXT_NODE;function C(s){const t=v();if(t.triggerPaused){t.triggerOnResume=!0;return}const e=Array.isArray(s),n=[];if(e){for(const a of s){const o=a.target;if(!H(o))switch(a.type){case"attributes":a.oldValue!==o.getAttribute(a.attributeName)&&n.push(a);break;case"childList":(!$.call(a.addedNodes,S)||!$.call(a.removedNodes,S))&&n.push(a);break}}if(n.length===0)return}if(n.length>500&&(t.triggerAll=!0),!t.triggerAll)if(e)for(const a of n){const o=a.target;switch(a.type){case"attributes":t.triggerElements.push(o);break;case"childList":for(const c of t.callbacks)c.addTriggerElements(t.triggerElements,o);break}}else t.triggerAll=!0;(t.triggerAll||t.triggerElements.length>0)&&!t.triggerFrame&&(t.triggerFrame=window.requestAnimationFrame(()=>{const a=t.triggerAll?void 0:t.triggerElements;t.triggerAll=!1,t.triggerElements=[],t.triggerFrame=0,t.callbacks.forEach(o=>o.trigger(a))}))}function z(){C(),new MutationObserver(C).observe(document,{attributes:!0,attributeFilter:["class","data-bsp-autosubmit","data-chart-type","data-code-type","data-internal-name","data-tab","name","rel","target"],attributeOldValue:!0,childList:!0,subtree:!0})}function D(){const s=v();s.initialized||(s.initialized=!0,document.readyState==="loading"?document.addEventListener("DOMContentLoaded",z):z())}function b(s,t,e){D();let n,a;typeof e<"u"?(n=s,a=t):(n=document,a=s,e=t);const o=new O(n,a,e);return o.trigger(),v().callbacks.push(o),()=>{const{callbacks:c}=v(),m=c.indexOf(o);m!==-1&&c.splice(m,1)}}b.triggerCallbacks=C;b.pause=()=>{v().triggerPaused=!0};b.resume=()=>{const s=v();s.triggerPaused=!1,s.triggerOnResume&&(s.triggerOnResume=!1,setTimeout(C,100))};b.ignore=(...s)=>{const{blacklist:t}=v();for(const e of s){try{document.querySelector(e)}catch{continue}t.includes(e)||t.push(e)}};const{expect:d,userEvent:r,waitFor:u,within:k}=__STORYBOOK_MODULE_TEST__,R={title:"Utilities/onFind",tags:["autodocs"],parameters:{docs:{subtitle:"The `onFind` utility observes DOM mutations and executes callbacks when elements matching specified selectors appear. Uses MutationObserver internally to efficiently track element additions and attribute changes."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector to watch for"}},args:{selector:".dynamic-item"}},h={render:s=>{const t=`onfind-${Math.random().toString(36).substring(2,9)}`,e=`.dynamic-item-${t}`;let n=0,a=0;const o=()=>{const i=document.getElementById(`${t}-items-count`),l=document.getElementById(`${t}-found-count`);i&&(i.textContent=String(n)),l&&(l.textContent=String(a))};return p(e,i=>{a++,o(),i.classList.add("ring-2","ring-success-500")}),f`
       <div class="space-y-4">
         <div class="text-base">
           <p class="mb-2">
@@ -8,10 +8,10 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
         </div>
 
         <div class="flex gap-2">
-          <button data-testid="add-item" @click=${()=>{n++;const i=document.getElementById(`${t}-container`);if(i){const l=document.createElement("div");l.className=`dynamic-item-${t} rounded border bg-white p-4`,l.textContent=`Item ${n}`,i.appendChild(l)}o()}} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="add-item" @click=${()=>{n++;const i=document.getElementById(`${t}-container`);if(i){const l=document.createElement("div");l.className=`dynamic-item-${t} rounded border bg-white p-4`,l.textContent=`Item ${n}`,i.appendChild(l)}o()}} class="btu-button btu-button-primary btu-button-sm">
             Add Item
           </button>
-          <button data-testid="clear-items" @click=${()=>{n=0,a=0;const i=document.getElementById(`${t}-container`);i&&(i.innerHTML=""),o()}} class="btu-button-gray btu-button-sm btu-button">
+          <button data-testid="clear-items" @click=${()=>{n=0,a=0;const i=document.getElementById(`${t}-container`);i&&(i.innerHTML=""),o()}} class="btu-button btu-button-gray btu-button-sm">
             Clear All
           </button>
         </div>
@@ -35,7 +35,7 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
           </div>
         </div>
       </div>
-    `},parameters:{docs:{description:{story:"Interactive example showing onFind detecting dynamically added elements. Elements are automatically highlighted when detected."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Detects dynamically added element",async()=>{await c.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("1"))}),await t("Detects multiple elements",async()=>{await c.click(e.getByTestId("add-item")),await c.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("3"))}),await t("Clear resets counts",async()=>{await c.click(e.getByTestId("clear-items")),d(e.getByTestId("items-count")).toHaveTextContent("0"),d(e.getByTestId("found-count")).toHaveTextContent("0")}),await t("Detection resumes after clear",async()=>{await c.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("1"))})}},B={render:()=>{const s="onfind-ignore-demo",t=".ignore-demo-item",e="ignore-demo-zone";let n=0,a=0;const o=()=>{const i=document.getElementById(`${s}-found-count`);i&&(i.textContent=String(n))};return b.ignore(`.${e}`),b(t,i=>{n++,o(),i.classList.add("ring-2","ring-success-500")}),f`
+    `},parameters:{docs:{description:{story:"Interactive example showing onFind detecting dynamically added elements. Elements are automatically highlighted when detected."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Detects dynamically added element",async()=>{await r.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("1"))}),await t("Detects multiple elements",async()=>{await r.click(e.getByTestId("add-item")),await r.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("3"))}),await t("Clear resets counts",async()=>{await r.click(e.getByTestId("clear-items")),d(e.getByTestId("items-count")).toHaveTextContent("0"),d(e.getByTestId("found-count")).toHaveTextContent("0")}),await t("Detection resumes after clear",async()=>{await r.click(e.getByTestId("add-item")),await u(()=>d(e.getByTestId("found-count")).toHaveTextContent("1"))})}},B={render:()=>{const s="onfind-ignore-demo",t=".ignore-demo-item",e="ignore-demo-zone";let n=0,a=0;const o=()=>{const i=document.getElementById(`${s}-found-count`);i&&(i.textContent=String(n))};return p.ignore(`.${e}`),p(t,i=>{n++,o(),i.classList.add("ring-2","ring-success-500")}),f`
       <div class="space-y-4">
         <p class="text-base">
           Elements added inside the <strong>ignored zone</strong> are skipped by onFind callbacks. Elements added
@@ -43,10 +43,10 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
         </p>
 
         <div class="flex gap-2">
-          <button data-testid="add-outside" @click=${()=>{a++;const i=document.getElementById(`${s}-outside`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Outside ${a}`,i.appendChild(l)}}} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="add-outside" @click=${()=>{a++;const i=document.getElementById(`${s}-outside`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Outside ${a}`,i.appendChild(l)}}} class="btu-button btu-button-primary btu-button-sm">
             Add Outside
           </button>
-          <button data-testid="add-inside" @click=${()=>{a++;const i=document.getElementById(`${s}-inside`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Inside ${a}`,i.appendChild(l)}}} class="btu-button-gray btu-button-sm btu-button">
+          <button data-testid="add-inside" @click=${()=>{a++;const i=document.getElementById(`${s}-inside`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Inside ${a}`,i.appendChild(l)}}} class="btu-button btu-button-gray btu-button-sm">
             Add Inside Ignored
           </button>
         </div>
@@ -80,7 +80,7 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
           </div>
         </div>
       </div>
-    `},parameters:{docs:{description:{story:"Demonstrates `onFind.ignore()` — elements inside ignored containers are excluded from callback processing. Useful for skipping rich-text editors or other zones where DOM mutations should not trigger component initialization."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Detects outside ignored zone",async()=>{await c.click(e.getByTestId("add-outside")),await u(()=>d(e.getByTestId("ignore-found-count")).toHaveTextContent("1"))}),await t("Skips inside ignored zone",async()=>{await c.click(e.getByTestId("add-inside")),await new Promise(n=>requestAnimationFrame(()=>requestAnimationFrame(n))),d(e.getByTestId("ignore-found-count")).toHaveTextContent("1")}),await t("Continues detecting outside",async()=>{await c.click(e.getByTestId("add-outside")),await u(()=>d(e.getByTestId("ignore-found-count")).toHaveTextContent("2"))})}},I={render:()=>{const s="onfind-pause-demo",t=".pause-demo-item";let e=0,n=0;const a=()=>{const i=document.getElementById(`${s}-found-count`);i&&(i.textContent=String(e))};b(t,i=>{e++,a(),i.classList.add("ring-2","ring-success-500")});const o=()=>{n++;const i=document.getElementById(`${s}-container`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Item ${n}`,i.appendChild(l)}};let r=!1;return f`
+    `},parameters:{docs:{description:{story:"Demonstrates `onFind.ignore()` — elements inside ignored containers are excluded from callback processing. Useful for skipping rich-text editors or other zones where DOM mutations should not trigger component initialization."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Detects outside ignored zone",async()=>{await r.click(e.getByTestId("add-outside")),await u(()=>d(e.getByTestId("ignore-found-count")).toHaveTextContent("1"))}),await t("Skips inside ignored zone",async()=>{await r.click(e.getByTestId("add-inside")),await new Promise(n=>requestAnimationFrame(()=>requestAnimationFrame(n))),d(e.getByTestId("ignore-found-count")).toHaveTextContent("1")}),await t("Continues detecting outside",async()=>{await r.click(e.getByTestId("add-outside")),await u(()=>d(e.getByTestId("ignore-found-count")).toHaveTextContent("2"))})}},I={render:()=>{const s="onfind-pause-demo",t=".pause-demo-item";let e=0,n=0;const a=()=>{const i=document.getElementById(`${s}-found-count`);i&&(i.textContent=String(e))};p(t,i=>{e++,a(),i.classList.add("ring-2","ring-success-500")});const o=()=>{n++;const i=document.getElementById(`${s}-container`);if(i){const l=document.createElement("div");l.className=`${t.slice(1)} rounded border bg-white p-4`,l.textContent=`Item ${n}`,i.appendChild(l)}};let c=!1;return f`
       <div class="space-y-4">
         <p class="text-base">
           Use <code>onFind.pause()</code> to temporarily stop detection and <code>onFind.resume()</code> to restart it.
@@ -88,10 +88,10 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
         </p>
 
         <div class="flex gap-2">
-          <button data-testid="pause-add" @click=${o} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="pause-add" @click=${o} class="btu-button btu-button-primary btu-button-sm">
             Add Item
           </button>
-          <button data-testid="toggle-pause" @click=${()=>{r=!r,r?b.pause():b.resume();const i=document.querySelector('[data-testid="toggle-pause"]');i&&(i.textContent=r?"Resume":"Pause",i.className=r?"btu-button btu-button-success btu-button-sm":"btu-button btu-button-warning btu-button-sm")}} class="btu-button-warning btu-button-sm btu-button">
+          <button data-testid="toggle-pause" @click=${()=>{c=!c,c?p.pause():p.resume();const i=document.querySelector('[data-testid="toggle-pause"]');i&&(i.textContent=c?"Resume":"Pause",i.className=c?"btu-button btu-button-success btu-button-sm":"btu-button btu-button-warning btu-button-sm")}} class="btu-button btu-button-warning btu-button-sm">
             Pause
           </button>
         </div>
@@ -111,7 +111,7 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
           </div>
         </div>
       </div>
-    `},parameters:{docs:{description:{story:"Demonstrates `onFind.pause()` and `onFind.resume()`. While paused, DOM mutations are queued and processed when resumed."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Normal detection before pause",async()=>{await c.click(e.getByTestId("pause-add")),await u(()=>d(e.getByTestId("pause-found-count")).toHaveTextContent("1"))}),await t("Pause stops detection",async()=>{await c.click(e.getByTestId("toggle-pause")),await c.click(e.getByTestId("pause-add")),await new Promise(n=>setTimeout(n,200)),d(e.getByTestId("pause-found-count")).toHaveTextContent("1")}),await t("Resume triggers pending detection",async()=>{await c.click(e.getByTestId("toggle-pause")),await u(()=>d(e.getByTestId("pause-found-count")).toHaveTextContent("2"),{timeout:2e3})})}},w={render:()=>{const s=b,t=".singleton-item-a",e=".singleton-item-b";let n=0,a=0;const o=()=>{const g=document.getElementById("singleton-count-a"),h=document.getElementById("singleton-count-b");g&&(g.textContent=String(n)),h&&(h.textContent=String(a))};s.ignore(".singleton-ignored-zone"),s(t,g=>{n++,o(),g.classList.add("ring-2","ring-blue-500")}),m(e,g=>{a++,o(),g.classList.add("ring-2","ring-purple-500")});const r=(g,h,M)=>{const A=document.getElementById(M);if(A){const E=document.createElement("div");E.className=`${g.slice(1)} rounded border bg-white p-4`,E.textContent=h,A.appendChild(E)}};let p=!1;return f`
+    `},parameters:{docs:{description:{story:"Demonstrates `onFind.pause()` and `onFind.resume()`. While paused, DOM mutations are queued and processed when resumed."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Normal detection before pause",async()=>{await r.click(e.getByTestId("pause-add")),await u(()=>d(e.getByTestId("pause-found-count")).toHaveTextContent("1"))}),await t("Pause stops detection",async()=>{await r.click(e.getByTestId("toggle-pause")),await r.click(e.getByTestId("pause-add")),await new Promise(n=>setTimeout(n,200)),d(e.getByTestId("pause-found-count")).toHaveTextContent("1")}),await t("Resume triggers pending detection",async()=>{await r.click(e.getByTestId("toggle-pause")),await u(()=>d(e.getByTestId("pause-found-count")).toHaveTextContent("2"),{timeout:2e3})})}},w={render:()=>{const s=p,t=".singleton-item-a",e=".singleton-item-b";let n=0,a=0;const o=()=>{const g=document.getElementById("singleton-count-a"),x=document.getElementById("singleton-count-b");g&&(g.textContent=String(n)),x&&(x.textContent=String(a))};s.ignore(".singleton-ignored-zone"),s(t,g=>{n++,o(),g.classList.add("ring-2","ring-blue-500")}),b(e,g=>{a++,o(),g.classList.add("ring-2","ring-purple-500")});const c=(g,x,M)=>{const A=document.getElementById(M);if(A){const E=document.createElement("div");E.className=`${g.slice(1)} rounded border bg-white p-4`,E.textContent=x,A.appendChild(E)}};let m=!1;return f`
       <div class="space-y-4">
         <p class="text-base">
           Two separate ES module instances of <code>onFind</code> (each with its own <code>_state</code> cache) share
@@ -121,8 +121,8 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
         <div class="flex items-center gap-4">
           <button
             data-testid="singleton-toggle-pause"
-            @click=${()=>{p=!p,p?s.pause():s.resume();const g=document.querySelector('[data-testid="singleton-toggle-pause"]');g&&(g.textContent=p?"Resume":"Pause",g.className=p?"btu-button btu-button-success btu-button-sm":"btu-button btu-button-warning btu-button-sm")}}
-            class="btu-button-warning btu-button-sm btu-button"
+            @click=${()=>{m=!m,m?s.pause():s.resume();const g=document.querySelector('[data-testid="singleton-toggle-pause"]');g&&(g.textContent=m?"Resume":"Pause",g.className=m?"btu-button btu-button-success btu-button-sm":"btu-button btu-button-warning btu-button-sm")}}
+            class="btu-button btu-button-warning btu-button-sm"
           >
             Pause
           </button>
@@ -144,15 +144,15 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
             <div class="mb-2 flex gap-1">
               <button
                 data-testid="singleton-add-a"
-                @click=${()=>r(t,"Bundle A item","singleton-zone-a")}
-                class="btu-button-primary btu-button-sm btu-button"
+                @click=${()=>c(t,"Bundle A item","singleton-zone-a")}
+                class="btu-button btu-button-primary btu-button-sm"
               >
                 Add A
               </button>
               <button
                 data-testid="singleton-zone-a-add-b"
-                @click=${()=>r(e,"Bundle B item","singleton-zone-a")}
-                class="btu-button-purple btu-button-sm btu-button"
+                @click=${()=>c(e,"Bundle B item","singleton-zone-a")}
+                class="btu-button btu-button-purple btu-button-sm"
               >
                 Add B
               </button>
@@ -166,15 +166,15 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
             <div class="mb-2 flex gap-1">
               <button
                 data-testid="singleton-zone-b-add-a"
-                @click=${()=>r(t,"Bundle A item","singleton-zone-b")}
-                class="btu-button-primary btu-button-sm btu-button"
+                @click=${()=>c(t,"Bundle A item","singleton-zone-b")}
+                class="btu-button btu-button-primary btu-button-sm"
               >
                 Add A
               </button>
               <button
                 data-testid="singleton-add-b"
-                @click=${()=>r(e,"Bundle B item","singleton-zone-b")}
-                class="btu-button-purple btu-button-sm btu-button"
+                @click=${()=>c(e,"Bundle B item","singleton-zone-b")}
+                class="btu-button btu-button-purple btu-button-sm"
               >
                 Add B
               </button>
@@ -188,8 +188,8 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
             <div class="mb-2 flex gap-1">
               <button
                 data-testid="singleton-add-ignored"
-                @click=${()=>{r(t,"Ignored A","singleton-ignored"),r(e,"Ignored B","singleton-ignored")}}
-                class="btu-button-gray btu-button-sm btu-button"
+                @click=${()=>{c(t,"Ignored A","singleton-ignored"),c(e,"Ignored B","singleton-ignored")}}
+                class="btu-button btu-button-gray btu-button-sm"
               >
                 Add A & B
               </button>
@@ -203,7 +203,7 @@ import{x as f}from"./iframe-C3TUQi31.js";import{l as P,o as b}from"./onFind-9HPh
           </div>
         </div>
       </div>
-    `},parameters:{docs:{description:{story:"Two independent module instances of `onFind` (simulating separate bundles) share a single MutationObserver, ignore list, and pause/resume state through the `globalThis[Symbol.for()]` singleton pattern."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Shared observer: Bundle A detects A items, Bundle B detects B items",async()=>{await c.click(e.getByTestId("singleton-add-a")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("1")),await c.click(e.getByTestId("singleton-add-b")),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("1"))}),await t("Cross-zone detection fires correct callback",async()=>{await c.click(e.getByTestId("singleton-zone-a-add-b")),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("2")),d(e.getByTestId("singleton-count-a")).toHaveTextContent("1"),await c.click(e.getByTestId("singleton-zone-b-add-a")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("2")),d(e.getByTestId("singleton-count-b")).toHaveTextContent("2")}),await t("Shared ignore list: Bundle A ignore() blocks Bundle B callbacks",async()=>{const n=e.getByTestId("singleton-count-a").textContent,a=e.getByTestId("singleton-count-b").textContent;await c.click(e.getByTestId("singleton-add-ignored")),await new Promise(o=>requestAnimationFrame(()=>requestAnimationFrame(o))),d(e.getByTestId("singleton-count-a")).toHaveTextContent(n),d(e.getByTestId("singleton-count-b")).toHaveTextContent(a)}),await t("Ignore lists are merged and deduped across bundles",async()=>{const n=globalThis[Symbol.for("brightspot.onFind")],a=n.blacklist.length;m.ignore(".singleton-ignored-zone"),d(n.blacklist.length).toBe(a),m.ignore(".bundle-b-ignored"),d(n.blacklist).toContain(".singleton-ignored-zone"),d(n.blacklist).toContain(".bundle-b-ignored"),d(n.blacklist.length).toBe(a+1)}),await t("Shared pause/resume: Bundle A pause() stops Bundle B detection",async()=>{await c.click(e.getByTestId("singleton-toggle-pause")),await c.click(e.getByTestId("singleton-add-a")),await c.click(e.getByTestId("singleton-add-b")),await new Promise(n=>setTimeout(n,200)),d(e.getByTestId("singleton-count-a")).toHaveTextContent("2"),d(e.getByTestId("singleton-count-b")).toHaveTextContent("2"),await c.click(e.getByTestId("singleton-toggle-pause")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("3"),{timeout:2e3}),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("3"),{timeout:2e3})}),await t("No index collision on data-ofc attributes",async()=>{const n=s.querySelectorAll(".singleton-item-a, .singleton-item-b"),a=new Set;n.forEach(o=>{o.getAttributeNames().filter(r=>r.startsWith("data-ofc")).forEach(r=>a.add(r))}),d(a.size).toBeGreaterThanOrEqual(2)}),await t("Singleton state: both bundles share the same globalThis object",async()=>{const n=globalThis[Symbol.for("brightspot.onFind")];d(n).toBeDefined(),d(n.callbacks).toBeDefined(),d(Array.isArray(n.callbacks)).toBe(!0),d(n.initialized).toBe(!0),d(b.pause).not.toBe(m.pause),d(b.resume).not.toBe(m.resume)})}},T={render:()=>f`
+    `},parameters:{docs:{description:{story:"Two independent module instances of `onFind` (simulating separate bundles) share a single MutationObserver, ignore list, and pause/resume state through the `globalThis[Symbol.for()]` singleton pattern."}}},play:async({canvasElement:s,step:t})=>{const e=k(s);await t("Shared observer: Bundle A detects A items, Bundle B detects B items",async()=>{await r.click(e.getByTestId("singleton-add-a")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("1")),await r.click(e.getByTestId("singleton-add-b")),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("1"))}),await t("Cross-zone detection fires correct callback",async()=>{await r.click(e.getByTestId("singleton-zone-a-add-b")),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("2")),d(e.getByTestId("singleton-count-a")).toHaveTextContent("1"),await r.click(e.getByTestId("singleton-zone-b-add-a")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("2")),d(e.getByTestId("singleton-count-b")).toHaveTextContent("2")}),await t("Shared ignore list: Bundle A ignore() blocks Bundle B callbacks",async()=>{const n=e.getByTestId("singleton-count-a").textContent,a=e.getByTestId("singleton-count-b").textContent;await r.click(e.getByTestId("singleton-add-ignored")),await new Promise(o=>requestAnimationFrame(()=>requestAnimationFrame(o))),d(e.getByTestId("singleton-count-a")).toHaveTextContent(n),d(e.getByTestId("singleton-count-b")).toHaveTextContent(a)}),await t("Ignore lists are merged and deduped across bundles",async()=>{const n=globalThis[Symbol.for("brightspot.onFind")],a=n.blacklist.length;b.ignore(".singleton-ignored-zone"),d(n.blacklist.length).toBe(a),b.ignore(".bundle-b-ignored"),d(n.blacklist).toContain(".singleton-ignored-zone"),d(n.blacklist).toContain(".bundle-b-ignored"),d(n.blacklist.length).toBe(a+1)}),await t("Shared pause/resume: Bundle A pause() stops Bundle B detection",async()=>{await r.click(e.getByTestId("singleton-toggle-pause")),await r.click(e.getByTestId("singleton-add-a")),await r.click(e.getByTestId("singleton-add-b")),await new Promise(n=>setTimeout(n,200)),d(e.getByTestId("singleton-count-a")).toHaveTextContent("2"),d(e.getByTestId("singleton-count-b")).toHaveTextContent("2"),await r.click(e.getByTestId("singleton-toggle-pause")),await u(()=>d(e.getByTestId("singleton-count-a")).toHaveTextContent("3"),{timeout:2e3}),await u(()=>d(e.getByTestId("singleton-count-b")).toHaveTextContent("3"),{timeout:2e3})}),await t("No index collision on data-ofc attributes",async()=>{const n=s.querySelectorAll(".singleton-item-a, .singleton-item-b"),a=new Set;n.forEach(o=>{o.getAttributeNames().filter(c=>c.startsWith("data-ofc")).forEach(c=>a.add(c))}),d(a.size).toBeGreaterThanOrEqual(2)}),await t("Singleton state: both bundles share the same globalThis object",async()=>{const n=globalThis[Symbol.for("brightspot.onFind")];d(n).toBeDefined(),d(n.callbacks).toBeDefined(),d(Array.isArray(n.callbacks)).toBe(!0),d(n.initialized).toBe(!0),d(p.pause).not.toBe(b.pause),d(p.resume).not.toBe(b.resume)})}},T={render:()=>f`
     <div class="space-y-4 text-sm">
       <div>
         <h3 class="mb-2 font-bold">Basic Usage</h3>
@@ -336,7 +336,7 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
         </p>
       </div>
     </div>
-  `,parameters:{docs:{description:{story:"Code examples and documentation for using the onFind utility."}}}};x.parameters={...x.parameters,docs:{...x.parameters?.docs,source:{originalSource:`{
+  `,parameters:{docs:{description:{story:"Code examples and documentation for using the onFind utility."}}}};h.parameters={...h.parameters,docs:{...h.parameters?.docs,source:{originalSource:`{
   render: args => {
     const instanceId = \`onfind-\${Math.random().toString(36).substring(2, 9)}\`;
     const uniqueSelector = \`.dynamic-item-\${instanceId}\`;
@@ -385,10 +385,10 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
         </div>
 
         <div class="flex gap-2">
-          <button data-testid="add-item" @click=\${addItem} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="add-item" @click=\${addItem} class="btu-button btu-button-primary btu-button-sm">
             Add Item
           </button>
-          <button data-testid="clear-items" @click=\${clearItems} class="btu-button-gray btu-button-sm btu-button">
+          <button data-testid="clear-items" @click=\${clearItems} class="btu-button btu-button-gray btu-button-sm">
             Clear All
           </button>
         </div>
@@ -445,7 +445,7 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
       await waitFor(() => expect(canvas.getByTestId('found-count')).toHaveTextContent('1'));
     });
   }
-}`,...x.parameters?.docs?.source}}};B.parameters={...B.parameters,docs:{...B.parameters?.docs,source:{originalSource:`{
+}`,...h.parameters?.docs?.source}}};B.parameters={...B.parameters,docs:{...B.parameters?.docs,source:{originalSource:`{
   render: () => {
     const instanceId = 'onfind-ignore-demo';
     const itemSelector = '.ignore-demo-item';
@@ -490,10 +490,10 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
         </p>
 
         <div class="flex gap-2">
-          <button data-testid="add-outside" @click=\${addOutside} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="add-outside" @click=\${addOutside} class="btu-button btu-button-primary btu-button-sm">
             Add Outside
           </button>
-          <button data-testid="add-inside" @click=\${addInside} class="btu-button-gray btu-button-sm btu-button">
+          <button data-testid="add-inside" @click=\${addInside} class="btu-button btu-button-gray btu-button-sm">
             Add Inside Ignored
           </button>
         </div>
@@ -603,10 +603,10 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
         </p>
 
         <div class="flex gap-2">
-          <button data-testid="pause-add" @click=\${addItem} class="btu-button-primary btu-button-sm btu-button">
+          <button data-testid="pause-add" @click=\${addItem} class="btu-button btu-button-primary btu-button-sm">
             Add Item
           </button>
-          <button data-testid="toggle-pause" @click=\${togglePause} class="btu-button-warning btu-button-sm btu-button">
+          <button data-testid="toggle-pause" @click=\${togglePause} class="btu-button btu-button-warning btu-button-sm">
             Pause
           </button>
         </div>
@@ -729,7 +729,7 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
           <button
             data-testid="singleton-toggle-pause"
             @click=\${togglePause}
-            class="btu-button-warning btu-button-sm btu-button"
+            class="btu-button btu-button-warning btu-button-sm"
           >
             Pause
           </button>
@@ -752,14 +752,14 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
               <button
                 data-testid="singleton-add-a"
                 @click=\${() => addItem(selectorA, 'Bundle A item', 'singleton-zone-a')}
-                class="btu-button-primary btu-button-sm btu-button"
+                class="btu-button btu-button-primary btu-button-sm"
               >
                 Add A
               </button>
               <button
                 data-testid="singleton-zone-a-add-b"
                 @click=\${() => addItem(selectorB, 'Bundle B item', 'singleton-zone-a')}
-                class="btu-button-purple btu-button-sm btu-button"
+                class="btu-button btu-button-purple btu-button-sm"
               >
                 Add B
               </button>
@@ -774,14 +774,14 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
               <button
                 data-testid="singleton-zone-b-add-a"
                 @click=\${() => addItem(selectorA, 'Bundle A item', 'singleton-zone-b')}
-                class="btu-button-primary btu-button-sm btu-button"
+                class="btu-button btu-button-primary btu-button-sm"
               >
                 Add A
               </button>
               <button
                 data-testid="singleton-add-b"
                 @click=\${() => addItem(selectorB, 'Bundle B item', 'singleton-zone-b')}
-                class="btu-button-purple btu-button-sm btu-button"
+                class="btu-button btu-button-purple btu-button-sm"
               >
                 Add B
               </button>
@@ -796,7 +796,7 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
               <button
                 data-testid="singleton-add-ignored"
                 @click=\${addIgnored}
-                class="btu-button-gray btu-button-sm btu-button"
+                class="btu-button btu-button-gray btu-button-sm"
               >
                 Add A & B
               </button>
@@ -1042,4 +1042,4 @@ onFind.ignore('.ProseMirror', '.RichTextEditor')
       }
     }
   }
-}`,...T.parameters?.docs?.source}}};const U=["Interactive","Ignore","PauseResume","Singleton","UsageExample"];export{B as Ignore,x as Interactive,I as PauseResume,w as Singleton,T as UsageExample,U as __namedExportsOrder,R as default};
+}`,...T.parameters?.docs?.source}}};const U=["Interactive","Ignore","PauseResume","Singleton","UsageExample"];export{B as Ignore,h as Interactive,I as PauseResume,w as Singleton,T as UsageExample,U as __namedExportsOrder,R as default};

package/dist/storybook/assets/{onRemove.stories-BPSyS2GE.js → onRemove.stories-HDkMhdmO.js}

@@ -1,4 +1,4 @@
-import{x as p}from"./iframe-C3TUQi31.js";import"./preload-helper-PPVm8Dsz.js";let l=!1;function m(e,o){const s=new MutationObserver(r=>{for(const v of r)for(const n of v.removedNodes)n.contains(e)&&!l&&(s.disconnect(),o())});s.observe(document,{childList:!0,subtree:!0})}m.pause=()=>{l=!0};m.resume=()=>{l=!1};const h={title:"Utilities/onRemove",tags:["autodocs"],parameters:{docs:{subtitle:"The `onRemove` utility triggers a callback when a DOM element is removed from the document. Uses MutationObserver to watch for removals, with global pause/resume support."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector of element to watch"}},args:{selector:".watched-item"}},i={render:()=>{const e=`onremove-${Math.random().toString(36).substring(2,9)}`;let o=0,s=0;const r=()=>{const n=document.getElementById(`${e}-items-count`),t=document.getElementById(`${e}-removed-count`);n&&(n.textContent=String(o)),t&&(t.textContent=String(s))};return p`
+import{x as p}from"./iframe-BqpRijx3.js";import"./preload-helper-PPVm8Dsz.js";let l=!1;function m(e,o){const s=new MutationObserver(r=>{for(const v of r)for(const n of v.removedNodes)n.contains(e)&&!l&&(s.disconnect(),o())});s.observe(document,{childList:!0,subtree:!0})}m.pause=()=>{l=!0};m.resume=()=>{l=!1};const h={title:"Utilities/onRemove",tags:["autodocs"],parameters:{docs:{subtitle:"The `onRemove` utility triggers a callback when a DOM element is removed from the document. Uses MutationObserver to watch for removals, with global pause/resume support."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector of element to watch"}},args:{selector:".watched-item"}},i={render:()=>{const e=`onremove-${Math.random().toString(36).substring(2,9)}`;let o=0,s=0;const r=()=>{const n=document.getElementById(`${e}-items-count`),t=document.getElementById(`${e}-removed-count`);n&&(n.textContent=String(o)),t&&(t.textContent=String(s))};return p`
       <div class="space-y-4">
         <div class="text-base">
           <p class="mb-2">
@@ -8,7 +8,7 @@ import{x as p}from"./iframe-C3TUQi31.js";import"./preload-helper-PPVm8Dsz.js";le
         </div>
 
         <div class="flex gap-2">
-          <button @click=${()=>{o++;const n=document.getElementById(`${e}-container`);if(!n)return;const t=document.createElement("div"),u=o;t.className="flex items-center justify-between rounded border bg-white p-4",t.innerHTML=`<span>Item ${u}</span>`;const d=document.createElement("button");d.className="rounded bg-red-100 px-2 py-1 text-xs text-red-700 hover:bg-red-200",d.textContent="Remove",d.addEventListener("click",()=>t.remove()),t.appendChild(d),n.appendChild(t),m(t,()=>{s++,o--,r();const g=document.getElementById(`${e}-log`);if(g){const c=document.createElement("div");c.className="text-sm text-gray-600",c.textContent=`Item ${u} removed at ${new Date().toLocaleTimeString()}`,g.prepend(c)}}),r()}} class="btu-button-primary btu-button-sm btu-button">Add Item</button>
+          <button @click=${()=>{o++;const n=document.getElementById(`${e}-container`);if(!n)return;const t=document.createElement("div"),u=o;t.className="flex items-center justify-between rounded border bg-white p-4",t.innerHTML=`<span>Item ${u}</span>`;const d=document.createElement("button");d.className="rounded bg-red-100 px-2 py-1 text-xs text-red-700 hover:bg-red-200",d.textContent="Remove",d.addEventListener("click",()=>t.remove()),t.appendChild(d),n.appendChild(t),m(t,()=>{s++,o--,r();const g=document.getElementById(`${e}-log`);if(g){const c=document.createElement("div");c.className="text-sm text-gray-600",c.textContent=`Item ${u} removed at ${new Date().toLocaleTimeString()}`,g.prepend(c)}}),r()}} class="btu-button btu-button-primary btu-button-sm">Add Item</button>
         </div>
 
         <div id="${e}-container" class="min-h-32 space-y-2 rounded border-2 border-gray-300 bg-gray-50 p-4">
@@ -134,7 +134,7 @@ onRemove.resume()</code></pre>
         </div>
 
         <div class="flex gap-2">
-          <button @click=\${addItem} class="btu-button-primary btu-button-sm btu-button">Add Item</button>
+          <button @click=\${addItem} class="btu-button btu-button-primary btu-button-sm">Add Item</button>
         </div>
 
         <div id="\${instanceId}-container" class="min-h-32 space-y-2 rounded border-2 border-gray-300 bg-gray-50 p-4">

package/dist/storybook/assets/{onVisible.stories-1lKUeGbt.js → onVisible.stories-CRCllRfN.js}

@@ -1,4 +1,4 @@
-import{x as d}from"./iframe-C3TUQi31.js";import{o as g}from"./onFind-9HPhEfV5.js";import"./preload-helper-PPVm8Dsz.js";const b=Symbol.for("brightspot.onVisible");let t;function v(){return t||(t=globalThis[b],t||(t={calledIndex:0},globalThis[b]=t),t)}function h(i,r){const s=`_ovc${v().calledIndex++}`,n=new IntersectionObserver(e=>{for(const o of e)if(o.isIntersecting){const c=o.target,m=c.classList;m.contains(s)||(m.add(s),n.unobserve(c),r(c))}});g(i,e=>{n.observe(e)})}const f={title:"Utilities/onVisible",tags:["autodocs"],parameters:{docs:{subtitle:"The `onVisible` utility triggers a callback once when elements matching a selector become visible in the viewport. Combines `onFind` with `IntersectionObserver` for lazy initialization of dynamically added elements."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector to watch for visibility"}},args:{selector:".lazy-item"}},l={render:()=>{const i=`onvisible-${Math.random().toString(36).substring(2,9)}`,r=`.lazy-item-${i}`;let s=0;const n=()=>{const e=document.getElementById(`${i}-visible-count`);e&&(e.textContent=String(s))};return h(r,e=>{s++,n(),e.classList.remove("opacity-30"),e.classList.add("ring-2","ring-success-500","opacity-100"),e.textContent+=" — visible!"}),d`
+import{x as d}from"./iframe-BqpRijx3.js";import{o as g}from"./onFind-C_VPLxg8.js";import"./preload-helper-PPVm8Dsz.js";const b=Symbol.for("brightspot.onVisible");let t;function v(){return t||(t=globalThis[b],t||(t={calledIndex:0},globalThis[b]=t),t)}function h(i,r){const s=`_ovc${v().calledIndex++}`,n=new IntersectionObserver(e=>{for(const o of e)if(o.isIntersecting){const c=o.target,m=c.classList;m.contains(s)||(m.add(s),n.unobserve(c),r(c))}});g(i,e=>{n.observe(e)})}const f={title:"Utilities/onVisible",tags:["autodocs"],parameters:{docs:{subtitle:"The `onVisible` utility triggers a callback once when elements matching a selector become visible in the viewport. Combines `onFind` with `IntersectionObserver` for lazy initialization of dynamically added elements."},controls:{expanded:!0}},argTypes:{selector:{control:{type:"text"},description:"CSS selector to watch for visibility"}},args:{selector:".lazy-item"}},l={render:()=>{const i=`onvisible-${Math.random().toString(36).substring(2,9)}`,r=`.lazy-item-${i}`;let s=0;const n=()=>{const e=document.getElementById(`${i}-visible-count`);e&&(e.textContent=String(s))};return h(r,e=>{s++,n(),e.classList.remove("opacity-30"),e.classList.add("ring-2","ring-success-500","opacity-100"),e.textContent+=" — visible!"}),d`
       <div class="space-y-4">
         <div class="text-base">
           <p class="mb-2">

package/dist/storybook/assets/{style-map-ADugLljH.js → style-map-DukvFNCc.js}

@@ -1 +1 @@
-import{e as l,ae as u,af as c,ag as a}from"./iframe-C3TUQi31.js";const o="important",d=" !"+o,h=l(class extends u{constructor(s){if(super(s),s.type!==c.ATTRIBUTE||s.name!=="style"||s.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(s){return Object.keys(s).reduce(((n,t)=>{const e=s[t];return e==null?n:n+`${t=t.includes("-")?t:t.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${e};`}),"")}update(s,[n]){const{style:t}=s.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(n)),this.render(n);for(const e of this.ft)n[e]==null&&(this.ft.delete(e),e.includes("-")?t.removeProperty(e):t[e]=null);for(const e in n){const r=n[e];if(r!=null){this.ft.add(e);const i=typeof r=="string"&&r.endsWith(d);e.includes("-")||i?t.setProperty(e,i?r.slice(0,-11):r,i?o:""):t[e]=r}}return a}});export{h as o};
+import{e as l,ae as u,af as c,ag as a}from"./iframe-BqpRijx3.js";const o="important",d=" !"+o,h=l(class extends u{constructor(s){if(super(s),s.type!==c.ATTRIBUTE||s.name!=="style"||s.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(s){return Object.keys(s).reduce(((n,t)=>{const e=s[t];return e==null?n:n+`${t=t.includes("-")?t:t.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${e};`}),"")}update(s,[n]){const{style:t}=s.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(n)),this.render(n);for(const e of this.ft)n[e]==null&&(this.ft.delete(e),e.includes("-")?t.removeProperty(e):t[e]=null);for(const e in n){const r=n[e];if(r!=null){this.ft.add(e);const i=typeof r=="string"&&r.endsWith(d);e.includes("-")||i?t.setProperty(e,i?r.slice(0,-11):r,i?o:""):t[e]=r}}return a}});export{h as o};