@mittwald/flow-react-components 0.2.0-alpha.5 → 0.2.0-alpha.500

package/dist/js/components/src/components/MarkdownEditor/lib/insertAtCursor.mjs

@@ -0,0 +1,153 @@
+"use client"
+/* */
+const markdownSyntax = {
+  bold: { before: "**", after: "**", toggleable: true },
+  italic: { before: "_", after: "_", toggleable: true },
+  strikeThrough: { before: "~~", after: "~~", toggleable: true },
+  quote: { before: "> " },
+  code: { before: "`", after: "`", toggleable: true },
+  link: { before: "[", after: "](https://)" },
+  unorderedList: { before: "- " },
+  orderedList: { before: "1. " }
+};
+const getLineStart = (text, pos) => {
+  const lastNewline = text.lastIndexOf("\n", pos - 1);
+  return lastNewline === -1 ? 0 : lastNewline + 1;
+};
+const getLineEnd = (text, pos) => {
+  const nextNewline = text.indexOf("\n", pos);
+  return nextNewline === -1 ? text.length : nextNewline;
+};
+const insertAtCursor = (markdown, setMarkdown, textAreaRef, type) => {
+  const textarea = textAreaRef.current;
+  if (!textarea) {
+    return;
+  }
+  const { before, after = "", toggleable = false } = markdownSyntax[type];
+  const start = textarea.selectionStart;
+  const end = textarea.selectionEnd;
+  const selectedText = markdown.substring(start, end);
+  const lines = selectedText.split("\n");
+  let newText = markdown;
+  let selectionStart = start;
+  let selectionEnd = end;
+  if (type === "code" && selectedText.includes("\n")) {
+    newText = markdown.substring(0, start) + "```\n" + selectedText + "\n```\n" + markdown.substring(end);
+    selectionStart = start + 4;
+    selectionEnd = selectionStart + selectedText.length;
+  } else if (type === "orderedList") {
+    if (selectedText) {
+      const numbered = lines.map((line, i) => `${i + 1}. ${line}`).join("\n");
+      newText = markdown.substring(0, start) + numbered + markdown.substring(end);
+      selectionStart = start;
+      selectionEnd = start + numbered.length;
+    } else {
+      const lineStart = getLineStart(markdown, start);
+      const lineEnd = getLineEnd(markdown, start);
+      const numberedLine = `1. ${markdown.substring(lineStart, lineEnd)}`;
+      newText = markdown.substring(0, lineStart) + before + markdown.substring(lineStart);
+      selectionStart = lineStart + numberedLine.length;
+      selectionEnd = selectionStart;
+    }
+  } else if (type === "unorderedList") {
+    if (selectedText) {
+      const bulleted = lines.map((line) => `${before}${line}`).join("\n");
+      newText = markdown.substring(0, start) + bulleted + markdown.substring(end);
+      selectionStart = start;
+      selectionEnd = start + bulleted.length;
+    } else {
+      const lineStart = getLineStart(markdown, start);
+      const lineEnd = getLineEnd(markdown, start);
+      const bulletedLine = `- ${markdown.substring(lineStart, lineEnd)}`;
+      newText = markdown.substring(0, lineStart) + before + markdown.substring(lineStart);
+      selectionStart = lineStart + bulletedLine.length;
+      selectionEnd = selectionStart;
+    }
+  } else if (type === "quote") {
+    if (selectedText) {
+      const quoted = lines.map((line) => `${before}${line}`).join("\n");
+      newText = markdown.substring(0, start) + quoted + markdown.substring(end);
+      selectionStart = start;
+      selectionEnd = start + quoted.length;
+    } else {
+      const quoteLine = `
+${before} `;
+      newText = markdown.substring(0, start) + quoteLine + markdown.substring(end);
+      selectionStart = start + quoteLine.length;
+      selectionEnd = selectionStart;
+    }
+  } else if (toggleable) {
+    const prefix = markdown.substring(start - before.length, start);
+    const suffix = markdown.substring(end, end + after.length);
+    const isSurrounded = prefix === before && suffix === after;
+    const isWrappedInside = selectedText.startsWith(before) && selectedText.endsWith(after);
+    if (isSurrounded) {
+      newText = markdown.substring(0, start - before.length) + selectedText + markdown.substring(end + after.length);
+      selectionStart = start - before.length;
+      selectionEnd = selectionStart + selectedText.length;
+    } else if (isWrappedInside) {
+      const unwrapped = selectedText.slice(
+        before.length,
+        selectedText.length - after.length
+      );
+      newText = markdown.substring(0, start) + unwrapped + markdown.substring(end);
+      selectionStart = start;
+      selectionEnd = start + unwrapped.length;
+    } else {
+      newText = markdown.substring(0, start) + before + selectedText + after + markdown.substring(end);
+      if (selectedText.length === 0) {
+        selectionStart = start + before.length;
+        selectionEnd = selectionStart;
+      } else {
+        selectionStart = start + before.length;
+        selectionEnd = selectionStart + selectedText.length;
+      }
+    }
+  } else if (type === "link") {
+    let linkText = "";
+    let linkUrl = "";
+    let inserted = "";
+    let cursorOffsetStart = 0;
+    const isValidUrl = (str) => {
+      try {
+        new URL(str);
+        return true;
+      } catch {
+        return false;
+      }
+    };
+    if (selectedText) {
+      if (isValidUrl(selectedText)) {
+        linkUrl = selectedText;
+        inserted = `[](${linkUrl})`;
+        cursorOffsetStart = start + 1;
+      } else {
+        linkText = selectedText;
+        inserted = `[${linkText}]()`;
+        cursorOffsetStart = start + inserted.indexOf("](") + 2;
+      }
+    } else {
+      inserted = `[](https://)`;
+      cursorOffsetStart = start + 1;
+    }
+    newText = markdown.substring(0, start) + inserted + markdown.substring(end);
+    selectionStart = selectionEnd = cursorOffsetStart;
+  } else {
+    newText = markdown.substring(0, start) + before + selectedText + after + markdown.substring(end);
+    if (selectedText.length === 0) {
+      selectionStart = start + before.length;
+      selectionEnd = selectionStart;
+    } else {
+      selectionStart = start + before.length;
+      selectionEnd = selectionStart + selectedText.length;
+    }
+  }
+  setMarkdown(newText);
+  requestAnimationFrame(() => {
+    textarea.setSelectionRange(selectionStart, selectionEnd);
+    textarea.focus();
+  });
+};
+
+export { insertAtCursor };
+//# sourceMappingURL=insertAtCursor.mjs.map

