@mittwald/flow-react-components 0.2.0-alpha.752 → 0.2.0-alpha.754

package/dist/js/packages/components/src/components/Markdown/Markdown.mjs

@@ -25,10 +25,9 @@ const Markdown = (props) => {
     ...rest
   } = props;
   const headingAndLinkColor = color === "default" ? "primary" : color;
-  const textColor = color === "default" ? void 0 : color;
   const components = {
     a: (props2) => /* @__PURE__ */ jsx(Link, { target: "_blank", color: headingAndLinkColor, href: props2.href, children: props2.children }),
-    p: (props2) => /* @__PURE__ */ jsx(Text, { elementType: "p", color: textColor, children: props2.children }),
+    p: (props2) => /* @__PURE__ */ jsx(Text, { elementType: "p", color, children: props2.children }),
     code: (props2) => /* @__PURE__ */ jsx(InlineCode, { color, children: props2.children }),
     h1: (props2) => /* @__PURE__ */ jsx(
       Heading,
@@ -95,9 +94,9 @@ const Markdown = (props) => {
         }
       );
     },
-    ul: (props2) => /* @__PURE__ */ jsx(Text, { color: textColor, children: /* @__PURE__ */ jsx("ul", { children: props2.children }) }),
-    ol: (props2) => /* @__PURE__ */ jsx(Text, { color: textColor, children: /* @__PURE__ */ jsx("ol", { children: props2.children }) }),
-    blockquote: (props2) => /* @__PURE__ */ jsx(Text, { color: textColor, children: /* @__PURE__ */ jsx("blockquote", { children: props2.children }) })
+    ul: (props2) => /* @__PURE__ */ jsx(Text, { color, children: /* @__PURE__ */ jsx("ul", { children: props2.children }) }),
+    ol: (props2) => /* @__PURE__ */ jsx(Text, { color, children: /* @__PURE__ */ jsx("ol", { children: props2.children }) }),
+    blockquote: (props2) => /* @__PURE__ */ jsx(Text, { color, children: /* @__PURE__ */ jsx("blockquote", { children: props2.children }) })
   };
   const textContent = extractTextFromFirstChild(children);
   return /* @__PURE__ */ jsx("div", { className: clsx(styles.markdown, className), ...rest, ref, children: /* @__PURE__ */ jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], components, children: textContent }) });

