@walkeros/explorer 3.0.1 → 3.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/__mocks__/@monaco-editor/react.d.ts +3 -0
- package/dist/__mocks__/@monaco-editor/react.d.ts.map +1 -0
- package/dist/__mocks__/@monaco-editor/react.js +4 -0
- package/dist/__mocks__/@monaco-editor/react.js.map +1 -0
- package/dist/components/atoms/box.d.ts +27 -0
- package/dist/components/atoms/box.d.ts.map +1 -0
- package/dist/components/atoms/box.js +86 -0
- package/dist/components/atoms/box.js.map +1 -0
- package/dist/components/atoms/box.stories.d.ts +34 -0
- package/dist/components/atoms/box.stories.d.ts.map +1 -0
- package/dist/components/atoms/box.stories.js +104 -0
- package/dist/components/atoms/box.stories.js.map +1 -0
- package/dist/components/atoms/button-group.d.ts +17 -0
- package/dist/components/atoms/button-group.d.ts.map +1 -0
- package/dist/components/atoms/button-group.js +12 -0
- package/dist/components/atoms/button-group.js.map +1 -0
- package/dist/components/atoms/button-group.stories.d.ts +18 -0
- package/dist/components/atoms/button-group.stories.d.ts.map +1 -0
- package/dist/components/atoms/button-group.stories.js +39 -0
- package/dist/components/atoms/button-group.stories.js.map +1 -0
- package/dist/components/atoms/button-link.d.ts +12 -0
- package/dist/components/atoms/button-link.d.ts.map +1 -0
- package/dist/components/atoms/button-link.js +10 -0
- package/dist/components/atoms/button-link.js.map +1 -0
- package/dist/components/atoms/button-link.stories.d.ts +11 -0
- package/dist/components/atoms/button-link.stories.d.ts.map +1 -0
- package/dist/components/atoms/button-link.stories.js +50 -0
- package/dist/components/atoms/button-link.stories.js.map +1 -0
- package/dist/components/atoms/button.d.ts +15 -0
- package/dist/components/atoms/button.d.ts.map +1 -0
- package/dist/components/atoms/button.js +11 -0
- package/dist/components/atoms/button.js.map +1 -0
- package/dist/components/atoms/button.stories.d.ts +14 -0
- package/dist/components/atoms/button.stories.d.ts.map +1 -0
- package/dist/components/atoms/button.stories.js +25 -0
- package/dist/components/atoms/button.stories.js.map +1 -0
- package/dist/components/atoms/code.d.ts +92 -0
- package/dist/components/atoms/code.d.ts.map +1 -0
- package/dist/components/atoms/code.js +405 -0
- package/dist/components/atoms/code.js.map +1 -0
- package/dist/components/atoms/code.stories.d.ts +46 -0
- package/dist/components/atoms/code.stories.d.ts.map +1 -0
- package/dist/components/atoms/code.stories.js +156 -0
- package/dist/components/atoms/code.stories.js.map +1 -0
- package/dist/components/atoms/footer.d.ts +21 -0
- package/dist/components/atoms/footer.d.ts.map +1 -0
- package/dist/components/atoms/footer.js +19 -0
- package/dist/components/atoms/footer.js.map +1 -0
- package/dist/components/atoms/footer.stories.d.ts +14 -0
- package/dist/components/atoms/footer.stories.d.ts.map +1 -0
- package/dist/components/atoms/footer.stories.js +29 -0
- package/dist/components/atoms/footer.stories.js.map +1 -0
- package/dist/components/atoms/grid.d.ts +65 -0
- package/dist/components/atoms/grid.d.ts.map +1 -0
- package/dist/components/atoms/grid.js +169 -0
- package/dist/components/atoms/grid.js.map +1 -0
- package/dist/components/atoms/grid.stories.d.ts +18 -0
- package/dist/components/atoms/grid.stories.d.ts.map +1 -0
- package/dist/components/atoms/grid.stories.js +60 -0
- package/dist/components/atoms/grid.stories.js.map +1 -0
- package/dist/components/atoms/header.d.ts +7 -0
- package/dist/components/atoms/header.d.ts.map +1 -0
- package/dist/components/atoms/header.js +5 -0
- package/dist/components/atoms/header.js.map +1 -0
- package/dist/components/atoms/header.stories.d.ts +15 -0
- package/dist/components/atoms/header.stories.d.ts.map +1 -0
- package/dist/components/atoms/header.stories.js +37 -0
- package/dist/components/atoms/header.stories.js.map +1 -0
- package/dist/components/atoms/icons/icon.stories.d.ts +18 -0
- package/dist/components/atoms/icons/icon.stories.d.ts.map +1 -0
- package/dist/components/atoms/icons/icon.stories.js +37 -0
- package/dist/components/atoms/icons/icon.stories.js.map +1 -0
- package/dist/components/atoms/icons/icons.d.ts +2 -0
- package/dist/components/atoms/icons/icons.d.ts.map +1 -0
- package/dist/components/atoms/icons/icons.js +7 -0
- package/dist/components/atoms/icons/icons.js.map +1 -0
- package/dist/components/atoms/icons/index.d.ts +3 -0
- package/dist/components/atoms/icons/index.d.ts.map +1 -0
- package/dist/components/atoms/icons/index.js +3 -0
- package/dist/components/atoms/icons/index.js.map +1 -0
- package/dist/components/atoms/mdx-code.d.ts +33 -0
- package/dist/components/atoms/mdx-code.d.ts.map +1 -0
- package/dist/components/atoms/mdx-code.js +69 -0
- package/dist/components/atoms/mdx-code.js.map +1 -0
- package/dist/components/atoms/preview-footer.d.ts +32 -0
- package/dist/components/atoms/preview-footer.d.ts.map +1 -0
- package/dist/components/atoms/preview-footer.js +31 -0
- package/dist/components/atoms/preview-footer.js.map +1 -0
- package/dist/components/atoms/spinner.d.ts +17 -0
- package/dist/components/atoms/spinner.d.ts.map +1 -0
- package/dist/components/atoms/spinner.js +14 -0
- package/dist/components/atoms/spinner.js.map +1 -0
- package/dist/components/atoms/spinner.stories.d.ts +7 -0
- package/dist/components/atoms/spinner.stories.d.ts.map +1 -0
- package/dist/components/atoms/spinner.stories.js +9 -0
- package/dist/components/atoms/spinner.stories.js.map +1 -0
- package/dist/components/atoms/toggle.d.ts +9 -0
- package/dist/components/atoms/toggle.d.ts.map +1 -0
- package/dist/components/atoms/toggle.js +6 -0
- package/dist/components/atoms/toggle.js.map +1 -0
- package/dist/components/demos/DestinationDemo.d.ts +48 -0
- package/dist/components/demos/DestinationDemo.d.ts.map +1 -0
- package/dist/components/demos/DestinationDemo.js +105 -0
- package/dist/components/demos/DestinationDemo.js.map +1 -0
- package/dist/components/demos/DestinationDemo.stories.d.ts +17 -0
- package/dist/components/demos/DestinationDemo.stories.d.ts.map +1 -0
- package/dist/components/demos/DestinationDemo.stories.js +53 -0
- package/dist/components/demos/DestinationDemo.stories.js.map +1 -0
- package/dist/components/demos/DestinationInitDemo.d.ts +34 -0
- package/dist/components/demos/DestinationInitDemo.d.ts.map +1 -0
- package/dist/components/demos/DestinationInitDemo.js +73 -0
- package/dist/components/demos/DestinationInitDemo.js.map +1 -0
- package/dist/components/demos/DestinationInitDemo.stories.d.ts +17 -0
- package/dist/components/demos/DestinationInitDemo.stories.d.ts.map +1 -0
- package/dist/components/demos/DestinationInitDemo.stories.js +39 -0
- package/dist/components/demos/DestinationInitDemo.stories.js.map +1 -0
- package/dist/components/demos/PromotionPlayground.d.ts +30 -0
- package/dist/components/demos/PromotionPlayground.d.ts.map +1 -0
- package/dist/components/demos/PromotionPlayground.js +366 -0
- package/dist/components/demos/PromotionPlayground.js.map +1 -0
- package/dist/components/demos/PromotionPlayground.stories.d.ts +27 -0
- package/dist/components/demos/PromotionPlayground.stories.d.ts.map +1 -0
- package/dist/components/demos/PromotionPlayground.stories.js +32 -0
- package/dist/components/demos/PromotionPlayground.stories.js.map +1 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.d.ts +24 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.d.ts.map +1 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.js +10 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.js.map +1 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.d.ts +7 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.d.ts.map +1 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.js +71 -0
- package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.js.map +1 -0
- package/dist/components/molecules/architecture-flow/index.d.ts +3 -0
- package/dist/components/molecules/architecture-flow/index.d.ts.map +1 -0
- package/dist/components/molecules/architecture-flow/index.js +2 -0
- package/dist/components/molecules/architecture-flow/index.js.map +1 -0
- package/dist/components/molecules/code-box.d.ts +75 -0
- package/dist/components/molecules/code-box.d.ts.map +1 -0
- package/dist/components/molecules/code-box.js +174 -0
- package/dist/components/molecules/code-box.js.map +1 -0
- package/dist/components/molecules/code-box.stories.d.ts +87 -0
- package/dist/components/molecules/code-box.stories.d.ts.map +1 -0
- package/dist/components/molecules/code-box.stories.js +300 -0
- package/dist/components/molecules/code-box.stories.js.map +1 -0
- package/dist/components/molecules/code-snippet.d.ts +58 -0
- package/dist/components/molecules/code-snippet.d.ts.map +1 -0
- package/dist/components/molecules/code-snippet.js +72 -0
- package/dist/components/molecules/code-snippet.js.map +1 -0
- package/dist/components/molecules/code-snippet.stories.d.ts +23 -0
- package/dist/components/molecules/code-snippet.stories.d.ts.map +1 -0
- package/dist/components/molecules/code-snippet.stories.js +87 -0
- package/dist/components/molecules/code-snippet.stories.js.map +1 -0
- package/dist/components/molecules/dropdown.d.ts +68 -0
- package/dist/components/molecules/dropdown.d.ts.map +1 -0
- package/dist/components/molecules/dropdown.js +47 -0
- package/dist/components/molecules/dropdown.js.map +1 -0
- package/dist/components/molecules/dropdown.stories.d.ts +7 -0
- package/dist/components/molecules/dropdown.stories.d.ts.map +1 -0
- package/dist/components/molecules/dropdown.stories.js +18 -0
- package/dist/components/molecules/dropdown.stories.js.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.d.ts +74 -0
- package/dist/components/molecules/flow-map/FlowMap.d.ts.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.js +1039 -0
- package/dist/components/molecules/flow-map/FlowMap.js.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.stories.d.ts +47 -0
- package/dist/components/molecules/flow-map/FlowMap.stories.d.ts.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.stories.js +355 -0
- package/dist/components/molecules/flow-map/FlowMap.stories.js.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.transformers.stories.d.ts +29 -0
- package/dist/components/molecules/flow-map/FlowMap.transformers.stories.d.ts.map +1 -0
- package/dist/components/molecules/flow-map/FlowMap.transformers.stories.js +117 -0
- package/dist/components/molecules/flow-map/FlowMap.transformers.stories.js.map +1 -0
- package/dist/components/molecules/flow-map/index.d.ts +3 -0
- package/dist/components/molecules/flow-map/index.d.ts.map +1 -0
- package/dist/components/molecules/flow-map/index.js +2 -0
- package/dist/components/molecules/flow-map/index.js.map +1 -0
- package/dist/components/molecules/preview.d.ts +23 -0
- package/dist/components/molecules/preview.d.ts.map +1 -0
- package/dist/components/molecules/preview.js +232 -0
- package/dist/components/molecules/preview.js.map +1 -0
- package/dist/components/molecules/preview.stories.d.ts +23 -0
- package/dist/components/molecules/preview.stories.d.ts.map +1 -0
- package/dist/components/molecules/preview.stories.js +186 -0
- package/dist/components/molecules/preview.stories.js.map +1 -0
- package/dist/components/molecules/property-table.d.ts +7 -0
- package/dist/components/molecules/property-table.d.ts.map +1 -0
- package/dist/components/molecules/property-table.js +88 -0
- package/dist/components/molecules/property-table.js.map +1 -0
- package/dist/components/molecules/property-table.stories.d.ts +24 -0
- package/dist/components/molecules/property-table.stories.d.ts.map +1 -0
- package/dist/components/molecules/property-table.stories.js +86 -0
- package/dist/components/molecules/property-table.stories.js.map +1 -0
- package/dist/components/organisms/browser-box.d.ts +31 -0
- package/dist/components/organisms/browser-box.d.ts.map +1 -0
- package/dist/components/organisms/browser-box.js +80 -0
- package/dist/components/organisms/browser-box.js.map +1 -0
- package/dist/components/organisms/browser-box.stories.d.ts +26 -0
- package/dist/components/organisms/browser-box.stories.d.ts.map +1 -0
- package/dist/components/organisms/browser-box.stories.js +102 -0
- package/dist/components/organisms/browser-box.stories.js.map +1 -0
- package/dist/components/organisms/collector-box.d.ts +24 -0
- package/dist/components/organisms/collector-box.d.ts.map +1 -0
- package/dist/components/organisms/collector-box.js +56 -0
- package/dist/components/organisms/collector-box.js.map +1 -0
- package/dist/components/organisms/collector-box.stories.d.ts +22 -0
- package/dist/components/organisms/collector-box.stories.d.ts.map +1 -0
- package/dist/components/organisms/collector-box.stories.js +59 -0
- package/dist/components/organisms/collector-box.stories.js.map +1 -0
- package/dist/components/organisms/live-code.d.ts +22 -0
- package/dist/components/organisms/live-code.d.ts.map +1 -0
- package/dist/components/organisms/live-code.js +50 -0
- package/dist/components/organisms/live-code.js.map +1 -0
- package/dist/components/organisms/live-code.stories.d.ts +24 -0
- package/dist/components/organisms/live-code.stories.d.ts.map +1 -0
- package/dist/components/organisms/live-code.stories.js +55 -0
- package/dist/components/organisms/live-code.stories.js.map +1 -0
- package/dist/components/ui/button.d.ts +4 -0
- package/dist/components/ui/button.d.ts.map +1 -0
- package/dist/components/ui/button.js +6 -0
- package/dist/components/ui/button.js.map +1 -0
- package/dist/components/ui/icon.d.ts +5 -0
- package/dist/components/ui/icon.d.ts.map +1 -0
- package/dist/components/ui/icon.js +5 -0
- package/dist/components/ui/icon.js.map +1 -0
- package/dist/contexts/GridHeightContext.d.ts +11 -0
- package/dist/contexts/GridHeightContext.d.ts.map +1 -0
- package/dist/contexts/GridHeightContext.js +14 -0
- package/dist/contexts/GridHeightContext.js.map +1 -0
- package/dist/helpers/capture.d.ts +83 -0
- package/dist/helpers/capture.d.ts.map +1 -0
- package/dist/helpers/capture.js +125 -0
- package/dist/helpers/capture.js.map +1 -0
- package/dist/helpers/destinations.d.ts +21 -0
- package/dist/helpers/destinations.d.ts.map +1 -0
- package/dist/helpers/destinations.js +46 -0
- package/dist/helpers/destinations.js.map +1 -0
- package/dist/hooks/useDropdown.d.ts +34 -0
- package/dist/hooks/useDropdown.d.ts.map +1 -0
- package/dist/hooks/useDropdown.js +66 -0
- package/dist/hooks/useDropdown.js.map +1 -0
- package/dist/hooks/useMonacoHeight.d.ts +31 -0
- package/dist/hooks/useMonacoHeight.d.ts.map +1 -0
- package/dist/hooks/useMonacoHeight.js +83 -0
- package/dist/hooks/useMonacoHeight.js.map +1 -0
- package/dist/hooks/useTreeState.d.ts +32 -0
- package/dist/hooks/useTreeState.d.ts.map +1 -0
- package/dist/hooks/useTreeState.js +94 -0
- package/dist/hooks/useTreeState.js.map +1 -0
- package/dist/index.d.ts +69 -1338
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +59 -1
- package/dist/index.js.map +1 -1
- package/dist/lib/utils.d.ts +7 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/lib/utils.js +10 -0
- package/dist/lib/utils.js.map +1 -0
- package/dist/providers/MDXProvider.d.ts +40 -0
- package/dist/providers/MDXProvider.d.ts.map +1 -0
- package/dist/providers/MDXProvider.js +57 -0
- package/dist/providers/MDXProvider.js.map +1 -0
- package/dist/themes/index.d.ts +23 -0
- package/dist/themes/index.d.ts.map +1 -0
- package/dist/themes/index.js +29 -0
- package/dist/themes/index.js.map +1 -0
- package/dist/themes/lighthouse.d.ts +26 -0
- package/dist/themes/lighthouse.d.ts.map +1 -0
- package/dist/themes/lighthouse.js +230 -0
- package/dist/themes/lighthouse.js.map +1 -0
- package/dist/themes/palenight.d.ts +31 -0
- package/dist/themes/palenight.d.ts.map +1 -0
- package/dist/themes/palenight.js +236 -0
- package/dist/themes/palenight.js.map +1 -0
- package/dist/themes/types.d.ts +103 -0
- package/dist/themes/types.d.ts.map +1 -0
- package/dist/themes/types.js +8 -0
- package/dist/themes/types.js.map +1 -0
- package/dist/types/intellisense.d.ts +33 -0
- package/dist/types/intellisense.d.ts.map +1 -0
- package/dist/types/intellisense.js +2 -0
- package/dist/types/intellisense.js.map +1 -0
- package/dist/utils/code-normalizer.d.ts +11 -0
- package/dist/utils/code-normalizer.d.ts.map +1 -0
- package/dist/utils/code-normalizer.js +21 -0
- package/dist/utils/code-normalizer.js.map +1 -0
- package/dist/utils/contract-path-walker.d.ts +27 -0
- package/dist/utils/contract-path-walker.d.ts.map +1 -0
- package/dist/utils/contract-path-walker.js +145 -0
- package/dist/utils/contract-path-walker.js.map +1 -0
- package/dist/utils/format-code.d.ts +9 -0
- package/dist/utils/format-code.d.ts.map +1 -0
- package/dist/utils/format-code.js +77 -0
- package/dist/utils/format-code.js.map +1 -0
- package/dist/utils/mapping-context-detector.d.ts +17 -0
- package/dist/utils/mapping-context-detector.d.ts.map +1 -0
- package/dist/utils/mapping-context-detector.js +22 -0
- package/dist/utils/mapping-context-detector.js.map +1 -0
- package/dist/utils/monaco-context-types.d.ts +39 -0
- package/dist/utils/monaco-context-types.d.ts.map +1 -0
- package/dist/utils/monaco-context-types.js +426 -0
- package/dist/utils/monaco-context-types.js.map +1 -0
- package/dist/utils/monaco-decorators.d.ts +17 -0
- package/dist/utils/monaco-decorators.d.ts.map +1 -0
- package/dist/utils/monaco-decorators.js +81 -0
- package/dist/utils/monaco-decorators.js.map +1 -0
- package/dist/utils/monaco-formatters.d.ts +16 -0
- package/dist/utils/monaco-formatters.d.ts.map +1 -0
- package/dist/utils/monaco-formatters.js +139 -0
- package/dist/utils/monaco-formatters.js.map +1 -0
- package/dist/utils/monaco-intellisense-flow-extractor.d.ts +13 -0
- package/dist/utils/monaco-intellisense-flow-extractor.d.ts.map +1 -0
- package/dist/utils/monaco-intellisense-flow-extractor.js +168 -0
- package/dist/utils/monaco-intellisense-flow-extractor.js.map +1 -0
- package/dist/utils/monaco-json-path.d.ts +12 -0
- package/dist/utils/monaco-json-path.d.ts.map +1 -0
- package/dist/utils/monaco-json-path.js +68 -0
- package/dist/utils/monaco-json-path.js.map +1 -0
- package/dist/utils/monaco-json-schema.d.ts +45 -0
- package/dist/utils/monaco-json-schema.d.ts.map +1 -0
- package/dist/utils/monaco-json-schema.js +90 -0
- package/dist/utils/monaco-json-schema.js.map +1 -0
- package/dist/utils/monaco-schema-contract.d.ts +8 -0
- package/dist/utils/monaco-schema-contract.d.ts.map +1 -0
- package/dist/utils/monaco-schema-contract.js +73 -0
- package/dist/utils/monaco-schema-contract.js.map +1 -0
- package/dist/utils/monaco-schema-enrichment.d.ts +26 -0
- package/dist/utils/monaco-schema-enrichment.d.ts.map +1 -0
- package/dist/utils/monaco-schema-enrichment.js +31 -0
- package/dist/utils/monaco-schema-enrichment.js.map +1 -0
- package/dist/utils/monaco-schema-flow-config.d.ts +10 -0
- package/dist/utils/monaco-schema-flow-config.d.ts.map +1 -0
- package/dist/utils/monaco-schema-flow-config.js +201 -0
- package/dist/utils/monaco-schema-flow-config.js.map +1 -0
- package/dist/utils/monaco-schema-variables.d.ts +4 -0
- package/dist/utils/monaco-schema-variables.d.ts.map +1 -0
- package/dist/utils/monaco-schema-variables.js +26 -0
- package/dist/utils/monaco-schema-variables.js.map +1 -0
- package/dist/utils/monaco-types.d.ts +174 -0
- package/dist/utils/monaco-types.d.ts.map +1 -0
- package/dist/utils/monaco-types.js +378 -0
- package/dist/utils/monaco-types.js.map +1 -0
- package/dist/utils/monaco-walkeros-completions.d.ts +23 -0
- package/dist/utils/monaco-walkeros-completions.d.ts.map +1 -0
- package/dist/utils/monaco-walkeros-completions.js +258 -0
- package/dist/utils/monaco-walkeros-completions.js.map +1 -0
- package/dist/utils/monaco-walkeros-decorations.d.ts +29 -0
- package/dist/utils/monaco-walkeros-decorations.d.ts.map +1 -0
- package/dist/utils/monaco-walkeros-decorations.js +87 -0
- package/dist/utils/monaco-walkeros-decorations.js.map +1 -0
- package/dist/utils/monaco-walkeros-markers.d.ts +13 -0
- package/dist/utils/monaco-walkeros-markers.d.ts.map +1 -0
- package/dist/utils/monaco-walkeros-markers.js +69 -0
- package/dist/utils/monaco-walkeros-markers.js.map +1 -0
- package/dist/utils/monaco-walkeros-providers.d.ts +19 -0
- package/dist/utils/monaco-walkeros-providers.d.ts.map +1 -0
- package/dist/utils/monaco-walkeros-providers.js +284 -0
- package/dist/utils/monaco-walkeros-providers.js.map +1 -0
- package/dist/utils/path-analyzer.d.ts +88 -0
- package/dist/utils/path-analyzer.d.ts.map +1 -0
- package/dist/utils/path-analyzer.js +215 -0
- package/dist/utils/path-analyzer.js.map +1 -0
- package/package.json +6 -6
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { PromotionPlayground } from './PromotionPlayground';
|
|
3
|
+
/**
|
|
4
|
+
* PromotionPlayground - Complete walkerOS demonstration
|
|
5
|
+
*
|
|
6
|
+
* Full-featured playground showing the complete walkerOS flow:
|
|
7
|
+
* HTML → Preview → Events → Mapping → Destination output
|
|
8
|
+
*
|
|
9
|
+
* Features:
|
|
10
|
+
* - Live HTML/CSS/JS editor with real-time preview
|
|
11
|
+
* - Event capture from data attributes
|
|
12
|
+
* - Interactive mapping configuration
|
|
13
|
+
* - Destination output visualization
|
|
14
|
+
*
|
|
15
|
+
* Perfect for demonstrating the entire walkerOS ecosystem in action.
|
|
16
|
+
*/
|
|
17
|
+
declare const meta: Meta<typeof PromotionPlayground>;
|
|
18
|
+
export default meta;
|
|
19
|
+
type Story = StoryObj<typeof PromotionPlayground>;
|
|
20
|
+
/**
|
|
21
|
+
* Default promotion playground with product card example
|
|
22
|
+
*
|
|
23
|
+
* Includes a fully styled product card with walkerOS data attributes,
|
|
24
|
+
* demonstrating event tracking, context switching, and destination integration.
|
|
25
|
+
*/
|
|
26
|
+
export declare const Default: Story;
|
|
27
|
+
//# sourceMappingURL=PromotionPlayground.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PromotionPlayground.stories.d.ts","sourceRoot":"","sources":["../../../src/components/demos/PromotionPlayground.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,mBAAmB,CAO1C,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAElD;;;;;GAKG;AACH,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { PromotionPlayground } from './PromotionPlayground';
|
|
2
|
+
/**
|
|
3
|
+
* PromotionPlayground - Complete walkerOS demonstration
|
|
4
|
+
*
|
|
5
|
+
* Full-featured playground showing the complete walkerOS flow:
|
|
6
|
+
* HTML → Preview → Events → Mapping → Destination output
|
|
7
|
+
*
|
|
8
|
+
* Features:
|
|
9
|
+
* - Live HTML/CSS/JS editor with real-time preview
|
|
10
|
+
* - Event capture from data attributes
|
|
11
|
+
* - Interactive mapping configuration
|
|
12
|
+
* - Destination output visualization
|
|
13
|
+
*
|
|
14
|
+
* Perfect for demonstrating the entire walkerOS ecosystem in action.
|
|
15
|
+
*/
|
|
16
|
+
const meta = {
|
|
17
|
+
component: PromotionPlayground,
|
|
18
|
+
title: 'Demos/PromotionPlayground',
|
|
19
|
+
tags: ['autodocs'],
|
|
20
|
+
parameters: {
|
|
21
|
+
layout: 'fullscreen',
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
|
+
export default meta;
|
|
25
|
+
/**
|
|
26
|
+
* Default promotion playground with product card example
|
|
27
|
+
*
|
|
28
|
+
* Includes a fully styled product card with walkerOS data attributes,
|
|
29
|
+
* demonstrating event tracking, context switching, and destination integration.
|
|
30
|
+
*/
|
|
31
|
+
export const Default = {};
|
|
32
|
+
//# sourceMappingURL=PromotionPlayground.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PromotionPlayground.stories.js","sourceRoot":"","sources":["../../../src/components/demos/PromotionPlayground.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D;;;;;;;;;;;;;GAaG;AACH,MAAM,IAAI,GAAqC;IAC7C,SAAS,EAAE,mBAAmB;IAC9B,KAAK,EAAE,2BAA2B;IAClC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB;;;;;GAKG;AACH,MAAM,CAAC,MAAM,OAAO,GAAU,EAAE,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
export interface FlowItem {
|
|
3
|
+
icon: ReactNode;
|
|
4
|
+
label: string;
|
|
5
|
+
}
|
|
6
|
+
export interface FlowSection {
|
|
7
|
+
title: string;
|
|
8
|
+
items: FlowItem[];
|
|
9
|
+
}
|
|
10
|
+
export interface FlowColumn {
|
|
11
|
+
title: string;
|
|
12
|
+
sections: FlowSection[];
|
|
13
|
+
}
|
|
14
|
+
export interface ArchitectureFlowProps {
|
|
15
|
+
sources: FlowColumn;
|
|
16
|
+
center: ReactNode;
|
|
17
|
+
centerTitle?: string;
|
|
18
|
+
destinations: FlowColumn;
|
|
19
|
+
arrowRight?: ReactNode;
|
|
20
|
+
arrowDown?: ReactNode;
|
|
21
|
+
className?: string;
|
|
22
|
+
}
|
|
23
|
+
export declare function ArchitectureFlow({ sources, center, centerTitle, destinations, arrowRight, arrowDown, className, }: ArchitectureFlowProps): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
//# sourceMappingURL=ArchitectureFlow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArchitectureFlow.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,EAAE,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,WAAW,EAAE,CAAC;CACzB;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,UAAU,CAAC;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,UAAU,CAAC;IACzB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,MAAM,EACN,WAAW,EACX,YAAY,EACZ,UAA4C,EAC5C,SAA0C,EAC1C,SAAS,GACV,EAAE,qBAAqB,2CA6DvB"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Icon } from '@iconify/react';
|
|
3
|
+
import { cn } from '../../../lib/utils';
|
|
4
|
+
export function ArchitectureFlow({ sources, center, centerTitle, destinations, arrowRight = _jsx(Icon, { icon: "mdi:arrow-right" }), arrowDown = _jsx(Icon, { icon: "mdi:arrow-down" }), className, }) {
|
|
5
|
+
return (_jsx("div", { className: cn('elb-architecture-flow', className), children: _jsxs("div", { className: "elb-architecture-flow__grid", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: sources.title }), _jsx("div", { className: "elb-architecture-flow__spacer" }), _jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: centerTitle }), _jsx("div", { className: "elb-architecture-flow__spacer" }), _jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: destinations.title }), _jsxs("div", { className: "elb-architecture-flow__column", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: sources.title }), _jsx("div", { className: "elb-architecture-flow__sections", children: sources.sections.map((section) => (_jsx(FlowSectionBox, { section: section }, section.title))) })] }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--desktop", children: arrowRight }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--mobile", children: arrowDown }), _jsxs("div", { className: "elb-architecture-flow__center", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: centerTitle }), _jsx("div", { className: "elb-architecture-flow__center-content", children: center })] }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--desktop", children: arrowRight }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--mobile", children: arrowDown }), _jsxs("div", { className: "elb-architecture-flow__column", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: destinations.title }), _jsx("div", { className: "elb-architecture-flow__sections", children: destinations.sections.map((section) => (_jsx(FlowSectionBox, { section: section }, section.title))) })] })] }) }));
|
|
6
|
+
}
|
|
7
|
+
function FlowSectionBox({ section }) {
|
|
8
|
+
return (_jsxs("div", { className: "elb-architecture-flow__section", children: [_jsx("span", { className: "elb-architecture-flow__section-title", children: section.title }), _jsxs("div", { className: "elb-architecture-flow__items", children: [section.items.map((item) => (_jsxs("div", { className: "elb-architecture-flow__item", children: [_jsx("span", { className: "elb-architecture-flow__item-icon", children: item.icon }), _jsx("span", { className: "elb-architecture-flow__item-label", children: item.label })] }, item.label))), _jsx("span", { className: "elb-architecture-flow__more", children: "and more\u2026" })] })] }));
|
|
9
|
+
}
|
|
10
|
+
//# sourceMappingURL=ArchitectureFlow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArchitectureFlow.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AA2BxC,MAAM,UAAU,gBAAgB,CAAC,EAC/B,OAAO,EACP,MAAM,EACN,WAAW,EACX,YAAY,EACZ,UAAU,GAAG,KAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,GAAG,EAC5C,SAAS,GAAG,KAAC,IAAI,IAAC,IAAI,EAAC,gBAAgB,GAAG,EAC1C,SAAS,GACa;IACtB,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,YACpD,eAAK,SAAS,EAAC,6BAA6B,aAC1C,eAAM,SAAS,EAAC,oEAAoE,YACjF,OAAO,CAAC,KAAK,GACT,EACP,cAAK,SAAS,EAAC,+BAA+B,GAAG,EACjD,eAAM,SAAS,EAAC,oEAAoE,YACjF,WAAW,GACP,EACP,cAAK,SAAS,EAAC,+BAA+B,GAAG,EACjD,eAAM,SAAS,EAAC,oEAAoE,YACjF,YAAY,CAAC,KAAK,GACd,EAEP,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,OAAO,CAAC,KAAK,GACT,EACP,cAAK,SAAS,EAAC,iCAAiC,YAC7C,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACjC,KAAC,cAAc,IAAqB,OAAO,EAAE,OAAO,IAA/B,OAAO,CAAC,KAAK,CAAsB,CACzD,CAAC,GACE,IACF,EAEN,cAAK,SAAS,EAAC,oEAAoE,YAChF,UAAU,GACP,EACN,cAAK,SAAS,EAAC,mEAAmE,YAC/E,SAAS,GACN,EAEN,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,WAAW,GACP,EACP,cAAK,SAAS,EAAC,uCAAuC,YAAE,MAAM,GAAO,IACjE,EAEN,cAAK,SAAS,EAAC,oEAAoE,YAChF,UAAU,GACP,EACN,cAAK,SAAS,EAAC,mEAAmE,YAC/E,SAAS,GACN,EAEN,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,YAAY,CAAC,KAAK,GACd,EACP,cAAK,SAAS,EAAC,iCAAiC,YAC7C,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACtC,KAAC,cAAc,IAAqB,OAAO,EAAE,OAAO,IAA/B,OAAO,CAAC,KAAK,CAAsB,CACzD,CAAC,GACE,IACF,IACF,GACF,CACP,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EAAE,OAAO,EAA4B;IAC3D,OAAO,CACL,eAAK,SAAS,EAAC,gCAAgC,aAC7C,eAAM,SAAS,EAAC,sCAAsC,YACnD,OAAO,CAAC,KAAK,GACT,EACP,eAAK,SAAS,EAAC,8BAA8B,aAC1C,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,eAAsB,SAAS,EAAC,6BAA6B,aAC3D,eAAM,SAAS,EAAC,kCAAkC,YAC/C,IAAI,CAAC,IAAI,GACL,EACP,eAAM,SAAS,EAAC,mCAAmC,YAChD,IAAI,CAAC,KAAK,GACN,KANC,IAAI,CAAC,KAAK,CAOd,CACP,CAAC,EACF,eAAM,SAAS,EAAC,6BAA6B,+BAAiB,IAC1D,IACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ArchitectureFlow } from './ArchitectureFlow';
|
|
3
|
+
declare const meta: Meta<typeof ArchitectureFlow>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof ArchitectureFlow>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
//# sourceMappingURL=ArchitectureFlow.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArchitectureFlow.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAItD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAavC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAyD/C,eAAO,MAAM,OAAO,EAAE,KAarB,CAAC"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { ArchitectureFlow } from './ArchitectureFlow';
|
|
3
|
+
import { Icon } from '../../atoms/icons';
|
|
4
|
+
const meta = {
|
|
5
|
+
title: 'Molecules/ArchitectureFlow',
|
|
6
|
+
component: ArchitectureFlow,
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: 'padded',
|
|
9
|
+
},
|
|
10
|
+
decorators: [
|
|
11
|
+
(Story) => (_jsx("div", { className: "elb-explorer", style: { padding: '2rem' }, children: _jsx(Story, {}) })),
|
|
12
|
+
],
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
const walkerOSSources = {
|
|
16
|
+
title: 'Sources',
|
|
17
|
+
sections: [
|
|
18
|
+
{
|
|
19
|
+
title: 'Client-side',
|
|
20
|
+
items: [
|
|
21
|
+
{ icon: _jsx(Icon, { icon: "mdi:web" }), label: 'Browser' },
|
|
22
|
+
{ icon: _jsx(Icon, { icon: "mdi:layers-outline" }), label: 'dataLayer' },
|
|
23
|
+
],
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
title: 'Server-side',
|
|
27
|
+
items: [
|
|
28
|
+
{ icon: _jsx(Icon, { icon: "simple-icons:express" }), label: 'Express' },
|
|
29
|
+
{ icon: _jsx(Icon, { icon: "mdi:api" }), label: 'Fetch' },
|
|
30
|
+
{ icon: _jsx(Icon, { icon: "logos:aws-lambda" }), label: 'AWS Lambda' },
|
|
31
|
+
{ icon: _jsx(Icon, { icon: "logos:google-cloud" }), label: 'GCP Functions' },
|
|
32
|
+
],
|
|
33
|
+
},
|
|
34
|
+
],
|
|
35
|
+
};
|
|
36
|
+
const walkerOSDestinations = {
|
|
37
|
+
title: 'Destinations',
|
|
38
|
+
sections: [
|
|
39
|
+
{
|
|
40
|
+
title: 'Client-side',
|
|
41
|
+
items: [
|
|
42
|
+
{ icon: _jsx(Icon, { icon: "logos:google-analytics" }), label: 'GA4' },
|
|
43
|
+
{ icon: _jsx(Icon, { icon: "logos:google-ads" }), label: 'Google Ads' },
|
|
44
|
+
{ icon: _jsx(Icon, { icon: "logos:meta-icon" }), label: 'Meta Pixel' },
|
|
45
|
+
{
|
|
46
|
+
icon: (_jsx(Icon, { icon: "simple-icons:plausibleanalytics", style: { color: '#5850EC' } })),
|
|
47
|
+
label: 'Plausible',
|
|
48
|
+
},
|
|
49
|
+
{ icon: _jsx(Icon, { icon: "walkeros:piwik-pro" }), label: 'Piwik PRO' },
|
|
50
|
+
{ icon: _jsx(Icon, { icon: "mdi:api" }), label: 'API' },
|
|
51
|
+
],
|
|
52
|
+
},
|
|
53
|
+
{
|
|
54
|
+
title: 'Server-side',
|
|
55
|
+
items: [
|
|
56
|
+
{ icon: _jsx(Icon, { icon: "logos:aws" }), label: 'AWS' },
|
|
57
|
+
{ icon: _jsx(Icon, { icon: "logos:google-cloud" }), label: 'BigQuery' },
|
|
58
|
+
{ icon: _jsx(Icon, { icon: "logos:meta-icon" }), label: 'Meta CAPI' },
|
|
59
|
+
],
|
|
60
|
+
},
|
|
61
|
+
],
|
|
62
|
+
};
|
|
63
|
+
export const Default = {
|
|
64
|
+
args: {
|
|
65
|
+
sources: walkerOSSources,
|
|
66
|
+
centerTitle: 'Collector',
|
|
67
|
+
center: (_jsx("img", { src: "/walkerOS_logo.svg", alt: "walkerOS", style: { width: '128px', height: '128px' } })),
|
|
68
|
+
destinations: walkerOSDestinations,
|
|
69
|
+
},
|
|
70
|
+
};
|
|
71
|
+
//# sourceMappingURL=ArchitectureFlow.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ArchitectureFlow.stories.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,qBAAqB,EACrB,UAAU,EACV,WAAW,EACX,QAAQ,GACT,MAAM,oBAAoB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { type CodeProps } from '../atoms/code';
|
|
3
|
+
/**
|
|
4
|
+
* Tab with code content for CodeBox
|
|
5
|
+
*/
|
|
6
|
+
export interface CodeBoxTab {
|
|
7
|
+
id: string;
|
|
8
|
+
label: string;
|
|
9
|
+
code: string;
|
|
10
|
+
language?: string;
|
|
11
|
+
}
|
|
12
|
+
export interface CodeBoxProps extends Omit<CodeProps, 'code'> {
|
|
13
|
+
code?: string;
|
|
14
|
+
label?: string;
|
|
15
|
+
header?: string;
|
|
16
|
+
showHeader?: boolean;
|
|
17
|
+
tabs?: CodeBoxTab[];
|
|
18
|
+
activeTab?: string;
|
|
19
|
+
onTabChange?: (id: string) => void;
|
|
20
|
+
defaultTab?: string;
|
|
21
|
+
showTrafficLights?: boolean;
|
|
22
|
+
showCopy?: boolean;
|
|
23
|
+
showFormat?: boolean;
|
|
24
|
+
showSettings?: boolean;
|
|
25
|
+
/** Callback when validation issues change. Use to disable Save when errors > 0. */
|
|
26
|
+
onValidationIssues?: (counts: {
|
|
27
|
+
errors: number;
|
|
28
|
+
warnings: number;
|
|
29
|
+
}) => void;
|
|
30
|
+
footer?: React.ReactNode;
|
|
31
|
+
height?: string | number;
|
|
32
|
+
style?: React.CSSProperties;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* CodeBox - Monaco editor wrapped in a Box with header and actions
|
|
36
|
+
*
|
|
37
|
+
* Molecule that combines Box + Code atom + toolbar actions.
|
|
38
|
+
* Use this when you need an editor with header, copy, and format buttons.
|
|
39
|
+
* Use Code atom directly when you need an editor without Box wrapper.
|
|
40
|
+
*
|
|
41
|
+
* Height Behavior:
|
|
42
|
+
*
|
|
43
|
+
* Three height modes:
|
|
44
|
+
* 1. Grid context: Equal row heights (250-450px), fills available space
|
|
45
|
+
* 2. Explicit height prop: Fixed height (e.g., height={600} or height="50vh")
|
|
46
|
+
* 3. Auto-height prop: Dynamically sizes to content (min-max boundaries)
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* // Grid context - use default (no autoHeight) for equal row heights
|
|
50
|
+
* <Grid columns={3}>
|
|
51
|
+
* <CodeBox code={event} label="Event" showCopy />
|
|
52
|
+
* <CodeBox code={mapping} label="Mapping" showFormat />
|
|
53
|
+
* <CodeBox code={output} label="Output" disabled />
|
|
54
|
+
* </Grid>
|
|
55
|
+
*
|
|
56
|
+
* @example
|
|
57
|
+
* // Standalone with auto-height - fits content, no blank space
|
|
58
|
+
* <CodeBox
|
|
59
|
+
* code={setupCode}
|
|
60
|
+
* label="Setup"
|
|
61
|
+
* autoHeight={{ min: 100, max: 600 }}
|
|
62
|
+
* disabled
|
|
63
|
+
* />
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* // Explicit height override
|
|
67
|
+
* <CodeBox
|
|
68
|
+
* code={largeConfig}
|
|
69
|
+
* label="Configuration"
|
|
70
|
+
* height={600}
|
|
71
|
+
* showFormat
|
|
72
|
+
* />
|
|
73
|
+
*/
|
|
74
|
+
export declare function CodeBox({ code, language, onChange, disabled, autoHeight, label, header, showHeader, tabs, activeTab: controlledActiveTab, onTabChange, defaultTab, showTrafficLights, showCopy, showFormat, showSettings, onValidationIssues, footer, height, style, className, ...codeProps }: CodeBoxProps): import("react/jsx-runtime").JSX.Element;
|
|
75
|
+
//# sourceMappingURL=code-box.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-box.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/code-box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAIxE,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,eAAe,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC;IAE3D,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IAGrB,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAG5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,mFAAmF;IACnF,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAG5E,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,wBAAgB,OAAO,CAAC,EAEtB,IAAI,EACJ,QAAuB,EACvB,QAAQ,EACR,QAAgB,EAChB,UAAU,EAEV,KAAK,EACL,MAAM,EACN,UAAiB,EAEjB,IAAI,EACJ,SAAS,EAAE,mBAAmB,EAC9B,WAAW,EACX,UAAU,EAEV,iBAAyB,EAEzB,QAAe,EACf,UAAkB,EAClB,YAAoB,EAEpB,kBAAkB,EAElB,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACb,EAAE,YAAY,2CA8Xd"}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState, useCallback, useRef, useEffect } from 'react';
|
|
3
|
+
import { useMonaco } from '@monaco-editor/react';
|
|
4
|
+
import { Box } from '../atoms/box';
|
|
5
|
+
import { Code } from '../atoms/code';
|
|
6
|
+
/**
|
|
7
|
+
* CodeBox - Monaco editor wrapped in a Box with header and actions
|
|
8
|
+
*
|
|
9
|
+
* Molecule that combines Box + Code atom + toolbar actions.
|
|
10
|
+
* Use this when you need an editor with header, copy, and format buttons.
|
|
11
|
+
* Use Code atom directly when you need an editor without Box wrapper.
|
|
12
|
+
*
|
|
13
|
+
* Height Behavior:
|
|
14
|
+
*
|
|
15
|
+
* Three height modes:
|
|
16
|
+
* 1. Grid context: Equal row heights (250-450px), fills available space
|
|
17
|
+
* 2. Explicit height prop: Fixed height (e.g., height={600} or height="50vh")
|
|
18
|
+
* 3. Auto-height prop: Dynamically sizes to content (min-max boundaries)
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* // Grid context - use default (no autoHeight) for equal row heights
|
|
22
|
+
* <Grid columns={3}>
|
|
23
|
+
* <CodeBox code={event} label="Event" showCopy />
|
|
24
|
+
* <CodeBox code={mapping} label="Mapping" showFormat />
|
|
25
|
+
* <CodeBox code={output} label="Output" disabled />
|
|
26
|
+
* </Grid>
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* // Standalone with auto-height - fits content, no blank space
|
|
30
|
+
* <CodeBox
|
|
31
|
+
* code={setupCode}
|
|
32
|
+
* label="Setup"
|
|
33
|
+
* autoHeight={{ min: 100, max: 600 }}
|
|
34
|
+
* disabled
|
|
35
|
+
* />
|
|
36
|
+
*
|
|
37
|
+
* @example
|
|
38
|
+
* // Explicit height override
|
|
39
|
+
* <CodeBox
|
|
40
|
+
* code={largeConfig}
|
|
41
|
+
* label="Configuration"
|
|
42
|
+
* height={600}
|
|
43
|
+
* showFormat
|
|
44
|
+
* />
|
|
45
|
+
*/
|
|
46
|
+
export function CodeBox({
|
|
47
|
+
// Code props (single code mode)
|
|
48
|
+
code, language = 'javascript', onChange, disabled = false, autoHeight,
|
|
49
|
+
// Header
|
|
50
|
+
label, header, showHeader = true,
|
|
51
|
+
// Tabs with code content
|
|
52
|
+
tabs, activeTab: controlledActiveTab, onTabChange, defaultTab,
|
|
53
|
+
// Visual
|
|
54
|
+
showTrafficLights = false,
|
|
55
|
+
// Actions
|
|
56
|
+
showCopy = true, showFormat = false, showSettings = false,
|
|
57
|
+
// Validation
|
|
58
|
+
onValidationIssues,
|
|
59
|
+
// Layout
|
|
60
|
+
footer, height, style, className, ...codeProps }) {
|
|
61
|
+
const { onMount: userOnMount, ...restCodeProps } = codeProps;
|
|
62
|
+
const monaco = useMonaco();
|
|
63
|
+
const [copied, setCopied] = useState(false);
|
|
64
|
+
const [showSettingsPanel, setShowSettingsPanel] = useState(false);
|
|
65
|
+
const [settings, setSettings] = useState({
|
|
66
|
+
lineNumbers: false,
|
|
67
|
+
minimap: false,
|
|
68
|
+
wordWrap: false,
|
|
69
|
+
sticky: true,
|
|
70
|
+
});
|
|
71
|
+
const settingsRef = useRef(null);
|
|
72
|
+
const [markerCounts, setMarkerCounts] = useState({ errors: 0, warnings: 0 });
|
|
73
|
+
const [markerDetails, setMarkerDetails] = useState([]);
|
|
74
|
+
const [openMarkerMenu, setOpenMarkerMenu] = useState(null);
|
|
75
|
+
const markerMenuRef = useRef(null);
|
|
76
|
+
const editorInstanceRef = useRef(null);
|
|
77
|
+
useEffect(() => {
|
|
78
|
+
if (!showSettingsPanel && !openMarkerMenu)
|
|
79
|
+
return;
|
|
80
|
+
const handleClickOutside = (e) => {
|
|
81
|
+
if (showSettingsPanel &&
|
|
82
|
+
settingsRef.current &&
|
|
83
|
+
!settingsRef.current.contains(e.target)) {
|
|
84
|
+
setShowSettingsPanel(false);
|
|
85
|
+
}
|
|
86
|
+
if (openMarkerMenu &&
|
|
87
|
+
markerMenuRef.current &&
|
|
88
|
+
!markerMenuRef.current.contains(e.target)) {
|
|
89
|
+
setOpenMarkerMenu(null);
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
document.addEventListener('mousedown', handleClickOutside);
|
|
93
|
+
return () => document.removeEventListener('mousedown', handleClickOutside);
|
|
94
|
+
}, [showSettingsPanel, openMarkerMenu]);
|
|
95
|
+
// Track active tab for copy button (Box handles tab state, we just observe)
|
|
96
|
+
const [currentTabId, setCurrentTabId] = useState(controlledActiveTab ?? defaultTab ?? tabs?.[0]?.id ?? '');
|
|
97
|
+
// Update internal tracking when controlled prop changes
|
|
98
|
+
const effectiveTabId = controlledActiveTab ?? currentTabId;
|
|
99
|
+
// Wrap user's onTabChange to also update our tracking
|
|
100
|
+
const handleTabChange = useCallback((tabId) => {
|
|
101
|
+
setCurrentTabId(tabId);
|
|
102
|
+
onTabChange?.(tabId);
|
|
103
|
+
}, [onTabChange]);
|
|
104
|
+
// Get current code for copy/format buttons
|
|
105
|
+
const activeTabData = tabs?.find((t) => t.id === effectiveTabId);
|
|
106
|
+
const currentCode = activeTabData?.code ?? code ?? '';
|
|
107
|
+
const currentLanguage = activeTabData?.language ?? language;
|
|
108
|
+
// Use label as fallback for header (backward compat)
|
|
109
|
+
const boxHeader = header ?? label ?? 'Code';
|
|
110
|
+
const handleCopy = async () => {
|
|
111
|
+
try {
|
|
112
|
+
await navigator.clipboard.writeText(currentCode);
|
|
113
|
+
setCopied(true);
|
|
114
|
+
setTimeout(() => setCopied(false), 2000);
|
|
115
|
+
}
|
|
116
|
+
catch {
|
|
117
|
+
// Clipboard write failed silently
|
|
118
|
+
}
|
|
119
|
+
};
|
|
120
|
+
const handleFormat = () => {
|
|
121
|
+
if (!onChange || disabled || currentLanguage !== 'json')
|
|
122
|
+
return;
|
|
123
|
+
try {
|
|
124
|
+
const parsed = JSON.parse(currentCode);
|
|
125
|
+
const formatted = JSON.stringify(parsed, null, 2);
|
|
126
|
+
onChange(formatted);
|
|
127
|
+
}
|
|
128
|
+
catch (e) {
|
|
129
|
+
// Invalid JSON, do nothing
|
|
130
|
+
}
|
|
131
|
+
};
|
|
132
|
+
const handleEditorMount = useCallback((monacoEditor) => {
|
|
133
|
+
editorInstanceRef.current = monacoEditor;
|
|
134
|
+
userOnMount?.(monacoEditor);
|
|
135
|
+
}, [userOnMount]);
|
|
136
|
+
const handleMarkerCounts = useCallback((info) => {
|
|
137
|
+
setMarkerCounts({ errors: info.errors, warnings: info.warnings });
|
|
138
|
+
setMarkerDetails(info.markers);
|
|
139
|
+
onValidationIssues?.({ errors: info.errors, warnings: info.warnings });
|
|
140
|
+
}, [onValidationIssues]);
|
|
141
|
+
const jumpToLine = useCallback((line, column) => {
|
|
142
|
+
const ed = editorInstanceRef.current;
|
|
143
|
+
if (!ed)
|
|
144
|
+
return;
|
|
145
|
+
ed.revealLineInCenter(line);
|
|
146
|
+
ed.setPosition({ lineNumber: line, column });
|
|
147
|
+
ed.focus();
|
|
148
|
+
setOpenMarkerMenu(null);
|
|
149
|
+
}, []);
|
|
150
|
+
const settingsProps = {
|
|
151
|
+
lineNumbers: settings.lineNumbers,
|
|
152
|
+
minimap: settings.minimap,
|
|
153
|
+
wordWrap: settings.wordWrap,
|
|
154
|
+
sticky: settings.sticky,
|
|
155
|
+
};
|
|
156
|
+
// Build header actions
|
|
157
|
+
const actions = (_jsxs("div", { style: { display: 'flex', gap: '4px', alignItems: 'center' }, children: [markerCounts.errors > 0 && (_jsxs("div", { ref: openMarkerMenu === 'error' ? markerMenuRef : undefined, style: { position: 'relative' }, children: [_jsxs("button", { className: "elb-codebox-marker-badge elb-codebox-marker-badge--error", onClick: () => setOpenMarkerMenu(openMarkerMenu === 'error' ? null : 'error'), children: [_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [_jsx("circle", { cx: "12", cy: "12", r: "10" }), _jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }), _jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })] }), _jsx("span", { children: markerCounts.errors })] }), openMarkerMenu === 'error' && (_jsx(MarkerMenu, { markers: markerDetails.filter((m) => m.severity === 'error'), onJump: jumpToLine }))] })), markerCounts.warnings > 0 && (_jsxs("div", { ref: openMarkerMenu === 'warning' ? markerMenuRef : undefined, style: { position: 'relative' }, children: [_jsxs("button", { className: "elb-codebox-marker-badge elb-codebox-marker-badge--warning", onClick: () => setOpenMarkerMenu(openMarkerMenu === 'warning' ? null : 'warning'), children: [_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }), _jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }), _jsx("circle", { cx: "12", cy: "17", r: ".5" })] }), _jsx("span", { children: markerCounts.warnings })] }), openMarkerMenu === 'warning' && (_jsx(MarkerMenu, { markers: markerDetails.filter((m) => m.severity === 'warning'), onJump: jumpToLine }))] })), showFormat && !disabled && currentLanguage === 'json' && (_jsx("button", { className: "elb-explorer-btn", onClick: handleFormat, title: "Format JSON", children: _jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("line", { x1: "3", y1: "5", x2: "16", y2: "5" }), _jsx("line", { x1: "7", y1: "10", x2: "20", y2: "10" }), _jsx("line", { x1: "7", y1: "15", x2: "18", y2: "15" }), _jsx("line", { x1: "3", y1: "20", x2: "12", y2: "20" })] }) })), showCopy && (_jsx("button", { className: "elb-explorer-btn", onClick: handleCopy, title: copied ? 'Copied!' : 'Copy to clipboard', children: copied ? (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("polyline", { points: "20 6 9 17 4 12" }) })) : (_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }), _jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })] })) })), showSettings && (_jsxs("div", { ref: settingsRef, style: { position: 'relative' }, children: [_jsx("button", { className: `elb-explorer-btn${showSettingsPanel ? ' active' : ''}`, onClick: () => setShowSettingsPanel(!showSettingsPanel), title: "Editor settings", children: _jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "12", cy: "12", r: "3" }), _jsx("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" })] }) }), showSettingsPanel && (_jsxs("div", { className: "elb-codebox-settings", children: [_jsxs("label", { className: "elb-codebox-settings-option", children: [_jsx("input", { type: "checkbox", checked: settings.lineNumbers, onChange: () => setSettings((s) => ({ ...s, lineNumbers: !s.lineNumbers })) }), "Line numbers"] }), _jsxs("label", { className: "elb-codebox-settings-option", children: [_jsx("input", { type: "checkbox", checked: settings.minimap, onChange: () => setSettings((s) => ({ ...s, minimap: !s.minimap })) }), "Minimap"] }), _jsxs("label", { className: "elb-codebox-settings-option", children: [_jsx("input", { type: "checkbox", checked: settings.wordWrap, onChange: () => setSettings((s) => ({ ...s, wordWrap: !s.wordWrap })) }), "Word wrap"] }), _jsxs("label", { className: "elb-codebox-settings-option", children: [_jsx("input", { type: "checkbox", checked: settings.sticky, onChange: () => setSettings((s) => ({ ...s, sticky: !s.sticky })) }), "Sticky scroll"] })] }))] }))] }));
|
|
158
|
+
// Auto-height class for content-based sizing (Box handles gridContext)
|
|
159
|
+
const autoHeightClass = autoHeight ? 'elb-box--auto-height' : '';
|
|
160
|
+
const boxClassName = `${autoHeightClass} ${className || ''}`.trim();
|
|
161
|
+
// Convert CodeBoxTab[] to BoxTab[] with Code as content (Box handles rendering)
|
|
162
|
+
const boxTabs = tabs?.map((tab) => ({
|
|
163
|
+
id: tab.id,
|
|
164
|
+
label: tab.label,
|
|
165
|
+
content: (_jsx(Code, { code: tab.code, language: tab.language ?? language, onChange: onChange, disabled: disabled, autoHeight: autoHeight, onMount: handleEditorMount, onMarkerCounts: handleMarkerCounts, ...restCodeProps, ...settingsProps })),
|
|
166
|
+
}));
|
|
167
|
+
return (_jsx(Box, { header: boxHeader, headerActions: actions, showHeader: showHeader, tabs: boxTabs, defaultTab: defaultTab, activeTab: controlledActiveTab, onTabChange: handleTabChange, showTrafficLights: showTrafficLights, footer: footer, height: height, style: style, className: boxClassName, children: !tabs && (_jsx(Code, { code: code ?? '', language: language, onChange: onChange, disabled: disabled, autoHeight: autoHeight, onMount: handleEditorMount, onMarkerCounts: handleMarkerCounts, ...restCodeProps, ...settingsProps })) }));
|
|
168
|
+
}
|
|
169
|
+
function MarkerMenu({ markers, onJump, }) {
|
|
170
|
+
return (_jsx("div", { className: "elb-codebox-marker-menu", children: markers
|
|
171
|
+
.sort((a, b) => a.line - b.line || a.column - b.column)
|
|
172
|
+
.map((m, i) => (_jsxs("button", { className: "elb-codebox-marker-menu-item", onClick: () => onJump(m.line, m.column), children: [_jsxs("span", { className: "elb-codebox-marker-menu-line", children: ["Ln ", m.line] }), _jsx("span", { className: "elb-codebox-marker-menu-msg", children: m.message })] }, i))) }));
|
|
173
|
+
}
|
|
174
|
+
//# sourceMappingURL=code-box.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-box.js","sourceRoot":"","sources":["../../../src/components/molecules/code-box.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { CodeBox } from './code-box';
|
|
3
|
+
/**
|
|
4
|
+
* CodeBox - Monaco Editor wrapped in a Box component
|
|
5
|
+
*
|
|
6
|
+
* Combines the Code atom with Box container, providing header and toolbar actions.
|
|
7
|
+
* Supports copy to clipboard, JSON formatting, and flexible height modes.
|
|
8
|
+
*/
|
|
9
|
+
declare const meta: Meta<typeof CodeBox>;
|
|
10
|
+
export default meta;
|
|
11
|
+
type Story = StoryObj<typeof CodeBox>;
|
|
12
|
+
/**
|
|
13
|
+
* Default CodeBox with JavaScript code
|
|
14
|
+
*/
|
|
15
|
+
export declare const Default: Story;
|
|
16
|
+
/**
|
|
17
|
+
* Mac-style code window with traffic lights and filename tab
|
|
18
|
+
*
|
|
19
|
+
* Use this pattern for landing pages and documentation.
|
|
20
|
+
*/
|
|
21
|
+
export declare const WithTrafficLights: Story;
|
|
22
|
+
/**
|
|
23
|
+
* CodeBox with multiple tabs - clicking tabs switches code content
|
|
24
|
+
*/
|
|
25
|
+
export declare const WithTabs: Story;
|
|
26
|
+
/**
|
|
27
|
+
* CodeBox with JSON Schema IntelliSense
|
|
28
|
+
*
|
|
29
|
+
* Demonstrates JSON validation, autocomplete, and hover docs
|
|
30
|
+
* powered by a JSON Schema passed via the `jsonSchema` prop.
|
|
31
|
+
*/
|
|
32
|
+
export declare const WithJsonSchema: Story;
|
|
33
|
+
/**
|
|
34
|
+
* CodeBox with settings toggle
|
|
35
|
+
*
|
|
36
|
+
* Click the gear icon to toggle line numbers, minimap, and word wrap.
|
|
37
|
+
*/
|
|
38
|
+
export declare const WithSettings: Story;
|
|
39
|
+
/**
|
|
40
|
+
* Enriched Flow.Config schema with defaultSnippets and markdownDescription
|
|
41
|
+
*
|
|
42
|
+
* Uses the real Flow.Config JSON Schema from @walkeros/core, enriched with
|
|
43
|
+
* Monaco-specific extensions (snippets, markdown hover docs).
|
|
44
|
+
*
|
|
45
|
+
* **How to verify:** Place cursor inside `{}` after `"flows":`, press
|
|
46
|
+
* Ctrl+Space — autocomplete shows property suggestions from the schema.
|
|
47
|
+
*/
|
|
48
|
+
export declare const EnrichedFlowConfig: Story;
|
|
49
|
+
/**
|
|
50
|
+
* Contract schema with entity/action snippets
|
|
51
|
+
*
|
|
52
|
+
* **How to verify:** Autocomplete inside entities shows entity snippet;
|
|
53
|
+
* hover on properties shows markdown descriptions.
|
|
54
|
+
*/
|
|
55
|
+
export declare const EnrichedContract: Story;
|
|
56
|
+
/**
|
|
57
|
+
* Variables schema with `$var.` interpolation docs
|
|
58
|
+
*
|
|
59
|
+
* **How to verify:** Autocomplete shows "Add string variable",
|
|
60
|
+
* "Add boolean variable", "Add number variable" snippets.
|
|
61
|
+
*/
|
|
62
|
+
export declare const VariablesEditor: Story;
|
|
63
|
+
/**
|
|
64
|
+
* Visual coloring of `$var.`, `$def.`, `$secret.`, `$env.`, `$code:` references
|
|
65
|
+
*
|
|
66
|
+
* Decorations are applied automatically for JSON content. Each reference type
|
|
67
|
+
* is colored differently: variables=cyan italic, definitions=green italic,
|
|
68
|
+
* secrets/env=amber italic, code=purple.
|
|
69
|
+
*
|
|
70
|
+
* **How to verify:** Each reference value should be colored differently
|
|
71
|
+
* in the editor.
|
|
72
|
+
*/
|
|
73
|
+
export declare const ReferenceDecorations: Story;
|
|
74
|
+
/**
|
|
75
|
+
* Dynamic Flow Context — self-referencing IntelliSense
|
|
76
|
+
*
|
|
77
|
+
* Edit the flow JSON and variables/definitions you define become immediately
|
|
78
|
+
* available as `$var.` and `$def.` completions in the same editor.
|
|
79
|
+
*
|
|
80
|
+
* **How to verify:**
|
|
81
|
+
* - Add a variable in the `"variables"` section (e.g., `"myVar": "hello"`)
|
|
82
|
+
* - Scroll down to a destination config and type `$var.` — your new variable appears
|
|
83
|
+
* - Rename or delete the variable — completions update instantly
|
|
84
|
+
* - `$var.nonExistent` gets a warning marker
|
|
85
|
+
*/
|
|
86
|
+
export declare const DynamicFlowContext: Story;
|
|
87
|
+
//# sourceMappingURL=code-box.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"code-box.stories.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/code-box.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAKrC;;;;;GAKG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAI9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAEtC;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAC;AAuBF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAS/B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,QAAQ,EAAE,KAqCtB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,cAAc,EAAE,KAyC5B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAgD1B,CAAC;AAMF;;;;;;;;GAQG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAmBhC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAe9B,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,eAAe,EAAE,KAiB7B,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,oBAAoB,EAAE,KA0BlC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAqDhC,CAAC"}
|