package/dist/js/components/src/components/MarkdownEditor/lib/insertAtCursor.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"insertAtCursor.mjs","sources":["../../../../../../../src/components/MarkdownEditor/lib/insertAtCursor.ts"],"sourcesContent":["import type { RefObject } from \"react\";\n\nexport type InsertType =\n  | \"bold\"\n  | \"italic\"\n  | \"strikeThrough\"\n  | \"quote\"\n  | \"code\"\n  | \"link\"\n  | \"unorderedList\"\n  | \"orderedList\";\n\nconst markdownSyntax: Record<\n  InsertType,\n  { before: string; after?: string; toggleable?: boolean }\n> = {\n  bold: { before: \"**\", after: \"**\", toggleable: true },\n  italic: { before: \"_\", after: \"_\", toggleable: true },\n  strikeThrough: { before: \"~~\", after: \"~~\", toggleable: true },\n  quote: { before: \"> \" },\n  code: { before: \"`\", after: \"`\", toggleable: true },\n  link: { before: \"[\", after: \"](https://)\" },\n  unorderedList: { before: \"- \" },\n  orderedList: { before: \"1. \" },\n};\n\nconst getLineStart = (text: string, pos: number) => {\n  const lastNewline = text.lastIndexOf(\"\\n\", pos - 1);\n  return lastNewline === -1 ? 0 : lastNewline + 1;\n};\n\nconst getLineEnd = (text: string, pos: number) => {\n  const nextNewline = text.indexOf(\"\\n\", pos);\n  return nextNewline === -1 ? text.length : nextNewline;\n};\n\nexport const insertAtCursor = (\n  markdown: string,\n  setMarkdown: (markdown: string) => void,\n  textAreaRef: RefObject<HTMLTextAreaElement | null>,\n  type: InsertType,\n) => {\n  const textarea = textAreaRef.current;\n  if (!textarea) {\n    return;\n  }\n\n  const { before, after = \"\", toggleable = false } = markdownSyntax[type];\n  const start = textarea.selectionStart;\n  const end = textarea.selectionEnd;\n  const selectedText = markdown.substring(start, end);\n  const lines = selectedText.split(\"\\n\");\n\n  let newText = markdown;\n  let selectionStart = start;\n  let selectionEnd = end;\n\n  if (type === \"code\" && selectedText.includes(\"\\n\")) {\n    newText =\n      markdown.substring(0, start) +\n      \"```\\n\" +\n      selectedText +\n      \"\\n```\\n\" +\n      markdown.substring(end);\n    selectionStart = start + 4;\n    selectionEnd = selectionStart + selectedText.length;\n  } else if (type === \"orderedList\") {\n    if (selectedText) {\n      const numbered = lines.map((line, i) => `${i + 1}. ${line}`).join(\"\\n\");\n      newText =\n        markdown.substring(0, start) + numbered + markdown.substring(end);\n      selectionStart = start;\n      selectionEnd = start + numbered.length;\n    } else {\n      const lineStart = getLineStart(markdown, start);\n      const lineEnd = getLineEnd(markdown, start);\n      const numberedLine = `1. ${markdown.substring(lineStart, lineEnd)}`;\n\n      newText =\n        markdown.substring(0, lineStart) +\n        before +\n        markdown.substring(lineStart);\n      selectionStart = lineStart + numberedLine.length;\n      selectionEnd = selectionStart;\n    }\n  } else if (type === \"unorderedList\") {\n    if (selectedText) {\n      const bulleted = lines.map((line) => `${before}${line}`).join(\"\\n\");\n      newText =\n        markdown.substring(0, start) + bulleted + markdown.substring(end);\n      selectionStart = start;\n      selectionEnd = start + bulleted.length;\n    } else {\n      const lineStart = getLineStart(markdown, start);\n      const lineEnd = getLineEnd(markdown, start);\n      const bulletedLine = `- ${markdown.substring(lineStart, lineEnd)}`;\n\n      newText =\n        markdown.substring(0, lineStart) +\n        before +\n        markdown.substring(lineStart);\n      selectionStart = lineStart + bulletedLine.length;\n      selectionEnd = selectionStart;\n    }\n  } else if (type === \"quote\") {\n    if (selectedText) {\n      const quoted = lines.map((line) => `${before}${line}`).join(\"\\n\");\n      newText = markdown.substring(0, start) + quoted + markdown.substring(end);\n      selectionStart = start;\n      selectionEnd = start + quoted.length;\n    } else {\n      const quoteLine = `\\n${before} `;\n      newText =\n        markdown.substring(0, start) + quoteLine + markdown.substring(end);\n      selectionStart = start + quoteLine.length;\n      selectionEnd = selectionStart;\n    }\n  } else if (toggleable) {\n    const prefix = markdown.substring(start - before.length, start);\n    const suffix = markdown.substring(end, end + after.length);\n    const isSurrounded = prefix === before && suffix === after;\n    const isWrappedInside =\n      selectedText.startsWith(before) && selectedText.endsWith(after);\n\n    if (isSurrounded) {\n      // Remove external wrapping (not selected)\n      newText =\n        markdown.substring(0, start - before.length) +\n        selectedText +\n        markdown.substring(end + after.length);\n      selectionStart = start - before.length;\n      selectionEnd = selectionStart + selectedText.length;\n    } else if (isWrappedInside) {\n      // Remove internal wrapping (selected)\n      const unwrapped = selectedText.slice(\n        before.length,\n        selectedText.length - after.length,\n      );\n      newText =\n        markdown.substring(0, start) + unwrapped + markdown.substring(end);\n      selectionStart = start;\n      selectionEnd = start + unwrapped.length;\n    } else {\n      // Add wrapping\n      newText =\n        markdown.substring(0, start) +\n        before +\n        selectedText +\n        after +\n        markdown.substring(end);\n\n      if (selectedText.length === 0) {\n        selectionStart = start + before.length;\n        selectionEnd = selectionStart;\n      } else {\n        selectionStart = start + before.length;\n        selectionEnd = selectionStart + selectedText.length;\n      }\n    }\n  } else if (type === \"link\") {\n    let linkText = \"\";\n    let linkUrl = \"\";\n    let inserted = \"\";\n    let cursorOffsetStart = 0;\n\n    const isValidUrl = (str: string): boolean => {\n      try {\n        new URL(str);\n        return true;\n      } catch {\n        return false;\n      }\n    };\n\n    if (selectedText) {\n      if (isValidUrl(selectedText)) {\n        linkUrl = selectedText;\n        inserted = `[](${linkUrl})`;\n        cursorOffsetStart = start + 1;\n      } else {\n        linkText = selectedText;\n        inserted = `[${linkText}]()`;\n        cursorOffsetStart = start + inserted.indexOf(\"](\") + 2;\n      }\n    } else {\n      inserted = `[](https://)`;\n      cursorOffsetStart = start + 1;\n    }\n\n    newText = markdown.substring(0, start) + inserted + markdown.substring(end);\n    selectionStart = selectionEnd = cursorOffsetStart;\n  } else {\n    // Fallback for non-toggleable, inline syntax\n    newText =\n      markdown.substring(0, start) +\n      before +\n      selectedText +\n      after +\n      markdown.substring(end);\n\n    if (selectedText.length === 0) {\n      // No text selected – place cursor between syntax\n      selectionStart = start + before.length;\n      selectionEnd = selectionStart;\n    } else {\n      // Keep selection\n      selectionStart = start + before.length;\n      selectionEnd = selectionStart + selectedText.length;\n    }\n  }\n\n  setMarkdown(newText);\n  requestAnimationFrame(() => {\n    textarea.setSelectionRange(selectionStart, selectionEnd);\n    textarea.focus();\n  });\n};\n"],"names":[],"mappings":"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"}

