@uva-glass/component-library 3.0.10 → 3.0.12

package/dist/components/Timeline/Timeline.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta } from '@storybook/react';
+import { TimelineProps } from './Timeline';
+declare const _default: Meta<TimelineProps>;
+export default _default;
+export declare const TimelineExample: import('@storybook/core/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, TimelineProps>;

package/dist/components/Timeline/Timeline.stories.js

@@ -0,0 +1,43 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Timeline as e } from "./Timeline.js";
+import { MOCK_TIMELINE_ITEM as i } from "./mockTimelineItem.js";
+const n = "<Timeline data=[] showLabel={string} hideLabel={string} />", c = {
+  title: "Organisms/Timeline",
+  component: e,
+  argTypes: {
+    timelineData: {
+      description: "Data for the timeline",
+      control: {
+        type: "object"
+      }
+    },
+    showLabel: {
+      description: "Label of the button if inclomplete tasks are hidden",
+      control: {
+        type: "text"
+      }
+    },
+    hideLabel: {
+      description: "Label of the button if inclomplete tasks are shown",
+      control: {
+        type: "text"
+      }
+    }
+  },
+  parameters: {
+    inspectComponent: e,
+    codeString: n
+  }
+}, a = (t) => /* @__PURE__ */ o(e, { ...t }), s = {
+  timelineData: i,
+  showLabel: "Toon vervolgstappen",
+  hideLabel: "Verberg vervolgstappen"
+}, l = a.bind({});
+l.args = {
+  ...s
+};
+export {
+  l as TimelineExample,
+  c as default
+};
+//# sourceMappingURL=Timeline.stories.js.map

package/dist/components/Timeline/Timeline.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.stories.js","sources":["../../../src/components/Timeline/Timeline.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { TimelineProps, TimelineItemProps } from './Timeline';\n\nimport { Timeline } from './Timeline';\nimport { MOCK_TIMELINE_ITEM } from './mockTimelineItem';\n\nconst codeString = '<Timeline data=[] showLabel={string} hideLabel={string} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Organisms/Timeline',\n  component: Timeline,\n  argTypes: {\n    timelineData: {\n      description: 'Data for the timeline',\n      control: {\n        type: 'object',\n      },\n    },\n    showLabel: {\n      description: 'Label of the button if inclomplete tasks are hidden',\n      control: {\n        type: 'text',\n      },\n    },\n    hideLabel: {\n      description: 'Label of the button if inclomplete tasks are shown',\n      control: {\n        type: 'text',\n      },\n    },\n  },\n  parameters: {\n    inspectComponent: Timeline,\n    codeString: codeString,\n  },\n} as Meta<TimelineProps>;\n\nconst Template: StoryFn<TimelineProps> = (args) => <Timeline {...args} />;\n\nconst defaultArgs: Partial<TimelineProps> = {\n  timelineData: MOCK_TIMELINE_ITEM as TimelineItemProps[],\n  showLabel: 'Toon vervolgstappen',\n  hideLabel: 'Verberg vervolgstappen',\n};\n\nexport const TimelineExample = Template.bind({});\nTimelineExample.args = {\n  ...defaultArgs,\n};\n"],"names":["codeString","Timeline_stories","Timeline","Template","args","jsx","defaultArgs","MOCK_TIMELINE_ITEM","TimelineExample"],"mappings":";;;AAMA,MAAMA,IAAa,8DAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,cAAc;AAAA,MACZ,aAAa;AAAA,MACb,SAAS;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,WAAW;AAAA,MACT,aAAa;AAAA,MACb,SAAS;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,WAAW;AAAA,MACT,aAAa;AAAA,MACb,SAAS;AAAA,QACP,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EAEJ;AAAA,EACA,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAmC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAU,GAAGE,GAAM,GAEjEE,IAAsC;AAAA,EAC1C,cAAcC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AACb,GAEaC,IAAkBL,EAAS,KAAK,CAAE,CAAA;AAC/CK,EAAgB,OAAO;AAAA,EACrB,GAAGF;AACL;"}

package/dist/components/Timeline/Timeline.test.js

@@ -0,0 +1,80 @@
+import { jsx as o } from "react/jsx-runtime";
+import "../../index-Z7qwJmRM.js";
+import { r as n, s as e, f as i } from "../../react.esm-BOUd0cvD.js";
+import { MOCK_TIMELINE_ITEM as r } from "./mockTimelineItem.js";
+import "react";
+import "../Buttons/Button.js";
+import "../Buttons/LinkButton.js";
+import "@react-aria/button";
+import "../Checkbox/Checkbox.js";
+import "@react-aria/dialog";
+import "@react-aria/focus";
+import "@react-aria/overlays";
+import "../OverlayCloseButton/OverlayCloseButton.js";
+import "../GridRow/GridRow.js";
+import "../IconButton/IconButton.js";
+import "../Input/Input.js";
+import "../InputField/InputField.js";
+import "react-router";
+import "../../TablePlugin-o1MveXq2.js";
+import "../RteEditor/Providers/LanguageProvider.js";
+import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
+import "../RteEditor/hooks/components/Flyout.js";
+import "../../index-B3c5pcHk.js";
+import "../SelectListbox/SelectListbox.js";
+import "../SelectListbox/SelectProvider.js";
+import "../Sortable/components/SortableItem.js";
+import "../../SortableProvider-Ck_XnBVq.js";
+import { Timeline as p } from "./Timeline.js";
+describe("should render", () => {
+  it("should render completed items", () => {
+    n(
+      /* @__PURE__ */ o(
+        p,
+        {
+          timelineData: r,
+          showLabel: "Toon vervolgstappen",
+          hideLabel: "Verberg vervolgstappen"
+        }
+      )
+    ), expect(e.getByText("Concept")).toBeInTheDocument(), expect(e.getByText("Vakgegevens afgewezen")).toBeInTheDocument(), expect(e.getByText("Geverifieerd 1 van 3")).toBeInTheDocument(), expect(e.getByText("Concept ingediend")).toBeInTheDocument(), expect(e.getByText("Aangemaakt")).toBeInTheDocument();
+  }), it("should switch label when button is clicked", () => {
+    n(
+      /* @__PURE__ */ o(
+        p,
+        {
+          timelineData: r,
+          showLabel: "Toon vervolgstappen",
+          hideLabel: "Verberg vervolgstappen"
+        }
+      )
+    );
+    const t = e.getByRole("button", { name: "Toon vervolgstappen" });
+    expect(t).toBeInTheDocument(), i.click(t), expect(e.getByText("Verberg vervolgstappen")).toBeInTheDocument();
+  }), it("should show incomplete tasks if button is clicked", () => {
+    n(
+      /* @__PURE__ */ o(
+        p,
+        {
+          timelineData: r,
+          showLabel: "Toon vervolgstappen",
+          hideLabel: "Verberg vervolgstappen"
+        }
+      )
+    );
+    const t = e.getByRole("button", { name: "Toon vervolgstappen" });
+    expect(t).toBeInTheDocument(), i.click(t), expect(e.getByText("Verberg vervolgstappen")).toBeInTheDocument(), expect(e.getByText("Actief")).toBeInTheDocument();
+  }), it("should not show button if there are no incomplete tasks", () => {
+    n(
+      /* @__PURE__ */ o(
+        p,
+        {
+          timelineData: r.filter(({ completed: t }) => t),
+          showLabel: "Toon vervolgstappen",
+          hideLabel: "Verberg vervolgstappen"
+        }
+      )
+    ), expect(e.queryByText("Toon vervolgstappen")).not.toBeInTheDocument();
+  });
+});
+//# sourceMappingURL=Timeline.test.js.map

