@eventcatalog/core 2.7.13 → 2.7.14

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.
@@ -1,6 +1,6 @@
1
1
  name: Bug Report 🐞
2
2
  description: Create a bug report
3
- labels: ["🐛 bug"]
3
+ labels: ["bug"]
4
4
  body:
5
5
  - type: markdown
6
6
  attributes:
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @eventcatalog/core
2
2
 
3
+ ## 2.7.14
4
+
5
+ ### Patch Changes
6
+
7
+ - c45ebd0: feat(core): added new steps component
8
+
3
9
  ## 2.7.13
4
10
 
5
11
  ### Patch Changes
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@eventcatalog/core",
3
3
  "type": "module",
4
- "version": "2.7.13",
4
+ "version": "2.7.14",
5
5
  "publishConfig": {
6
6
  "access": "public"
7
7
  },
@@ -0,0 +1,25 @@
1
+ ---
2
+ const { title } = Astro.props;
3
+ ---
4
+
5
+ <li class="mb-8 ml-6 w-full xl:max-w-[50%]">
6
+ <div class="flex items-center mb-4">
7
+ <span class="step-number absolute flex items-center justify-center w-6 h-6 bg-purple-500/70 rounded-md -left-3 text-white">
8
+ <div></div>
9
+ </span>
10
+ <h3 class="font-semibold text-lg ml-0">{title}</h3>
11
+ </div>
12
+ <p class="text-gray-500 text-sm ml-4"><slot /></p>
13
+ </li>
14
+
15
+ <script>
16
+ document.addEventListener('DOMContentLoaded', () => {
17
+ document.querySelectorAll('li[data-step]').forEach((li) => {
18
+ const stepNumber = li.getAttribute('data-step');
19
+ const stepSpan = li.querySelector('.step-number div');
20
+ if (stepSpan) {
21
+ stepSpan.textContent = stepNumber;
22
+ }
23
+ });
24
+ });
25
+ </script>
@@ -0,0 +1,27 @@
1
+ ---
2
+ const { title } = Astro.props;
3
+ const html = await Astro.slots.render('default');
4
+
5
+ function splitByLi(html: string) {
6
+ // Use regex to match <li> tags and their contents, including nested tags
7
+ const liRegex = /<li[\s\S]*?<\/li>/g;
8
+
9
+ // Find all matches
10
+ const matches = html.match(liRegex) || [];
11
+
12
+ // Add data-step attribute to each li
13
+ return matches.map((li: string, index: number) => {
14
+ // Replace the opening <li tag with <li data-step="index+1"
15
+ return li.replace(/<li/, `<li data-step="${index + 1}"`);
16
+ });
17
+ }
18
+
19
+ const data = splitByLi(html);
20
+ ---
21
+
22
+ <div class="bg-white text-gray-800 py-10 pb-0 font-sans not-prose">
23
+ {title && <h2 class="text-2xl font-bold text-gray-800 mb-6">{title}</h2>}
24
+ <ol class="relative border-l border-gray-200 ml-3">
25
+ {data.map((item: any) => <Fragment set:html={item} />)}
26
+ </ol>
27
+ </div>
@@ -6,6 +6,8 @@ import AccordionGroup from '@components/MDX/Accordion/AccordionGroup.astro';
6
6
  import Flow from '@components/MDX/Flow/Flow.astro';
7
7
  import Tiles from '@components/MDX/Tiles/Tiles.astro';
8
8
  import Tile from '@components/MDX/Tiles/Tile.astro';
9
+ import Steps from '@components/MDX/Steps/Steps.astro';
10
+ import Step from '@components/MDX/Steps/Step.astro';
9
11
  import Admonition from '@components/MDX/Admonition';
10
12
  import OpenAPI from '@components/MDX/OpenAPI/OpenAPI.astro';
11
13
  import AsyncAPI from '@components/MDX/AsyncAPI/AsyncAPI.astro';
@@ -21,8 +23,10 @@ const components = (props: any) => {
21
23
  Flow,
22
24
  OpenAPI,
23
25
  AsyncAPI,
24
- Tiles,
25
26
  Tile,
27
+ Tiles,
28
+ Step,
29
+ Steps,
26
30
  Admonition: (mdxProp: any) => <Admonition {...mdxProp} {...props} />,
27
31
  File: (mdxProp: any) => File({ ...props, ...mdxProp }),
28
32
  NodeGraph: (mdxProp: any) => NodeGraphPortal({ ...props.data, ...mdxProp }),