package/dist/js/components/src/components/MenuItem/MenuItem.mjs

@@ -0,0 +1,28 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import { createElement } from 'react';
+import * as Aria from 'react-aria-components';
+import styles from './MenuItem.module.scss.mjs';
+import clsx from 'clsx';
+import { MenuItemContent } from './components/MenuItemContent/MenuItemContent.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+
+const MenuItem = flowComponent("MenuItem", (props) => {
+  const { children, className, selectionVariant, id, ref, ...rest } = props;
+  const rootClassName = clsx(styles.menuItem, className);
+  return /* @__PURE__ */ createElement(
+    Aria.MenuItem,
+    {
+      ...rest,
+      key: id,
+      id,
+      className: rootClassName,
+      ref
+    },
+    (props2) => /* @__PURE__ */ jsx(MenuItemContent, { ...props2, selectionVariant, children })
+  );
+});
+
+export { MenuItem, MenuItem as default };
+//# sourceMappingURL=MenuItem.mjs.map

package/dist/js/components/src/components/MenuItem/MenuItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.mjs","sources":["../../../../../../src/components/MenuItem/MenuItem.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport styles from \"./MenuItem.module.scss\";\nimport clsx from \"clsx\";\nimport { MenuItemContent } from \"@/components/MenuItem/components/MenuItemContent/MenuItemContent\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\n\nexport interface MenuItemProps\n  extends Omit<Aria.MenuItemProps, \"children\">,\n    PropsWithChildren,\n    FlowComponentProps {\n  selectionVariant?: \"control\" | \"navigation\" | \"switch\";\n}\n\n/** @flr-generate all */\nexport const MenuItem = flowComponent(\"MenuItem\", (props) => {\n  const { children, className, selectionVariant, id, ref, ...rest } = props;\n  const rootClassName = clsx(styles.menuItem, className);\n\n  return (\n    <Aria.MenuItem\n      {...rest}\n      key={id}\n      id={id}\n      className={rootClassName}\n      ref={ref}\n    >\n      {(props) => (\n        <MenuItemContent {...props} selectionVariant={selectionVariant}>\n          {children}\n        </MenuItemContent>\n      )}\n    </Aria.MenuItem>\n  );\n});\n\nexport default MenuItem;\n"],"names":["props"],"mappings":";;;;;;;;AAgBO,MAAM,QAAW,GAAA,aAAA,CAAc,UAAY,EAAA,CAAC,KAAU,KAAA;AAC3D,EAAM,MAAA,EAAE,UAAU,SAAW,EAAA,gBAAA,EAAkB,IAAI,GAAK,EAAA,GAAG,MAAS,GAAA,KAAA;AACpE,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,QAAA,EAAU,SAAS,CAAA;AAErD,EACE,uBAAA,aAAA;AAAA,IAAC,IAAK,CAAA,QAAA;AAAA,IAAL;AAAA,MACE,GAAG,IAAA;AAAA,MACJ,GAAK,EAAA,EAAA;AAAA,MACL,EAAA;AAAA,MACA,SAAW,EAAA,aAAA;AAAA,MACX;AAAA,KAAA;AAAA,IAEC,CAACA,MACA,qBAAA,GAAA,CAAC,mBAAiB,GAAGA,MAAAA,EAAO,kBACzB,QACH,EAAA;AAAA,GAEJ;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/MenuItem/MenuItem.module.scss.mjs

@@ -0,0 +1,16 @@
+"use client"
+/* */
+const menuItem = "flow--menu-item";
+const icon = "flow--menu-item--icon";
+const controlIcon = "flow--menu-item--control-icon";
+const avatar = "flow--menu-item--avatar";
+const styles = {
+	menuItem: menuItem,
+	"switch": "flow--menu-item--switch",
+	icon: icon,
+	controlIcon: controlIcon,
+	avatar: avatar
+};
+
+export { avatar, controlIcon, styles as default, icon, menuItem };
+//# sourceMappingURL=MenuItem.module.scss.mjs.map

package/dist/js/components/src/components/MenuItem/MenuItem.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}

package/dist/js/components/src/components/MenuItem/components/MenuItemContent/MenuItemContent.mjs

