@walkeros/storybook-addon 0.0.0-next-20251219153324

package/.eslintrc.js

@@ -0,0 +1,15 @@
+module.exports = {
+  extends: ['@walkeros/eslint'],
+  env: {
+    browser: true,
+    es2023: true,
+  },
+  overrides: [
+    {
+      files: ['**/*.stories.*'],
+      rules: {
+        'import/no-anonymous-default-export': 'off',
+      },
+    },
+  ],
+};

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Storybook contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,191 @@
+# @walkeros/storybook-addon
+
+A Storybook addon that integrates walkerOS tagging support for data collection
+and tracking validation. Visualize, debug, and validate walkerOS events in your
+stories.
+
+## Features
+
+- 📊 **Events Tab**: View all detected walkerOS events with JSON syntax
+  highlighting
+- 🔴 **Live Events Tab**: Real-time event capture as you interact with
+  components
+- 🎯 **Visual Highlighting**: Toggle highlights for Context, Entity, Property,
+  and Action attributes
+- 🔄 **Auto-refresh**: Updates automatically when navigating stories or changing
+  controls
+- ⚙️ **Custom Prefix Support**: Configure custom data attribute prefixes
+- 🚀 **Zero Configuration**: Works out of the box with walkerOS data attributes
+
+## Compatibility
+
+| Addon Version | Storybook Version | Status                      |
+| ------------- | ----------------- | --------------------------- |
+| ^0.2.x        | ^9.0.0            | ✅ Current (Active Support) |
+| ^1.0.0        | ^10.0.0           | 📋 Planned                  |
+
+> **Note:** Storybook 10 support is planned for v1.0.0. See
+> [STORYBOOK_10_MIGRATION.md](./STORYBOOK_10_MIGRATION.md) for migration
+> details.
+
+## Installation
+
+```bash
+npm install --save-dev @walkeros/storybook-addon
+```
+
+```ts
+// .storybook/main.ts
+const config: StorybookConfig = {
+  addons: ['@walkeros/storybook-addon'],
+};
+```
+
+## Usage
+
+### Basic Setup
+
+1. **Install and register** the addon
+2. **Add walkerOS tracking** to your components:
+
+```tsx
+import { tagger } from '../utils/tagger';
+
+export const Button = ({ label, onClick }) => {
+  const trackingProps = tagger('button').data({ label }).action('click').get();
+
+  return (
+    <button {...trackingProps} onClick={onClick}>
+      {label}
+    </button>
+  );
+};
+```
+
+3. **Use in stories**:
+
+```ts
+export const Primary: Story = {
+  args: {
+    label: 'Button',
+    dataElb: {
+      entity: 'button',
+      action: 'click',
+      data: { category: 'primary' },
+    },
+  },
+};
+```
+
+### Custom Prefix Configuration
+
+Configure a custom prefix in your Storybook preview:
+
+```ts
+// .storybook/preview.ts
+const preview: Preview = {
+  parameters: {
+    walkerOS: {
+      prefix: 'data-elb',
+      autoRefresh: true,
+    },
+  },
+};
+```
+
+Update your tagger configuration to match:
+
+```ts
+// utils/tagger.ts
+const taggerInstance = createTagger({
+  prefix: 'data-elb',
+});
+```
+
+## Addon Panels
+
+### Events Tab
+
+Shows all walkerOS events detected in the current story's DOM. Click "Update
+events" to manually refresh.
+
+### Live Events Tab
+
+Captures events in real-time as you interact with components. Events are
+automatically sent to the panel via the walker collector.
+
+### Visual Highlighting
+
+Use the highlight toggles to visually identify different types of walkerOS
+attributes:
+
+- **Context**: Yellow outline for context attributes
+- **Entity**: Green outline for entity attributes
+- **Property**: Red outline for property attributes
+- **Action**: Purple outline for action attributes
+
+## API Reference
+
+```ts
+import { DataElb, dataElbArgTypes } from '@walkeros/storybook-addon';
+```
+
+### `DataElb` Interface
+
+```ts
+interface DataElb {
+  entity?: string;
+  trigger?: string;
+  action?: string;
+  data?: WalkerOS.Properties;
+  context?: WalkerOS.Properties;
+  globals?: WalkerOS.Properties;
+  link?: Record<string, string>;
+}
+```
+
+### Story ArgTypes
+
+```ts
+export default {
+  argTypes: {
+    ...dataElbArgTypes,
+    // Adds a walkerOS object control to your story
+  },
+};
+```
+
+## Configuration
+
+| Option        | Type      | Default      | Description                                          |
+| ------------- | --------- | ------------ | ---------------------------------------------------- |
+| `prefix`      | `string`  | `'data-elb'` | Data attribute prefix (must match your walker setup) |
+| `autoRefresh` | `boolean` | `true`       | Auto-refresh events on story/control changes         |
+
+## Troubleshooting
+
+### Events Not Showing
+
+- Ensure components have walkerOS attributes: `data-elb`, `data-elb-*`, etc.
+- Check prefix matches between addon config and tagger config
+- Try manual refresh with "Update events" button
+
+### Live Events Not Working
+
+- Verify walker is properly initialized with matching prefix
+- Check browser console for walker initialization errors
+- Ensure components generate events when clicked/interacted with
+
+### Highlighting Not Working
+
+- Confirm prefix configuration matches in both addon and tagger
+- Check that elements have the expected data attributes in DOM inspector
+
+## License
+
+MIT © [elbwalker GmbH](https://www.walkeros.io)
+
+## Links
+
+- [walkerOS Documentation](https://docs.walkeros.com)
+- [GitHub Repository](https://github.com/elbwalker/walkerOS)

package/dist/index.cjs

@@ -0,0 +1,2 @@
+'use strict';var t={dataElb:{name:"walkerOS Data",description:"walkerOS tracking configuration",control:{type:"object"},table:{category:"walkerOS"}}};var e="walkerOS";var r={RESULT:`${e}/result`,REQUEST:`${e}/request`,HIGHLIGHT:`${e}/highlight`,LIVE_EVENT:`${e}/live-event`,ATTRIBUTES_RESULT:`${e}/attributes-result`,ATTRIBUTES_REQUEST:`${e}/attributes-request`};exports.EVENTS=r;exports.dataElbArgTypes=t;//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/types.ts","../src/constants.ts"],"names":["dataElbArgTypes","ADDON_ID","EVENTS"],"mappings":"aA0CO,IAAMA,CAAAA,CAAkB,CAC7B,OAAA,CAAS,CACP,IAAA,CAAM,gBACN,WAAA,CAAa,iCAAA,CACb,OAAA,CAAS,CAAE,IAAA,CAAM,QAAS,EAC1B,KAAA,CAAO,CACL,QAAA,CAAU,UACZ,CACF,CACF,ECnDO,IAAMC,CAAAA,CAAW,UAAA,CAIjB,IAAMC,CAAAA,CAAS,CACpB,MAAA,CAAQ,CAAA,EAAGD,CAAQ,UACnB,OAAA,CAAS,CAAA,EAAGA,CAAQ,CAAA,QAAA,CAAA,CACpB,SAAA,CAAW,CAAA,EAAGA,CAAQ,CAAA,UAAA,CAAA,CACtB,UAAA,CAAY,CAAA,EAAGA,CAAQ,CAAA,WAAA,CAAA,CACvB,iBAAA,CAAmB,CAAA,EAAGA,CAAQ,CAAA,kBAAA,CAAA,CAC9B,kBAAA,CAAoB,CAAA,EAAGA,CAAQ,CAAA,mBAAA,CACjC","file":"index.cjs","sourcesContent":["// Import WalkerOS Property types\nimport type { WalkerOS } from '@walkeros/core';\nimport type { Walker } from '@walkeros/web-core';\n\nexport interface WalkerOSAddon {\n  autoRefresh: boolean;\n  prefix?: string;\n  highlights?: {\n    context: boolean;\n    entity: boolean;\n    property: boolean;\n    action: boolean;\n    globals: boolean;\n  };\n}\n\nexport interface AttributeNode {\n  element: string;\n  path: string;\n  htmlMarkup?: string; // Store the HTML string instead of DOM reference\n  attributes: {\n    entity?: string;\n    action?: string;\n    context?: WalkerOS.Properties;\n    globals?: WalkerOS.Properties;\n    properties?: WalkerOS.Properties;\n  };\n  children: AttributeNode[];\n}\n\n// walkerOS tracking interface for clean component APIs\nexport interface DataElb {\n  entity?: string;\n  trigger?: string;\n  action?: string;\n  data?: WalkerOS.Properties;\n  context?: WalkerOS.Properties;\n  globals?: WalkerOS.Properties;\n  link?: Record<string, string>;\n}\n\n// Storybook argTypes for DataElb interface\nexport const dataElbArgTypes = {\n  dataElb: {\n    name: 'walkerOS Data',\n    description: 'walkerOS tracking configuration',\n    control: { type: 'object' },\n    table: {\n      category: 'walkerOS',\n    },\n  },\n};\n","export const ADDON_ID = 'walkerOS';\nexport const PANEL_ID = `${ADDON_ID}/panel`;\nexport const KEY = `walkerOS`;\n\nexport const EVENTS = {\n  RESULT: `${ADDON_ID}/result`,\n  REQUEST: `${ADDON_ID}/request`,\n  HIGHLIGHT: `${ADDON_ID}/highlight`,\n  LIVE_EVENT: `${ADDON_ID}/live-event`,\n  ATTRIBUTES_RESULT: `${ADDON_ID}/attributes-result`,\n  ATTRIBUTES_REQUEST: `${ADDON_ID}/attributes-request`,\n};\n"]}

package/dist/index.d.cts

@@ -0,0 +1,45 @@
+import { WalkerOS } from '@walkeros/core';
+
+interface WalkerOSAddon {
+    autoRefresh: boolean;
+    prefix?: string;
+    highlights?: {
+        context: boolean;
+        entity: boolean;
+        property: boolean;
+        action: boolean;
+        globals: boolean;
+    };
+}
+interface DataElb {
+    entity?: string;
+    trigger?: string;
+    action?: string;
+    data?: WalkerOS.Properties;
+    context?: WalkerOS.Properties;
+    globals?: WalkerOS.Properties;
+    link?: Record<string, string>;
+}
+declare const dataElbArgTypes: {
+    dataElb: {
+        name: string;
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            category: string;
+        };
+    };
+};
+
+declare const EVENTS: {
+    RESULT: string;
+    REQUEST: string;
+    HIGHLIGHT: string;
+    LIVE_EVENT: string;
+    ATTRIBUTES_RESULT: string;
+    ATTRIBUTES_REQUEST: string;
+};
+
+export { type DataElb, EVENTS, type WalkerOSAddon, dataElbArgTypes };

package/dist/index.d.ts

@@ -0,0 +1,45 @@
+import { WalkerOS } from '@walkeros/core';
+
+interface WalkerOSAddon {
+    autoRefresh: boolean;
+    prefix?: string;
+    highlights?: {
+        context: boolean;
+        entity: boolean;
+        property: boolean;
+        action: boolean;
+        globals: boolean;
+    };
+}
+interface DataElb {
+    entity?: string;
+    trigger?: string;
+    action?: string;
+    data?: WalkerOS.Properties;
+    context?: WalkerOS.Properties;
+    globals?: WalkerOS.Properties;
+    link?: Record<string, string>;
+}
+declare const dataElbArgTypes: {
+    dataElb: {
+        name: string;
+        description: string;
+        control: {
+            type: string;
+        };
+        table: {
+            category: string;
+        };
+    };
+};
+
+declare const EVENTS: {
+    RESULT: string;
+    REQUEST: string;
+    HIGHLIGHT: string;
+    LIVE_EVENT: string;
+    ATTRIBUTES_RESULT: string;
+    ATTRIBUTES_REQUEST: string;
+};
+
+export { type DataElb, EVENTS, type WalkerOSAddon, dataElbArgTypes };

package/dist/index.js

@@ -0,0 +1,2 @@
+var t={dataElb:{name:"walkerOS Data",description:"walkerOS tracking configuration",control:{type:"object"},table:{category:"walkerOS"}}};var e="walkerOS";var r={RESULT:`${e}/result`,REQUEST:`${e}/request`,HIGHLIGHT:`${e}/highlight`,LIVE_EVENT:`${e}/live-event`,ATTRIBUTES_RESULT:`${e}/attributes-result`,ATTRIBUTES_REQUEST:`${e}/attributes-request`};export{r as EVENTS,t as dataElbArgTypes};//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/types.ts","../src/constants.ts"],"names":["dataElbArgTypes","ADDON_ID","EVENTS"],"mappings":"AA0CO,IAAMA,CAAAA,CAAkB,CAC7B,OAAA,CAAS,CACP,IAAA,CAAM,gBACN,WAAA,CAAa,iCAAA,CACb,OAAA,CAAS,CAAE,IAAA,CAAM,QAAS,EAC1B,KAAA,CAAO,CACL,QAAA,CAAU,UACZ,CACF,CACF,ECnDO,IAAMC,CAAAA,CAAW,UAAA,CAIjB,IAAMC,CAAAA,CAAS,CACpB,MAAA,CAAQ,CAAA,EAAGD,CAAQ,UACnB,OAAA,CAAS,CAAA,EAAGA,CAAQ,CAAA,QAAA,CAAA,CACpB,SAAA,CAAW,CAAA,EAAGA,CAAQ,CAAA,UAAA,CAAA,CACtB,UAAA,CAAY,CAAA,EAAGA,CAAQ,CAAA,WAAA,CAAA,CACvB,iBAAA,CAAmB,CAAA,EAAGA,CAAQ,CAAA,kBAAA,CAAA,CAC9B,kBAAA,CAAoB,CAAA,EAAGA,CAAQ,CAAA,mBAAA,CACjC","file":"index.js","sourcesContent":["// Import WalkerOS Property types\nimport type { WalkerOS } from '@walkeros/core';\nimport type { Walker } from '@walkeros/web-core';\n\nexport interface WalkerOSAddon {\n  autoRefresh: boolean;\n  prefix?: string;\n  highlights?: {\n    context: boolean;\n    entity: boolean;\n    property: boolean;\n    action: boolean;\n    globals: boolean;\n  };\n}\n\nexport interface AttributeNode {\n  element: string;\n  path: string;\n  htmlMarkup?: string; // Store the HTML string instead of DOM reference\n  attributes: {\n    entity?: string;\n    action?: string;\n    context?: WalkerOS.Properties;\n    globals?: WalkerOS.Properties;\n    properties?: WalkerOS.Properties;\n  };\n  children: AttributeNode[];\n}\n\n// walkerOS tracking interface for clean component APIs\nexport interface DataElb {\n  entity?: string;\n  trigger?: string;\n  action?: string;\n  data?: WalkerOS.Properties;\n  context?: WalkerOS.Properties;\n  globals?: WalkerOS.Properties;\n  link?: Record<string, string>;\n}\n\n// Storybook argTypes for DataElb interface\nexport const dataElbArgTypes = {\n  dataElb: {\n    name: 'walkerOS Data',\n    description: 'walkerOS tracking configuration',\n    control: { type: 'object' },\n    table: {\n      category: 'walkerOS',\n    },\n  },\n};\n","export const ADDON_ID = 'walkerOS';\nexport const PANEL_ID = `${ADDON_ID}/panel`;\nexport const KEY = `walkerOS`;\n\nexport const EVENTS = {\n  RESULT: `${ADDON_ID}/result`,\n  REQUEST: `${ADDON_ID}/request`,\n  HIGHLIGHT: `${ADDON_ID}/highlight`,\n  LIVE_EVENT: `${ADDON_ID}/live-event`,\n  ATTRIBUTES_RESULT: `${ADDON_ID}/attributes-result`,\n  ATTRIBUTES_REQUEST: `${ADDON_ID}/attributes-request`,\n};\n"]}

package/dist/manager.js

@@ -0,0 +1,2 @@
+import n,{memo,useState,Fragment,useCallback,useEffect}from'react';import {useStorybookApi,useChannel,addons,types}from'storybook/manager-api';import {AddonPanel,TabsState,Placeholder,Button,SyntaxHighlighter}from'storybook/internal/components';import {styled,useTheme}from'storybook/theming';import {CURRENT_STORY_WAS_SET,SELECT_STORY,STORY_RENDERED,STORY_ARGS_UPDATED}from'storybook/internal/core-events';import {ArrowDownIcon}from'@storybook/icons';var c="walkerOS",z=`${c}/panel`;var y={RESULT:`${c}/result`,REQUEST:`${c}/request`,HIGHLIGHT:`${c}/highlight`,LIVE_EVENT:`${c}/live-event`,ATTRIBUTES_RESULT:`${c}/attributes-result`,ATTRIBUTES_REQUEST:`${c}/attributes-request`};var dt=styled.ul({listStyle:"none",fontSize:14,padding:0,margin:0}),ct=styled.div(({theme:t})=>({display:"flex",width:"100%",borderBottom:`1px solid ${t.appBorderColor}`,"&:hover":{background:t.background.hoverable}})),ut=styled(ArrowDownIcon)(({theme:t})=>({height:10,width:10,minWidth:10,color:t.color.mediumdark,marginRight:10,transition:"transform 0.1s ease-in-out",alignSelf:"center",display:"inline-flex"})),ft=styled.div(({theme:t})=>({padding:"6px 12px",paddingLeft:9,background:"none",color:"inherit",textAlign:"left",cursor:"pointer",borderLeft:"3px solid transparent",width:"100%",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis","&:focus":{outline:"0 none",borderLeft:`3px solid ${t.color.secondary}`},"& .event-base":{color:"inherit",fontWeight:"500"},"& .event-separator":{color:t.color.mediumdark,fontWeight:"300"},"& .event-preview":{color:t.color.mediumdark,fontWeight:"400"}})),mt=styled.div(({theme:t})=>({padding:t.layoutMargin,background:t.background.content,fontFamily:t.typography.fonts.mono,whiteSpace:"pre-wrap",textAlign:"left"})),bt=memo(({item:t})=>{let[e,r]=useState(false);return n.createElement(Fragment,null,n.createElement(ct,null,n.createElement(ft,{onClick:()=>r(!e),role:"button"},n.createElement(ut,{style:{transform:`rotate(${e?0:-90}deg)`}}),t.title)),e?n.createElement(mt,null,t.content):null)}),D=memo(({items:t})=>n.createElement(dt,null,t.map((e,r)=>n.createElement(bt,{key:`${e.title}-${r}`,item:e}))));var I=({highlights:t,toggleHighlight:e})=>{let r=useTheme();return n.createElement("div",{style:{display:"flex",gap:"4px",alignItems:"center"}},n.createElement("span",{style:{fontSize:"12px",color:r.color.mediumdark,marginRight:"8px"}},"Highlight:"),n.createElement(Button,{size:"small",variant:t.globals?"solid":"outline",onClick:()=>e("globals"),style:{fontSize:"11px",padding:"4px 8px",backgroundColor:t.globals?"#4fc3f7cc":"transparent",color:t.globals?"#fff":r.color.mediumdark,border:`1px solid ${t.globals?"#4fc3f7":r.color.border}`}},"Globals"),n.createElement(Button,{size:"small",variant:t.context?"solid":"outline",onClick:()=>e("context"),style:{fontSize:"11px",padding:"4px 8px",backgroundColor:t.context?"#ffbd44cc":"transparent",color:t.context?"#000":r.color.mediumdark,border:`1px solid ${t.context?"#ffbd44":r.color.border}`}},"Context"),n.createElement(Button,{size:"small",variant:t.entity?"solid":"outline",onClick:()=>e("entity"),style:{fontSize:"11px",padding:"4px 8px",backgroundColor:t.entity?"#00ca4ecc":"transparent",color:t.entity?"#fff":r.color.mediumdark,border:`1px solid ${t.entity?"#00ca4e":r.color.border}`}},"Entity"),n.createElement(Button,{size:"small",variant:t.property?"solid":"outline",onClick:()=>e("property"),style:{fontSize:"11px",padding:"4px 8px",backgroundColor:t.property?"#ff605ccc":"transparent",color:t.property?"#fff":r.color.mediumdark,border:`1px solid ${t.property?"#ff605c":r.color.border}`}},"Property"),n.createElement(Button,{size:"small",variant:t.action?"solid":"outline",onClick:()=>e("action"),style:{fontSize:"11px",padding:"4px 8px",backgroundColor:t.action?"#9900ffcc":"transparent",color:t.action?"#fff":r.color.mediumdark,border:`1px solid ${t.action?"#9900ff":r.color.border}`}},"Action"))};var xt=t=>{if(typeof t=="string")return t;if(typeof t=="number"||typeof t=="boolean")return String(t);if(t==null)return "";if(typeof t=="object"){if(Array.isArray(t))return t.length<=3?t.join(", "):`${t.slice(0,3).join(", ")}...`;let e=Object.keys(t);return e.length===0?"":e.length<=3?e.join(", "):`${e.slice(0,3).join(", ")}...`}return String(t)},C=({type:t,label:e,value:r})=>{let p={entity:"#00ca4e",action:"#9900ff",context:"#ffbd44",globals:"#4fc3f7",data:"#ff605c"},o=r?`${e}: ${r}`:e;return n.createElement("span",{style:{display:"inline-block",padding:"2px 6px",margin:"0 4px",fontSize:"14px",color:"black",backgroundColor:p[t],borderRadius:"3px",maxWidth:"200px",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},title:o},n.createElement("span",null,t==="data"?r?n.createElement(n.Fragment,null,n.createElement("strong",null,e,":")," ",r):n.createElement("strong",null,e):n.createElement(n.Fragment,null,n.createElement("strong",null,t,":")," ",o)))},Y=({node:t,depth:e})=>{let[r,p]=useState(true),[o,b]=useState(false),l=useTheme(),d=t.attributes.entity||t.attributes.action||t.attributes.context||t.attributes.globals||t.attributes.properties,S=t.children.length>0;return n.createElement("div",{style:{marginLeft:e*16,borderLeft:e>0?`1px solid ${l.color.border}`:"none",paddingLeft:e>0?"8px":"0"}},n.createElement("div",{style:{display:"flex",alignItems:"center",padding:"4px 0"}},S?n.createElement("span",{style:{marginRight:"8px",color:l.color.mediumdark,cursor:"pointer",userSelect:"none",display:"inline-block",width:"12px",textAlign:"center"},onClick:()=>p(!r),title:r?"Collapse":"Expand"},r?"\u25BC":"\u25B6"):n.createElement("span",{style:{marginRight:"8px",width:"12px",display:"inline-block"}}),n.createElement("div",{style:{display:"flex",alignItems:"center",cursor:d?"pointer":"default",flex:1},onClick:d?()=>b(!o):void 0},t.attributes.entity&&n.createElement(C,{type:"entity",label:t.attributes.entity}),t.attributes.action&&n.createElement(C,{type:"action",label:t.attributes.action}),t.attributes.context&&Object.keys(t.attributes.context).length>0&&n.createElement(C,{key:"context",type:"context",label:Object.keys(t.attributes.context).join(", ")}),t.attributes.globals&&Object.keys(t.attributes.globals).length>0&&n.createElement(C,{key:"globals",type:"globals",label:Object.keys(t.attributes.globals).join(", ")}),t.attributes.properties&&(()=>{let g=t.attributes.properties;return Object.entries(g).filter(([f,u])=>typeof u=="object"&&u!==null&&Object.keys(u).length===0?false:u!=null&&u!=="").map(([f,u])=>{let O=f?`data-${f}`:"data-generic",W=xt(u);return n.createElement(C,{key:`data-${f}`,type:"data",label:O,value:W})})})())),o&&d&&t.htmlMarkup&&n.createElement("div",{style:{marginTop:"8px",marginBottom:"8px",textAlign:"left"}},n.createElement(SyntaxHighlighter,{language:"html",copyable:true,bordered:true,padded:true},t.htmlMarkup)),r&&S&&n.createElement("div",null,t.children.map((g,$)=>n.createElement(Y,{key:$,node:g,depth:e+1}))))},Q=({tree:t,depth:e=0})=>{let r=useTheme();return t.length===0?n.createElement("div",{style:{color:r.color.mediumdark,padding:"20px"}},"No walker attributes found",n.createElement("br",null),n.createElement("small",null,"Make sure your components have walker attributes like data-elb, data-elbaction, etc.")):n.createElement("div",null,t.map((p,o)=>n.createElement(Y,{key:o,node:p,depth:e})))};function q(t){let e=[],r=o=>o==null?"null":typeof o=="string"?`"${o}"`:Array.isArray(o)?`[${o.map(l=>typeof l=="string"?`"${l}"`:String(l)).join(", ")}]`:typeof o=="object"?"{...}":String(o),p=(o,b)=>{if(!o||typeof o!="object"||o===null||Object.keys(o).length===0)return null;let l=Object.entries(o).map(([d,S])=>`${d}: ${r(S)}`).join(", ");return `${b}: { ${l} }`};if(t.data){let o=p(t.data,"data");o&&e.push(o);}if(t.context){let o=p(t.context,"context");o&&e.push(o);}return e.join("; ")}function H(t,e){let r=q(t),p=`#${e+1}`,o="name"in t?t.name:`${t.entity} ${t.action}`,b=`${p} ${o}`;return r?n.createElement(n.Fragment,null,n.createElement("span",{className:"event-base"},b),n.createElement("span",{className:"event-separator"}," - "),n.createElement("span",{className:"event-preview"},r)):n.createElement("span",{className:"event-base"},b)}var Z=memo(function(e){let r=useTheme(),p=useStorybookApi(),{parameters:o}=p.getCurrentStoryData()||{},l={...{autoRefresh:true,prefix:"data-elb"},...o==null?void 0:o[c]},[d,S]=useState({context:false,entity:false,property:false,action:false,globals:false}),[g,$]=useState([]),[f,u]=useState([]),[O,W]=useState([]),j=s=>{let a={...d,[s]:!d[s]};S(a),T(y.HIGHLIGHT,{...l,highlights:a});},T=useChannel({[y.RESULT]:s=>{$(s);},[y.LIVE_EVENT]:s=>{u(a=>[{...s,timestamp:Date.now()}].concat(a).slice(0,50));},[y.ATTRIBUTES_RESULT]:s=>{W(s);}}),L=useCallback(()=>{T(y.REQUEST,{...l,highlights:d});},[l,d,T]),N=useCallback(()=>{T(y.ATTRIBUTES_REQUEST,{...l,highlights:d});},[l,d,T]);useEffect(()=>{l.autoRefresh&&(L(),N());},[]),useEffect(()=>{if(!l.autoRefresh)return;let s=[CURRENT_STORY_WAS_SET,SELECT_STORY,STORY_RENDERED,STORY_ARGS_UPDATED],a=()=>{L(),N();};return s.forEach(P=>p.on(P,a)),()=>s.forEach(P=>p.off(P,a))},[p,L,N,l.autoRefresh]);let tt=s=>{let a=s.length==1?"Event":"Events";return `${s.length} ${a}`},et=()=>{let s=f.length==1?"Event":"Events";return `${f.length} Live ${s}`},rt=()=>{u([]);},ot=()=>{let s=nt=>nt.reduce((it,m)=>{let h=0;if(m.attributes.entity&&h++,m.attributes.action&&h++,m.attributes.context&&Object.keys(m.attributes.context).length>0&&h++,m.attributes.globals&&Object.keys(m.attributes.globals).length>0&&h++,m.attributes.properties){let st=Object.entries(m.attributes.properties).filter(([Pt,E])=>typeof E=="object"&&E!==null&&Object.keys(E).length===0?false:E!=null&&E!=="");h+=st.length;}return it+h+s(m.children||[])},0),a=s(O);return `${a} ${a===1?"Attribute":"Attributes"}`};return n.createElement(AddonPanel,{...e},n.createElement(TabsState,{initial:"live",backgroundColor:r.background.hoverable},n.createElement("div",{id:"events",title:tt(g)},n.createElement(Placeholder,null,n.createElement(Fragment,null,n.createElement("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"12px",padding:"8px",backgroundColor:r.background.app,borderRadius:"4px",border:`1px solid ${r.color.border}`}},n.createElement(Button,{onClick:L},"Update events"),n.createElement(I,{highlights:d,toggleHighlight:j}))),g.length>0?n.createElement(D,{items:g.map((s,a)=>({title:H(s,a),content:n.createElement(SyntaxHighlighter,{language:"json",copyable:true,bordered:true,padded:true},JSON.stringify(s,null,2))}))}):n.createElement("p",null,"No events yet"))),n.createElement("div",{id:"live",title:et()},n.createElement(Placeholder,null,n.createElement(Fragment,null,n.createElement("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"12px",padding:"8px",backgroundColor:r.background.app,borderRadius:"4px",border:`1px solid ${r.color.border}`}},n.createElement("div",{style:{display:"flex",gap:"8px",alignItems:"center"}},n.createElement(Button,{size:"small",onClick:rt},"Clear Events")),n.createElement(I,{highlights:d,toggleHighlight:j}))),f.length>0?n.createElement(D,{items:f.map((s,a)=>({title:H(s,f.length-a-1),content:n.createElement(SyntaxHighlighter,{language:"json",copyable:true,bordered:true,padded:true},JSON.stringify(s,null,2))}))}):n.createElement("p",{style:{textAlign:"center",color:r.color.mediumdark,padding:"20px"}},"Waiting for live events...",n.createElement("br",null),n.createElement("small",null,"Interact with components to see events appear here in real-time")))),n.createElement("div",{id:"attributes",title:ot()},n.createElement(Placeholder,null,n.createElement(Fragment,null,n.createElement("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"12px",padding:"8px",backgroundColor:r.background.app,borderRadius:"4px",border:`1px solid ${r.color.border}`}},n.createElement(Button,{onClick:N},"Update attributes"),n.createElement(I,{highlights:d,toggleHighlight:j}))),n.createElement(Q,{tree:O})))))});addons.register(c,t=>{addons.add(z,{type:types.PANEL,title:c,match:({viewMode:e})=>e==="story",render:({active:e})=>n.createElement(Z,{active:!!e})});});//# sourceMappingURL=manager.js.map
+//# sourceMappingURL=manager.js.map

package/dist/manager.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/constants.ts","../src/components/List.tsx","../src/components/HighlightButtons.tsx","../src/components/AttributeTreeView.tsx","../src/utils/eventPreview.ts","../src/utils/formatEventTitle.tsx","../src/components/Panel.tsx","../src/manager.tsx"],"names":["ADDON_ID","PANEL_ID","EVENTS","ListWrapper","styled","Wrapper","theme","Icon","ArrowDownIcon","HeaderBar","Description","ListItem","memo","item","isOpen","onToggle","useState","React","Fragment","List","items","idx","HighlightButtons","highlights","toggleHighlight","useTheme","Button","formatValueForBadge","value","keys","AttributeBadge","type","label","colors","displayText","AttributeNodeComponent","node","depth","expanded","setExpanded","showDetails","setShowDetails","hasAttributes","hasChildren","properties","key","displayLabel","displayValue","SyntaxHighlighter","child","index","AttributeTreeView","tree","createEventDataPreview","event","sections","formatValue","v","formatSection","obj","sectionName","entries","dataSection","contextSection","formatEventTitle","dataPreview","eventNumber","eventName","baseTitle","Panel","props","api","useStorybookApi","parameters","config","setHighlights","events","setState","liveEvents","setLiveEvents","attributeTree","setAttributeTree","newHighlights","emit","useChannel","newEvents","prev","updateEvents","useCallback","updateAttributes","useEffect","storyEvents","CURRENT_STORY_WAS_SET","SELECT_STORY","STORY_RENDERED","STORY_ARGS_UPDATED","updateAll","getEventTitle","form","getLiveEventTitle","clearLiveEvents","getAttributeTitle","countAttributes","nodes","total","nodeAttributeCount","validProperties","attributeCount","AddonPanel","TabsState","Placeholder","addons","types","viewMode","active"],"mappings":"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","file":"manager.js","sourcesContent":["export const ADDON_ID = 'walkerOS';\nexport const PANEL_ID = `${ADDON_ID}/panel`;\nexport const KEY = `walkerOS`;\n\nexport const EVENTS = {\n  RESULT: `${ADDON_ID}/result`,\n  REQUEST: `${ADDON_ID}/request`,\n  HIGHLIGHT: `${ADDON_ID}/highlight`,\n  LIVE_EVENT: `${ADDON_ID}/live-event`,\n  ATTRIBUTES_RESULT: `${ADDON_ID}/attributes-result`,\n  ATTRIBUTES_REQUEST: `${ADDON_ID}/attributes-request`,\n};\n","import { ArrowDownIcon } from '@storybook/icons';\nimport React, { Fragment, useState, memo } from 'react';\nimport { styled } from 'storybook/theming';\n\ntype Item = {\n  title: string | React.ReactNode;\n  content: string | React.ReactNode;\n};\n\ninterface ListItemProps {\n  item: Item;\n}\n\ninterface ListProps {\n  items: Item[];\n}\n\nconst ListWrapper = styled.ul({\n  listStyle: 'none',\n  fontSize: 14,\n  padding: 0,\n  margin: 0,\n});\n\nconst Wrapper = styled.div(({ theme }) => ({\n  display: 'flex',\n  width: '100%',\n  borderBottom: `1px solid ${theme.appBorderColor}`,\n  '&:hover': {\n    background: theme.background.hoverable,\n  },\n}));\n\nconst Icon = styled(ArrowDownIcon)(({ theme }) => ({\n  height: 10,\n  width: 10,\n  minWidth: 10,\n  color: theme.color.mediumdark,\n  marginRight: 10,\n  transition: 'transform 0.1s ease-in-out',\n  alignSelf: 'center',\n  display: 'inline-flex',\n}));\n\nconst HeaderBar = styled.div(({ theme }) => ({\n  padding: '6px 12px',\n  paddingLeft: 9,\n  background: 'none',\n  color: 'inherit',\n  textAlign: 'left',\n  cursor: 'pointer',\n  borderLeft: '3px solid transparent',\n  width: '100%',\n  whiteSpace: 'nowrap',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n\n  '&:focus': {\n    outline: '0 none',\n    borderLeft: `3px solid ${theme.color.secondary}`,\n  },\n\n  '& .event-base': {\n    color: 'inherit',\n    fontWeight: '500',\n  },\n\n  '& .event-separator': {\n    color: theme.color.mediumdark,\n    fontWeight: '300',\n  },\n\n  '& .event-preview': {\n    color: theme.color.mediumdark,\n    fontWeight: '400',\n  },\n}));\n\nconst Description = styled.div(({ theme }) => ({\n  padding: theme.layoutMargin,\n  background: theme.background.content,\n  fontFamily: theme.typography.fonts.mono,\n  whiteSpace: 'pre-wrap',\n  textAlign: 'left',\n}));\n\nexport const ListItem: React.FC<ListItemProps> = memo(({ item }) => {\n  const [isOpen, onToggle] = useState(false);\n\n  return (\n    <Fragment>\n      <Wrapper>\n        <HeaderBar onClick={() => onToggle(!isOpen)} role=\"button\">\n          <Icon\n            style={{\n              transform: `rotate(${isOpen ? 0 : -90}deg)`,\n            }}\n          />\n          {item.title}\n        </HeaderBar>\n      </Wrapper>\n      {isOpen ? <Description>{item.content}</Description> : null}\n    </Fragment>\n  );\n});\n\nexport const List: React.FC<ListProps> = memo(({ items }) => (\n  <ListWrapper>\n    {items.map((item, idx) => (\n      <ListItem key={`${item.title}-${idx}`} item={item}></ListItem>\n    ))}\n  </ListWrapper>\n));\n","import type { WalkerOSAddon } from '../types';\nimport React from 'react';\nimport { Button } from 'storybook/internal/components';\nimport { useTheme } from 'storybook/theming';\n\ninterface HighlightButtonsProps {\n  highlights: {\n    context: boolean;\n    entity: boolean;\n    property: boolean;\n    action: boolean;\n    globals: boolean;\n  };\n  toggleHighlight: (type: keyof HighlightButtonsProps['highlights']) => void;\n}\n\nexport const HighlightButtons: React.FC<HighlightButtonsProps> = ({\n  highlights,\n  toggleHighlight,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        gap: '4px',\n        alignItems: 'center',\n      }}\n    >\n      <span\n        style={{\n          fontSize: '12px',\n          color: theme.color.mediumdark,\n          marginRight: '8px',\n        }}\n      >\n        Highlight:\n      </span>\n      <Button\n        size=\"small\"\n        variant={highlights.globals ? 'solid' : 'outline'}\n        onClick={() => toggleHighlight('globals')}\n        style={{\n          fontSize: '11px',\n          padding: '4px 8px',\n          backgroundColor: highlights.globals ? '#4fc3f7cc' : 'transparent',\n          color: highlights.globals ? '#fff' : theme.color.mediumdark,\n          border: `1px solid ${highlights.globals ? '#4fc3f7' : theme.color.border}`,\n        }}\n      >\n        Globals\n      </Button>\n      <Button\n        size=\"small\"\n        variant={highlights.context ? 'solid' : 'outline'}\n        onClick={() => toggleHighlight('context')}\n        style={{\n          fontSize: '11px',\n          padding: '4px 8px',\n          backgroundColor: highlights.context ? '#ffbd44cc' : 'transparent',\n          color: highlights.context ? '#000' : theme.color.mediumdark,\n          border: `1px solid ${highlights.context ? '#ffbd44' : theme.color.border}`,\n        }}\n      >\n        Context\n      </Button>\n      <Button\n        size=\"small\"\n        variant={highlights.entity ? 'solid' : 'outline'}\n        onClick={() => toggleHighlight('entity')}\n        style={{\n          fontSize: '11px',\n          padding: '4px 8px',\n          backgroundColor: highlights.entity ? '#00ca4ecc' : 'transparent',\n          color: highlights.entity ? '#fff' : theme.color.mediumdark,\n          border: `1px solid ${highlights.entity ? '#00ca4e' : theme.color.border}`,\n        }}\n      >\n        Entity\n      </Button>\n      <Button\n        size=\"small\"\n        variant={highlights.property ? 'solid' : 'outline'}\n        onClick={() => toggleHighlight('property')}\n        style={{\n          fontSize: '11px',\n          padding: '4px 8px',\n          backgroundColor: highlights.property ? '#ff605ccc' : 'transparent',\n          color: highlights.property ? '#fff' : theme.color.mediumdark,\n          border: `1px solid ${highlights.property ? '#ff605c' : theme.color.border}`,\n        }}\n      >\n        Property\n      </Button>\n      <Button\n        size=\"small\"\n        variant={highlights.action ? 'solid' : 'outline'}\n        onClick={() => toggleHighlight('action')}\n        style={{\n          fontSize: '11px',\n          padding: '4px 8px',\n          backgroundColor: highlights.action ? '#9900ffcc' : 'transparent',\n          color: highlights.action ? '#fff' : theme.color.mediumdark,\n          border: `1px solid ${highlights.action ? '#9900ff' : theme.color.border}`,\n        }}\n      >\n        Action\n      </Button>\n    </div>\n  );\n};\n","import React, { useState } from 'react';\nimport { SyntaxHighlighter } from 'storybook/internal/components';\nimport { useTheme } from 'storybook/theming';\nimport type { AttributeNode } from '../types';\nimport type { WalkerOS } from '@walkeros/core';\n\n// Utility to format complex values for display in badges\nconst formatValueForBadge = (value: unknown): string => {\n  if (typeof value === 'string') return value;\n  if (typeof value === 'number' || typeof value === 'boolean')\n    return String(value);\n  if (value === null || value === undefined) return '';\n  if (typeof value === 'object') {\n    if (Array.isArray(value)) {\n      return value.length <= 3\n        ? value.join(', ')\n        : `${value.slice(0, 3).join(', ')}...`;\n    }\n    // For objects, show the actual keys instead of just the count\n    const keys = Object.keys(value);\n    if (keys.length === 0) return '';\n    if (keys.length <= 3) {\n      return keys.join(', ');\n    }\n    return `${keys.slice(0, 3).join(', ')}...`;\n  }\n  return String(value);\n};\n\ninterface AttributeTreeViewProps {\n  tree: AttributeNode[];\n  depth?: number;\n}\n\ninterface AttributeBadgeProps {\n  type: 'entity' | 'action' | 'context' | 'globals' | 'data';\n  label: string;\n  value?: string;\n}\n\nconst AttributeBadge: React.FC<AttributeBadgeProps> = ({\n  type,\n  label,\n  value,\n}) => {\n  const colors = {\n    entity: '#00ca4e',\n    action: '#9900ff',\n    context: '#ffbd44',\n    globals: '#4fc3f7',\n    data: '#ff605c',\n  };\n\n  const displayText = value ? `${label}: ${value}` : label;\n\n  return (\n    <span\n      style={{\n        display: 'inline-block',\n        padding: '2px 6px',\n        margin: '0 4px',\n        fontSize: '14px',\n        color: 'black',\n        backgroundColor: colors[type],\n        borderRadius: '3px',\n        maxWidth: '200px',\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap',\n      }}\n      title={displayText}\n    >\n      <span>\n        {type === 'data' ? (\n          value ? (\n            <>\n              <strong>{label}:</strong> {value}\n            </>\n          ) : (\n            <strong>{label}</strong>\n          )\n        ) : (\n          <>\n            <strong>{type}:</strong> {displayText}\n          </>\n        )}\n      </span>\n    </span>\n  );\n};\n\nconst AttributeNodeComponent: React.FC<{\n  node: AttributeNode;\n  depth: number;\n}> = ({ node, depth }) => {\n  const [expanded, setExpanded] = useState(true);\n  const [showDetails, setShowDetails] = useState(false);\n  const theme = useTheme();\n\n  const hasAttributes =\n    node.attributes.entity ||\n    node.attributes.action ||\n    node.attributes.context ||\n    node.attributes.globals ||\n    node.attributes.properties;\n\n  const hasChildren = node.children.length > 0;\n\n  return (\n    <div\n      style={{\n        marginLeft: depth * 16,\n        borderLeft: depth > 0 ? `1px solid ${theme.color.border}` : 'none',\n        paddingLeft: depth > 0 ? '8px' : '0',\n      }}\n    >\n      <div\n        style={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: '4px 0',\n        }}\n      >\n        {hasChildren ? (\n          <span\n            style={{\n              marginRight: '8px',\n              color: theme.color.mediumdark,\n              cursor: 'pointer',\n              userSelect: 'none',\n              display: 'inline-block',\n              width: '12px',\n              textAlign: 'center',\n            }}\n            onClick={() => setExpanded(!expanded)}\n            title={expanded ? 'Collapse' : 'Expand'}\n          >\n            {expanded ? '▼' : '▶'}\n          </span>\n        ) : (\n          <span\n            style={{\n              marginRight: '8px',\n              width: '12px',\n              display: 'inline-block',\n            }}\n          />\n        )}\n\n        <div\n          style={{\n            display: 'flex',\n            alignItems: 'center',\n            cursor: hasAttributes ? 'pointer' : 'default',\n            flex: 1,\n          }}\n          onClick={\n            hasAttributes ? () => setShowDetails(!showDetails) : undefined\n          }\n        >\n          {node.attributes.entity && (\n            <AttributeBadge type=\"entity\" label={node.attributes.entity} />\n          )}\n\n          {node.attributes.action && (\n            <AttributeBadge type=\"action\" label={node.attributes.action} />\n          )}\n\n          {node.attributes.context &&\n            Object.keys(node.attributes.context).length > 0 && (\n              <AttributeBadge\n                key=\"context\"\n                type=\"context\"\n                label={Object.keys(node.attributes.context).join(', ')}\n              />\n            )}\n\n          {node.attributes.globals &&\n            Object.keys(node.attributes.globals).length > 0 && (\n              <AttributeBadge\n                key=\"globals\"\n                type=\"globals\"\n                label={Object.keys(node.attributes.globals).join(', ')}\n              />\n            )}\n\n          {node.attributes.properties &&\n            (() => {\n              const properties = node.attributes.properties;\n              const validEntries = Object.entries(properties).filter(\n                ([key, value]) => {\n                  // Skip empty objects and null/undefined values\n                  if (\n                    typeof value === 'object' &&\n                    value !== null &&\n                    Object.keys(value).length === 0\n                  )\n                    return false;\n                  return value !== null && value !== undefined && value !== '';\n                },\n              );\n\n              return validEntries.map(([key, value]) => {\n                // If key is empty/generic, name it \"generic\", otherwise use \"data-{key}\"\n                const displayLabel = key ? `data-${key}` : 'data-generic';\n                const displayValue = formatValueForBadge(value);\n                return (\n                  <AttributeBadge\n                    key={`data-${key}`}\n                    type=\"data\"\n                    label={displayLabel}\n                    value={displayValue}\n                  />\n                );\n              });\n            })()}\n        </div>\n      </div>\n\n      {showDetails && hasAttributes && node.htmlMarkup && (\n        <div\n          style={{ marginTop: '8px', marginBottom: '8px', textAlign: 'left' }}\n        >\n          <SyntaxHighlighter\n            language=\"html\"\n            copyable={true}\n            bordered={true}\n            padded={true}\n          >\n            {node.htmlMarkup}\n          </SyntaxHighlighter>\n        </div>\n      )}\n\n      {expanded && hasChildren && (\n        <div>\n          {node.children.map((child, index) => (\n            <AttributeNodeComponent\n              key={index}\n              node={child}\n              depth={depth + 1}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport const AttributeTreeView: React.FC<AttributeTreeViewProps> = ({\n  tree,\n  depth = 0,\n}) => {\n  const theme = useTheme();\n\n  if (tree.length === 0) {\n    return (\n      <div\n        style={{\n          color: theme.color.mediumdark,\n          padding: '20px',\n        }}\n      >\n        No walker attributes found\n        <br />\n        <small>\n          Make sure your components have walker attributes like data-elb,\n          data-elbaction, etc.\n        </small>\n      </div>\n    );\n  }\n\n  return (\n    <div>\n      {tree.map((node, index) => (\n        <AttributeNodeComponent key={index} node={node} depth={depth} />\n      ))}\n    </div>\n  );\n};\n","import type { WalkerOS } from '@walkeros/core';\nimport type { Walker } from '@walkeros/web-core';\n\n/**\n * Creates a formatted data preview from a walkerOS event\n * Shows data and context properties in JSON-like syntax\n */\nexport function createEventDataPreview(\n  event: WalkerOS.Event | Walker.Event,\n): string {\n  const sections: string[] = [];\n\n  // Helper to format value\n  const formatValue = (value: unknown): string => {\n    if (value === null || value === undefined) {\n      return 'null';\n    }\n    if (typeof value === 'string') {\n      return `\"${value}\"`;\n    }\n    if (Array.isArray(value)) {\n      const items = value\n        .map((v) => (typeof v === 'string' ? `\"${v}\"` : String(v)))\n        .join(', ');\n      return `[${items}]`;\n    }\n    if (typeof value === 'object') {\n      return '{...}';\n    }\n    return String(value);\n  };\n\n  // Helper to format a section (data or context)\n  const formatSection = (obj: unknown, sectionName: string): string | null => {\n    if (\n      !obj ||\n      typeof obj !== 'object' ||\n      obj === null ||\n      Object.keys(obj as Record<string, unknown>).length === 0\n    ) {\n      return null;\n    }\n\n    const entries = Object.entries(obj as Record<string, unknown>)\n      .map(([key, value]) => `${key}: ${formatValue(value)}`)\n      .join(', ');\n\n    return `${sectionName}: { ${entries} }`;\n  };\n\n  // Process data section first\n  if (event.data) {\n    const dataSection = formatSection(event.data, 'data');\n    if (dataSection) {\n      sections.push(dataSection);\n    }\n  }\n\n  // Process context section second\n  if (event.context) {\n    const contextSection = formatSection(event.context, 'context');\n    if (contextSection) {\n      sections.push(contextSection);\n    }\n  }\n\n  return sections.join('; ');\n}\n","import React from 'react';\nimport type { WalkerOS } from '@walkeros/core';\nimport type { Walker } from '@walkeros/web-core';\nimport { createEventDataPreview } from './eventPreview';\n\n/**\n * Formats an event title with consistent styling across Events and Live Events tabs\n */\nexport function formatEventTitle(\n  event: WalkerOS.Event | Walker.Event,\n  index: number,\n): React.ReactNode {\n  const dataPreview = createEventDataPreview(event);\n\n  // Build base title components\n  const eventNumber = `#${index + 1}`;\n  // Handle both WalkerOS.Event (has name property) and Walker.Event (has entity/action)\n  const eventName =\n    'name' in event ? event.name : `${event.entity} ${event.action}`;\n\n  // Construct base title\n  const baseTitle = `${eventNumber} ${eventName}`;\n\n  // Return styled JSX\n  if (!dataPreview) {\n    return <span className=\"event-base\">{baseTitle}</span>;\n  }\n\n  return (\n    <>\n      <span className=\"event-base\">{baseTitle}</span>\n      <span className=\"event-separator\"> - </span>\n      <span className=\"event-preview\">{dataPreview}</span>\n    </>\n  );\n}\n","import type { WalkerOSAddon, AttributeNode } from '../types';\nimport type { WalkerOS } from '@walkeros/core';\nimport React, { Fragment, memo, useCallback, useEffect, useState } from 'react';\nimport {\n  AddonPanel,\n  Placeholder,\n  TabsState,\n  SyntaxHighlighter,\n  Button,\n} from 'storybook/internal/components';\nimport { useChannel, useStorybookApi } from 'storybook/manager-api';\nimport { useTheme } from 'storybook/theming';\nimport {\n  STORY_ARGS_UPDATED,\n  CURRENT_STORY_WAS_SET,\n  SELECT_STORY,\n  STORY_RENDERED,\n} from 'storybook/internal/core-events';\n\nimport { ADDON_ID, EVENTS } from '../constants';\nimport { List } from './List';\nimport { HighlightButtons } from './HighlightButtons';\nimport { AttributeTreeView } from './AttributeTreeView';\nimport { formatEventTitle } from '../utils/formatEventTitle';\n\ninterface PanelProps {\n  active: boolean;\n  walkerOSAddon: WalkerOSAddon;\n}\n\nexport const Panel: React.FC<PanelProps> = memo(function MyPanel(props) {\n  const theme = useTheme();\n  const api = useStorybookApi();\n  const { parameters } = api.getCurrentStoryData() || {};\n\n  const defaultConfig = {\n    autoRefresh: true,\n    prefix: 'data-elb',\n  };\n\n  const config = {\n    ...defaultConfig,\n    ...parameters?.[ADDON_ID],\n  };\n\n  // Highlights are now local state, not persistent config\n  const [highlights, setHighlights] = useState({\n    context: false,\n    entity: false,\n    property: false,\n    action: false,\n    globals: false,\n  });\n\n  const [events, setState] = useState<WalkerOS.Event[]>([]);\n  const [liveEvents, setLiveEvents] = useState<WalkerOS.Event[]>([]);\n  const [attributeTree, setAttributeTree] = useState<AttributeNode[]>([]);\n\n  const toggleHighlight = (type: keyof typeof highlights) => {\n    const newHighlights = {\n      ...highlights,\n      [type]: !highlights[type],\n    };\n    setHighlights(newHighlights);\n\n    // Send highlighting update to preview with current config + highlights\n    emit(EVENTS.HIGHLIGHT, { ...config, highlights: newHighlights });\n  };\n\n  // https://storybook.js.org/docs/react/addons/addons-api#usechannel\n  const emit = useChannel({\n    [EVENTS.RESULT]: (newEvents: WalkerOS.Event[]) => {\n      setState(newEvents);\n    },\n    [EVENTS.LIVE_EVENT]: (event: WalkerOS.Event) => {\n      setLiveEvents((prev) =>\n        [{ ...event, timestamp: Date.now() }].concat(prev).slice(0, 50),\n      );\n    },\n    [EVENTS.ATTRIBUTES_RESULT]: (tree: AttributeNode[]) => {\n      setAttributeTree(tree);\n    },\n  });\n\n  const updateEvents = useCallback(() => {\n    emit(EVENTS.REQUEST, { ...config, highlights });\n  }, [config, highlights, emit]);\n\n  const updateAttributes = useCallback(() => {\n    emit(EVENTS.ATTRIBUTES_REQUEST, { ...config, highlights });\n  }, [config, highlights, emit]);\n\n  // Initial auto-refresh on page load\n  useEffect(() => {\n    if (config.autoRefresh) {\n      updateEvents();\n      updateAttributes();\n    }\n  }, []); // Only run once on mount\n\n  // Auto-refresh on story navigation and args updates\n  useEffect(() => {\n    if (!config.autoRefresh) return;\n\n    // Events to listen for\n    const storyEvents = [\n      CURRENT_STORY_WAS_SET,\n      SELECT_STORY,\n      STORY_RENDERED,\n      STORY_ARGS_UPDATED,\n    ];\n\n    // Combined update function for events and attributes\n    const updateAll = () => {\n      updateEvents();\n      updateAttributes();\n    };\n\n    // Listen for story navigation and control changes\n    storyEvents.forEach((event) => api.on(event, updateAll));\n    // Cleanup listeners on unmount\n    return () => storyEvents.forEach((event) => api.off(event, updateAll));\n  }, [api, updateEvents, updateAttributes, config.autoRefresh]);\n\n  const getEventTitle = (events: WalkerOS.Event[]) => {\n    const form = events.length == 1 ? 'Event' : 'Events';\n    return `${events.length} ${form}`;\n  };\n\n  const getLiveEventTitle = () => {\n    const form = liveEvents.length == 1 ? 'Event' : 'Events';\n    return `${liveEvents.length} Live ${form}`;\n  };\n\n  const clearLiveEvents = () => {\n    setLiveEvents([]);\n  };\n\n  const formatTime = (timestamp: number) => {\n    return new Date(timestamp).toLocaleTimeString();\n  };\n\n  const getAttributeTitle = () => {\n    // Count all walker attributes (badges) across all nodes\n    const countAttributes = (nodes: AttributeNode[]): number => {\n      return nodes.reduce((total, node) => {\n        let nodeAttributeCount = 0;\n\n        // Count entity, action, context, globals\n        if (node.attributes.entity) nodeAttributeCount++;\n        if (node.attributes.action) nodeAttributeCount++;\n        if (\n          node.attributes.context &&\n          Object.keys(node.attributes.context).length > 0\n        ) {\n          nodeAttributeCount++; // Count context as 1 attribute\n        }\n        if (\n          node.attributes.globals &&\n          Object.keys(node.attributes.globals).length > 0\n        ) {\n          nodeAttributeCount++; // Count globals as 1 attribute\n        }\n\n        // Count data properties (ignore custom properties like data-elbproperty)\n        if (node.attributes.properties) {\n          const validProperties = Object.entries(\n            node.attributes.properties,\n          ).filter(([key, value]) => {\n            // Skip empty objects and null/undefined values\n            if (\n              typeof value === 'object' &&\n              value !== null &&\n              Object.keys(value).length === 0\n            )\n              return false;\n            return value !== null && value !== undefined && value !== '';\n          });\n          nodeAttributeCount += validProperties.length;\n        }\n\n        return (\n          total + nodeAttributeCount + countAttributes(node.children || [])\n        );\n      }, 0);\n    };\n\n    const attributeCount = countAttributes(attributeTree);\n    const form = attributeCount === 1 ? 'Attribute' : 'Attributes';\n    return `${attributeCount} ${form}`;\n  };\n\n  return (\n    <AddonPanel {...props}>\n      <TabsState\n        initial=\"live\"\n        backgroundColor={theme.background.hoverable as string}\n      >\n        <div id=\"events\" title={getEventTitle(events)}>\n          <Placeholder>\n            <Fragment>\n              <div\n                style={{\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'space-between',\n                  marginBottom: '12px',\n                  padding: '8px',\n                  backgroundColor: theme.background.app,\n                  borderRadius: '4px',\n                  border: `1px solid ${theme.color.border}`,\n                }}\n              >\n                <Button onClick={updateEvents}>Update events</Button>\n                <HighlightButtons\n                  highlights={highlights}\n                  toggleHighlight={toggleHighlight}\n                />\n              </div>\n            </Fragment>\n            {events.length > 0 ? (\n              <List\n                items={events.map((item, index) => {\n                  return {\n                    title: formatEventTitle(item, index),\n                    content: (\n                      <SyntaxHighlighter\n                        language=\"json\"\n                        copyable={true}\n                        bordered={true}\n                        padded={true}\n                      >\n                        {JSON.stringify(item, null, 2)}\n                      </SyntaxHighlighter>\n                    ),\n                  };\n                })}\n              />\n            ) : (\n              <p>No events yet</p>\n            )}\n          </Placeholder>\n        </div>\n        <div id=\"live\" title={getLiveEventTitle()}>\n          <Placeholder>\n            <Fragment>\n              <div\n                style={{\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'space-between',\n                  marginBottom: '12px',\n                  padding: '8px',\n                  backgroundColor: theme.background.app,\n                  borderRadius: '4px',\n                  border: `1px solid ${theme.color.border}`,\n                }}\n              >\n                <div\n                  style={{ display: 'flex', gap: '8px', alignItems: 'center' }}\n                >\n                  <Button size=\"small\" onClick={clearLiveEvents}>\n                    Clear Events\n                  </Button>\n                </div>\n                <HighlightButtons\n                  highlights={highlights}\n                  toggleHighlight={toggleHighlight}\n                />\n              </div>\n            </Fragment>\n            {liveEvents.length > 0 ? (\n              <List\n                items={liveEvents.map((event, index) => {\n                  return {\n                    title: formatEventTitle(\n                      event,\n                      liveEvents.length - index - 1,\n                    ),\n                    content: (\n                      <SyntaxHighlighter\n                        language=\"json\"\n                        copyable={true}\n                        bordered={true}\n                        padded={true}\n                      >\n                        {JSON.stringify(event, null, 2)}\n                      </SyntaxHighlighter>\n                    ),\n                  };\n                })}\n              />\n            ) : (\n              <p\n                style={{\n                  textAlign: 'center',\n                  color: theme.color.mediumdark,\n                  padding: '20px',\n                }}\n              >\n                Waiting for live events...\n                <br />\n                <small>\n                  Interact with components to see events appear here in\n                  real-time\n                </small>\n              </p>\n            )}\n          </Placeholder>\n        </div>\n        <div id=\"attributes\" title={getAttributeTitle()}>\n          <Placeholder>\n            <Fragment>\n              <div\n                style={{\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'space-between',\n                  marginBottom: '12px',\n                  padding: '8px',\n                  backgroundColor: theme.background.app,\n                  borderRadius: '4px',\n                  border: `1px solid ${theme.color.border}`,\n                }}\n              >\n                <Button onClick={updateAttributes}>Update attributes</Button>\n                <HighlightButtons\n                  highlights={highlights}\n                  toggleHighlight={toggleHighlight}\n                />\n              </div>\n            </Fragment>\n            <AttributeTreeView tree={attributeTree} />\n          </Placeholder>\n        </div>\n      </TabsState>\n    </AddonPanel>\n  );\n});\n","import React from 'react';\nimport { addons, types } from 'storybook/manager-api';\n\nimport { Panel } from './components/Panel';\nimport { ADDON_ID, PANEL_ID } from './constants';\n\n/**\n * Note: if you want to use JSX in this file, rename it to `manager.tsx`\n * and update the entry prop in tsup.config.ts to use \"src/manager.tsx\",\n */\n\naddons.register(ADDON_ID, (api) => {\n  addons.add(PANEL_ID, {\n    type: types.PANEL,\n    title: ADDON_ID,\n    match: ({ viewMode }) => viewMode === 'story',\n    render: ({ active }) => <Panel active={!!active} />,\n  });\n});\n"]}

package/dist/preset.cjs

@@ -0,0 +1,2 @@
+'use strict';var t=async n=>n,e=async n=>n;exports.viteFinal=t;exports.webpack=e;//# sourceMappingURL=preset.cjs.map
+//# sourceMappingURL=preset.cjs.map

package/dist/preset.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/preset.ts"],"names":["viteFinal","config","webpack"],"mappings":"aAAO,IAAMA,EAAY,MAAOC,CAAAA,EACvBA,CAAAA,CAGIC,CAAAA,CAAU,MAAOD,CAAAA,EACrBA","file":"preset.cjs","sourcesContent":["export const viteFinal = async (config: unknown) => {\n  return config;\n};\n\nexport const webpack = async (config: unknown) => {\n  return config;\n};\n"]}