@helpwave/hightide 0.0.12 → 0.0.15

package/dist/components/layout/FAQSection.mjs

@@ -0,0 +1,302 @@
+// src/components/layout/FAQSection.tsx
+import clsx2 from "clsx";
+import { ChevronDown as ChevronDown2, ChevronUp as ChevronUp2 } from "lucide-react";
+
+// src/components/Expandable.tsx
+import { forwardRef, useState } from "react";
+import { ChevronDown, ChevronUp } from "lucide-react";
+import clsx from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DefaultIcon = (expanded) => expanded ? /* @__PURE__ */ jsx(ChevronUp, { size: 16, className: "min-w-[16px]" }) : /* @__PURE__ */ jsx(ChevronDown, { size: 16, className: "min-w-[16px]" });
+var Expandable = forwardRef(({
+  children,
+  label,
+  icon,
+  initialExpansion = false,
+  clickOnlyOnHeader = true,
+  className = "",
+  headerClassName = ""
+}, ref) => {
+  const [isExpanded, setIsExpanded] = useState(initialExpansion);
+  icon ??= DefaultIcon;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: clsx("col bg-surface text-on-surface group rounded-lg shadow-sm", { "cursor-pointer": !clickOnlyOnHeader }, className),
+      onClick: () => !clickOnlyOnHeader && setIsExpanded(!isExpanded),
+      children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            className: clsx("btn-md rounded-lg justify-between items-center bg-surface text-on-surface", { "group-hover:brightness-95": !isExpanded }, headerClassName),
+            onClick: () => clickOnlyOnHeader && setIsExpanded(!isExpanded),
+            children: [
+              label,
+              icon(isExpanded)
+            ]
+          }
+        ),
+        isExpanded && /* @__PURE__ */ jsx("div", { className: "col", children })
+      ]
+    }
+  );
+});
+Expandable.displayName = "Expandable";
+
+// src/components/MarkdownInterpreter.tsx
+import { Fragment, jsx as jsx2 } from "react/jsx-runtime";
+var astNodeInserterType = ["helpwave", "newline"];
+var ASTNodeInterpreter = ({
+  node,
+  isRoot = false,
+  className = ""
+}) => {
+  switch (node.type) {
+    case "newline":
+      return /* @__PURE__ */ jsx2("br", {});
+    case "text":
+      return isRoot ? /* @__PURE__ */ jsx2("span", { className, children: node.text }) : node.text;
+    case "helpwave":
+      return /* @__PURE__ */ jsx2("span", { className: "font-bold font-space no-underline", children: "helpwave" });
+    case "none":
+      return isRoot ? /* @__PURE__ */ jsx2("span", { className, children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) }) : /* @__PURE__ */ jsx2(Fragment, { children: node.children.map((value, index) => /* @__PURE__ */ jsx2(ASTNodeInterpreter, { node: value }, index)) });
+    case "bold":
+      return /* @__PURE__ */ jsx2("b", { children: node.children.map((value, index) => /* @__PURE__ */ jsx2(ASTNodeInterpreter, { node: value }, index)) });
+    case "italic":
+      return /* @__PURE__ */ jsx2("i", { children: node.children.map((value, index) => /* @__PURE__ */ jsx2(ASTNodeInterpreter, { node: value }, index)) });
+    case "underline":
+      return /* @__PURE__ */ jsx2("u", { children: node.children.map((value, index) => /* @__PURE__ */ jsx2(ASTNodeInterpreter, { node: value }, index)) });
+    case "font-space":
+      return /* @__PURE__ */ jsx2("span", { className: "font-space", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    case "primary":
+      return /* @__PURE__ */ jsx2("span", { className: "text-primary", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    case "secondary":
+      return /* @__PURE__ */ jsx2("span", { className: "text-secondary", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    case "warn":
+      return /* @__PURE__ */ jsx2("span", { className: "text-warning", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    case "positive":
+      return /* @__PURE__ */ jsx2("span", { className: "text-positive", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    case "negative":
+      return /* @__PURE__ */ jsx2("span", { className: "text-negative", children: node.children.map((value, index) => /* @__PURE__ */ jsx2(
+        ASTNodeInterpreter,
+        {
+          node: value
+        },
+        index
+      )) });
+    default:
+      return null;
+  }
+};
+var modifierIdentifierMapping = [
+  { id: "i", name: "italic" },
+  { id: "b", name: "bold" },
+  { id: "u", name: "underline" },
+  { id: "space", name: "font-space" },
+  { id: "primary", name: "primary" },
+  { id: "secondary", name: "secondary" },
+  { id: "warn", name: "warn" },
+  { id: "positive", name: "positive" },
+  { id: "negative", name: "negative" }
+];
+var inserterIdentifierMapping = [
+  { id: "helpwave", name: "helpwave" },
+  { id: "newline", name: "newline" }
+];
+var parseMarkdown = (text, commandStart = "\\", open = "{", close = "}") => {
+  let start = text.indexOf(commandStart);
+  const children = [];
+  while (text !== "") {
+    if (start === -1) {
+      children.push({
+        type: "text",
+        text
+      });
+      break;
+    }
+    children.push(parseMarkdown(text.substring(0, start)));
+    text = text.substring(start);
+    if (text.length <= 1) {
+      children.push({
+        type: "text",
+        text
+      });
+      text = "";
+      continue;
+    }
+    const simpleReplace = [commandStart, open, close];
+    if (simpleReplace.some((value) => text[1] === value)) {
+      children.push({
+        type: "text",
+        text: simpleReplace.find((value) => text[1] === value)
+      });
+      text = text.substring(2);
+      start = text.indexOf(commandStart);
+      continue;
+    }
+    const inserter = inserterIdentifierMapping.find((value) => text.substring(1).startsWith(value.id));
+    if (inserter) {
+      children.push({
+        type: inserter.name
+      });
+      text = text.substring(inserter.id.length + 1);
+      start = text.indexOf(commandStart);
+      continue;
+    }
+    const modifier = modifierIdentifierMapping.find((value) => text.substring(1).startsWith(value.id));
+    if (modifier) {
+      if (text[modifier.id.length + 1] !== open) {
+        children.push({
+          type: "text",
+          text: text.substring(0, modifier.id.length + 1)
+        });
+        text = text.substring(modifier.id.length + 2);
+        start = text.indexOf(commandStart);
+        continue;
+      }
+      let closing = -1;
+      let index = modifier.id.length + 2;
+      let counter = 1;
+      let escaping = false;
+      while (index < text.length) {
+        if (text[index] === open && !escaping) {
+          counter++;
+        }
+        if (text[index] === close && !escaping) {
+          counter--;
+          if (counter === 0) {
+            closing = index;
+            break;
+          }
+        }
+        escaping = text[index] === commandStart;
+        index++;
+      }
+      if (closing !== -1) {
+        children.push({
+          type: modifier.name,
+          children: [parseMarkdown(text.substring(modifier.id.length + 2, closing))]
+        });
+        text = text.substring(closing + 1);
+        start = text.indexOf(commandStart);
+        continue;
+      }
+    }
+    children.push({
+      type: "text",
+      text: text[0]
+    });
+    text = text.substring(1);
+    start = text.indexOf(commandStart);
+  }
+  return {
+    type: "none",
+    children
+  };
+};
+var optimizeTree = (node) => {
+  if (node.type === "text") {
+    return !node.text ? void 0 : node;
+  }
+  if (astNodeInserterType.some((value) => value === node.type)) {
+    return node;
+  }
+  const currentNode = node;
+  if (currentNode.children.length === 0) {
+    return void 0;
+  }
+  let children = [];
+  for (let i = 0; i < currentNode.children.length; i++) {
+    const child = optimizeTree(currentNode.children[i]);
+    if (!child) {
+      continue;
+    }
+    if (child.type === "none") {
+      children.push(...child.children);
+    } else {
+      children.push(child);
+    }
+  }
+  currentNode.children = children;
+  children = [];
+  for (let i = 0; i < currentNode.children.length; i++) {
+    const child = currentNode.children[i];
+    if (child) {
+      if (child.type === "text" && children[children.length - 1]?.type === "text") {
+        children[children.length - 1].text += child.text;
+      } else {
+        children.push(child);
+      }
+    }
+  }
+  currentNode.children = children;
+  return currentNode;
+};
+var MarkdownInterpreter = ({ text, className }) => {
+  const tree = parseMarkdown(text);
+  const optimizedTree = optimizeTree(tree);
+  return /* @__PURE__ */ jsx2(ASTNodeInterpreter, { node: optimizedTree, isRoot: true, className });
+};
+
+// src/components/layout/FAQSection.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var FAQSection = ({
+  entries,
+  expandableClassName
+}) => {
+  const chevronSize = 28;
+  return /* @__PURE__ */ jsx3("div", { className: "col gap-y-4", children: entries.map(({ id, title, content, ...restProps }) => /* @__PURE__ */ jsx3(
+    Expandable,
+    {
+      ...restProps,
+      label: /* @__PURE__ */ jsx3("h3", { id, className: "textstyle-title-md", children: title }),
+      clickOnlyOnHeader: false,
+      icon: (expanded) => expanded ? /* @__PURE__ */ jsx3(ChevronUp2, { size: chevronSize, className: "text-primary", style: { minWidth: `${chevronSize}px` } }) : /* @__PURE__ */ jsx3(ChevronDown2, { size: chevronSize, className: "text-primary" }),
+      className: clsx2("rounded-xl", expandableClassName),
+      headerClassName: "px-6 py-4",
+      children: /* @__PURE__ */ jsx3("div", { className: "mt-2 px-6 pb-4", children: content.type === "markdown" ? /* @__PURE__ */ jsx3(MarkdownInterpreter, { text: content.value }) : content.value })
+    },
+    id
+  )) });
+};
+export {
+  FAQSection
+};
+//# sourceMappingURL=FAQSection.mjs.map

package/dist/components/layout/FAQSection.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layout/FAQSection.tsx","../../../src/components/Expandable.tsx","../../../src/components/MarkdownInterpreter.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport clsx from 'clsx'\nimport { ChevronDown, ChevronUp } from 'lucide-react'\nimport type { ExpandableProps } from '../Expandable'\nimport { Expandable } from '../Expandable'\nimport { MarkdownInterpreter } from '../MarkdownInterpreter'\n\ntype ContentType = {\n  type: 'markdown',\n  value: string,\n} | {\n  type: 'custom',\n  value: ReactNode,\n}\n\nexport type FAQItem = Pick<ExpandableProps, 'initialExpansion'| 'className'> & {\n  id: string,\n  title: string,\n  content: ContentType,\n}\n\nexport type FAQSectionProps = {\n  entries: FAQItem[],\n  expandableClassName?: string,\n}\n\n/**\n * Description\n */\nexport const FAQSection = ({\n  entries,\n  expandableClassName\n}: FAQSectionProps) => {\n  const chevronSize = 28\n  return (\n    <div className=\"col gap-y-4\">\n      {entries.map(({ id, title, content, ...restProps }) => (\n        <Expandable\n          key={id}\n          {...restProps}\n          label={(<h3 id={id} className=\"textstyle-title-md\">{title}</h3>)}\n          clickOnlyOnHeader={false}\n          icon={(expanded) => expanded ?\n              (<ChevronUp size={chevronSize} className=\"text-primary\" style={{ minWidth: `${chevronSize}px` }}/>) :\n              (<ChevronDown size={chevronSize} className=\"text-primary\"/>)\n          }\n          className={clsx('rounded-xl', expandableClassName)}\n          headerClassName=\"px-6 py-4\"\n        >\n          <div className=\"mt-2 px-6 pb-4\">\n            {content.type === 'markdown' ? (<MarkdownInterpreter text={content.value}/>) : content.value}\n          </div>\n        </Expandable>\n      ))}\n    </div>\n  )\n}\n","import type { PropsWithChildren, ReactNode } from 'react'\nimport { forwardRef, useState } from 'react'\nimport { ChevronDown, ChevronUp } from 'lucide-react'\nimport clsx from 'clsx'\n\ntype IconBuilder = (expanded: boolean) => ReactNode\n\nexport type ExpandableProps = PropsWithChildren<{\n  label: ReactNode,\n  icon?: IconBuilder,\n  initialExpansion?: boolean,\n  /**\n   * Whether the expansion should only happen when the header is clicked or on the entire component\n   */\n  clickOnlyOnHeader?: boolean,\n  className?: string,\n  headerClassName?: string,\n}>\n\nconst DefaultIcon: IconBuilder = (expanded) => expanded ?\n  (<ChevronUp size={16} className=\"min-w-[16px]\"/>)\n  : (<ChevronDown size={16} className=\"min-w-[16px]\"/>)\n\n/**\n * A Component for showing and hiding content\n */\nexport const Expandable = forwardRef<HTMLDivElement, ExpandableProps>(({\n                                                                         children,\n                                                                         label,\n                                                                         icon,\n                                                                         initialExpansion = false,\n                                                                         clickOnlyOnHeader = true,\n                                                                         className = '',\n                                                                         headerClassName = ''\n                                                                       }, ref) => {\n  const [isExpanded, setIsExpanded] = useState(initialExpansion)\n  icon ??= DefaultIcon\n\n  return (\n    <div\n      ref={ref}\n      className={clsx('col bg-surface text-on-surface group rounded-lg shadow-sm', { 'cursor-pointer': !clickOnlyOnHeader }, className)}\n      onClick={() => !clickOnlyOnHeader && setIsExpanded(!isExpanded)}\n    >\n      <button\n        className={clsx('btn-md rounded-lg justify-between items-center bg-surface text-on-surface', { 'group-hover:brightness-95': !isExpanded }, headerClassName)}\n        onClick={() => clickOnlyOnHeader && setIsExpanded(!isExpanded)}\n      >\n        {label}\n        {icon(isExpanded)}\n      </button>\n      {isExpanded && (\n        <div className=\"col\">\n          {children}\n        </div>\n      )}\n    </div>\n  )\n})\n\nExpandable.displayName = 'Expandable'\n","type ASTNodeModifierType =\n  'none'\n  | 'italic'\n  | 'bold'\n  | 'underline'\n  | 'font-space'\n  | 'primary'\n  | 'secondary'\n  | 'warn'\n  | 'positive'\n  | 'negative'\n\nconst astNodeInserterType = ['helpwave', 'newline'] as const\ntype ASTNodeInserterType = typeof astNodeInserterType[number]\ntype ASTNodeDefaultType = 'text'\n\ntype ASTNode = {\n  type: ASTNodeModifierType,\n  children: ASTNode[],\n} | {\n  type: ASTNodeInserterType,\n} | {\n  type: ASTNodeDefaultType,\n  text: string,\n}\n\nexport type ASTNodeInterpreterProps = {\n  node: ASTNode,\n  isRoot?: boolean,\n  className?: string,\n}\nexport const ASTNodeInterpreter = ({\n                                     node,\n                                     isRoot = false,\n                                     className = '',\n                                   }: ASTNodeInterpreterProps) => {\n  switch (node.type) {\n    case 'newline':\n      return <br/>\n    case 'text':\n      return isRoot ? <span className={className}>{node.text}</span> : node.text\n    case 'helpwave':\n      return (<span className=\"font-bold font-space no-underline\">helpwave</span>)\n    case 'none':\n      return isRoot ? (\n<span className={className}>{node.children.map((value, index) => (\n<ASTNodeInterpreter key={index}\n                                                                                                           node={value}/>\n))}</span>\n) :\n        <>{node.children.map((value, index) => <ASTNodeInterpreter key={index} node={value}/>)}</>\n    case 'bold':\n      return <b>{node.children.map((value, index) => <ASTNodeInterpreter key={index} node={value}/>)}</b>\n    case 'italic':\n      return <i>{node.children.map((value, index) => <ASTNodeInterpreter key={index} node={value}/>)}</i>\n    case 'underline':\n      return (<u>{node.children.map((value, index) => (<ASTNodeInterpreter key={index} node={value}/>))}</u>)\n    case 'font-space':\n      return (\n        <span className=\"font-space\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter key={index}\n                              node={value}/>\n        ))}</span>\n      )\n    case 'primary':\n      return (\n        <span className=\"text-primary\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter\n            key={index} node={value}/>\n        ))}</span>\n      )\n    case 'secondary':\n      return (\n        <span className=\"text-secondary\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter\n            key={index} node={value}/>\n        ))}</span>\n      )\n    case 'warn':\n      return (\n        <span className=\"text-warning\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter\n            key={index} node={value}/>\n        ))}</span>\n      )\n    case 'positive':\n      return (\n        <span className=\"text-positive\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter\n            key={index} node={value}/>\n        ))}</span>\n      )\n    case 'negative':\n      return (\n        <span className=\"text-negative\">{node.children.map((value, index) => (\n          <ASTNodeInterpreter\n            key={index} node={value}/>\n        ))}</span>\n      )\n    default:\n      return null\n  }\n}\n\nconst modifierIdentifierMapping = [\n  { id: 'i', name: 'italic' },\n  { id: 'b', name: 'bold' },\n  { id: 'u', name: 'underline' },\n  { id: 'space', name: 'font-space' },\n  { id: 'primary', name: 'primary' },\n  { id: 'secondary', name: 'secondary' },\n  { id: 'warn', name: 'warn' },\n  { id: 'positive', name: 'positive' },\n  { id: 'negative', name: 'negative' },\n] as const\n\nconst inserterIdentifierMapping = [\n  { id: 'helpwave', name: 'helpwave' },\n  { id: 'newline', name: 'newline' }\n] as const\nconst parseMarkdown = (\n  text: string,\n  commandStart: string = '\\\\',\n  open: string = '{',\n  close: string = '}'\n): ASTNode => {\n  let start = text.indexOf(commandStart)\n  const children: ASTNode[] = []\n\n  // parse the text step by step\n  while (text !== '') {\n    if (start === -1) {\n      children.push({\n        type: 'text',\n        text\n      })\n      break\n    }\n    children.push(parseMarkdown(text.substring(0, start)))\n    text = text.substring(start)\n    if (text.length <= 1) {\n      children.push({\n        type: 'text',\n        text\n      })\n      text = ''\n      continue\n    }\n    const simpleReplace = [commandStart, open, close]\n    if (simpleReplace.some(value => text[1] === value)) {\n      children.push({\n        type: 'text',\n        text: simpleReplace.find(value => text[1] === value)!\n      })\n      text = text.substring(2)\n      start = text.indexOf(commandStart)\n      continue\n    }\n    const inserter = inserterIdentifierMapping.find(value => text.substring(1).startsWith(value.id))\n    if (inserter) {\n      children.push({\n        type: inserter.name,\n      })\n      text = text.substring(inserter.id.length + 1)\n      start = text.indexOf(commandStart)\n      continue\n    }\n    const modifier = modifierIdentifierMapping.find(value => text.substring(1).startsWith(value.id))\n    if (modifier) {\n      // check brackets\n      if (text[modifier.id.length + 1] !== open) {\n        children.push({\n          type: 'text',\n          text: text.substring(0, modifier.id.length + 1)\n        })\n        text = text.substring(modifier.id.length + 2)\n        start = text.indexOf(commandStart)\n        continue\n      }\n      let closing = -1\n      let index = modifier.id.length + 2\n      let counter = 1\n      let escaping = false\n      while (index < text.length) {\n        if (text[index] === open && !escaping) {\n          counter++\n        }\n        if (text[index] === close && !escaping) {\n          counter--\n          if (counter === 0) {\n            closing = index\n            break\n          }\n        }\n        escaping = text[index] === commandStart\n        index++\n      }\n\n      if (closing !== -1) {\n        children.push({\n          type: modifier.name,\n          children: [parseMarkdown(text.substring(modifier.id.length + 2, closing))]\n        })\n        text = text.substring(closing + 1)\n        start = text.indexOf(commandStart)\n        continue\n      }\n    }\n    // nothing could be applied to command start\n    children.push({\n      type: 'text',\n      text: text[0]!\n    })\n    text = text.substring(1)\n    start = text.indexOf(commandStart)\n  }\n\n  return {\n    type: 'none',\n    children\n  }\n}\n\nconst optimizeTree = (node: ASTNode) => {\n  if (node.type === 'text') {\n    return !node.text ? undefined : node\n  }\n  if (astNodeInserterType.some(value => value === node.type)) {\n    return node\n  }\n\n  const currentNode = node as\n    { type: ASTNodeModifierType, children: ASTNode[] }\n\n  if (currentNode.children.length === 0) {\n    return undefined\n  }\n\n  let children: ASTNode[] = []\n  for (let i = 0; i < currentNode.children.length; i++) {\n    const child = optimizeTree(currentNode.children[i]!)\n    if (!child) {\n      continue\n    }\n    if (child.type === 'none') {\n      children.push(...child.children)\n    } else {\n      children.push(child)\n    }\n  }\n\n  currentNode.children = children\n  children = []\n\n  for (let i = 0; i < currentNode.children.length; i++) {\n    const child = currentNode.children[i]!\n    if (child) {\n      if (child.type === 'text' && children[children.length - 1]?.type === 'text') {\n        (children[children.length - 1]! as { type: ASTNodeDefaultType, text: string }).text += child.text\n      } else {\n        children.push(child)\n      }\n    }\n  }\n  currentNode.children = children\n  return currentNode\n}\n\nexport type MarkdownInterpreterProps = {\n  text: string,\n  className?: string,\n}\n\nexport const MarkdownInterpreter = ({ text, className }: MarkdownInterpreterProps) => {\n  const tree = parseMarkdown(text)\n  const optimizedTree = optimizeTree(tree)!\n  return <ASTNodeInterpreter node={optimizedTree} isRoot={true} className={className}/>\n}\n"],"mappings":";AACA,OAAOA,WAAU;AACjB,SAAS,eAAAC,cAAa,aAAAC,kBAAiB;;;ACDvC,SAAS,YAAY,gBAAgB;AACrC,SAAS,aAAa,iBAAiB;AACvC,OAAO,UAAU;AAiBd,cAwBG,YAxBH;AADH,IAAM,cAA2B,CAAC,aAAa,WAC5C,oBAAC,aAAU,MAAM,IAAI,WAAU,gBAAc,IAC3C,oBAAC,eAAY,MAAM,IAAI,WAAU,gBAAc;AAK7C,IAAM,aAAa,WAA4C,CAAC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,YAAY;AAAA,EACZ,kBAAkB;AACpB,GAAG,QAAQ;AAChF,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,gBAAgB;AAC7D,WAAS;AAET,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,KAAK,6DAA6D,EAAE,kBAAkB,CAAC,kBAAkB,GAAG,SAAS;AAAA,MAChI,SAAS,MAAM,CAAC,qBAAqB,cAAc,CAAC,UAAU;AAAA,MAE9D;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,6EAA6E,EAAE,6BAA6B,CAAC,WAAW,GAAG,eAAe;AAAA,YAC1J,SAAS,MAAM,qBAAqB,cAAc,CAAC,UAAU;AAAA,YAE5D;AAAA;AAAA,cACA,KAAK,UAAU;AAAA;AAAA;AAAA,QAClB;AAAA,QACC,cACC,oBAAC,SAAI,WAAU,OACZ,UACH;AAAA;AAAA;AAAA,EAEJ;AAEJ,CAAC;AAED,WAAW,cAAc;;;ACtBZ,SAYL,UAZK,OAAAC,YAAA;AA1Bb,IAAM,sBAAsB,CAAC,YAAY,SAAS;AAmB3C,IAAM,qBAAqB,CAAC;AAAA,EACE;AAAA,EACA,SAAS;AAAA,EACT,YAAY;AACd,MAA+B;AAChE,UAAQ,KAAK,MAAM;AAAA,IACjB,KAAK;AACH,aAAO,gBAAAA,KAAC,QAAE;AAAA,IACZ,KAAK;AACH,aAAO,SAAS,gBAAAA,KAAC,UAAK,WAAuB,eAAK,MAAK,IAAU,KAAK;AAAA,IACxE,KAAK;AACH,aAAQ,gBAAAA,KAAC,UAAK,WAAU,qCAAoC,sBAAQ;AAAA,IACtE,KAAK;AACH,aAAO,SACb,gBAAAA,KAAC,UAAK,WAAuB,eAAK,SAAS,IAAI,CAAC,OAAO,UACvD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UAC0G,MAAM;AAAA;AAAA,QADxF;AAAA,MAC8F,CACtH,GAAE,IAEK,gBAAAA,KAAA,YAAG,eAAK,SAAS,IAAI,CAAC,OAAO,UAAU,gBAAAA,KAAC,sBAA+B,MAAM,SAAb,KAAmB,CAAE,GAAE;AAAA,IAC3F,KAAK;AACH,aAAO,gBAAAA,KAAC,OAAG,eAAK,SAAS,IAAI,CAAC,OAAO,UAAU,gBAAAA,KAAC,sBAA+B,MAAM,SAAb,KAAmB,CAAE,GAAE;AAAA,IACjG,KAAK;AACH,aAAO,gBAAAA,KAAC,OAAG,eAAK,SAAS,IAAI,CAAC,OAAO,UAAU,gBAAAA,KAAC,sBAA+B,MAAM,SAAb,KAAmB,CAAE,GAAE;AAAA,IACjG,KAAK;AACH,aAAQ,gBAAAA,KAAC,OAAG,eAAK,SAAS,IAAI,CAAC,OAAO,UAAW,gBAAAA,KAAC,sBAA+B,MAAM,SAAb,KAAmB,CAAG,GAAE;AAAA,IACpG,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,cAAc,eAAK,SAAS,IAAI,CAAC,OAAO,UACtD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACmB,MAAM;AAAA;AAAA,QADD;AAAA,MACO,CACjC,GAAE;AAAA,IAEP,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,gBAAgB,eAAK,SAAS,IAAI,CAAC,OAAO,UACxD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACa,MAAM;AAAA;AAAA,QAAb;AAAA,MAAmB,CAC3B,GAAE;AAAA,IAEP,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,kBAAkB,eAAK,SAAS,IAAI,CAAC,OAAO,UAC1D,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACa,MAAM;AAAA;AAAA,QAAb;AAAA,MAAmB,CAC3B,GAAE;AAAA,IAEP,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,gBAAgB,eAAK,SAAS,IAAI,CAAC,OAAO,UACxD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACa,MAAM;AAAA;AAAA,QAAb;AAAA,MAAmB,CAC3B,GAAE;AAAA,IAEP,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,iBAAiB,eAAK,SAAS,IAAI,CAAC,OAAO,UACzD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACa,MAAM;AAAA;AAAA,QAAb;AAAA,MAAmB,CAC3B,GAAE;AAAA,IAEP,KAAK;AACH,aACE,gBAAAA,KAAC,UAAK,WAAU,iBAAiB,eAAK,SAAS,IAAI,CAAC,OAAO,UACzD,gBAAAA;AAAA,QAAC;AAAA;AAAA,UACa,MAAM;AAAA;AAAA,QAAb;AAAA,MAAmB,CAC3B,GAAE;AAAA,IAEP;AACE,aAAO;AAAA,EACX;AACF;AAEA,IAAM,4BAA4B;AAAA,EAChC,EAAE,IAAI,KAAK,MAAM,SAAS;AAAA,EAC1B,EAAE,IAAI,KAAK,MAAM,OAAO;AAAA,EACxB,EAAE,IAAI,KAAK,MAAM,YAAY;AAAA,EAC7B,EAAE,IAAI,SAAS,MAAM,aAAa;AAAA,EAClC,EAAE,IAAI,WAAW,MAAM,UAAU;AAAA,EACjC,EAAE,IAAI,aAAa,MAAM,YAAY;AAAA,EACrC,EAAE,IAAI,QAAQ,MAAM,OAAO;AAAA,EAC3B,EAAE,IAAI,YAAY,MAAM,WAAW;AAAA,EACnC,EAAE,IAAI,YAAY,MAAM,WAAW;AACrC;AAEA,IAAM,4BAA4B;AAAA,EAChC,EAAE,IAAI,YAAY,MAAM,WAAW;AAAA,EACnC,EAAE,IAAI,WAAW,MAAM,UAAU;AACnC;AACA,IAAM,gBAAgB,CACpB,MACA,eAAuB,MACvB,OAAe,KACf,QAAgB,QACJ;AACZ,MAAI,QAAQ,KAAK,QAAQ,YAAY;AACrC,QAAM,WAAsB,CAAC;AAG7B,SAAO,SAAS,IAAI;AAClB,QAAI,UAAU,IAAI;AAChB,eAAS,KAAK;AAAA,QACZ,MAAM;AAAA,QACN;AAAA,MACF,CAAC;AACD;AAAA,IACF;AACA,aAAS,KAAK,cAAc,KAAK,UAAU,GAAG,KAAK,CAAC,CAAC;AACrD,WAAO,KAAK,UAAU,KAAK;AAC3B,QAAI,KAAK,UAAU,GAAG;AACpB,eAAS,KAAK;AAAA,QACZ,MAAM;AAAA,QACN;AAAA,MACF,CAAC;AACD,aAAO;AACP;AAAA,IACF;AACA,UAAM,gBAAgB,CAAC,cAAc,MAAM,KAAK;AAChD,QAAI,cAAc,KAAK,WAAS,KAAK,CAAC,MAAM,KAAK,GAAG;AAClD,eAAS,KAAK;AAAA,QACZ,MAAM;AAAA,QACN,MAAM,cAAc,KAAK,WAAS,KAAK,CAAC,MAAM,KAAK;AAAA,MACrD,CAAC;AACD,aAAO,KAAK,UAAU,CAAC;AACvB,cAAQ,KAAK,QAAQ,YAAY;AACjC;AAAA,IACF;AACA,UAAM,WAAW,0BAA0B,KAAK,WAAS,KAAK,UAAU,CAAC,EAAE,WAAW,MAAM,EAAE,CAAC;AAC/F,QAAI,UAAU;AACZ,eAAS,KAAK;AAAA,QACZ,MAAM,SAAS;AAAA,MACjB,CAAC;AACD,aAAO,KAAK,UAAU,SAAS,GAAG,SAAS,CAAC;AAC5C,cAAQ,KAAK,QAAQ,YAAY;AACjC;AAAA,IACF;AACA,UAAM,WAAW,0BAA0B,KAAK,WAAS,KAAK,UAAU,CAAC,EAAE,WAAW,MAAM,EAAE,CAAC;AAC/F,QAAI,UAAU;AAEZ,UAAI,KAAK,SAAS,GAAG,SAAS,CAAC,MAAM,MAAM;AACzC,iBAAS,KAAK;AAAA,UACZ,MAAM;AAAA,UACN,MAAM,KAAK,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AAAA,QAChD,CAAC;AACD,eAAO,KAAK,UAAU,SAAS,GAAG,SAAS,CAAC;AAC5C,gBAAQ,KAAK,QAAQ,YAAY;AACjC;AAAA,MACF;AACA,UAAI,UAAU;AACd,UAAI,QAAQ,SAAS,GAAG,SAAS;AACjC,UAAI,UAAU;AACd,UAAI,WAAW;AACf,aAAO,QAAQ,KAAK,QAAQ;AAC1B,YAAI,KAAK,KAAK,MAAM,QAAQ,CAAC,UAAU;AACrC;AAAA,QACF;AACA,YAAI,KAAK,KAAK,MAAM,SAAS,CAAC,UAAU;AACtC;AACA,cAAI,YAAY,GAAG;AACjB,sBAAU;AACV;AAAA,UACF;AAAA,QACF;AACA,mBAAW,KAAK,KAAK,MAAM;AAC3B;AAAA,MACF;AAEA,UAAI,YAAY,IAAI;AAClB,iBAAS,KAAK;AAAA,UACZ,MAAM,SAAS;AAAA,UACf,UAAU,CAAC,cAAc,KAAK,UAAU,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;AAAA,QAC3E,CAAC;AACD,eAAO,KAAK,UAAU,UAAU,CAAC;AACjC,gBAAQ,KAAK,QAAQ,YAAY;AACjC;AAAA,MACF;AAAA,IACF;AAEA,aAAS,KAAK;AAAA,MACZ,MAAM;AAAA,MACN,MAAM,KAAK,CAAC;AAAA,IACd,CAAC;AACD,WAAO,KAAK,UAAU,CAAC;AACvB,YAAQ,KAAK,QAAQ,YAAY;AAAA,EACnC;AAEA,SAAO;AAAA,IACL,MAAM;AAAA,IACN;AAAA,EACF;AACF;AAEA,IAAM,eAAe,CAAC,SAAkB;AACtC,MAAI,KAAK,SAAS,QAAQ;AACxB,WAAO,CAAC,KAAK,OAAO,SAAY;AAAA,EAClC;AACA,MAAI,oBAAoB,KAAK,WAAS,UAAU,KAAK,IAAI,GAAG;AAC1D,WAAO;AAAA,EACT;AAEA,QAAM,cAAc;AAGpB,MAAI,YAAY,SAAS,WAAW,GAAG;AACrC,WAAO;AAAA,EACT;AAEA,MAAI,WAAsB,CAAC;AAC3B,WAAS,IAAI,GAAG,IAAI,YAAY,SAAS,QAAQ,KAAK;AACpD,UAAM,QAAQ,aAAa,YAAY,SAAS,CAAC,CAAE;AACnD,QAAI,CAAC,OAAO;AACV;AAAA,IACF;AACA,QAAI,MAAM,SAAS,QAAQ;AACzB,eAAS,KAAK,GAAG,MAAM,QAAQ;AAAA,IACjC,OAAO;AACL,eAAS,KAAK,KAAK;AAAA,IACrB;AAAA,EACF;AAEA,cAAY,WAAW;AACvB,aAAW,CAAC;AAEZ,WAAS,IAAI,GAAG,IAAI,YAAY,SAAS,QAAQ,KAAK;AACpD,UAAM,QAAQ,YAAY,SAAS,CAAC;AACpC,QAAI,OAAO;AACT,UAAI,MAAM,SAAS,UAAU,SAAS,SAAS,SAAS,CAAC,GAAG,SAAS,QAAQ;AAC3E,QAAC,SAAS,SAAS,SAAS,CAAC,EAAkD,QAAQ,MAAM;AAAA,MAC/F,OAAO;AACL,iBAAS,KAAK,KAAK;AAAA,MACrB;AAAA,IACF;AAAA,EACF;AACA,cAAY,WAAW;AACvB,SAAO;AACT;AAOO,IAAM,sBAAsB,CAAC,EAAE,MAAM,UAAU,MAAgC;AACpF,QAAM,OAAO,cAAc,IAAI;AAC/B,QAAM,gBAAgB,aAAa,IAAI;AACvC,SAAO,gBAAAA,KAAC,sBAAmB,MAAM,eAAe,QAAQ,MAAM,WAAqB;AACrF;;;AF7OkB,gBAAAC,YAAA;AAXX,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AACF,MAAuB;AACrB,QAAM,cAAc;AACpB,SACE,gBAAAA,KAAC,SAAI,WAAU,eACZ,kBAAQ,IAAI,CAAC,EAAE,IAAI,OAAO,SAAS,GAAG,UAAU,MAC/C,gBAAAA;AAAA,IAAC;AAAA;AAAA,MAEE,GAAG;AAAA,MACJ,OAAQ,gBAAAA,KAAC,QAAG,IAAQ,WAAU,sBAAsB,iBAAM;AAAA,MAC1D,mBAAmB;AAAA,MACnB,MAAM,CAAC,aAAa,WACf,gBAAAA,KAACC,YAAA,EAAU,MAAM,aAAa,WAAU,gBAAe,OAAO,EAAE,UAAU,GAAG,WAAW,KAAK,GAAE,IAC/F,gBAAAD,KAACE,cAAA,EAAY,MAAM,aAAa,WAAU,gBAAc;AAAA,MAE7D,WAAWC,MAAK,cAAc,mBAAmB;AAAA,MACjD,iBAAgB;AAAA,MAEhB,0BAAAH,KAAC,SAAI,WAAU,kBACZ,kBAAQ,SAAS,aAAc,gBAAAA,KAAC,uBAAoB,MAAM,QAAQ,OAAM,IAAM,QAAQ,OACzF;AAAA;AAAA,IAbK;AAAA,EAcP,CACD,GACH;AAEJ;","names":["clsx","ChevronDown","ChevronUp","jsx","jsx","ChevronUp","ChevronDown","clsx"]}

package/dist/components/layout/Tile.d.mts

@@ -0,0 +1,37 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type TileProps = {
+    title: {
+        value: string;
+        className?: string;
+    };
+    description?: {
+        value: string;
+        className?: string;
+    };
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    className?: string;
+};
+/**
+ * A component for creating a tile similar to the flutter ListTile
+ */
+declare const Tile: ({ title, description, prefix, suffix, className }: TileProps) => react_jsx_runtime.JSX.Element;
+type ImageLocation = 'prefix' | 'suffix';
+type ImageSize = {
+    width: number;
+    height: number;
+};
+type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {
+    url: string;
+    imageLocation?: ImageLocation;
+    imageSize?: ImageSize;
+    imageClassName?: string;
+};
+/**
+ * A Tile with an image as prefix or suffix
+ */
+declare const TileWithImage: ({ url, imageLocation, imageSize, imageClassName, ...tileProps }: TileWithImageProps) => react_jsx_runtime.JSX.Element;
+
+export { Tile, type TileProps, TileWithImage, type TileWithImageProps };

package/dist/components/layout/Tile.d.ts

@@ -1,5 +1,7 @@
-import type { ReactNode } from 'react';
-export type TileProps = {
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ReactNode } from 'react';
+
+type TileProps = {
     title: {
         value: string;
         className?: string;
@@ -15,13 +17,13 @@ export type TileProps = {
 /**
  * A component for creating a tile similar to the flutter ListTile
  */
-export declare const Tile: ({ title, description, prefix, suffix, className }: TileProps) => import("react/jsx-runtime").JSX.Element;
+declare const Tile: ({ title, description, prefix, suffix, className }: TileProps) => react_jsx_runtime.JSX.Element;
 type ImageLocation = 'prefix' | 'suffix';
 type ImageSize = {
     width: number;
     height: number;
 };
-export type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {
+type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {
     url: string;
     imageLocation?: ImageLocation;
     imageSize?: ImageSize;
@@ -30,5 +32,6 @@ export type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {
 /**
  * A Tile with an image as prefix or suffix
  */
-export declare const TileWithImage: ({ url, imageLocation, imageSize, imageClassName, ...tileProps }: TileWithImageProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+declare const TileWithImage: ({ url, imageLocation, imageSize, imageClassName, ...tileProps }: TileWithImageProps) => react_jsx_runtime.JSX.Element;
+
+export { Tile, type TileProps, TileWithImage, type TileWithImageProps };

package/dist/components/layout/Tile.js

@@ -1,18 +1,78 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Image from 'next/image';
-import clsx from 'clsx';
-/**
- * A component for creating a tile similar to the flutter ListTile
- */
-export const Tile = ({ title, description, prefix, suffix, className }) => {
-    var _a;
-    return (_jsxs("div", { className: clsx('row gap-x-4 w-full items-center', className), children: [prefix, _jsxs("div", { className: "col w-full", children: [_jsx("span", { className: clsx(title.className), children: title.value }), !!description &&
-                        _jsx("span", { className: clsx((_a = description.className) !== null && _a !== void 0 ? _a : 'textstyle-description'), children: description.value })] }), suffix] }));
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-/**
- * A Tile with an image as prefix or suffix
- */
-export const TileWithImage = ({ url, imageLocation = 'prefix', imageSize = { width: 24, height: 24 }, imageClassName = '', ...tileProps }) => {
-    const image = _jsx(Image, { src: url, alt: "", ...imageSize, className: clsx(imageClassName) });
-    return (_jsx(Tile, { ...tileProps, prefix: imageLocation === 'prefix' ? image : undefined, suffix: imageLocation === 'suffix' ? image : undefined }));
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/layout/Tile.tsx
+var Tile_exports = {};
+__export(Tile_exports, {
+  Tile: () => Tile,
+  TileWithImage: () => TileWithImage
+});
+module.exports = __toCommonJS(Tile_exports);
+var import_image = __toESM(require("next/image"));
+var import_clsx = __toESM(require("clsx"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var Tile = ({
+  title,
+  description,
+  prefix,
+  suffix,
+  className
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_clsx.default)("row gap-x-4 w-full items-center", className), children: [
+    prefix,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "col w-full", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_clsx.default)(title.className), children: title.value }),
+      !!description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_clsx.default)(description.className ?? "textstyle-description"), children: description.value })
+    ] }),
+    suffix
+  ] });
+};
+var TileWithImage = ({
+  url,
+  imageLocation = "prefix",
+  imageSize = { width: 24, height: 24 },
+  imageClassName = "",
+  ...tileProps
+}) => {
+  const image = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: url, alt: "", ...imageSize, className: (0, import_clsx.default)(imageClassName) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    Tile,
+    {
+      ...tileProps,
+      prefix: imageLocation === "prefix" ? image : void 0,
+      suffix: imageLocation === "suffix" ? image : void 0
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Tile,
+  TileWithImage
+});
+//# sourceMappingURL=Tile.js.map

package/dist/components/layout/Tile.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layout/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport Image from 'next/image'\nimport clsx from 'clsx'\n\nexport type TileProps = {\n  title: { value: string, className?: string },\n  description?: { value: string, className?: string },\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n  title,\n  description,\n  prefix,\n  suffix,\n  className\n}: TileProps) => {\n  return (\n    <div className={clsx('row gap-x-4 w-full items-center', className)}>\n      {prefix}\n      <div className=\"col w-full\">\n        <span className={clsx(title.className)}>{title.value}</span>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix}\n    </div>\n  )\n}\n\ntype ImageLocation = 'prefix' | 'suffix'\ntype ImageSize = {\n  width: number,\n  height: number,\n}\n\nexport type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {\n  url: string,\n  imageLocation?: ImageLocation,\n  imageSize?: ImageSize,\n  imageClassName?: string,\n}\n\n/**\n * A Tile with an image as prefix or suffix\n */\nexport const TileWithImage = ({\n  url,\n  imageLocation = 'prefix',\n  imageSize = { width: 24, height: 24 },\n  imageClassName = '',\n  ...tileProps\n}: TileWithImageProps) => {\n  const image = <Image src={url} alt=\"\" {...imageSize} className={clsx(imageClassName)}/>\n  return (\n    <Tile\n      {...tileProps}\n      prefix={imageLocation === 'prefix' ? image : undefined}\n      suffix={imageLocation === 'suffix' ? image : undefined}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkB;AAClB,kBAAiB;AAuBX;AAVC,IAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiB;AACf,SACE,6CAAC,SAAI,eAAW,YAAAA,SAAK,mCAAmC,SAAS,GAC9D;AAAA;AAAA,IACD,6CAAC,SAAI,WAAU,cACb;AAAA,kDAAC,UAAK,eAAW,YAAAA,SAAK,MAAM,SAAS,GAAI,gBAAM,OAAM;AAAA,MACpD,CAAC,CAAC,eACD,4CAAC,UAAK,eAAW,YAAAA,SAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,OAChG;AAAA,IACC;AAAA,KACH;AAEJ;AAkBO,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA,gBAAgB;AAAA,EAChB,YAAY,EAAE,OAAO,IAAI,QAAQ,GAAG;AAAA,EACpC,iBAAiB;AAAA,EACjB,GAAG;AACL,MAA0B;AACxB,QAAM,QAAQ,4CAAC,aAAAC,SAAA,EAAM,KAAK,KAAK,KAAI,IAAI,GAAG,WAAW,eAAW,YAAAD,SAAK,cAAc,GAAE;AACrF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,QAAQ,kBAAkB,WAAW,QAAQ;AAAA,MAC7C,QAAQ,kBAAkB,WAAW,QAAQ;AAAA;AAAA,EAC/C;AAEJ;","names":["clsx","Image"]}

package/dist/components/layout/Tile.mjs

@@ -0,0 +1,42 @@
+// src/components/layout/Tile.tsx
+import Image from "next/image";
+import clsx from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Tile = ({
+  title,
+  description,
+  prefix,
+  suffix,
+  className
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: clsx("row gap-x-4 w-full items-center", className), children: [
+    prefix,
+    /* @__PURE__ */ jsxs("div", { className: "col w-full", children: [
+      /* @__PURE__ */ jsx("span", { className: clsx(title.className), children: title.value }),
+      !!description && /* @__PURE__ */ jsx("span", { className: clsx(description.className ?? "textstyle-description"), children: description.value })
+    ] }),
+    suffix
+  ] });
+};
+var TileWithImage = ({
+  url,
+  imageLocation = "prefix",
+  imageSize = { width: 24, height: 24 },
+  imageClassName = "",
+  ...tileProps
+}) => {
+  const image = /* @__PURE__ */ jsx(Image, { src: url, alt: "", ...imageSize, className: clsx(imageClassName) });
+  return /* @__PURE__ */ jsx(
+    Tile,
+    {
+      ...tileProps,
+      prefix: imageLocation === "prefix" ? image : void 0,
+      suffix: imageLocation === "suffix" ? image : void 0
+    }
+  );
+};
+export {
+  Tile,
+  TileWithImage
+};
+//# sourceMappingURL=Tile.mjs.map

package/dist/components/layout/Tile.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/layout/Tile.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport Image from 'next/image'\nimport clsx from 'clsx'\n\nexport type TileProps = {\n  title: { value: string, className?: string },\n  description?: { value: string, className?: string },\n  prefix?: ReactNode,\n  suffix?: ReactNode,\n  className?: string,\n}\n\n/**\n * A component for creating a tile similar to the flutter ListTile\n */\nexport const Tile = ({\n  title,\n  description,\n  prefix,\n  suffix,\n  className\n}: TileProps) => {\n  return (\n    <div className={clsx('row gap-x-4 w-full items-center', className)}>\n      {prefix}\n      <div className=\"col w-full\">\n        <span className={clsx(title.className)}>{title.value}</span>\n        {!!description &&\n          <span className={clsx(description.className ?? 'textstyle-description')}>{description.value}</span>}\n      </div>\n      {suffix}\n    </div>\n  )\n}\n\ntype ImageLocation = 'prefix' | 'suffix'\ntype ImageSize = {\n  width: number,\n  height: number,\n}\n\nexport type TileWithImageProps = Omit<TileProps, 'suffix' | 'prefix'> & {\n  url: string,\n  imageLocation?: ImageLocation,\n  imageSize?: ImageSize,\n  imageClassName?: string,\n}\n\n/**\n * A Tile with an image as prefix or suffix\n */\nexport const TileWithImage = ({\n  url,\n  imageLocation = 'prefix',\n  imageSize = { width: 24, height: 24 },\n  imageClassName = '',\n  ...tileProps\n}: TileWithImageProps) => {\n  const image = <Image src={url} alt=\"\" {...imageSize} className={clsx(imageClassName)}/>\n  return (\n    <Tile\n      {...tileProps}\n      prefix={imageLocation === 'prefix' ? image : undefined}\n      suffix={imageLocation === 'suffix' ? image : undefined}\n    />\n  )\n}\n"],"mappings":";AACA,OAAO,WAAW;AAClB,OAAO,UAAU;AAuBX,SACE,KADF;AAVC,IAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiB;AACf,SACE,qBAAC,SAAI,WAAW,KAAK,mCAAmC,SAAS,GAC9D;AAAA;AAAA,IACD,qBAAC,SAAI,WAAU,cACb;AAAA,0BAAC,UAAK,WAAW,KAAK,MAAM,SAAS,GAAI,gBAAM,OAAM;AAAA,MACpD,CAAC,CAAC,eACD,oBAAC,UAAK,WAAW,KAAK,YAAY,aAAa,uBAAuB,GAAI,sBAAY,OAAM;AAAA,OAChG;AAAA,IACC;AAAA,KACH;AAEJ;AAkBO,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA,gBAAgB;AAAA,EAChB,YAAY,EAAE,OAAO,IAAI,QAAQ,GAAG;AAAA,EACpC,iBAAiB;AAAA,EACjB,GAAG;AACL,MAA0B;AACxB,QAAM,QAAQ,oBAAC,SAAM,KAAK,KAAK,KAAI,IAAI,GAAG,WAAW,WAAW,KAAK,cAAc,GAAE;AACrF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,QAAQ,kBAAkB,WAAW,QAAQ;AAAA,MAC7C,QAAQ,kBAAkB,WAAW,QAAQ;AAAA;AAAA,EAC/C;AAEJ;","names":[]}

package/dist/components/modals/ConfirmDialog.d.mts

@@ -0,0 +1,38 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PropsWithChildren } from 'react';
+import { SolidButtonColor } from '../Button.mjs';
+import { PropsForTranslation } from '../../hooks/useTranslation.mjs';
+import { ModalProps } from './Modal.mjs';
+import '../../hooks/useLanguage.mjs';
+
+type ConfirmDialogTranslation = {
+    confirm: string;
+    cancel: string;
+    decline: string;
+};
+type ConfirmDialogType = 'positive' | 'negative' | 'neutral';
+type ButtonOverwriteType = {
+    text?: string;
+    color?: SolidButtonColor;
+    disabled?: boolean;
+};
+type ConfirmDialogProps = ModalProps & {
+    isShowingDecline?: boolean;
+    requireAnswer?: boolean;
+    onCancel?: () => void;
+    onConfirm: () => void;
+    onDecline?: () => void;
+    confirmType?: ConfirmDialogType;
+    /**
+     * Order: Cancel, Decline, Confirm
+     */
+    buttonOverwrites?: [ButtonOverwriteType, ButtonOverwriteType, ButtonOverwriteType];
+};
+/**
+ * A Dialog for asking the user for Confirmation
+ *
+ * To require an answer omit the onBackgroundClick
+ */
+declare const ConfirmDialog: ({ overwriteTranslation, children, onCancel, onConfirm, onDecline, confirmType, buttonOverwrites, ...restProps }: PropsForTranslation<ConfirmDialogTranslation, PropsWithChildren<ConfirmDialogProps>>) => react_jsx_runtime.JSX.Element;
+
+export { type ButtonOverwriteType, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogType };

package/dist/components/modals/ConfirmDialog.d.ts

@@ -1,19 +1,22 @@
-import type { PropsWithChildren } from 'react';
-import type { SolidButtonColor } from '../Button';
-import type { PropsForTranslation } from '../../hooks/useTranslation';
-import { type ModalProps } from './Modal';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { PropsWithChildren } from 'react';
+import { SolidButtonColor } from '../Button.js';
+import { PropsForTranslation } from '../../hooks/useTranslation.js';
+import { ModalProps } from './Modal.js';
+import '../../hooks/useLanguage.js';
+
 type ConfirmDialogTranslation = {
     confirm: string;
     cancel: string;
     decline: string;
 };
-export type ConfirmDialogType = 'positive' | 'negative' | 'neutral';
-export type ButtonOverwriteType = {
+type ConfirmDialogType = 'positive' | 'negative' | 'neutral';
+type ButtonOverwriteType = {
     text?: string;
     color?: SolidButtonColor;
     disabled?: boolean;
 };
-export type ConfirmDialogProps = ModalProps & {
+type ConfirmDialogProps = ModalProps & {
     isShowingDecline?: boolean;
     requireAnswer?: boolean;
     onCancel?: () => void;
@@ -30,5 +33,6 @@ export type ConfirmDialogProps = ModalProps & {
  *
  * To require an answer omit the onBackgroundClick
  */
-export declare const ConfirmDialog: ({ overwriteTranslation, children, onCancel, onConfirm, onDecline, confirmType, buttonOverwrites, ...restProps }: PropsForTranslation<ConfirmDialogTranslation, PropsWithChildren<ConfirmDialogProps>>) => import("react/jsx-runtime").JSX.Element;
-export {};
+declare const ConfirmDialog: ({ overwriteTranslation, children, onCancel, onConfirm, onDecline, confirmType, buttonOverwrites, ...restProps }: PropsForTranslation<ConfirmDialogTranslation, PropsWithChildren<ConfirmDialogProps>>) => react_jsx_runtime.JSX.Element;
+
+export { type ButtonOverwriteType, ConfirmDialog, type ConfirmDialogProps, type ConfirmDialogType };