@@ -0,0 +1,49 @@
+"use client"
+/* */
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import styles from '../../MenuItem.module.scss.mjs';
+import '../../../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../../../lib/propsContext/components/PropsContextProvider.mjs';
+import 'react';
+import '@tabler/icons-react';
+import '../../../Icon/Icon.mjs';
+import '../../../../views/IconView.mjs';
+import { IconCheckboxChecked } from '../../../Icon/components/icons/IconCheckboxChecked.mjs';
+import { IconCheckboxEmpty } from '../../../Icon/components/icons/IconCheckboxEmpty.mjs';
+import { IconRadioOff } from '../../../Icon/components/icons/IconRadioOff.mjs';
+import { IconRadioOn } from '../../../Icon/components/icons/IconRadioOn.mjs';
+import clsx from 'clsx';
+import { Switch } from '../../../Switch/Switch.mjs';
+
+const MenuItemContent = (props) => {
+  const {
+    selectionMode,
+    isSelected,
+    selectionVariant = "control",
+    children
+  } = props;
+  const propsContext = {
+    Icon: {
+      className: styles.icon
+    },
+    Avatar: {
+      className: styles.avatar
+    }
+  };
+  const controlIconPropsContext = {
+    Icon: {
+      className: clsx(styles.controlIcon, styles.icon)
+    },
+    Switch: {
+      className: clsx(styles.controlIcon, styles.switch)
+    }
+  };
+  const selectionIcon = selectionMode === "none" || selectionVariant === "navigation" ? null : selectionVariant === "switch" ? /* @__PURE__ */ jsx(Switch, { isReadOnly: true, isSelected }) : selectionMode === "single" && isSelected ? /* @__PURE__ */ jsx(IconRadioOn, {}) : selectionMode === "single" && !isSelected ? /* @__PURE__ */ jsx(IconRadioOff, {}) : selectionMode === "multiple" && isSelected ? /* @__PURE__ */ jsx(IconCheckboxChecked, {}) : /* @__PURE__ */ jsx(IconCheckboxEmpty, {});
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(PropsContextProvider, { props: controlIconPropsContext, children: selectionIcon }),
+    /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children })
+  ] });
+};
+
+export { MenuItemContent };
+//# sourceMappingURL=MenuItemContent.mjs.map

package/dist/js/components/src/components/MenuItem/components/MenuItemContent/MenuItemContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemContent.mjs","sources":["../../../../../../../../src/components/MenuItem/components/MenuItemContent/MenuItemContent.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport type * as Aria from \"react-aria-components\";\nimport styles from \"../../MenuItem.module.scss\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  IconCheckboxChecked,\n  IconCheckboxEmpty,\n  IconRadioOff,\n  IconRadioOn,\n} from \"@/components/Icon/components/icons\";\nimport clsx from \"clsx\";\nimport { Switch } from \"@/components/Switch\";\n\ninterface Props extends Aria.MenuItemRenderProps, PropsWithChildren {\n  selectionVariant?: \"control\" | \"navigation\" | \"switch\";\n}\n\nexport const MenuItemContent: FC<Props> = (props) => {\n  const {\n    selectionMode,\n    isSelected,\n    selectionVariant = \"control\",\n    children,\n  } = props;\n\n  const propsContext: PropsContext = {\n    Icon: {\n      className: styles.icon,\n    },\n    Avatar: {\n      className: styles.avatar,\n    },\n  };\n\n  const controlIconPropsContext: PropsContext = {\n    Icon: {\n      className: clsx(styles.controlIcon, styles.icon),\n    },\n    Switch: {\n      className: clsx(styles.controlIcon, styles.switch),\n    },\n  };\n\n  const selectionIcon =\n    selectionMode === \"none\" ||\n    selectionVariant === \"navigation\" ? null : selectionVariant === \"switch\" ? (\n      <Switch isReadOnly isSelected={isSelected} />\n    ) : selectionMode === \"single\" && isSelected ? (\n      <IconRadioOn />\n    ) : selectionMode === \"single\" && !isSelected ? (\n      <IconRadioOff />\n    ) : selectionMode === \"multiple\" && isSelected ? (\n      <IconCheckboxChecked />\n    ) : (\n      <IconCheckboxEmpty />\n    );\n\n  return (\n    <>\n      <PropsContextProvider props={controlIconPropsContext}>\n        {selectionIcon}\n      </PropsContextProvider>\n      <PropsContextProvider props={propsContext}>\n        {children}\n      </PropsContextProvider>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAkBa,MAAA,eAAA,GAA6B,CAAC,KAAU,KAAA;AACnD,EAAM,MAAA;AAAA,IACJ,aAAA;AAAA,IACA,UAAA;AAAA,IACA,gBAAmB,GAAA,SAAA;AAAA,IACnB;AAAA,GACE,GAAA,KAAA;AAEJ,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,IAAM,EAAA;AAAA,MACJ,WAAW,MAAO,CAAA;AAAA,KACpB;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,WAAW,MAAO,CAAA;AAAA;AACpB,GACF;AAEA,EAAA,MAAM,uBAAwC,GAAA;AAAA,IAC5C,IAAM,EAAA;AAAA,MACJ,SAAW,EAAA,IAAA,CAAK,MAAO,CAAA,WAAA,EAAa,OAAO,IAAI;AAAA,KACjD;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,SAAW,EAAA,IAAA,CAAK,MAAO,CAAA,WAAA,EAAa,OAAO,MAAM;AAAA;AACnD,GACF;AAEA,EAAA,MAAM,aACJ,GAAA,aAAA,KAAkB,MAClB,IAAA,gBAAA,KAAqB,eAAe,IAAO,GAAA,gBAAA,KAAqB,QAC9D,mBAAA,GAAA,CAAC,UAAO,UAAU,EAAA,IAAA,EAAC,UAAwB,EAAA,CAAA,GACzC,kBAAkB,QAAY,IAAA,UAAA,mBAC/B,GAAA,CAAA,WAAA,EAAA,EAAY,CACX,GAAA,aAAA,KAAkB,QAAY,IAAA,CAAC,6BAChC,GAAA,CAAA,YAAA,EAAA,EAAa,CACZ,GAAA,aAAA,KAAkB,cAAc,UAClC,mBAAA,GAAA,CAAC,mBAAoB,EAAA,EAAA,CAAA,uBAEpB,iBAAkB,EAAA,EAAA,CAAA;AAGvB,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,oBAAA,EAAA,EAAqB,KAAO,EAAA,uBAAA,EAC1B,QACH,EAAA,aAAA,EAAA,CAAA;AAAA,oBACC,GAAA,CAAA,oBAAA,EAAA,EAAqB,KAAO,EAAA,YAAA,EAC1B,QACH,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/Message/Message.mjs