package/dist/js/packages/components/src/components/Markdown/Markdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Markdown.mjs","sources":["../../../../../../../src/components/Markdown/Markdown.tsx"],"sourcesContent":["import { CodeBlock } from \"@/components/CodeBlock\";\nimport { Heading } from \"@/components/Heading\";\nimport { InlineCode } from \"@/components/InlineCode\";\nimport { Link } from \"@/components/Link\";\nimport { Separator } from \"@/components/Separator\";\nimport { Text } from \"@/components/Text\";\nimport type { CSSProperties, FC, ReactNode, Ref } from \"react\";\nimport { Children, isValidElement } from \"react\";\nimport type { Components, Options } from \"react-markdown\";\nimport ReactMarkdown from \"react-markdown\";\nimport styles from \"./Markdown.module.scss\";\nimport { extractTextFromFirstChild } from \"@/lib/react/remote\";\nimport type { PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport remarkGfm from \"remark-gfm\";\nimport { getHeadingLevelWithOffset } from \"@/components/Markdown/lib/getHeadingLevelWithOffset\";\nimport type { CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\n\nexport interface MarkdownProps\n  extends PropsWithClassName, Omit<Options, \"components\"> {\n  /** The color schema of the markdown component. */\n  color?: \"dark\" | \"light\" | \"default\";\n  /** Shifts all heading levels by the given offset. @default 0 */\n  headingOffset?: number;\n  /** @internal */\n  style?: CSSProperties;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/** @flr-generate all */\nexport const Markdown: FC<MarkdownProps> = (props) => {\n  const {\n    children,\n    color = \"default\",\n    className,\n    headingOffset = 0,\n    ref,\n    ...rest\n  } = props;\n\n  const headingAndLinkColor = color === \"default\" ? \"primary\" : color;\n  const textColor = color === \"default\" ? undefined : color;\n\n  const components: Components = {\n    a: (props) => (\n      <Link target=\"_blank\" color={headingAndLinkColor} href={props.href}>\n        {props.children}\n      </Link>\n    ),\n    p: (props) => (\n      <Text elementType=\"p\" color={textColor}>\n        {props.children}\n      </Text>\n    ),\n    code: (props) => <InlineCode color={color}>{props.children}</InlineCode>,\n    h1: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(1, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h2: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(2, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h3: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(3, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h4: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(4, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h5: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(5, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h6: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(6, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    hr: () => <Separator />,\n    pre: (props) => {\n      const preElementContent = Children.toArray(props.children)[0];\n\n      return (\n        <CodeBlock\n          copyable={false}\n          language={\n            isValidElement<{ className?: string }>(preElementContent) &&\n            preElementContent.props.className\n              ? (preElementContent.props.className.replace(\n                  \"language-\",\n                  \"\",\n                ) as CodeEditorLanguage)\n              : undefined\n          }\n          code={String(\n            isValidElement<{ children: string }>(preElementContent)\n              ? preElementContent.props.children\n              : preElementContent,\n          ).trim()}\n        />\n      );\n    },\n    ul: (props) => (\n      <Text color={textColor}>\n        <ul>{props.children as ReactNode}</ul>\n      </Text>\n    ),\n    ol: (props) => (\n      <Text color={textColor}>\n        <ol>{props.children as ReactNode}</ol>\n      </Text>\n    ),\n    blockquote: (props) => (\n      <Text color={textColor}>\n        <blockquote>{props.children}</blockquote>\n      </Text>\n    ),\n  };\n\n  const textContent = extractTextFromFirstChild(children);\n\n  return (\n    <div className={clsx(styles.markdown, className)} {...rest} ref={ref}>\n      <ReactMarkdown remarkPlugins={[remarkGfm]} components={components}>\n        {textContent}\n      </ReactMarkdown>\n    </div>\n  );\n};\n\nexport default Markdown;\n"],"names":["props"],"mappings":"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"}
+{"version":3,"file":"Markdown.mjs","sources":["../../../../../../../src/components/Markdown/Markdown.tsx"],"sourcesContent":["import { CodeBlock } from \"@/components/CodeBlock\";\nimport { Heading } from \"@/components/Heading\";\nimport { InlineCode } from \"@/components/InlineCode\";\nimport { Link } from \"@/components/Link\";\nimport { Separator } from \"@/components/Separator\";\nimport { Text } from \"@/components/Text\";\nimport type { CSSProperties, FC, ReactNode, Ref } from \"react\";\nimport { Children, isValidElement } from \"react\";\nimport type { Components, Options } from \"react-markdown\";\nimport ReactMarkdown from \"react-markdown\";\nimport styles from \"./Markdown.module.scss\";\nimport { extractTextFromFirstChild } from \"@/lib/react/remote\";\nimport type { AlphaColor, PropsWithClassName } from \"@/lib/types/props\";\nimport clsx from \"clsx\";\nimport remarkGfm from \"remark-gfm\";\nimport { getHeadingLevelWithOffset } from \"@/components/Markdown/lib/getHeadingLevelWithOffset\";\nimport type { CodeEditorLanguage } from \"@/components/CodeEditor/languages\";\n\nexport interface MarkdownProps\n  extends PropsWithClassName, Omit<Options, \"components\"> {\n  /** The color schema of the markdown component. @default \"default\" */\n  color?: \"default\" | AlphaColor;\n  /** Shifts all heading levels by the given offset. @default 0 */\n  headingOffset?: number;\n  /** @internal */\n  style?: CSSProperties;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/** @flr-generate all */\nexport const Markdown: FC<MarkdownProps> = (props) => {\n  const {\n    children,\n    color = \"default\",\n    className,\n    headingOffset = 0,\n    ref,\n    ...rest\n  } = props;\n\n  const headingAndLinkColor = color === \"default\" ? \"primary\" : color;\n\n  const components: Components = {\n    a: (props) => (\n      <Link target=\"_blank\" color={headingAndLinkColor} href={props.href}>\n        {props.children}\n      </Link>\n    ),\n    p: (props) => (\n      <Text elementType=\"p\" color={color}>\n        {props.children}\n      </Text>\n    ),\n    code: (props) => <InlineCode color={color}>{props.children}</InlineCode>,\n    h1: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(1, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h2: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(2, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h3: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(3, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h4: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(4, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h5: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(5, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    h6: (props) => (\n      <Heading\n        level={getHeadingLevelWithOffset(6, headingOffset)}\n        color={headingAndLinkColor}\n      >\n        {props.children}\n      </Heading>\n    ),\n    hr: () => <Separator />,\n    pre: (props) => {\n      const preElementContent = Children.toArray(props.children)[0];\n\n      return (\n        <CodeBlock\n          copyable={false}\n          language={\n            isValidElement<{ className?: string }>(preElementContent) &&\n            preElementContent.props.className\n              ? (preElementContent.props.className.replace(\n                  \"language-\",\n                  \"\",\n                ) as CodeEditorLanguage)\n              : undefined\n          }\n          code={String(\n            isValidElement<{ children: string }>(preElementContent)\n              ? preElementContent.props.children\n              : preElementContent,\n          ).trim()}\n        />\n      );\n    },\n    ul: (props) => (\n      <Text color={color}>\n        <ul>{props.children as ReactNode}</ul>\n      </Text>\n    ),\n    ol: (props) => (\n      <Text color={color}>\n        <ol>{props.children as ReactNode}</ol>\n      </Text>\n    ),\n    blockquote: (props) => (\n      <Text color={color}>\n        <blockquote>{props.children}</blockquote>\n      </Text>\n    ),\n  };\n\n  const textContent = extractTextFromFirstChild(children);\n\n  return (\n    <div className={clsx(styles.markdown, className)} {...rest} ref={ref}>\n      <ReactMarkdown remarkPlugins={[remarkGfm]} components={components}>\n        {textContent}\n      </ReactMarkdown>\n    </div>\n  );\n};\n\nexport default Markdown;\n"],"names":["props"],"mappings":"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"}