package/dist/components/Timeline/Timeline.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.test.js","sources":["../../../src/components/Timeline/Timeline.test.tsx"],"sourcesContent":["import '@testing-library/jest-dom';\nimport { fireEvent, render, screen } from '@testing-library/react';\n\nimport type { TimelineItemProps } from './Timeline';\n\nimport { MOCK_TIMELINE_ITEM } from './mockTimelineItem';\n\nimport { Timeline } from 'components';\n\ndescribe('should render', () => {\n  it('should render completed items', () => {\n    render(\n      <Timeline\n        timelineData={MOCK_TIMELINE_ITEM as TimelineItemProps[]}\n        showLabel=\"Toon vervolgstappen\"\n        hideLabel=\"Verberg vervolgstappen\"\n      />\n    );\n    expect(screen.getByText('Concept')).toBeInTheDocument();\n    expect(screen.getByText('Vakgegevens afgewezen')).toBeInTheDocument();\n    expect(screen.getByText('Geverifieerd 1 van 3')).toBeInTheDocument();\n    expect(screen.getByText('Concept ingediend')).toBeInTheDocument();\n    expect(screen.getByText('Aangemaakt')).toBeInTheDocument();\n  });\n\n  it('should switch label when button is clicked', () => {\n    render(\n      <Timeline\n        timelineData={MOCK_TIMELINE_ITEM as TimelineItemProps[]}\n        showLabel=\"Toon vervolgstappen\"\n        hideLabel=\"Verberg vervolgstappen\"\n      />\n    );\n    const button = screen.getByRole('button', { name: 'Toon vervolgstappen' });\n    expect(button).toBeInTheDocument();\n    fireEvent.click(button);\n    expect(screen.getByText('Verberg vervolgstappen')).toBeInTheDocument();\n  });\n\n  it('should show incomplete tasks if button is clicked', () => {\n    render(\n      <Timeline\n        timelineData={MOCK_TIMELINE_ITEM as TimelineItemProps[]}\n        showLabel=\"Toon vervolgstappen\"\n        hideLabel=\"Verberg vervolgstappen\"\n      />\n    );\n    const button = screen.getByRole('button', { name: 'Toon vervolgstappen' });\n    expect(button).toBeInTheDocument();\n    fireEvent.click(button);\n    expect(screen.getByText('Verberg vervolgstappen')).toBeInTheDocument();\n    expect(screen.getByText('Actief')).toBeInTheDocument();\n  });\n\n  it('should not show button if there are no incomplete tasks', () => {\n    render(\n      <Timeline\n        timelineData={(MOCK_TIMELINE_ITEM as TimelineItemProps[]).filter(({ completed }) => completed)}\n        showLabel=\"Toon vervolgstappen\"\n        hideLabel=\"Verberg vervolgstappen\"\n      />\n    );\n    expect(screen.queryByText('Toon vervolgstappen')).not.toBeInTheDocument();\n  });\n});\n"],"names":["render","jsx","Timeline","MOCK_TIMELINE_ITEM","screen","button","fireEvent","completed"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,SAAS,iBAAiB,MAAM;AAC9B,KAAG,iCAAiC,MAAM;AACxC,IAAAA;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,cAAcC;AAAA,UACd,WAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAEd,GACA,OAAOC,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB,GACtD,OAAOA,EAAO,UAAU,uBAAuB,CAAC,EAAE,kBAAkB,GACpE,OAAOA,EAAO,UAAU,sBAAsB,CAAC,EAAE,kBAAkB,GACnE,OAAOA,EAAO,UAAU,mBAAmB,CAAC,EAAE,kBAAkB,GAChE,OAAOA,EAAO,UAAU,YAAY,CAAC,EAAE,kBAAkB;AAAA,EAAA,CAC1D,GAED,GAAG,8CAA8C,MAAM;AACrD,IAAAJ;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,cAAcC;AAAA,UACd,WAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAEd;AACA,UAAME,IAASD,EAAO,UAAU,UAAU,EAAE,MAAM,uBAAuB;AAClE,WAAAC,CAAM,EAAE,kBAAkB,GACjCC,EAAU,MAAMD,CAAM,GACtB,OAAOD,EAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACtE,GAED,GAAG,qDAAqD,MAAM;AAC5D,IAAAJ;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,cAAcC;AAAA,UACd,WAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAEd;AACA,UAAME,IAASD,EAAO,UAAU,UAAU,EAAE,MAAM,uBAAuB;AAClE,WAAAC,CAAM,EAAE,kBAAkB,GACjCC,EAAU,MAAMD,CAAM,GACtB,OAAOD,EAAO,UAAU,wBAAwB,CAAC,EAAE,kBAAkB,GACrE,OAAOA,EAAO,UAAU,QAAQ,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACtD,GAED,GAAG,2DAA2D,MAAM;AAClE,IAAAJ;AAAA,MACE,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,cAAeC,EAA2C,OAAO,CAAC,EAAE,WAAAI,EAAA,MAAgBA,CAAS;AAAA,UAC7F,WAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAEd,GACA,OAAOH,EAAO,YAAY,qBAAqB,CAAC,EAAE,IAAI,kBAAkB;AAAA,EAAA,CACzE;AACH,CAAC;"}

package/dist/components/Timeline/TimelineItem.d.ts

@@ -0,0 +1,2 @@
+import { TimelineItemProps } from './Timeline';
+export declare const TimelineItem: ({ title, type, reason, subtitle, tasks, completed }: TimelineItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Timeline/TimelineItem.js

@@ -0,0 +1,7 @@
+import "react/jsx-runtime";
+import "../../clsx-OuTLNxxd.js";
+import { T as r } from "../../TimelineItem-DmrymETS.js";
+export {
+  r as TimelineItem
+};
+//# sourceMappingURL=TimelineItem.js.map

package/dist/components/Timeline/TimelineItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimelineItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/Timeline/index.d.ts

@@ -0,0 +1 @@
+export * from './Timeline';

package/dist/components/Timeline/index.js

@@ -0,0 +1,5 @@
+import { Timeline as m } from "./Timeline.js";
+export {
+  m as Timeline
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Timeline/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/Timeline/mockTimelineItem.d.ts

@@ -0,0 +1,30 @@
+export declare const MOCK_TIMELINE_ITEM: ({
+    title: string;
+    type: string;
+    reason: string;
+    subtitle: string;
+    tasks: {
+        title: string;
+        assignee: string;
+    }[];
+    completed: boolean;
+} | {
+    title: string;
+    type: string;
+    tasks: {
+        title: string;
+        assignee: string;
+    }[];
+    completed: boolean;
+    reason?: undefined;
+    subtitle?: undefined;
+} | {
+    title: string;
+    type: string;
+    reason: string;
+    subtitle: string;
+    tasks: {
+        title: string;
+    }[];
+    completed: boolean;
+})[];

package/dist/components/Timeline/mockTimelineItem.js

@@ -0,0 +1,95 @@
+const e = [
+  {
+    title: "Actief",
+    type: "active",
+    completed: !1,
+    reason: "",
+    subtitle: "",
+    tasks: []
+  },
+  {
+    title: "Verificatie",
+    type: "submitted",
+    reason: "",
+    subtitle: "3 openstaande verificatietaken",
+    tasks: [
+      {
+        title: "Vakgegevens te verifiëren door",
+        assignee: "Opleidingsdirecteur"
+      },
+      {
+        title: "Vakgegevens te verifiëren door",
+        assignee: "Opleidingscoördinator"
+      },
+      {
+        title: "Vakgegevens te verifiëren door",
+        assignee: "Studiegidsredacteur"
+      }
+    ],
+    completed: !1
+  },
+  {
+    title: "Concept",
+    type: "draft",
+    reason: "",
+    subtitle: "",
+    tasks: [
+      {
+        title: "Vakgegevens opnieuw in te dienen door",
+        assignee: "Vakcoördinator"
+      }
+    ],
+    completed: !0
+  },
+  {
+    title: "Vakgegevens afgewezen",
+    type: "rejected",
+    tasks: [
+      {
+        title: "Afwijsreden: gegevens mbt de aanbiedingen kloppen nog niet.",
+        assignee: "Jane Doe als opleidingscoördinator, 14 mei 2024, 16:39"
+      }
+    ],
+    completed: !0
+  },
+  {
+    title: "Geverifieerd 1 van 3",
+    type: "verified",
+    reason: "ongeldig door afwijzing",
+    subtitle: "",
+    tasks: [
+      {
+        title: "Jan Doe als opleidingsdirecteur, 14 mei 2024, 16:38"
+      }
+    ],
+    completed: !0
+  },
+  {
+    title: "Concept ingediend",
+    type: "submitted",
+    reason: "",
+    subtitle: "",
+    tasks: [
+      {
+        title: "John Doe, 14 mei 2024, 16:37"
+      }
+    ],
+    completed: !0
+  },
+  {
+    title: "Aangemaakt",
+    type: "draft",
+    reason: "ongeldig door afwijzing",
+    subtitle: "",
+    tasks: [
+      {
+        title: "Glass jaarkopie, 14 mei 2024, 16:35"
+      }
+    ],
+    completed: !0
+  }
+];
+export {
+  e as MOCK_TIMELINE_ITEM
+};
+//# sourceMappingURL=mockTimelineItem.js.map

package/dist/components/Timeline/mockTimelineItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mockTimelineItem.js","sources":["../../../src/components/Timeline/mockTimelineItem.ts"],"sourcesContent":["export const MOCK_TIMELINE_ITEM = [\n  {\n    title: 'Actief',\n    type: 'active',\n    completed: false,\n    reason: '',\n    subtitle: '',\n    tasks: [],\n  },\n  {\n    title: 'Verificatie',\n    type: 'submitted',\n    reason: '',\n    subtitle: '3 openstaande verificatietaken',\n    tasks: [\n      {\n        title: 'Vakgegevens te verifiëren door',\n        assignee: 'Opleidingsdirecteur',\n      },\n      {\n        title: 'Vakgegevens te verifiëren door',\n        assignee: 'Opleidingscoördinator',\n      },\n      {\n        title: 'Vakgegevens te verifiëren door',\n        assignee: 'Studiegidsredacteur',\n      },\n    ],\n    completed: false,\n  },\n  {\n    title: 'Concept',\n    type: 'draft',\n    reason: '',\n    subtitle: '',\n    tasks: [\n      {\n        title: 'Vakgegevens opnieuw in te dienen door',\n        assignee: 'Vakcoördinator',\n      },\n    ],\n    completed: true,\n  },\n  {\n    title: 'Vakgegevens afgewezen',\n    type: 'rejected',\n    tasks: [\n      {\n        title: 'Afwijsreden: gegevens mbt de aanbiedingen kloppen nog niet.',\n        assignee: 'Jane Doe als opleidingscoördinator, 14 mei 2024, 16:39',\n      },\n    ],\n    completed: true,\n  },\n  {\n    title: 'Geverifieerd 1 van 3',\n    type: 'verified',\n    reason: 'ongeldig door afwijzing',\n    subtitle: '',\n    tasks: [\n      {\n        title: 'Jan Doe als opleidingsdirecteur, 14 mei 2024, 16:38',\n      },\n    ],\n    completed: true,\n  },\n  {\n    title: 'Concept ingediend',\n    type: 'submitted',\n    reason: '',\n    subtitle: '',\n    tasks: [\n      {\n        title: 'John Doe, 14 mei 2024, 16:37',\n      },\n    ],\n    completed: true,\n  },\n  {\n    title: 'Aangemaakt',\n    type: 'draft',\n    reason: 'ongeldig door afwijzing',\n    subtitle: '',\n    tasks: [\n      {\n        title: 'Glass jaarkopie, 14 mei 2024, 16:35',\n      },\n    ],\n    completed: true,\n  },\n];\n"],"names":["MOCK_TIMELINE_ITEM"],"mappings":"AAAO,MAAMA,IAAqB;AAAA,EAChC;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO,CAAA;AAAA,EACT;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,MACA;AAAA,QACE,OAAO;AAAA,QACP,UAAU;AAAA,MACZ;AAAA,MACA;AAAA,QACE,OAAO;AAAA,QACP,UAAU;AAAA,MAAA;AAAA,IAEd;AAAA,IACA,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,QACP,UAAU;AAAA,MAAA;AAAA,IAEd;AAAA,IACA,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,QACP,UAAU;AAAA,MAAA;AAAA,IAEd;AAAA,IACA,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IACA,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IACA,WAAW;AAAA,EACb;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,OAAO;AAAA,MACL;AAAA,QACE,OAAO;AAAA,MAAA;AAAA,IAEX;AAAA,IACA,WAAW;AAAA,EAAA;AAEf;"}

package/dist/components/VarIndicator/VarIndicator.js

@@ -1,20 +1,20 @@
-import { jsxs as d, jsx as a } from "react/jsx-runtime";
+import { jsxs as l, jsx as a } from "react/jsx-runtime";
 import { c as s } from "../../clsx-OuTLNxxd.js";
 import { Icon as c } from "../Icon/Icon.js";
 import '../../assets/VarIndicator.css';const i = {
-  "var-indicator__container": "_var-indicator__container_1840l_38",
-  "var-indicator__container--draft": "_var-indicator__container--draft_1840l_58",
-  "var-indicator__container--rejected": "_var-indicator__container--rejected_1840l_59",
-  "var-indicator__container--submitted": "_var-indicator__container--submitted_1840l_71",
-  "var-indicator__container--active": "_var-indicator__container--active_1840l_82",
-  "var-indicator__label": "_var-indicator__label_1840l_93",
-  "var-indicator__step-container": "_var-indicator__step-container_1840l_104"
+  "var-indicator__container": "_var-indicator__container_1bf94_40",
+  "var-indicator__container--draft": "_var-indicator__container--draft_1bf94_59",
+  "var-indicator__container--rejected": "_var-indicator__container--rejected_1bf94_60",
+  "var-indicator__container--submitted": "_var-indicator__container--submitted_1bf94_72",
+  "var-indicator__container--active": "_var-indicator__container--active_1bf94_83",
+  "var-indicator__label": "_var-indicator__label_1bf94_94",
+  "var-indicator__step-container": "_var-indicator__step-container_1bf94_105"
 }, v = {
   DRAFT: "CircleLarge",
   REJECTED: "CircleLarge",
   SUBMITTED: "CircleLargeDotted",
   ACTIVE: "SignalActive"
-}, E = ({ label: t, variant: r = "DRAFT", maxSteps: n, currentStep: e = 1, onClick: o }) => /* @__PURE__ */ d(
+}, C = ({ label: t, variant: r = "DRAFT", maxSteps: n, currentStep: e = 1, onClick: o }) => /* @__PURE__ */ l(
   "button",
   {
     className: s(i["var-indicator__container"], i[`var-indicator__container--${r.toLowerCase()}`]),
@@ -22,11 +22,11 @@ import '../../assets/VarIndicator.css';const i = {
     children: [
       /* @__PURE__ */ a(c, { name: v[r], size: 16 }),
       /* @__PURE__ */ a("span", { className: i["var-indicator__label"], children: t[`${r}`] }),
-      n && n > 0 && r === "SUBMITTED" ? Array.from({ length: n }, (_, l) => l + 1).map((_) => /* @__PURE__ */ a("div", { className: i["var-indicator__step-container"], children: /* @__PURE__ */ a(c, { name: _ <= e ? "CircleSmallFilled" : "CircleSmall" }) }, _)) : null
+      n && n > 0 && r === "SUBMITTED" ? Array.from({ length: n }, (_, d) => d + 1).map((_) => /* @__PURE__ */ a("div", { className: i["var-indicator__step-container"], children: /* @__PURE__ */ a(c, { name: _ <= e ? "CircleSmallFilled" : "CircleSmall" }) }, _)) : null
     ]
   }
 );
 export {
-  E as VarIndicator
+  C as VarIndicator
 };
 //# sourceMappingURL=VarIndicator.js.map

package/dist/components/VarIndicator/VarIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"VarIndicator.js","sources":["../../../src/components/VarIndicator/VarIndicator.tsx"],"sourcesContent":["import clsx from 'clsx';\r\n\r\nimport type { IconProps } from 'components/Icon';\r\n\r\nimport styles from './VarIndicator.module.css';\r\n\r\nimport { Icon } from 'components/Icon';\r\n\r\nexport type StatusType = 'DRAFT' | 'REJECTED' | 'SUBMITTED' | 'ACTIVE';\r\n\r\nexport interface VarIndicatorProps {\r\n  label: Record<StatusType, string>;\r\n  variant?: StatusType;\r\n  maxSteps?: number;\r\n  currentStep?: number;\r\n  onClick?: () => void;\r\n}\r\n\r\nconst ICON_NAMES = {\r\n  DRAFT: 'CircleLarge',\r\n  REJECTED: 'CircleLarge',\r\n  SUBMITTED: 'CircleLargeDotted',\r\n  ACTIVE: 'SignalActive',\r\n};\r\n\r\nexport const VarIndicator = ({ label, variant = 'DRAFT', maxSteps, currentStep = 1, onClick }: VarIndicatorProps) => (\r\n  <button\r\n    className={clsx(styles['var-indicator__container'], styles[`var-indicator__container--${variant.toLowerCase()}`])}\r\n    onClick={onClick}\r\n  >\r\n    <Icon name={ICON_NAMES[variant] as IconProps['name']} size={16} />\r\n    <span className={styles['var-indicator__label']}>{label[`${variant}`]}</span>\r\n    {maxSteps && maxSteps > 0 && variant === 'SUBMITTED'\r\n      ? Array.from({ length: maxSteps }, (_, idx) => idx + 1).map((step) => (\r\n          <div key={step} className={styles['var-indicator__step-container']}>\r\n            <Icon name={step <= currentStep ? 'CircleSmallFilled' : 'CircleSmall'} />\r\n          </div>\r\n        ))\r\n      : null}\r\n  </button>\r\n);\r\n"],"names":["ICON_NAMES","VarIndicator","label","variant","maxSteps","currentStep","onClick","jsxs","clsx","styles","jsx","Icon","idx","step"],"mappings":";;;;;;;;;;;GAkBMA,IAAa;AAAA,EACjB,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV,GAEaC,IAAe,CAAC,EAAE,OAAAC,GAAO,SAAAC,IAAU,SAAS,UAAAC,GAAU,aAAAC,IAAc,GAAG,SAAAC,EAAA,MAClF,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAKC,EAAO,0BAA0B,GAAGA,EAAO,6BAA6BN,EAAQ,YAAa,CAAA,EAAE,CAAC;AAAA,IAChH,SAAAG;AAAA,IAEA,UAAA;AAAA,MAAA,gBAAAI,EAACC,KAAK,MAAMX,EAAWG,CAAO,GAAwB,MAAM,IAAI;AAAA,MAChE,gBAAAO,EAAC,QAAK,EAAA,WAAWD,EAAO,sBAAsB,GAAI,UAAMP,EAAA,GAAGC,CAAO,EAAE,EAAE,CAAA;AAAA,MACrEC,KAAYA,IAAW,KAAKD,MAAY,cACrC,MAAM,KAAK,EAAE,QAAQC,KAAY,CAAC,GAAGQ,MAAQA,IAAM,CAAC,EAAE,IAAI,CAACC,wBACxD,OAAe,EAAA,WAAWJ,EAAO,+BAA+B,GAC/D,UAAC,gBAAAC,EAAAC,GAAA,EAAK,MAAME,KAAQR,IAAc,sBAAsB,cAAA,CAAe,EAD/D,GAAAQ,CAEV,CACD,IACD;AAAA,IAAA;AAAA,EAAA;AACN;"}
+{"version":3,"file":"VarIndicator.js","sources":["../../../src/components/VarIndicator/VarIndicator.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport type { IconProps } from 'components/Icon';\n\nimport styles from './VarIndicator.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport type StatusType = 'DRAFT' | 'REJECTED' | 'SUBMITTED' | 'ACTIVE';\n\nexport interface VarIndicatorProps {\n  label: Record<StatusType, string>;\n  variant?: StatusType;\n  maxSteps?: number;\n  currentStep?: number;\n  onClick?: () => void;\n}\n\nconst ICON_NAMES = {\n  DRAFT: 'CircleLarge',\n  REJECTED: 'CircleLarge',\n  SUBMITTED: 'CircleLargeDotted',\n  ACTIVE: 'SignalActive',\n};\n\nexport const VarIndicator = ({ label, variant = 'DRAFT', maxSteps, currentStep = 1, onClick }: VarIndicatorProps) => (\n  <button\n    className={clsx(styles['var-indicator__container'], styles[`var-indicator__container--${variant.toLowerCase()}`])}\n    onClick={onClick}\n  >\n    <Icon name={ICON_NAMES[variant] as IconProps['name']} size={16} />\n    <span className={styles['var-indicator__label']}>{label[`${variant}`]}</span>\n    {maxSteps && maxSteps > 0 && variant === 'SUBMITTED'\n      ? Array.from({ length: maxSteps }, (_, idx) => idx + 1).map((step) => (\n          <div key={step} className={styles['var-indicator__step-container']}>\n            <Icon name={step <= currentStep ? 'CircleSmallFilled' : 'CircleSmall'} />\n          </div>\n        ))\n      : null}\n  </button>\n);\n"],"names":["ICON_NAMES","VarIndicator","label","variant","maxSteps","currentStep","onClick","jsxs","clsx","styles","jsx","Icon","idx","step"],"mappings":";;;;;;;;;;;GAkBMA,IAAa;AAAA,EACjB,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV,GAEaC,IAAe,CAAC,EAAE,OAAAC,GAAO,SAAAC,IAAU,SAAS,UAAAC,GAAU,aAAAC,IAAc,GAAG,SAAAC,EAAA,MAClF,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAKC,EAAO,0BAA0B,GAAGA,EAAO,6BAA6BN,EAAQ,YAAa,CAAA,EAAE,CAAC;AAAA,IAChH,SAAAG;AAAA,IAEA,UAAA;AAAA,MAAA,gBAAAI,EAACC,KAAK,MAAMX,EAAWG,CAAO,GAAwB,MAAM,IAAI;AAAA,MAChE,gBAAAO,EAAC,QAAK,EAAA,WAAWD,EAAO,sBAAsB,GAAI,UAAMP,EAAA,GAAGC,CAAO,EAAE,EAAE,CAAA;AAAA,MACrEC,KAAYA,IAAW,KAAKD,MAAY,cACrC,MAAM,KAAK,EAAE,QAAQC,KAAY,CAAC,GAAGQ,MAAQA,IAAM,CAAC,EAAE,IAAI,CAACC,wBACxD,OAAe,EAAA,WAAWJ,EAAO,+BAA+B,GAC/D,UAAC,gBAAAC,EAAAC,GAAA,EAAK,MAAME,KAAQR,IAAc,sBAAsB,cAAA,CAAe,EAD/D,GAAAQ,CAEV,CACD,IACD;AAAA,IAAA;AAAA,EAAA;AACN;"}

package/dist/components/VarIndicator/VarIndicator.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"VarIndicator.stories.js","sources":["../../../src/components/VarIndicator/VarIndicator.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\r\n\r\nimport type { Meta, StoryFn } from '@storybook/react';\r\nimport type { VarIndicatorProps } from './VarIndicator';\r\n\r\nimport { VarIndicator } from './VarIndicator';\r\n\r\nconst LABELS = {\r\n  DRAFT: 'Concept',\r\n  REJECTED: 'Concept',\r\n  SUBMITTED: 'Verificatie',\r\n  ACTIVE: 'Actief',\r\n};\r\n\r\nconst codeString =\r\n  '<VarIndicator label={[string]: [string]} maxSteps={number} currentStep={number} onClick={() => void} />';\r\n\r\n// eslint-disable-next-line import/no-default-export\r\nexport default {\r\n  title: 'Atoms/VarIndicator',\r\n  component: VarIndicator,\r\n  argTypes: {},\r\n  parameters: {\r\n    inspectComponent: VarIndicator,\r\n    codeString: codeString,\r\n  },\r\n} as Meta<VarIndicatorProps>;\r\n\r\nconst Template: StoryFn<VarIndicatorProps> = (args) => <VarIndicator {...args} />;\r\n\r\nconst defaultArgs: Partial<VarIndicatorProps> = {\r\n  label: LABELS,\r\n  maxSteps: 3,\r\n  currentStep: 2,\r\n  onClick: fn(),\r\n};\r\n\r\nexport const VarIndicatorExample = Template.bind({});\r\nVarIndicatorExample.args = {\r\n  ...defaultArgs,\r\n};\r\n"],"names":["LABELS","codeString","VarIndicator_stories","VarIndicator","Template","args","jsx","defaultArgs","fn","VarIndicatorExample"],"mappings":";;;AAOA,MAAMA,IAAS;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV,GAEMC,IACJ,2GAGaC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU,CAAC;AAAA,EACX,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAuC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAc,GAAGE,GAAM,GAEzEE,IAA0C;AAAA,EAC9C,OAAOP;AAAA,EACP,UAAU;AAAA,EACV,aAAa;AAAA,EACb,SAASQ,EAAG;AACd,GAEaC,IAAsBL,EAAS,KAAK,CAAE,CAAA;AACnDK,EAAoB,OAAO;AAAA,EACzB,GAAGF;AACL;"}
+{"version":3,"file":"VarIndicator.stories.js","sources":["../../../src/components/VarIndicator/VarIndicator.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { VarIndicatorProps } from './VarIndicator';\n\nimport { VarIndicator } from './VarIndicator';\n\nconst LABELS = {\n  DRAFT: 'Concept',\n  REJECTED: 'Concept',\n  SUBMITTED: 'Verificatie',\n  ACTIVE: 'Actief',\n};\n\nconst codeString =\n  '<VarIndicator label={[string]: [string]} maxSteps={number} currentStep={number} onClick={() => void} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Atoms/VarIndicator',\n  component: VarIndicator,\n  argTypes: {},\n  parameters: {\n    inspectComponent: VarIndicator,\n    codeString: codeString,\n  },\n} as Meta<VarIndicatorProps>;\n\nconst Template: StoryFn<VarIndicatorProps> = (args) => <VarIndicator {...args} />;\n\nconst defaultArgs: Partial<VarIndicatorProps> = {\n  label: LABELS,\n  maxSteps: 3,\n  currentStep: 2,\n  onClick: fn(),\n};\n\nexport const VarIndicatorExample = Template.bind({});\nVarIndicatorExample.args = {\n  ...defaultArgs,\n};\n"],"names":["LABELS","codeString","VarIndicator_stories","VarIndicator","Template","args","jsx","defaultArgs","fn","VarIndicatorExample"],"mappings":";;;AAOA,MAAMA,IAAS;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV,GAEMC,IACJ,2GAGaC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU,CAAC;AAAA,EACX,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAuC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAc,GAAGE,GAAM,GAEzEE,IAA0C;AAAA,EAC9C,OAAOP;AAAA,EACP,UAAU;AAAA,EACV,aAAa;AAAA,EACb,SAASQ,EAAG;AACd,GAEaC,IAAsBL,EAAS,KAAK,CAAE,CAAA;AACnDK,EAAoB,OAAO;AAAA,EACzB,GAAGF;AACL;"}

package/dist/components/VarIndicator/VarIndicator.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"VarIndicator.test.js","sources":["../../../src/components/VarIndicator/VarIndicator.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-magic-numbers */\r\nimport '@testing-library/jest-dom';\r\nimport { render, screen, waitFor } from '@testing-library/react';\r\nimport userEvent from '@testing-library/user-event';\r\nimport { useState } from 'react';\r\n\r\nimport { VarIndicator } from './VarIndicator';\r\n\r\nconst LABELS = {\r\n  DRAFT: 'Concept',\r\n  REJECTED: 'Concept',\r\n  SUBMITTED: 'Verificatie',\r\n  ACTIVE: 'Actief',\r\n};\r\n\r\njest.mock('components/Icon', () => ({\r\n  Icon: ({ name }: { name: string }) => <svg data-testid={name} />,\r\n}));\r\n\r\nconst TestWrapper = () => {\r\n  const [currentStep, setCurrentStep] = useState(1);\r\n  return (\r\n    // When clicked the onClick callback updates currentStep from 1 to 2.\r\n    <VarIndicator\r\n      label={LABELS}\r\n      variant=\"SUBMITTED\"\r\n      maxSteps={3}\r\n      currentStep={currentStep}\r\n      onClick={() => setCurrentStep(2)}\r\n    />\r\n  );\r\n};\r\n\r\ndescribe('VarIndicator', () => {\r\n  const onClickSpy = jest.fn();\r\n\r\n  beforeEach(() => {\r\n    onClickSpy.mockClear();\r\n  });\r\n\r\n  it('should render Concept (DRAFT)', () => {\r\n    render(<VarIndicator label={LABELS} variant=\"DRAFT\" />);\r\n    expect(screen.getByText('Concept')).toBeInTheDocument();\r\n  });\r\n\r\n  it('should render Concept (REJECTED)', () => {\r\n    render(<VarIndicator label={LABELS} variant=\"REJECTED\" />);\r\n    expect(screen.getByText('Concept')).toBeInTheDocument();\r\n  });\r\n\r\n  it('should render Concept (ACTIVE)', () => {\r\n    render(<VarIndicator label={LABELS} variant=\"ACTIVE\" />);\r\n    expect(screen.getByText('Actief')).toBeInTheDocument();\r\n  });\r\n\r\n  it('should render dots (SUBMITTED)', () => {\r\n    render(<VarIndicator label={LABELS} variant=\"SUBMITTED\" maxSteps={3} currentStep={0} />);\r\n    expect(screen.getByText('Verificatie')).toBeInTheDocument();\r\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(3);\r\n    expect(screen.queryByTestId('CircleSmallFilled')).not.toBeInTheDocument();\r\n  });\r\n\r\n  it('should render filled dots when currentStep != 0 (SUBMITTED)', () => {\r\n    render(<VarIndicator label={LABELS} variant=\"SUBMITTED\" maxSteps={3} currentStep={1} onClick={onClickSpy} />);\r\n    const verificationButton = screen.getByText('Verificatie');\r\n    expect(verificationButton).toBeInTheDocument();\r\n    expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(1);\r\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(2);\r\n  });\r\n\r\n  it('should render filled dots currentStep is updated (SUBMITTED)', async () => {\r\n    render(<TestWrapper />);\r\n    expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(1);\r\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(2);\r\n    const verificationButton = screen.getByText('Verificatie');\r\n    await userEvent.click(verificationButton);\r\n    await waitFor(() => {\r\n      expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(2);\r\n    });\r\n    await waitFor(() => {\r\n      expect(screen.getAllByTestId('CircleSmall')).toHaveLength(1);\r\n    });\r\n  });\r\n});\r\n"],"names":["LABELS","name","jsx","TestWrapper","currentStep","setCurrentStep","useState","VarIndicator","onClickSpy","render","screen","verificationButton","userEvent","waitFor"],"mappings":";;;;;;AAQA,MAAMA,IAAS;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV;AAEA,KAAK,KAAK,mBAAmB,OAAO;AAAA,EAClC,MAAM,CAAC,EAAE,MAAAC,QAA8B,gBAAAC,EAAA,OAAA,EAAI,eAAaD,EAAM,CAAA;AAChE,EAAE;AAEF,MAAME,IAAc,MAAM;AACxB,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,CAAC;AAChD;AAAA;AAAA,IAEE,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,OAAOP;AAAA,QACP,SAAQ;AAAA,QACR,UAAU;AAAA,QACV,aAAAI;AAAA,QACA,SAAS,MAAMC,EAAe,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA;AAGrC;AAEA,SAAS,gBAAgB,MAAM;AACvB,QAAAG,IAAa,KAAK,GAAG;AAE3B,aAAW,MAAM;AACf,IAAAA,EAAW,UAAU;AAAA,EAAA,CACtB,GAED,GAAG,iCAAiC,MAAM;AACxC,IAAAC,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,SAAQ,CAAE,GACtD,OAAOU,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACvD,GAED,GAAG,oCAAoC,MAAM;AAC3C,IAAAD,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,YAAW,CAAE,GACzD,OAAOU,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACvD,GAED,GAAG,kCAAkC,MAAM;AACzC,IAAAD,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,UAAS,CAAE,GACvD,OAAOU,EAAO,UAAU,QAAQ,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACtD,GAED,GAAG,kCAAkC,MAAM;AAClC,IAAAD,EAAA,gBAAAP,EAACK,GAAa,EAAA,OAAOP,GAAQ,SAAQ,aAAY,UAAU,GAAG,aAAa,EAAG,CAAA,CAAE,GACvF,OAAOU,EAAO,UAAU,aAAa,CAAC,EAAE,kBAAkB,GAC1D,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC,GAC3D,OAAOA,EAAO,cAAc,mBAAmB,CAAC,EAAE,IAAI,kBAAkB;AAAA,EAAA,CACzE,GAED,GAAG,+DAA+D,MAAM;AACtE,IAAAD,EAAQ,gBAAAP,EAAAK,GAAA,EAAa,OAAOP,GAAQ,SAAQ,aAAY,UAAU,GAAG,aAAa,GAAG,SAASQ,EAAY,CAAA,CAAE;AACtG,UAAAG,IAAqBD,EAAO,UAAU,aAAa;AAClD,WAAAC,CAAkB,EAAE,kBAAkB,GAC7C,OAAOD,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC,GACjE,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AAAA,EAAA,CAC5D,GAED,GAAG,gEAAgE,YAAY;AACtE,IAAAD,EAAA,gBAAAP,EAACC,KAAY,CAAE,GACtB,OAAOO,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC,GACjE,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AACrD,UAAAC,IAAqBD,EAAO,UAAU,aAAa;AACnD,UAAAE,EAAU,MAAMD,CAAkB,GACxC,MAAME,EAAQ,MAAM;AAClB,aAAOH,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC;AAAA,IAAA,CAClE,GACD,MAAMG,EAAQ,MAAM;AAClB,aAAOH,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AAAA,IAAA,CAC5D;AAAA,EAAA,CACF;AACH,CAAC;"}
+{"version":3,"file":"VarIndicator.test.js","sources":["../../../src/components/VarIndicator/VarIndicator.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-magic-numbers */\nimport '@testing-library/jest-dom';\nimport { render, screen, waitFor } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { useState } from 'react';\n\nimport { VarIndicator } from './VarIndicator';\n\nconst LABELS = {\n  DRAFT: 'Concept',\n  REJECTED: 'Concept',\n  SUBMITTED: 'Verificatie',\n  ACTIVE: 'Actief',\n};\n\njest.mock('components/Icon', () => ({\n  Icon: ({ name }: { name: string }) => <svg data-testid={name} />,\n}));\n\nconst TestWrapper = () => {\n  const [currentStep, setCurrentStep] = useState(1);\n  return (\n    // When clicked the onClick callback updates currentStep from 1 to 2.\n    <VarIndicator\n      label={LABELS}\n      variant=\"SUBMITTED\"\n      maxSteps={3}\n      currentStep={currentStep}\n      onClick={() => setCurrentStep(2)}\n    />\n  );\n};\n\ndescribe('VarIndicator', () => {\n  const onClickSpy = jest.fn();\n\n  beforeEach(() => {\n    onClickSpy.mockClear();\n  });\n\n  it('should render Concept (DRAFT)', () => {\n    render(<VarIndicator label={LABELS} variant=\"DRAFT\" />);\n    expect(screen.getByText('Concept')).toBeInTheDocument();\n  });\n\n  it('should render Concept (REJECTED)', () => {\n    render(<VarIndicator label={LABELS} variant=\"REJECTED\" />);\n    expect(screen.getByText('Concept')).toBeInTheDocument();\n  });\n\n  it('should render Concept (ACTIVE)', () => {\n    render(<VarIndicator label={LABELS} variant=\"ACTIVE\" />);\n    expect(screen.getByText('Actief')).toBeInTheDocument();\n  });\n\n  it('should render dots (SUBMITTED)', () => {\n    render(<VarIndicator label={LABELS} variant=\"SUBMITTED\" maxSteps={3} currentStep={0} />);\n    expect(screen.getByText('Verificatie')).toBeInTheDocument();\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(3);\n    expect(screen.queryByTestId('CircleSmallFilled')).not.toBeInTheDocument();\n  });\n\n  it('should render filled dots when currentStep != 0 (SUBMITTED)', () => {\n    render(<VarIndicator label={LABELS} variant=\"SUBMITTED\" maxSteps={3} currentStep={1} onClick={onClickSpy} />);\n    const verificationButton = screen.getByText('Verificatie');\n    expect(verificationButton).toBeInTheDocument();\n    expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(1);\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(2);\n  });\n\n  it('should render filled dots currentStep is updated (SUBMITTED)', async () => {\n    render(<TestWrapper />);\n    expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(1);\n    expect(screen.getAllByTestId('CircleSmall')).toHaveLength(2);\n    const verificationButton = screen.getByText('Verificatie');\n    await userEvent.click(verificationButton);\n    await waitFor(() => {\n      expect(screen.getAllByTestId('CircleSmallFilled')).toHaveLength(2);\n    });\n    await waitFor(() => {\n      expect(screen.getAllByTestId('CircleSmall')).toHaveLength(1);\n    });\n  });\n});\n"],"names":["LABELS","name","jsx","TestWrapper","currentStep","setCurrentStep","useState","VarIndicator","onClickSpy","render","screen","verificationButton","userEvent","waitFor"],"mappings":";;;;;;AAQA,MAAMA,IAAS;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,EACV,WAAW;AAAA,EACX,QAAQ;AACV;AAEA,KAAK,KAAK,mBAAmB,OAAO;AAAA,EAClC,MAAM,CAAC,EAAE,MAAAC,QAA8B,gBAAAC,EAAA,OAAA,EAAI,eAAaD,EAAM,CAAA;AAChE,EAAE;AAEF,MAAME,IAAc,MAAM;AACxB,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,CAAC;AAChD;AAAA;AAAA,IAEE,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,OAAOP;AAAA,QACP,SAAQ;AAAA,QACR,UAAU;AAAA,QACV,aAAAI;AAAA,QACA,SAAS,MAAMC,EAAe,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA;AAGrC;AAEA,SAAS,gBAAgB,MAAM;AACvB,QAAAG,IAAa,KAAK,GAAG;AAE3B,aAAW,MAAM;AACf,IAAAA,EAAW,UAAU;AAAA,EAAA,CACtB,GAED,GAAG,iCAAiC,MAAM;AACxC,IAAAC,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,SAAQ,CAAE,GACtD,OAAOU,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACvD,GAED,GAAG,oCAAoC,MAAM;AAC3C,IAAAD,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,YAAW,CAAE,GACzD,OAAOU,EAAO,UAAU,SAAS,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACvD,GAED,GAAG,kCAAkC,MAAM;AACzC,IAAAD,oBAAQF,GAAa,EAAA,OAAOP,GAAQ,SAAQ,UAAS,CAAE,GACvD,OAAOU,EAAO,UAAU,QAAQ,CAAC,EAAE,kBAAkB;AAAA,EAAA,CACtD,GAED,GAAG,kCAAkC,MAAM;AAClC,IAAAD,EAAA,gBAAAP,EAACK,GAAa,EAAA,OAAOP,GAAQ,SAAQ,aAAY,UAAU,GAAG,aAAa,EAAG,CAAA,CAAE,GACvF,OAAOU,EAAO,UAAU,aAAa,CAAC,EAAE,kBAAkB,GAC1D,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC,GAC3D,OAAOA,EAAO,cAAc,mBAAmB,CAAC,EAAE,IAAI,kBAAkB;AAAA,EAAA,CACzE,GAED,GAAG,+DAA+D,MAAM;AACtE,IAAAD,EAAQ,gBAAAP,EAAAK,GAAA,EAAa,OAAOP,GAAQ,SAAQ,aAAY,UAAU,GAAG,aAAa,GAAG,SAASQ,EAAY,CAAA,CAAE;AACtG,UAAAG,IAAqBD,EAAO,UAAU,aAAa;AAClD,WAAAC,CAAkB,EAAE,kBAAkB,GAC7C,OAAOD,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC,GACjE,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AAAA,EAAA,CAC5D,GAED,GAAG,gEAAgE,YAAY;AACtE,IAAAD,EAAA,gBAAAP,EAACC,KAAY,CAAE,GACtB,OAAOO,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC,GACjE,OAAOA,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AACrD,UAAAC,IAAqBD,EAAO,UAAU,aAAa;AACnD,UAAAE,EAAU,MAAMD,CAAkB,GACxC,MAAME,EAAQ,MAAM;AAClB,aAAOH,EAAO,eAAe,mBAAmB,CAAC,EAAE,aAAa,CAAC;AAAA,IAAA,CAClE,GACD,MAAMG,EAAQ,MAAM;AAClB,aAAOH,EAAO,eAAe,aAAa,CAAC,EAAE,aAAa,CAAC;AAAA,IAAA,CAC5D;AAAA,EAAA,CACF;AACH,CAAC;"}

package/dist/components/index.d.ts

@@ -46,6 +46,7 @@ export * from './SelectListbox/SelectProvider';
 export * from './Sortable';
 export * from './Spinner';
 export * from './StatusPill';
+export * from './Timeline';
 export * from './ToggleSwitch';
 export * from './Tooltip';
 export * from './VarIndicator';

package/dist/components/index.js

@@ -1,7 +1,7 @@
 import { Accordion as t } from "./Accordion/Accordion.js";
 import { AccordionCard as p } from "./AccordionCard/AccordionCard.js";
-import { ActionList as m } from "./ActionList/ActionList.js";
-import { AppStatusBar as a } from "./AppStatusBar/AppStatusBar.js";
+import { ActionList as x } from "./ActionList/ActionList.js";
+import { AppStatusBar as i } from "./AppStatusBar/AppStatusBar.js";
 import { Attention as n } from "./Attention/Attention.js";
 import { Backdrop as c } from "./Backdrop/Backdrop.js";
 import { ButtonGroup as u } from "./ButtonGroup/ButtonGroup.js";
@@ -14,7 +14,7 @@ import { CheckboxButton as h } from "./CheckboxButton/CheckboxButton.js";
 import { CheckboxButtonBar as y } from "./CheckboxButtonBar/CheckboxButtonBar.js";
 import { CheckboxTree as D } from "./CheckboxTree/CheckboxTree.js";
 import { Chip as v } from "./Chip/Chip.js";
-import { Drawer as O } from "./Drawer/Drawer.js";
+import { Drawer as w } from "./Drawer/Drawer.js";
 import { EmptyStateDataDisplay as E } from "./EmptyStateDataDisplay/EmptyStateDataDisplay.js";
 import { FeedbackBox as H } from "./FeedbackBox/FeedbackBox.js";
 import { FieldHint as N } from "./FieldHint/FieldHint.js";
@@ -27,12 +27,12 @@ import { Icon as _ } from "./Icon/Icon.js";
 import { IconButton as oo } from "./IconButton/IconButton.js";
 import { InfoMessage as to } from "./InfoMessage/InfoMessage.js";
 import { Input as po } from "./Input/Input.js";
-import { InputField as mo } from "./InputField/InputField.js";
-import { Label as ao } from "./Label/Label.js";
+import { InputField as xo } from "./InputField/InputField.js";
+import { Label as io } from "./Label/Label.js";
 import { MenuLink as no } from "./MenuLink/MenuLink.js";
 import { MetaDataList as co } from "./MetaDataList/MetaDataList.js";
 import { ModalDialog as so } from "./ModalDialog/ModalDialog.js";
-import { M as So } from "../TablePlugin-CFD5PSMc.js";
+import { M as So } from "../TablePlugin-o1MveXq2.js";
 import { OverlayCloseButton as bo } from "./OverlayCloseButton/OverlayCloseButton.js";
 import { OverlayStepBar as Fo } from "./OverlayStepBar/OverlayStepBar.js";
 import { PageOverlay as Lo } from "./PageOverlay/PageOverlay.js";
@@ -40,22 +40,23 @@ import { Periods as go } from "./Periods/Periods.js";
 import { PeriodSelector as Po } from "./PeriodSelector/PeriodSelector.js";
 import { ProgrammeCard as Ao } from "./ProgrammeCard/ProgrammeCard.js";
 import { RadioButton as Ro } from "./RadioButton/RadioButton.js";
-import { Repeater as wo } from "./Repeater/Repeater.js";
-import { Rte as To, RteEditor as Eo } from "./RteEditor/RteEditor.js";
+import { Repeater as To } from "./Repeater/Repeater.js";
+import { Rte as Oo, RteEditor as Eo } from "./RteEditor/RteEditor.js";
 import { SectionNotification as Ho } from "./SectionNotification/SectionNotification.js";
 import { SelectListbox as No } from "./SelectListbox/SelectListbox.js";
 import { SelectProvider as jo, useSelect as qo } from "./SelectListbox/SelectProvider.js";
 import { Sortable as Ko } from "./Sortable/Sortable.js";
 import { Spinner as Uo } from "./Spinner/Spinner.js";
 import { StatusPill as Xo } from "./StatusPill/StatusPill.js";
-import { ToggleSwitch as Zo } from "./ToggleSwitch/ToggleSwitch.js";
-import { Tooltip as $o } from "./Tooltip/Tooltip.js";
-import { VarIndicator as rr } from "./VarIndicator/VarIndicator.js";
+import { Timeline as Zo } from "./Timeline/Timeline.js";
+import { ToggleSwitch as $o } from "./ToggleSwitch/ToggleSwitch.js";
+import { Tooltip as rr } from "./Tooltip/Tooltip.js";
+import { VarIndicator as er } from "./VarIndicator/VarIndicator.js";
 export {
   t as Accordion,
   p as AccordionCard,
-  m as ActionList,
-  a as AppStatusBar,
+  x as ActionList,
+  i as AppStatusBar,
   n as Attention,
   c as Backdrop,
   B as Button,
@@ -66,7 +67,7 @@ export {
   y as CheckboxButtonBar,
   D as CheckboxTree,
   v as Chip,
-  O as Drawer,
+  w as Drawer,
   E as EmptyStateDataDisplay,
   H as FeedbackBox,
   N as FieldHint,
@@ -79,8 +80,8 @@ export {
   oo as IconButton,
   to as InfoMessage,
   po as Input,
-  mo as InputField,
-  ao as Label,
+  xo as InputField,
+  io as Label,
   C as LinkButton,
   k as MenuButton,
   no as MenuLink,
@@ -94,8 +95,8 @@ export {
   go as Periods,
   Ao as ProgrammeCard,
   Ro as RadioButton,
-  wo as Repeater,
-  To as Rte,
+  To as Repeater,
+  Oo as Rte,
   Eo as RteEditor,
   Ho as SectionNotification,
   No as SelectListbox,
@@ -103,9 +104,10 @@ export {
   Ko as Sortable,
   Uo as Spinner,
   Xo as StatusPill,
-  Zo as ToggleSwitch,
-  $o as Tooltip,
-  rr as VarIndicator,
+  Zo as Timeline,
+  $o as ToggleSwitch,
+  rr as Tooltip,
+  er as VarIndicator,
   qo as useSelect
 };
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/{helpers-C-JeRM2f.js → helpers-CtrLGKFA.js}

@@ -1,7 +1,7 @@
-import { p as _, O as y, U as x, d as F, m as G } from "./LexicalLink.prod-DgAdBBH7.js";
+import { p as _, O as y, U as x, d as F, m as G } from "./LexicalLink.prod-NMeHB9CR.js";
 import { o as M } from "./LexicalComposerContext.prod-DLlRM5wP.js";
-import { $ as H } from "./LexicalUtils.prod-CqRL6ZhZ.js";
-import { a as v, l as E, E as Q, R as j, X as T, Q as L, aA as B, O as N, d as P } from "./Lexical.prod-CoFvB6ST.js";
+import { $ as H } from "./LexicalUtils.prod-C_aSRWfh.js";
+import { a as v, l as E, E as Q, R as j, X as T, Q as L, aA as B, O as N, d as P } from "./Lexical.prod-pVkgOp1j.js";
 import { useEffect as K } from "react";
 function b(t, e = (n) => n) {
   return (n) => {
@@ -161,4 +161,4 @@ export {
   gt as v,
   at as w
 };
-//# sourceMappingURL=helpers-C-JeRM2f.js.map
+//# sourceMappingURL=helpers-CtrLGKFA.js.map