@@ -0,0 +1,47 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import styles from './Message.module.scss.mjs';
+import 'react';
+import '@tabler/icons-react';
+import '../Icon/Icon.mjs';
+import '../../views/IconView.mjs';
+import { IconContextMenu } from '../Icon/components/icons/IconContextMenu.mjs';
+import '../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+
+const Message = flowComponent("Message", (props) => {
+  const { type = "responder", children, className } = props;
+  const rootClassName = clsx(styles.message, styles[type], className);
+  const propsContext = {
+    Content: { className: styles.content },
+    Header: {
+      className: styles.header,
+      Button: {
+        className: styles.action,
+        size: "s",
+        variant: "plain",
+        color: "secondary"
+      },
+      ContextMenuTrigger: {
+        Button: {
+          className: styles.action,
+          size: "s",
+          variant: "plain",
+          color: "secondary",
+          children: /* @__PURE__ */ jsx(IconContextMenu, {})
+        }
+      },
+      Text: { className: styles.date },
+      Align: {
+        className: styles.user
+      }
+    }
+  };
+  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx("article", { className: rootClassName, children }) });
+});
+
+export { Message, Message as default };
+//# sourceMappingURL=Message.mjs.map

package/dist/js/components/src/components/Message/Message.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.mjs","sources":["../../../../../../src/components/Message/Message.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport clsx from \"clsx\";\nimport styles from \"./Message.module.scss\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { IconContextMenu } from \"@/components/Icon/components/icons\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\nexport interface MessageProps\n  extends PropsWithChildren,\n    PropsWithClassName,\n    FlowComponentProps {\n  /** Determines the color and orientation of the message. @default \"responder\" */\n  type?: \"responder\" | \"sender\";\n}\n\n/** @flr-generate all */\nexport const Message = flowComponent(\"Message\", (props) => {\n  const { type = \"responder\", children, className } = props;\n\n  const rootClassName = clsx(styles.message, styles[type], className);\n\n  const propsContext: PropsContext = {\n    Content: { className: styles.content },\n    Header: {\n      className: styles.header,\n      Button: {\n        className: styles.action,\n        size: \"s\",\n        variant: \"plain\",\n        color: \"secondary\",\n      },\n      ContextMenuTrigger: {\n        Button: {\n          className: styles.action,\n          size: \"s\",\n          variant: \"plain\",\n          color: \"secondary\",\n          children: <IconContextMenu />,\n        },\n      },\n      Text: { className: styles.date },\n      Align: {\n        className: styles.user,\n      },\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <article className={rootClassName}>{children}</article>\n    </PropsContextProvider>\n  );\n});\n\nexport default Message;\n"],"names":[],"mappings":";;;;;;;;;;;;AAoBO,MAAM,OAAU,GAAA,aAAA,CAAc,SAAW,EAAA,CAAC,KAAU,KAAA;AACzD,EAAA,MAAM,EAAE,IAAA,GAAO,WAAa,EAAA,QAAA,EAAU,WAAc,GAAA,KAAA;AAEpD,EAAA,MAAM,gBAAgB,IAAK,CAAA,MAAA,CAAO,SAAS,MAAO,CAAA,IAAI,GAAG,SAAS,CAAA;AAElE,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA,EAAE,SAAW,EAAA,MAAA,CAAO,OAAQ,EAAA;AAAA,IACrC,MAAQ,EAAA;AAAA,MACN,WAAW,MAAO,CAAA,MAAA;AAAA,MAClB,MAAQ,EAAA;AAAA,QACN,WAAW,MAAO,CAAA,MAAA;AAAA,QAClB,IAAM,EAAA,GAAA;AAAA,QACN,OAAS,EAAA,OAAA;AAAA,QACT,KAAO,EAAA;AAAA,OACT;AAAA,MACA,kBAAoB,EAAA;AAAA,QAClB,MAAQ,EAAA;AAAA,UACN,WAAW,MAAO,CAAA,MAAA;AAAA,UAClB,IAAM,EAAA,GAAA;AAAA,UACN,OAAS,EAAA,OAAA;AAAA,UACT,KAAO,EAAA,WAAA;AAAA,UACP,QAAA,sBAAW,eAAgB,EAAA,EAAA;AAAA;AAC7B,OACF;AAAA,MACA,IAAM,EAAA,EAAE,SAAW,EAAA,MAAA,CAAO,IAAK,EAAA;AAAA,MAC/B,KAAO,EAAA;AAAA,QACL,WAAW,MAAO,CAAA;AAAA;AACpB;AACF,GACF;AAEA,EACE,uBAAA,GAAA,CAAC,wBAAqB,KAAO,EAAA,YAAA,EAC3B,8BAAC,SAAQ,EAAA,EAAA,SAAA,EAAW,aAAgB,EAAA,QAAA,EAAS,CAC/C,EAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/Message/Message.module.scss.mjs

@@ -0,0 +1,23 @@
+"use client"
+/* */
+const message = "flow--message";
+const content = "flow--message--content";
+const sender = "flow--message--sender";
+const header = "flow--message--header";
+const user = "flow--message--user";
+const responder = "flow--message--responder";
+const date = "flow--message--date";
+const action = "flow--message--action";
+const styles = {
+	message: message,
+	content: content,
+	sender: sender,
+	header: header,
+	user: user,
+	responder: responder,
+	date: date,
+	action: action
+};
+
+export { action, content, date, styles as default, header, message, responder, sender, user };
+//# sourceMappingURL=Message.module.scss.mjs.map

package/dist/js/components/src/components/Message/Message.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Message.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}

package/dist/js/components/src/components/MessageThread/MessageThread.mjs

@@ -0,0 +1,29 @@
+"use client"
+/* */
+import { jsx } from 'react/jsx-runtime';
+import clsx from 'clsx';
+import styles from './MessageThread.module.scss.mjs';
+import { dynamic } from '../../lib/propsContext/dynamicProps/dynamic.mjs';
+import '../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+
+const MessageThread = flowComponent("MessageThread", (props) => {
+  const { children, className } = props;
+  const rootClassName = clsx(styles.messageThread, className);
+  const propsContext = {
+    Message: {
+      className: dynamic((props2) => {
+        return clsx(
+          props2.className,
+          styles.message,
+          styles[props2.type ?? "responder"]
+        );
+      })
+    }
+  };
+  return /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children: /* @__PURE__ */ jsx("div", { className: rootClassName, children }) });
+});
+
+export { MessageThread, MessageThread as default };
+//# sourceMappingURL=MessageThread.mjs.map