package/dist/js/packages/components/src/components/Text/Text.mjs

@@ -5,6 +5,7 @@ import 'react';
 import * as Aria from 'react-aria-components';
 import '../../lib/propsContext/propsContext.mjs';
 import { PropsContextProvider } from '../../lib/propsContext/components/PropsContextProvider.mjs';
+import { isAlphaColor } from '../../lib/types/props.mjs';
 import invariant from 'invariant';
 import { flowComponent } from '../../lib/componentFactory/flowComponent.mjs';
 import { EmulatedBoldText } from '../EmulatedBoldText/EmulatedBoldText.mjs';
@@ -19,7 +20,7 @@ const Text = flowComponent("Text", (props) => {
     elementType = "span",
     emulateBoldWidth,
     ref,
-    color,
+    color = "default",
     align = "start",
     wrap,
     style: styleFromProps,
@@ -29,7 +30,7 @@ const Text = flowComponent("Text", (props) => {
   } = props;
   const rootClassName = clsx(
     styles.text,
-    color && styles[color],
+    isAlphaColor(color) && styles[color],
     align && styles[`align-${align}`],
     wrap && styles[`wrap-${wrap}`],
     className

package/dist/js/packages/components/src/components/Text/Text.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Text.mjs","sources":["../../../../../../../src/components/Text/Text.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport type { PropsWithElementType } from \"@/lib/types/props\";\nimport invariant from \"invariant\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { EmulatedBoldText } from \"@/components/EmulatedBoldText\";\nimport { Wrap } from \"@/components/Wrap\";\nimport clsx from \"clsx\";\nimport styles from \"./Text.module.scss\";\n\nexport interface TextProps\n  extends\n    PropsWithChildren,\n    Omit<Aria.TextProps, \"children\" | \"elementType\">,\n    PropsWithElementType<\"span\" | \"div\" | \"p\">,\n    FlowComponentProps {\n  /* Whether the elements width should match the width it would have with mold text. */\n  emulateBoldWidth?: boolean;\n  /* The color of the text. */\n  color?: \"light\" | \"dark\";\n  /* The alignment of the text. @default \"start\" */\n  align?: \"start\" | \"end\" | \"center\";\n  /* The text-wrap property of the text. @default undefined */\n  wrap?: \"wrap\" | \"balance\" | \"pretty\";\n  /* The white-space property of the text. @default undefined */\n  whiteSpace?: React.CSSProperties[\"whiteSpace\"];\n  /* The word-break property of the text. @default undefined */\n  wordBreak?: React.CSSProperties[\"wordBreak\"];\n}\n\n/** @flr-generate all */\nexport const Text = flowComponent(\"Text\", (props) => {\n  const {\n    children,\n    className,\n    elementType = \"span\",\n    emulateBoldWidth,\n    ref,\n    color,\n    align = \"start\",\n    wrap,\n    style: styleFromProps,\n    whiteSpace,\n    wordBreak,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.text,\n    color && styles[color],\n    align && styles[`align-${align}`],\n    wrap && styles[`wrap-${wrap}`],\n    className,\n  );\n\n  const textProps = { ...rest, className: rootClassName };\n\n  const propsContext: PropsContext = {\n    Link: {\n      inline: true,\n    },\n    Icon: { className: styles.icon },\n    Kbd: { variant: \"soft\" },\n  };\n\n  const style = { whiteSpace, wordBreak, ...styleFromProps };\n\n  const childrenElement = (\n    <PropsContextProvider props={propsContext}>\n      <Wrap if={emulateBoldWidth}>\n        <EmulatedBoldText>{children}</EmulatedBoldText>\n      </Wrap>\n    </PropsContextProvider>\n  );\n\n  if (!props.slot) {\n    const Element = elementType;\n    return (\n      <Element style={style} {...textProps} ref={ref}>\n        {childrenElement}\n      </Element>\n    );\n  }\n\n  invariant(\n    typeof elementType === \"string\",\n    \"'elementType' in Text component must be of type string\",\n  );\n\n  return (\n    <Aria.Text style={style} {...textProps} elementType={elementType} ref={ref}>\n      {childrenElement}\n    </Aria.Text>\n  );\n});\n\nexport default Text;\n"],"names":[],"mappings":";;;;;;;;;;;;AAmCO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA,GAAc,MAAA;AAAA,IACd,gBAAA;AAAA,IACA,GAAA;AAAA,IACA,KAAA;AAAA,IACA,KAAA,GAAQ,OAAA;AAAA,IACR,IAAA;AAAA,IACA,KAAA,EAAO,cAAA;AAAA,IACP,UAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,IAAA;AAAA,IACP,KAAA,IAAS,OAAO,KAAK,CAAA;AAAA,IACrB,KAAA,IAAS,MAAA,CAAO,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,CAAA;AAAA,IAChC,IAAA,IAAQ,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAAA;AAAA,IAC7B;AAAA,GACF;AAEA,EAAA,MAAM,SAAA,GAAY,EAAE,GAAG,IAAA,EAAM,WAAW,aAAA,EAAc;AAEtD,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM;AAAA,MACJ,MAAA,EAAQ;AAAA,KACV;AAAA,IACA,IAAA,EAAM,EAAE,SAAA,EAAW,MAAA,CAAO,IAAA,EAAK;AAAA,IAC/B,GAAA,EAAK,EAAE,OAAA,EAAS,MAAA;AAAO,GACzB;AAEA,EAAA,MAAM,KAAA,GAAQ,EAAE,UAAA,EAAY,SAAA,EAAW,GAAG,cAAA,EAAe;AAEzD,EAAA,MAAM,eAAA,mBACJ,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,gBAAA,EACR,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAkB,QAAA,EAAS,GAC9B,CAAA,EACF,CAAA;AAGF,EAAA,IAAI,CAAC,MAAM,IAAA,EAAM;AACf,IAAA,MAAM,OAAA,GAAU,WAAA;AAChB,IAAA,2BACG,OAAA,EAAA,EAAQ,KAAA,EAAe,GAAG,SAAA,EAAW,KACnC,QAAA,EAAA,eAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,SAAA;AAAA,IACE,OAAO,WAAA,KAAgB,QAAA;AAAA,IACvB;AAAA,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,KAAK,IAAA,EAAL,EAAU,OAAe,GAAG,SAAA,EAAW,WAAA,EAA0B,GAAA,EAC/D,QAAA,EAAA,eAAA,EACH,CAAA;AAEJ,CAAC;;;;"}
+{"version":3,"file":"Text.mjs","sources":["../../../../../../../src/components/Text/Text.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\nimport * as Aria from \"react-aria-components\";\nimport type { PropsContext } from \"@/lib/propsContext\";\nimport { PropsContextProvider } from \"@/lib/propsContext\";\nimport {\n  type AlphaColor,\n  isAlphaColor,\n  type PropsWithElementType,\n} from \"@/lib/types/props\";\nimport invariant from \"invariant\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport { flowComponent } from \"@/lib/componentFactory/flowComponent\";\nimport { EmulatedBoldText } from \"@/components/EmulatedBoldText\";\nimport { Wrap } from \"@/components/Wrap\";\nimport clsx from \"clsx\";\nimport styles from \"./Text.module.scss\";\n\nexport interface TextProps\n  extends\n    PropsWithChildren,\n    Omit<Aria.TextProps, \"children\" | \"elementType\">,\n    PropsWithElementType<\"span\" | \"div\" | \"p\">,\n    FlowComponentProps {\n  /* Whether the elements width should match the width it would have with mold text. */\n  emulateBoldWidth?: boolean;\n  /* The color of the text. @default \"default\" */\n  color?: \"default\" | AlphaColor;\n  /* The alignment of the text. @default \"start\" */\n  align?: \"start\" | \"end\" | \"center\";\n  /* The text-wrap property of the text. @default undefined */\n  wrap?: \"wrap\" | \"balance\" | \"pretty\";\n  /* The white-space property of the text. @default undefined */\n  whiteSpace?: React.CSSProperties[\"whiteSpace\"];\n  /* The word-break property of the text. @default undefined */\n  wordBreak?: React.CSSProperties[\"wordBreak\"];\n}\n\n/** @flr-generate all */\nexport const Text = flowComponent(\"Text\", (props) => {\n  const {\n    children,\n    className,\n    elementType = \"span\",\n    emulateBoldWidth,\n    ref,\n    color = \"default\",\n    align = \"start\",\n    wrap,\n    style: styleFromProps,\n    whiteSpace,\n    wordBreak,\n    ...rest\n  } = props;\n\n  const rootClassName = clsx(\n    styles.text,\n    isAlphaColor(color) && styles[color],\n    align && styles[`align-${align}`],\n    wrap && styles[`wrap-${wrap}`],\n    className,\n  );\n\n  const textProps = { ...rest, className: rootClassName };\n\n  const propsContext: PropsContext = {\n    Link: {\n      inline: true,\n    },\n    Icon: { className: styles.icon },\n    Kbd: { variant: \"soft\" },\n  };\n\n  const style = { whiteSpace, wordBreak, ...styleFromProps };\n\n  const childrenElement = (\n    <PropsContextProvider props={propsContext}>\n      <Wrap if={emulateBoldWidth}>\n        <EmulatedBoldText>{children}</EmulatedBoldText>\n      </Wrap>\n    </PropsContextProvider>\n  );\n\n  if (!props.slot) {\n    const Element = elementType;\n    return (\n      <Element style={style} {...textProps} ref={ref}>\n        {childrenElement}\n      </Element>\n    );\n  }\n\n  invariant(\n    typeof elementType === \"string\",\n    \"'elementType' in Text component must be of type string\",\n  );\n\n  return (\n    <Aria.Text style={style} {...textProps} elementType={elementType} ref={ref}>\n      {childrenElement}\n    </Aria.Text>\n  );\n});\n\nexport default Text;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAuCO,MAAM,IAAA,GAAO,aAAA,CAAc,MAAA,EAAQ,CAAC,KAAA,KAAU;AACnD,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,SAAA;AAAA,IACA,WAAA,GAAc,MAAA;AAAA,IACd,gBAAA;AAAA,IACA,GAAA;AAAA,IACA,KAAA,GAAQ,SAAA;AAAA,IACR,KAAA,GAAQ,OAAA;AAAA,IACR,IAAA;AAAA,IACA,KAAA,EAAO,cAAA;AAAA,IACP,UAAA;AAAA,IACA,SAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,aAAA,GAAgB,IAAA;AAAA,IACpB,MAAA,CAAO,IAAA;AAAA,IACP,YAAA,CAAa,KAAK,CAAA,IAAK,MAAA,CAAO,KAAK,CAAA;AAAA,IACnC,KAAA,IAAS,MAAA,CAAO,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,CAAA;AAAA,IAChC,IAAA,IAAQ,MAAA,CAAO,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAAA;AAAA,IAC7B;AAAA,GACF;AAEA,EAAA,MAAM,SAAA,GAAY,EAAE,GAAG,IAAA,EAAM,WAAW,aAAA,EAAc;AAEtD,EAAA,MAAM,YAAA,GAA6B;AAAA,IACjC,IAAA,EAAM;AAAA,MACJ,MAAA,EAAQ;AAAA,KACV;AAAA,IACA,IAAA,EAAM,EAAE,SAAA,EAAW,MAAA,CAAO,IAAA,EAAK;AAAA,IAC/B,GAAA,EAAK,EAAE,OAAA,EAAS,MAAA;AAAO,GACzB;AAEA,EAAA,MAAM,KAAA,GAAQ,EAAE,UAAA,EAAY,SAAA,EAAW,GAAG,cAAA,EAAe;AAEzD,EAAA,MAAM,eAAA,mBACJ,GAAA,CAAC,oBAAA,EAAA,EAAqB,KAAA,EAAO,YAAA,EAC3B,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,EAAA,EAAI,gBAAA,EACR,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAkB,QAAA,EAAS,GAC9B,CAAA,EACF,CAAA;AAGF,EAAA,IAAI,CAAC,MAAM,IAAA,EAAM;AACf,IAAA,MAAM,OAAA,GAAU,WAAA;AAChB,IAAA,2BACG,OAAA,EAAA,EAAQ,KAAA,EAAe,GAAG,SAAA,EAAW,KACnC,QAAA,EAAA,eAAA,EACH,CAAA;AAAA,EAEJ;AAEA,EAAA,SAAA;AAAA,IACE,OAAO,WAAA,KAAgB,QAAA;AAAA,IACvB;AAAA,GACF;AAEA,EAAA,uBACE,GAAA,CAAC,KAAK,IAAA,EAAL,EAAU,OAAe,GAAG,SAAA,EAAW,WAAA,EAA0B,GAAA,EAC/D,QAAA,EAAA,eAAA,EACH,CAAA;AAEJ,CAAC;;;;"}

package/dist/js/packages/components/src/components/Text/Text.module.scss.mjs

@@ -1,13 +1,15 @@
 "use client"
 /* */
 const text = "flow--text";
-const light = "flow--text--light";
 const dark = "flow--text--dark";
+const light = "flow--text--light";
 const icon = "flow--text--icon";
 const styles = {
 	text: text,
-	light: light,
 	dark: dark,
+	light: light,
+	"dark-static": "flow--text--dark-static",
+	"light-static": "flow--text--light-static",
 	icon: icon,
 	"align-start": "flow--text--align-start",
 	"align-center": "flow--text--align-center",

package/dist/js/packages/components/src/components/Text/Text.module.scss.mjs.map

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

package/dist/js/packages/components/src/integrations/react-hook-form/components/FormRootError/FormRootError.mjs

@@ -9,7 +9,7 @@ const FormRootError = () => {
   const form = useFormContext().form;
   useMountedFormRootErrorComponent();
   const error = form.formState.errors.root;
-  return /* @__PURE__ */ jsx(FieldErrorView, { children: error?.message });
+  return /* @__PURE__ */ jsx(FieldErrorView, { renderAlert: true, children: error?.message });
 };
 
 export { FormRootError };

package/dist/js/packages/components/src/integrations/react-hook-form/components/FormRootError/FormRootError.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormRootError.mjs","sources":["../../../../../../../../../src/integrations/react-hook-form/components/FormRootError/FormRootError.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useFormContext } from \"../FormContextProvider\";\nimport FieldErrorView from \"@/views/FieldErrorView\";\nimport { useMountedFormRootErrorComponent } from \"./useMountedFormRootErrorComponent\";\n\nexport const FormRootError: FC = () => {\n  const form = useFormContext().form;\n  useMountedFormRootErrorComponent();\n  const error = form.formState.errors.root;\n  return <FieldErrorView>{error?.message}</FieldErrorView>;\n};\n\nexport default FormRootError;\n"],"names":[],"mappings":";;;;;AAKO,MAAM,gBAAoB,MAAM;AACrC,EAAA,MAAM,IAAA,GAAO,gBAAe,CAAE,IAAA;AAC9B,EAAA,gCAAA,EAAiC;AACjC,EAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,SAAA,CAAU,MAAA,CAAO,IAAA;AACpC,EAAA,uBAAO,GAAA,CAAC,cAAA,EAAA,EAAgB,QAAA,EAAA,KAAA,EAAO,OAAA,EAAQ,CAAA;AACzC;;;;"}
+{"version":3,"file":"FormRootError.mjs","sources":["../../../../../../../../../src/integrations/react-hook-form/components/FormRootError/FormRootError.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useFormContext } from \"../FormContextProvider\";\nimport FieldErrorView from \"@/views/FieldErrorView\";\nimport { useMountedFormRootErrorComponent } from \"./useMountedFormRootErrorComponent\";\n\nexport const FormRootError: FC = () => {\n  const form = useFormContext().form;\n  useMountedFormRootErrorComponent();\n  const error = form.formState.errors.root;\n  return <FieldErrorView renderAlert>{error?.message}</FieldErrorView>;\n};\n\nexport default FormRootError;\n"],"names":[],"mappings":";;;;;AAKO,MAAM,gBAAoB,MAAM;AACrC,EAAA,MAAM,IAAA,GAAO,gBAAe,CAAE,IAAA;AAC9B,EAAA,gCAAA,EAAiC;AACjC,EAAA,MAAM,KAAA,GAAQ,IAAA,CAAK,SAAA,CAAU,MAAA,CAAO,IAAA;AACpC,EAAA,uBAAO,GAAA,CAAC,cAAA,EAAA,EAAe,WAAA,EAAW,IAAA,EAAE,iBAAO,OAAA,EAAQ,CAAA;AACrD;;;;"}

package/dist/js/packages/components/src/lib/types/props.mjs

@@ -0,0 +1,14 @@
+"use client"
+/* */
+const alphaColors = [
+  "dark",
+  "light",
+  "dark-static",
+  "light-static"
+];
+function isAlphaColor(color) {
+  return alphaColors.includes(color);
+}
+
+export { alphaColors, isAlphaColor };
+//# sourceMappingURL=props.mjs.map

package/dist/js/packages/components/src/lib/types/props.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.mjs","sources":["../../../../../../../src/lib/types/props.ts"],"sourcesContent":["import type { ExoticComponent, HTMLAttributes } from \"react\";\n\nexport type Status = \"info\" | \"success\" | \"warning\" | \"danger\";\n\nexport type PropsWithStatus<T extends Status = Status, P = unknown> = P & {\n  /** The elements status */\n  status?: T;\n};\n\nexport interface PropsWithTunnel {\n  /** @internal */\n  tunnelId?: string | null;\n}\n\nexport interface PropsWithClassName {\n  /** The elements class name. */\n  className?: string;\n}\n\nexport type PropsWithElementType<\n  T extends keyof HTMLElementTagNameMap = never,\n> = HTMLAttributes<HTMLElement> & {\n  elementType?: T | ExoticComponent;\n};\n\nexport type ContainerBreakpointSize = \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\";\n\nexport interface PropsWithContainerBreakpointSize {\n  containerBreakpointSize?: ContainerBreakpointSize;\n}\n\nexport const alphaColors = [\n  \"dark\",\n  \"light\",\n  \"dark-static\",\n  \"light-static\",\n] as const;\n\nexport type AlphaColor = (typeof alphaColors)[number];\n\nexport function isAlphaColor(color: string): color is AlphaColor {\n  return alphaColors.includes(color as AlphaColor);\n}\n"],"names":[],"mappings":"AA+BO,MAAM,WAAA,GAAc;AAAA,EACzB,MAAA;AAAA,EACA,OAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF;AAIO,SAAS,aAAa,KAAA,EAAoC;AAC/D,EAAA,OAAO,WAAA,CAAY,SAAS,KAAmB,CAAA;AACjD;;;;"}