@skitter/assistant_md 1.0.0-alpha.0

package/src/backup.tsx

@@ -0,0 +1,278 @@
+import React from "react";
+
+const URL_REGEX =
+  /[(http(s)?):\/\/(www\.)?a-zA-Z0-9@:%._\+~#=-]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/;
+
+const normalStr = (str: string) => ({
+  type: "normal_str",
+  value: str,
+});
+
+const urlStr = (str: string) => ({
+  type: "url",
+  value: str,
+});
+
+export function parseUrlAndString(str: string) {
+  const results = [];
+  let remaining = str;
+  while (remaining) {
+    let match = remaining.match(URL_REGEX);
+    if (!match) {
+      results.push(normalStr(remaining));
+      break;
+    }
+
+    if (match.index !== 0) {
+      results.push(normalStr(remaining.slice(0, match.index)));
+      results.push(
+        urlStr(
+          remaining.slice(
+            match.index,
+            match.index && match.index + match[0].length
+          )
+        )
+      );
+      remaining = remaining.slice(match.index && match.index + match[0].length);
+      continue;
+    }
+    results.push(urlStr(remaining.slice(0, match[0].length)));
+    remaining = remaining.slice(match[0].length);
+  }
+  return results;
+}
+
+const DisplayLineBreaks = ({ text }: { text: string }) => {
+  let texts = text.split("\n");
+  let lastOne = texts[texts.length - 1];
+  let exceptLastOne = texts.slice(0, texts.length - 1);
+  return (
+    <>
+      {exceptLastOne.reduce(
+        (arr: (string | JSX.Element)[], text) => [
+          ...arr,
+          text,
+          <br key={arr.length} />,
+        ],
+        []
+      )}
+      {lastOne}
+    </>
+  );
+};
+
+const DisplayURL = ({ text }: { text: string }) => {
+  const parsed = parseUrlAndString(text);
+  return (
+    <>
+      {parsed.map(({ type, value }, i) =>
+        type === "url" ? (
+          <a href={value} target="_blank" key={i} rel="noreferrer">
+            {value}
+          </a>
+        ) : (
+          <DisplayLineBreaks text={value} key={i}></DisplayLineBreaks>
+        )
+      )}
+    </>
+  );
+};
+
+type MdTypes =
+  | "normal_text"
+  | "bold"
+  | "italic"
+  | "underline"
+  | "hyperlink"
+  | "ordered_list"
+  | "unordered_list"
+  | "newline"
+  | "join";
+
+type NormalText = {
+  normal_text: string;
+  markdown_text: "normal_text";
+};
+
+type MdValueContainer = { value: MdText };
+
+type BoldText = {
+  bold: MdValueContainer;
+  markdown_text: "bold";
+};
+
+type ItalicText = {
+  italic: MdValueContainer;
+  markdown_text: "italic";
+};
+
+type UnderlineText = {
+  underline: MdValueContainer;
+  markdown_text: "underline";
+};
+
+type HyperLinkContainer = {
+  link: string;
+  value: MdText;
+};
+
+type HyperLinkText = {
+  hyperlink: HyperLinkContainer;
+  markdown_text: "hyperlink";
+};
+
+type MdList = {
+  list: MdText[];
+};
+
+type OrdredListText = {
+  ordered_list: MdList;
+  markdown_text: "ordered_list";
+};
+
+type UnOrdredListText = {
+  unordered_list: MdList;
+  markdown_text: "unordered_list";
+};
+
+type NewlineText = {
+  markdown_text: "newline";
+};
+
+type JoinMdContainer = {
+  lhs: MdText;
+  rhs: MdText;
+};
+
+type JoinMdText = {
+  join: JoinMdContainer;
+  markdown_text: "join";
+};
+
+type MdText =
+  | NormalText
+  | BoldText
+  | ItalicText
+  | UnderlineText
+  | HyperLinkText
+  | OrdredListText
+  | UnOrdredListText
+  | JoinMdText
+  | NewlineText;
+
+type MdTextProp = { mdText: MdText };
+
+type NormalRenderes = React.FunctionComponent<{ mdText: MdValueContainer }>;
+
+type ListRenderers = React.FunctionComponent<{ mdText: MdList }>;
+
+type TextRenderer = React.FunctionComponent<{ mdText: string }>;
+
+type JoinMdRenderer = React.FunctionComponent<{ mdText: JoinMdContainer }>;
+
+type HyperLinkRenderer = React.FunctionComponent<{
+  mdText: HyperLinkContainer;
+}>;
+
+const normalWrapper: (TagName: React.ElementType) => NormalRenderes =
+  (TagName: React.ElementType) =>
+  ({ mdText }) =>
+    (
+      <TagName>
+        <AssistantMd mdText={mdText.value} />
+      </TagName>
+    );
+
+const listWrapper: (TagName: React.ElementType) => ListRenderers =
+  (TagName) =>
+  ({ mdText: { list } }) =>
+    (
+      <TagName>
+        {list.map((mdText) => (
+          <li>
+            <AssistantMd mdText={mdText} />
+          </li>
+        ))}
+      </TagName>
+    );
+
+type RenderTypes = MdTypes;
+
+type MdRenderers =
+  | NormalRenderes
+  | ListRenderers
+  | TextRenderer
+  | HyperLinkRenderer
+  | JoinMdRenderer;
+
+type RenderMap = Record<RenderTypes, MdRenderers>;
+
+const NormalTextMd: TextRenderer = ({ mdText }) => {
+  return <DisplayURL text={mdText} />;
+};
+
+const HyperLinkMd: HyperLinkRenderer = ({ mdText }) => (
+  <a href={mdText.link}>
+    <AssistantMd mdText={mdText.value} />
+  </a>
+);
+
+const JoinMd: JoinMdRenderer = ({ mdText: { lhs, rhs } }) => (
+  <>
+    <AssistantMd mdText={lhs} />
+    <AssistantMd mdText={rhs} />
+  </>
+);
+
+
+
+const mdTypeRenderers = {
+  normal_text: NormalTextMd,
+  bold: normalWrapper("strong"),
+  italic: normalWrapper("em"),
+  underline: normalWrapper("u"),
+  hyperlink: HyperLinkMd,
+  ordered_list: listWrapper("ol"),
+  unordered_list: listWrapper("ul"),
+  newline: () => <br />,
+  join: JoinMd,
+};
+
+
+type RendT<T> = {
+    [P in keyof T] : T[P]  
+}
+
+type Renderers = typeof mdTypeRenderers
+
+type MappedRend = RendT<Renderers>
+
+type Pick<T,R extends keyof T> = {
+    [P in R] : T[P]
+}
+
+type boldRenderer<T> =  T extends Pick<MappedRend, infer T> ?
+
+type MDs<T extends MdTypes, S extends MdText> = S[infer T]
+
+
+function getMdContainerAndRenderer<T>(x : T extends MdTypes)  => {
+    let RRederMd = mdTypeRenderers[x] as Pick<MappedRend,infer T>
+    let container = x[x.markdown_text]
+
+    return  <RRederMd mdText={container} />;
+
+} 
+
+export default function AssistantMd({ mdText }: MdTextProp) {
+  let RenderMd = mdTypeRenderers[mdText.markdown_text];
+//   let container: any = mdText[mdText.markdown_text];
+   if(mdText.markdown_text === "bold") {
+       let RRederMd = mdTypeRenderers[mdText.markdown_text]
+       let container = mdText[mdText.markdown_text]
+       return  <RRederMd mdText={container} />;
+   }
+
+
+  return null
+}

package/src/sol-1.tsx

@@ -0,0 +1,363 @@
+import React from "react";
+
+const URL_REGEX =
+  /[(http(s)?):\/\/(www\.)?a-zA-Z0-9@:%._\+~#=-]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/;
+
+const normalStr = (str: string) => ({
+  type: "normal_str",
+  value: str,
+});
+
+const urlStr = (str: string) => ({
+  type: "url",
+  value: str,
+});
+
+export function parseUrlAndString(str: string) {
+  const results = [];
+  let remaining = str;
+  while (remaining) {
+    let match = remaining.match(URL_REGEX);
+    if (!match) {
+      results.push(normalStr(remaining));
+      break;
+    }
+
+    if (match.index !== 0) {
+      results.push(normalStr(remaining.slice(0, match.index)));
+      results.push(
+        urlStr(
+          remaining.slice(
+            match.index,
+            match.index && match.index + match[0].length
+          )
+        )
+      );
+      remaining = remaining.slice(match.index && match.index + match[0].length);
+      continue;
+    }
+    results.push(urlStr(remaining.slice(0, match[0].length)));
+    remaining = remaining.slice(match[0].length);
+  }
+  return results;
+}
+
+const DisplayLineBreaks = ({ text }: { text: string }) => {
+  let texts = text.split("\n");
+  let lastOne = texts[texts.length - 1];
+  let exceptLastOne = texts.slice(0, texts.length - 1);
+  return (
+    <>
+      {exceptLastOne.reduce(
+        (arr: (string | JSX.Element)[], text) => [
+          ...arr,
+          text,
+          <br key={arr.length} />,
+        ],
+        []
+      )}
+      {lastOne}
+    </>
+  );
+};
+
+const DisplayURL = ({ text }: { text: string }) => {
+  const parsed = parseUrlAndString(text);
+  return (
+    <>
+      {parsed.map(({ type, value }, i) =>
+        type === "url" ? (
+          <a href={value} target="_blank" key={i} rel="noreferrer">
+            {value}
+          </a>
+        ) : (
+          <DisplayLineBreaks text={value} key={i}></DisplayLineBreaks>
+        )
+      )}
+    </>
+  );
+};
+
+type MdTypes =
+  | "normal_text"
+  | "bold"
+  | "italic"
+  | "underline"
+  | "hyperlink"
+  | "ordered_list"
+  | "unordered_list"
+  | "newline"
+  | "join";
+
+type NormalText = {
+  normal_text: string;
+  markdown_text: "normal_text";
+};
+
+type MdValueContainer = { value: MdText };
+
+type BoldText = {
+  bold: MdValueContainer;
+  markdown_text: "bold";
+};
+
+type ItalicText = {
+  italic: MdValueContainer;
+  markdown_text: "italic";
+};
+
+type UnderlineText = {
+  underline: MdValueContainer;
+  markdown_text: "underline";
+};
+
+type HyperLinkContainer = {
+  link: string;
+  value: MdText;
+};
+
+type HyperLinkText = {
+  hyperlink: HyperLinkContainer;
+  markdown_text: "hyperlink";
+};
+
+type MdList = {
+  list: MdText[];
+};
+
+type OrdredListText = {
+  ordered_list: MdList;
+  markdown_text: "ordered_list";
+};
+
+type UnOrdredListText = {
+  unordered_list: MdList;
+  markdown_text: "unordered_list";
+};
+
+type NewlineText = {
+  markdown_text: "newline";
+};
+
+type JoinMdContainer = {
+  lhs: MdText;
+  rhs: MdText;
+};
+
+type JoinMdText = {
+  join: JoinMdContainer;
+  markdown_text: "join";
+};
+
+type MdText =
+  | NormalText
+  | BoldText
+  | ItalicText
+  | UnderlineText
+  | HyperLinkText
+  | OrdredListText
+  | UnOrdredListText
+  | JoinMdText
+  | NewlineText;
+
+type MdTextProp = { mdText: MdText };
+
+type NormalRenderes = React.FunctionComponent<{ mdText: MdValueContainer }>;
+
+type ListRenderers = React.FunctionComponent<{ mdText: MdList }>;
+
+type TextRenderer = React.FunctionComponent<{ mdText: string }>;
+
+type JoinMdRenderer = React.FunctionComponent<{ mdText: JoinMdContainer }>;
+
+type HyperLinkRenderer = React.FunctionComponent<{
+  mdText: HyperLinkContainer;
+}>;
+
+const normalWrapper: (TagName: React.ElementType) => NormalRenderes =
+  (TagName: React.ElementType) =>
+  ({ mdText }) =>
+    (
+      <TagName>
+        <AssistantMd mdText={mdText.value} />
+      </TagName>
+    );
+
+const listWrapper: (TagName: React.ElementType) => ListRenderers =
+  (TagName) =>
+  ({ mdText: { list } }) =>
+    (
+      <TagName>
+        {list.map((mdText) => (
+          <li>
+            <AssistantMd mdText={mdText} />
+          </li>
+        ))}
+      </TagName>
+    );
+
+type RenderTypes = MdTypes;
+
+type MdRenderers =
+  | NormalRenderes
+  | ListRenderers
+  | TextRenderer
+  | HyperLinkRenderer
+  | JoinMdRenderer;
+
+// type RenderMap = Record<RenderTypes, MdRenderers>;
+
+const NormalTextMd: TextRenderer = ({ mdText }) => {
+  return <DisplayURL text={mdText} />;
+};
+
+const HyperLinkMd: HyperLinkRenderer = ({ mdText }) => (
+  <a href={mdText.link}>
+    <AssistantMd mdText={mdText.value} />
+  </a>
+);
+
+const JoinMd: JoinMdRenderer = ({ mdText: { lhs, rhs } }) => (
+  <>
+    <AssistantMd mdText={lhs} />
+    <AssistantMd mdText={rhs} />
+  </>
+);
+
+// const mdTypeRenderers = {
+//   normal_text: NormalTextMd,
+//   bold: normalWrapper("strong"),
+//   italic: normalWrapper("em"),
+//   underline: normalWrapper("u"),
+//   hyperlink: HyperLinkMd,
+//   ordered_list: listWrapper("ol"),
+//   unordered_list: listWrapper("ul"),
+//   newline: () => <br />,
+//   join: JoinMd,
+// };
+
+// type S<T extends MdTypes> = T extends MdTypes?  Record<T,_mcR[T]> : never
+
+// type _Rss<T extends _mcR, K extends MdTypes> = K extends infer L
+//   ? {
+//       [P in K]: _R<K>;
+//     }
+//   : never;
+
+//  type _Rss1<T> = T extends MdTypes ?  T extends infer L ?  L : never
+
+type _R<T extends MdTypes> = T extends "bold" | "italic" | "underline"
+  ? NormalRenderes
+  : T extends "hyperlink"
+  ? HyperLinkRenderer
+  : T extends "join"
+  ? JoinMdRenderer
+  : T extends "unordered_list" | "ordered_list"
+  ? ListRenderers
+  : T extends "normal_text"
+  ? TextRenderer
+  : T extends "newline"
+  ? () => JSX.Element
+  : never;
+
+type _mcR<T> = T extends MdTypes ? Record<T, _R<T>> : never;
+
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
+  k: infer I
+) => void
+  ? I
+  : never;
+
+type Renderers<T extends MdTypes> = UnionToIntersection<_mcR<T>>;
+
+const mdTypeRenderers: Renderers<MdTypes> = {
+  normal_text: NormalTextMd,
+  bold: normalWrapper("strong"),
+  italic: normalWrapper("em"),
+  underline: normalWrapper("u"),
+  hyperlink: HyperLinkMd,
+  ordered_list: listWrapper("ol"),
+  unordered_list: listWrapper("ul"),
+  newline: () => <br />,
+  join: JoinMd,
+};
+
+type _A = Renderers<MdTypes>["bold"];
+
+type ReducerState<
+  R extends Renderers<MdTypes>,
+  K extends MdTypes
+> = R extends Renderers<infer S> ? (S extends K ? _R<K> : never) : never;
+
+type F = ReducerState<Renderers<MdTypes>, "normal_text">;
+
+function MDD<K extends MdTypes>(
+  type: K,
+  renderers: Renderers<MdTypes>
+): Renderers<MdTypes>[K] {
+  return renderers[type];
+}
+
+
+
+function exhaustiveCheck(param: never) {}
+
+export default function AssistantMd({ mdText }: MdTextProp) {
+  if (mdText.markdown_text == "bold") {
+    let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+    let container = mdText[mdText.markdown_text];
+
+    const x = MDD<"bold">(mdText.markdown_text, mdTypeRenderers);
+  }
+
+  // let container = mdText[mdText.markdown_text] as Renderers<mdText.markdown_text>
+  // return <RendenMDElement mdText={container} />;
+
+  switch (mdText.markdown_text) {
+    case "bold": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "italic": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "normal_text": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "underline": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "hyperlink": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "ordered_list": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "unordered_list": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "join": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      let container = mdText[mdText.markdown_text];
+      return <RendenMDElement mdText={container} />;
+    }
+    case "newline": {
+      let RendenMDElement = mdTypeRenderers[mdText.markdown_text];
+      return <RendenMDElement />;
+    }
+  }
+  exhaustiveCheck(mdText);
+}