package/dist/js/components/src/components/MessageThread/MessageThread.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageThread.mjs","sources":["../../../../../../src/components/MessageThread/MessageThread.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport styles from \"./MessageThread.module.scss\";\nimport {\n  dynamic,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport {\n  flowComponent,\n  type FlowComponentProps,\n} from \"@/lib/componentFactory/flowComponent\";\n\nexport type MessageThreadProps = PropsWithChildren &\n  PropsWithClassName &\n  FlowComponentProps;\n\n/** @flr-generate all */\nexport const MessageThread = flowComponent(\"MessageThread\", (props) => {\n  const { children, className } = props;\n\n  const rootClassName = clsx(styles.messageThread, className);\n\n  const propsContext: PropsContext = {\n    Message: {\n      className: dynamic((props) => {\n        return clsx(\n          props.className,\n          styles.message,\n          styles[props.type ?? \"responder\"],\n        );\n      }),\n    },\n  };\n\n  return (\n    <PropsContextProvider props={propsContext}>\n      <div className={rootClassName}>{children}</div>\n    </PropsContextProvider>\n  );\n});\n\nexport default MessageThread;\n"],"names":["props"],"mappings":";;;;;;;;AAmBO,MAAM,aAAgB,GAAA,aAAA,CAAc,eAAiB,EAAA,CAAC,KAAU,KAAA;AACrE,EAAM,MAAA,EAAE,QAAU,EAAA,SAAA,EAAc,GAAA,KAAA;AAEhC,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,aAAA,EAAe,SAAS,CAAA;AAE1D,EAAA,MAAM,YAA6B,GAAA;AAAA,IACjC,OAAS,EAAA;AAAA,MACP,SAAA,EAAW,OAAQ,CAAA,CAACA,MAAU,KAAA;AAC5B,QAAO,OAAA,IAAA;AAAA,UACLA,MAAM,CAAA,SAAA;AAAA,UACN,MAAO,CAAA,OAAA;AAAA,UACP,MAAA,CAAOA,MAAM,CAAA,IAAA,IAAQ,WAAW;AAAA,SAClC;AAAA,OACD;AAAA;AACH,GACF;AAEA,EACE,uBAAA,GAAA,CAAC,wBAAqB,KAAO,EAAA,YAAA,EAC3B,8BAAC,KAAI,EAAA,EAAA,SAAA,EAAW,aAAgB,EAAA,QAAA,EAAS,CAC3C,EAAA,CAAA;AAEJ,CAAC;;;;"}

package/dist/js/components/src/components/MessageThread/MessageThread.module.scss.mjs

@@ -0,0 +1,15 @@
+"use client"
+/* */
+const messageThread = "flow--message-thread";
+const message = "flow--message-thread--message";
+const responder = "flow--message-thread--responder";
+const sender = "flow--message-thread--sender";
+const styles = {
+	messageThread: messageThread,
+	message: message,
+	responder: responder,
+	sender: sender
+};
+
+export { styles as default, message, messageThread, responder, sender };
+//# sourceMappingURL=MessageThread.module.scss.mjs.map

package/dist/js/components/src/components/MessageThread/MessageThread.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageThread.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/dist/js/components/src/components/MessageThread/components/MessageSeparator/MessageSeparator.mjs

@@ -0,0 +1,20 @@
+"use client"
+/* */
+import { jsxs, jsx } from 'react/jsx-runtime';
+import styles from './MessageSeparator.module.scss.mjs';
+import 'react';
+import clsx from 'clsx';
+import { Separator } from '../../../Separator/Separator.mjs';
+import { Content } from '../../../Content/Content.mjs';
+
+const MessageSeparator = (props) => {
+  const { children, className } = props;
+  const rootClassName = clsx(styles.messageSeparator, className);
+  return /* @__PURE__ */ jsxs("span", { className: rootClassName, children: [
+    /* @__PURE__ */ jsx(Separator, { className: styles.separator }),
+    /* @__PURE__ */ jsx(Content, { className: styles.content, children })
+  ] });
+};
+
+export { MessageSeparator, MessageSeparator as default };
+//# sourceMappingURL=MessageSeparator.mjs.map

package/dist/js/components/src/components/MessageThread/components/MessageSeparator/MessageSeparator.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageSeparator.mjs","sources":["../../../../../../../../src/components/MessageThread/components/MessageSeparator/MessageSeparator.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport styles from \"./MessageSeparator.module.scss\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport React from \"react\";\nimport clsx from \"clsx\";\nimport { Separator } from \"@/components/Separator\";\nimport { Content } from \"@/components/Content\";\n\nexport interface MessageSeparatorProps\n  extends PropsWithChildren,\n    PropsWithClassName {}\n\n/** @flr-generate all */\nexport const MessageSeparator: FC<MessageSeparatorProps> = (props) => {\n  const { children, className } = props;\n\n  const rootClassName = clsx(styles.messageSeparator, className);\n\n  return (\n    <span className={rootClassName}>\n      <Separator className={styles.separator} />\n      <Content className={styles.content}>{children}</Content>\n    </span>\n  );\n};\nexport default MessageSeparator;\n"],"names":[],"mappings":";;;;;;;AAaa,MAAA,gBAAA,GAA8C,CAAC,KAAU,KAAA;AACpE,EAAM,MAAA,EAAE,QAAU,EAAA,SAAA,EAAc,GAAA,KAAA;AAEhC,EAAA,MAAM,aAAgB,GAAA,IAAA,CAAK,MAAO,CAAA,gBAAA,EAAkB,SAAS,CAAA;AAE7D,EACE,uBAAA,IAAA,CAAC,MAAK,EAAA,EAAA,SAAA,EAAW,aACf,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,SAAA,EAAA,EAAU,SAAW,EAAA,MAAA,CAAO,SAAW,EAAA,CAAA;AAAA,oBACvC,GAAA,CAAA,OAAA,EAAA,EAAQ,SAAW,EAAA,MAAA,CAAO,SAAU,QAAS,EAAA;AAAA,GAChD,EAAA,CAAA;AAEJ;;;;"}

package/dist/js/components/src/components/MessageThread/components/MessageSeparator/MessageSeparator.module.scss.mjs

@@ -0,0 +1,13 @@
+"use client"
+/* */
+const messageSeparator = "flow--message-thread--message-separator";
+const separator = "flow--message-thread--message-separator--separator";
+const content = "flow--message-thread--message-separator--content";
+const styles = {
+	messageSeparator: messageSeparator,
+	separator: separator,
+	content: content
+};
+
+export { content, styles as default, messageSeparator, separator };
+//# sourceMappingURL=MessageSeparator.module.scss.mjs.map

package/dist/js/components/src/components/MessageThread/components/MessageSeparator/MessageSeparator.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageSeparator.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/dist/js/components/src/components/Modal/Modal.mjs

@@ -0,0 +1,95 @@
+"use client"
+/* */
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import styles from './Modal.module.scss.mjs';
+import clsx from 'clsx';
+import { dynamic } from '../../lib/propsContext/dynamicProps/dynamic.mjs';
+import '../../lib/propsContext/propsContext.mjs';
+import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
+import { Overlay } from '../Overlay/Overlay.mjs';
+import { Action } from '../Action/Action.mjs';
+import 'react';
+import '@tabler/icons-react';
+import '../Icon/Icon.mjs';
+import '../../views/IconView.mjs';
+import { IconClose } from '../Icon/components/icons/IconClose.mjs';
+import ButtonView from '../../views/ButtonView.mjs';
+
+const Modal = flowComponent(
+  "Modal",
+  (props) => {
+    const {
+      size = "s",
+      offCanvas,
+      controller,
+      children,
+      ref,
+      className,
+      offCanvasOrientation = "right",
+      ...rest
+    } = props;
+    const rootClassName = clsx(
+      offCanvas ? styles.offCanvas : styles.modal,
+      styles[`size-${size}`],
+      offCanvasOrientation === "left" && styles["left"],
+      className
+    );
+    const header = (children2) => /* @__PURE__ */ jsxs(Fragment, { children: [
+      children2,
+      /* @__PURE__ */ jsx(Action, { closeOverlay: "Modal", children: /* @__PURE__ */ jsx(
+        ButtonView,
+        {
+          variant: "plain",
+          color: "secondary",
+          onPress: controller?.close,
+          children: /* @__PURE__ */ jsx(IconClose, {})
+        }
+      ) })
+    ] });
+    const nestedHeadingLevel = 3;
+    const nestedHeadingProps = {
+      Heading: { level: nestedHeadingLevel },
+      Section: { Heading: { level: nestedHeadingLevel } }
+    };
+    const propsContext = {
+      Content: {
+        ...nestedHeadingProps,
+        className: styles.content
+      },
+      ColumnLayout: {
+        ...nestedHeadingProps,
+        l: [2, 1],
+        m: [1],
+        className: styles.columnLayout,
+        AccentBox: { className: styles.accentBox, color: "neutral" }
+      },
+      Heading: {
+        className: styles.header,
+        level: 2,
+        slot: "title",
+        children: dynamic((props2) => header(props2.children))
+      },
+      ActionGroup: {
+        className: styles.actionGroup,
+        spacing: "m"
+      }
+    };
+    return /* @__PURE__ */ jsx(
+      Overlay,
+      {
+        className: rootClassName,
+        controller,
+        ref,
+        ...rest,
+        children: /* @__PURE__ */ jsx(PropsContextProvider, { props: propsContext, children })
+      }
+    );
+  },
+  {
+    type: "provider"
+  }
+);
+
+export { Modal, Modal as default };
+//# sourceMappingURL=Modal.mjs.map

package/dist/js/components/src/components/Modal/Modal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.mjs","sources":["../../../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import type { PropsWithChildren, ReactNode } from \"react\";\nimport styles from \"./Modal.module.scss\";\nimport clsx from \"clsx\";\nimport {\n  dynamic,\n  type PropsContext,\n  PropsContextProvider,\n} from \"@/lib/propsContext\";\nimport type { OverlayController } from \"@/lib/controller/overlay\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { Overlay } from \"@/components/Overlay/Overlay\";\nimport { Action } from \"@/components/Action\";\nimport { IconClose } from \"@/components/Icon/components/icons\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport ButtonView from \"@/views/ButtonView\";\n\nexport interface ModalProps\n  extends PropsWithChildren,\n    FlowComponentProps,\n    PropsWithClassName {\n  /** The size of the modal. @default \"s\" */\n  size?: \"s\" | \"m\" | \"l\";\n  /** Whether the modal should be displayed as an off canvas. */\n  offCanvas?: boolean;\n  /**\n   * Whether the off canvas should be displayed on the right or left side of the\n   * screen. @default \"right\"\n   */\n  offCanvasOrientation?: \"left\" | \"right\";\n  /** An overlay controller to control the modal state. */\n  controller?: OverlayController;\n  /**\n   * Accepts \"actionConfirm\" to use the modal as a confirmation modal for an\n   * action.\n   */\n  slot?: string;\n  /** Whether the modal can be closed by clicking outside of it. */\n  isDismissable?: boolean;\n}\n\nexport const Modal = flowComponent(\n  \"Modal\",\n  (props) => {\n    const {\n      size = \"s\",\n      offCanvas,\n      controller,\n      children,\n      ref,\n      className,\n      offCanvasOrientation = \"right\",\n      ...rest\n    } = props;\n\n    const rootClassName = clsx(\n      offCanvas ? styles.offCanvas : styles.modal,\n      styles[`size-${size}`],\n      offCanvasOrientation === \"left\" && styles[\"left\"],\n      className,\n    );\n\n    const header = (children: ReactNode) => (\n      <>\n        {children}\n        <Action closeOverlay=\"Modal\">\n          <ButtonView\n            variant=\"plain\"\n            color=\"secondary\"\n            onPress={controller?.close}\n          >\n            <IconClose />\n          </ButtonView>\n        </Action>\n      </>\n    );\n\n    const nestedHeadingLevel = 3;\n\n    const nestedHeadingProps: PropsContext = {\n      Heading: { level: nestedHeadingLevel },\n      Section: { Heading: { level: nestedHeadingLevel } },\n    };\n\n    const propsContext: PropsContext = {\n      Content: {\n        ...nestedHeadingProps,\n        className: styles.content,\n      },\n      ColumnLayout: {\n        ...nestedHeadingProps,\n        l: [2, 1],\n        m: [1],\n        className: styles.columnLayout,\n        AccentBox: { className: styles.accentBox, color: \"neutral\" },\n      },\n      Heading: {\n        className: styles.header,\n        level: 2,\n        slot: \"title\",\n        children: dynamic((props) => header(props.children)),\n      },\n      ActionGroup: {\n        className: styles.actionGroup,\n        spacing: \"m\",\n      },\n    };\n\n    return (\n      <Overlay\n        className={rootClassName}\n        controller={controller}\n        ref={ref}\n        {...rest}\n      >\n        <PropsContextProvider props={propsContext}>\n          {children}\n        </PropsContextProvider>\n      </Overlay>\n    );\n  },\n  {\n    type: \"provider\",\n  },\n);\n\nexport default Modal;\n"],"names":["children","props"],"mappings":";;;;;;;;;;;;;;;;AAyCO,MAAM,KAAQ,GAAA,aAAA;AAAA,EACnB,OAAA;AAAA,EACA,CAAC,KAAU,KAAA;AACT,IAAM,MAAA;AAAA,MACJ,IAAO,GAAA,GAAA;AAAA,MACP,SAAA;AAAA,MACA,UAAA;AAAA,MACA,QAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAA;AAAA,MACA,oBAAuB,GAAA,OAAA;AAAA,MACvB,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAA,MAAM,aAAgB,GAAA,IAAA;AAAA,MACpB,SAAA,GAAY,MAAO,CAAA,SAAA,GAAY,MAAO,CAAA,KAAA;AAAA,MACtC,MAAA,CAAO,CAAQ,KAAA,EAAA,IAAI,CAAE,CAAA,CAAA;AAAA,MACrB,oBAAA,KAAyB,MAAU,IAAA,MAAA,CAAO,MAAM,CAAA;AAAA,MAChD;AAAA,KACF;AAEA,IAAM,MAAA,MAAA,GAAS,CAACA,SAAAA,qBAEX,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,MAAAA,SAAAA;AAAA,sBACD,GAAA,CAAC,MAAO,EAAA,EAAA,YAAA,EAAa,OACnB,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,OAAA;AAAA,UACR,KAAM,EAAA,WAAA;AAAA,UACN,SAAS,UAAY,EAAA,KAAA;AAAA,UAErB,8BAAC,SAAU,EAAA,EAAA;AAAA;AAAA,OAEf,EAAA;AAAA,KACF,EAAA,CAAA;AAGF,IAAA,MAAM,kBAAqB,GAAA,CAAA;AAE3B,IAAA,MAAM,kBAAmC,GAAA;AAAA,MACvC,OAAA,EAAS,EAAE,KAAA,EAAO,kBAAmB,EAAA;AAAA,MACrC,SAAS,EAAE,OAAA,EAAS,EAAE,KAAA,EAAO,oBAAqB;AAAA,KACpD;AAEA,IAAA,MAAM,YAA6B,GAAA;AAAA,MACjC,OAAS,EAAA;AAAA,QACP,GAAG,kBAAA;AAAA,QACH,WAAW,MAAO,CAAA;AAAA,OACpB;AAAA,MACA,YAAc,EAAA;AAAA,QACZ,GAAG,kBAAA;AAAA,QACH,CAAA,EAAG,CAAC,CAAA,EAAG,CAAC,CAAA;AAAA,QACR,CAAA,EAAG,CAAC,CAAC,CAAA;AAAA,QACL,WAAW,MAAO,CAAA,YAAA;AAAA,QAClB,WAAW,EAAE,SAAA,EAAW,MAAO,CAAA,SAAA,EAAW,OAAO,SAAU;AAAA,OAC7D;AAAA,MACA,OAAS,EAAA;AAAA,QACP,WAAW,MAAO,CAAA,MAAA;AAAA,QAClB,KAAO,EAAA,CAAA;AAAA,QACP,IAAM,EAAA,OAAA;AAAA,QACN,UAAU,OAAQ,CAAA,CAACC,WAAU,MAAOA,CAAAA,MAAAA,CAAM,QAAQ,CAAC;AAAA,OACrD;AAAA,MACA,WAAa,EAAA;AAAA,QACX,WAAW,MAAO,CAAA,WAAA;AAAA,QAClB,OAAS,EAAA;AAAA;AACX,KACF;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,aAAA;AAAA,QACX,UAAA;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAC,kBAAA,GAAA,CAAA,oBAAA,EAAA,EAAqB,KAAO,EAAA,YAAA,EAC1B,QACH,EAAA;AAAA;AAAA,KACF;AAAA,GAEJ;AAAA,EACA;AAAA,IACE,IAAM,EAAA;AAAA;AAEV;;;;"}

package/dist/js/components/src/components/Modal/Modal.module.scss.mjs

@@ -0,0 +1,30 @@
+"use client"
+/* */
+const modal = "flow--modal";
+const offCanvas = "flow--modal--off-canvas";
+const header = "flow--modal--header";
+const content = "flow--modal--content";
+const columnLayout = "flow--modal--column-layout";
+const actionGroup = "flow--modal--action-group";
+const accentBox = "flow--modal--accent-box";
+const left = "flow--modal--left";
+const styles = {
+	modal: modal,
+	offCanvas: offCanvas,
+	header: header,
+	content: content,
+	columnLayout: columnLayout,
+	actionGroup: actionGroup,
+	accentBox: accentBox,
+	"size-s": "flow--modal--size-s",
+	"size-m": "flow--modal--size-m",
+	"size-l": "flow--modal--size-l",
+	"modal-zoom": "flow--modal--modal-zoom",
+	"modal-slide-in-from-right": "flow--modal--modal-slide-in-from-right",
+	left: left,
+	"modal-slide-in-from-left": "flow--modal--modal-slide-in-from-left",
+	"modal-slide-up": "flow--modal--modal-slide-up"
+};
+
+export { accentBox, actionGroup, columnLayout, content, styles as default, header, left, modal, offCanvas };
+//# sourceMappingURL=Modal.module.scss.mjs.map

package/dist/js/components/src/components/Modal/Modal.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}