@code0-tech/pictor 0.3.0 → 0.4.0

package/dist/components/data-table/DataTableFilterInput.js

@@ -0,0 +1,212 @@
+import { jsx as u } from "react/jsx-runtime";
+import { c as Q } from "../../_virtual/compiler-runtime.js";
+import { Editor as z } from "../editor/Editor.js";
+import { StreamLanguage as U, syntaxTree as J } from "@codemirror/language";
+import { EditorState as K } from "@uiw/react-codemirror";
+import { Badge as b } from "../badge/Badge.js";
+import { DataTableFilterSuggestionMenu as j } from "./DataTableFilterSuggestionMenu.js";
+import { MenuItem as G } from "../menu/Menu.js";
+import "../../utils/contextStore.js";
+import "react";
+import { hashToColor as X } from "../../utils/utils.js";
+const $ = {
+  "=": "isOneOf",
+  "!=": "isNotOneOf"
+}, H = {
+  isOneOf: "is one of",
+  isNotOneOf: "is not one of"
+}, Y = {
+  isOneOf: "=",
+  isNotOneOf: "!="
+}, y = (r) => r.replace(/^\\|\\$/g, ""), Z = (r) => U.define({
+  startState: () => ({
+    tokens: []
+  }),
+  token(e, n) {
+    if (e.eatSpace()) return null;
+    if (e.match("!=") || e.match("=") && e.peek() !== "=")
+      return n.tokens.push("operator"), "operator";
+    if (e.peek() === "\\") {
+      e.next();
+      const k = [];
+      for (; !e.eol() && e.peek() !== "\\"; ) k.push(e.next());
+      if (e.peek() === "\\") {
+        e.next();
+        const S = k.join("");
+        if (r.includes(S) && n.tokens[n.tokens.length - 1] !== "propertyName")
+          return n.tokens.push("propertyName"), "propertyName";
+        if (n.tokens[n.tokens.length - 1] !== "literal")
+          return n.tokens.push("literal"), "literal";
+      }
+      return null;
+    }
+    return e.next(), null;
+  }
+}), ye = (r) => {
+  const e = Q.c(17), {
+    filterTokens: n,
+    onChange: k
+  } = r;
+  let S;
+  e[0] !== n ? (S = Z(n?.map(q) || []), e[0] = n, e[1] = S) : S = e[1];
+  const A = S;
+  let v;
+  e[2] !== n ? (v = (o) => {
+    if (!o.trim())
+      return {};
+    const d = {}, l = o.split(/\\/).filter(Boolean);
+    for (let i = 0; i + 2 < l.length; i = i + 3, i) {
+      const p = l[i], a = l[i + 1], _ = l[i + 2];
+      if (!p || !a || !_)
+        continue;
+      const L = n?.find((t) => t.token === p);
+      if (!L)
+        continue;
+      const h = $[a];
+      if (!h)
+        continue;
+      const O = _.split(",").map(x).filter(Boolean);
+      O.length > 0 && (d[L.key] = {
+        operator: h,
+        value: O
+      });
+    }
+    return d;
+  }, e[2] = n, e[3] = v) : v = e[3];
+  const B = v;
+  let w;
+  e[4] !== k || e[5] !== B ? (w = (o) => {
+    const d = B(o);
+    k?.(d);
+  }, e[4] = k, e[5] = B, e[6] = w) : w = e[6];
+  const F = w;
+  let C;
+  e[7] !== n ? (C = (o) => {
+    const d = J(o.state), l = d.resolveInner(o.pos, -1), i = d.resolveInner(o.pos, 1), {
+      propertyNode: p,
+      operatorNode: a
+    } = (() => {
+      const t = {
+        propertyNode: null,
+        operatorNode: null
+      };
+      for (let s = l; s; s = s.prevSibling)
+        s.name === "propertyName" && !t.propertyNode && (t.propertyNode = s), s.name === "operator" && !t.operatorNode && (t.operatorNode = s);
+      return t;
+    })(), _ = p ? o.pos < p.to ? "propertyName" : o.pos === p.to ? "operator" : a ? o.pos < a.to ? "operator" : o.pos === a.to ? "literal" : l.name === "literal" ? "propertyName" : l.name === "invalid" && o.state.sliceDoc(l.from, l.to).startsWith("\\") ? "literal" : (() => {
+      const t = o.state.sliceDoc(a.to, o.pos);
+      return t.trim() ? t.includes(" ") ? "propertyName" : "literal" : t.length > 0 ? "propertyName" : "literal";
+    })() : (i.name === "operator", "operator") : "propertyName", L = p ? y(o.state.sliceDoc(p.from, p.to)) : "", h = n?.find((t) => t.token === L), O = (t, s, c, g) => {
+      g ? o.view?.dispatch({
+        changes: {
+          from: t,
+          to: s,
+          insert: c
+        },
+        selection: {
+          anchor: o.pos
+        },
+        scrollIntoView: !1
+      }) : (o.view?.dispatch({
+        changes: {
+          from: t,
+          to: s,
+          insert: c
+        },
+        selection: {
+          anchor: t + c.length
+        },
+        scrollIntoView: !0
+      }), o.view?.focus());
+    };
+    if (_ === "propertyName") {
+      const t = /* @__PURE__ */ new Set(), s = o.matchBefore(/\\?[\w-]*/), c = s ? s.from : o.pos, g = p && o.pos <= p.to, N = i.name === "propertyName" ? i.to : g ? p.to : o.pos, m = g && p.from < c ? p.from : c, W = y(o.state.sliceDoc(m, o.pos)), R = n?.filter((f) => f.token.startsWith(W) && !t.has(f.token)) || [];
+      if (d.iterate({
+        enter: (f) => {
+          f.name === "propertyName" && t.add(y(o.state.sliceDoc(f.from, f.to)));
+        }
+      }), R.length)
+        return /* @__PURE__ */ u(j, { context: o, children: R.map((f) => /* @__PURE__ */ u(G, { onSelect: () => {
+          let M = `\\${f.token}\\`;
+          l.name === "literal" && o.state.sliceDoc(N, N + 1) !== "\\" && (M = "\\" + M), O(m, N, M);
+        }, children: f.token }, f.token)) });
+    }
+    if (_ === "operator" && h) {
+      const t = o.matchBefore(/[!=]+/), s = t ? t.from : o.pos, c = a && o.pos <= a.to, g = i.name === "operator" ? i.to : c ? a.to : o.pos, N = c && a.from < s ? a.from : s;
+      return /* @__PURE__ */ u(j, { context: o, children: h.operators.map((m) => /* @__PURE__ */ u(G, { onSelect: () => O(N, g, Y[m]), children: H[m] }, m)) });
+    }
+    if (_ === "literal" && h?.suggestion) {
+      const t = a ? o.state.sliceDoc(a.from, a.to) : "", s = $[t];
+      if (s && h.operators.includes(s)) {
+        const c = i.name === "literal" ? o.state.sliceDoc(i.from, i.to) : "";
+        return h.suggestion(o, s, y(c), (g, N) => {
+          const m = l.name === "literal" || l.name === "invalid" && o.state.sliceDoc(l.from, l.to).startsWith("\\"), W = m ? l.from : o.pos, R = m ? l.to : i.name === "literal" ? i.to : o.pos;
+          O(W, R, `\\${g}\\`, N);
+        });
+      }
+    }
+    return null;
+  }, e[7] = n, e[8] = C) : C = e[8];
+  const V = C;
+  let D, I;
+  e[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (D = {
+    backgroundColor: "rgba(255,255,255,.1)",
+    padding: "0.35rem",
+    boxSizing: "border-box",
+    borderRadius: "1rem",
+    boxShadow: "inset 0 1px 1px 0 rgba(255,255,255,.2)"
+  }, I = {
+    literal: oe,
+    operator: te,
+    propertyName: re
+  }, e[9] = D, e[10] = I) : (D = e[9], I = e[10]);
+  let T, E;
+  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (T = [K.transactionFilter.of(ne)], E = {
+    lineNumbers: !1,
+    foldGutter: !1,
+    highlightActiveLine: !1,
+    highlightActiveLineGutter: !1,
+    dropCursor: !1,
+    indentOnInput: !1
+  }, e[11] = T, e[12] = E) : (T = e[11], E = e[12]);
+  let P;
+  return e[13] !== V || e[14] !== F || e[15] !== A ? (P = /* @__PURE__ */ u(z, { w: "100%", initialValue: "", onChange: F, style: D, tokenHighlights: I, showTooltips: !1, showValidation: !1, customSuggestionComponent: !0, suggestions: V, extensions: T, basicSetup: E, language: A }), e[13] = V, e[14] = F, e[15] = A, e[16] = P) : P = e[16], P;
+};
+function q(r) {
+  return r.token;
+}
+function x(r) {
+  return r.trim();
+}
+function ee(r) {
+  return /* @__PURE__ */ u(b, { style: {
+    boxShadow: "none"
+  }, color: "secondary", children: r }, r);
+}
+function oe(r) {
+  const {
+    content: e
+  } = r, n = y(e).split(",");
+  return n.length > 1 ? /* @__PURE__ */ u(b, { p: 0.175, mx: 0.175, children: n.map(ee) }) : /* @__PURE__ */ u(b, { mx: 0.175, children: y(e) });
+}
+function te(r) {
+  const {
+    content: e
+  } = r;
+  return /* @__PURE__ */ u(b, { color: "tertiary", style: {
+    boxShadow: "none"
+  }, children: H[$[e]] || e });
+}
+function re(r) {
+  const {
+    content: e
+  } = r;
+  return /* @__PURE__ */ u(b, { mx: 0.175, color: X(y(e)), children: y(e) });
+}
+function ne(r) {
+  return r.docChanged && r.newDoc.lines > 1 ? [] : r;
+}
+export {
+  ye as DataTableFilterInput,
+  Z as createFilterQueryLanguage
+};

package/dist/components/data-table/DataTableFilterSuggestionMenu.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { CompletionContext } from '@codemirror/autocomplete';
+export interface DataTableFilterSuggestionMenuProps {
+    children?: React.ReactNode;
+    context?: CompletionContext;
+}
+export declare const DataTableFilterSuggestionMenu: React.FC<DataTableFilterSuggestionMenuProps>;

package/dist/components/data-table/DataTableFilterSuggestionMenu.js

@@ -0,0 +1,53 @@
+import { jsx as f, jsxs as d } from "react/jsx-runtime";
+import { c as v } from "../../_virtual/compiler-runtime.js";
+import w from "react";
+import { MenuTrigger as y, MenuContent as _, Menu as g } from "../menu/Menu.js";
+const T = (t) => {
+  const e = v.c(11), {
+    children: l,
+    context: m
+  } = t, [u, p] = w.useState(!0), h = _;
+  let r;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (r = (a) => p(a), e[0] = r) : r = e[0];
+  let i;
+  e[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ f(y, { asChild: !0, children: /* @__PURE__ */ f("div", { style: {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    width: 0,
+    height: 0
+  } }) }), e[1] = i) : i = e[1];
+  let n;
+  e[2] !== m?.view ? (n = (a) => {
+    ["Escape", "ArrowUp", "ArrowDown"].includes(a.key) || m?.view?.focus();
+  }, e[2] = m?.view, e[3] = n) : n = e[3];
+  let s;
+  e[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (s = {
+    position: "fixed",
+    top: 0,
+    left: 0,
+    pointerEvents: "auto"
+  }, e[4] = s) : s = e[4];
+  let o;
+  e[5] !== l || e[6] !== n ? (o = /* @__PURE__ */ f(h, { miw: "200px", onInteractOutside: b, onOpenAutoFocus: D, onKeyDown: n, style: s, children: l }), e[5] = l, e[6] = n, e[7] = o) : o = e[7];
+  let c;
+  return e[8] !== u || e[9] !== o ? (c = /* @__PURE__ */ d(g, { open: u, onOpenChange: r, modal: !1, children: [
+    i,
+    o
+  ] }), e[8] = u, e[9] = o, e[10] = c) : c = e[10], c;
+};
+function x(t) {
+  return t;
+}
+function S(t) {
+  return t.startsWith("cm-");
+}
+function b(t) {
+  Array.from(t.currentTarget.classList).map(x).some(S) && t.preventDefault();
+}
+function D(t) {
+  t.preventDefault(), t.currentTarget.querySelector('[role="menuitem"]')?.focus();
+}
+export {
+  T as DataTableFilterSuggestionMenu
+};

package/dist/components/data-table/index.d.ts

@@ -0,0 +1,4 @@
+export * from './DataTable';
+export * from './DataTableColumn';
+export * from './DataTableFilterInput';
+export * from './DataTableFilterSuggestionMenu';

package/dist/components/data-table/index.js

@@ -0,0 +1,11 @@
+import { DataTable as t } from "./DataTable.js";
+import { DataTableColumn as o } from "./DataTableColumn.js";
+import { DataTableFilterInput as u, createFilterQueryLanguage as m } from "./DataTableFilterInput.js";
+import { DataTableFilterSuggestionMenu as p } from "./DataTableFilterSuggestionMenu.js";
+export {
+  t as DataTable,
+  o as DataTableColumn,
+  u as DataTableFilterInput,
+  p as DataTableFilterSuggestionMenu,
+  m as createFilterQueryLanguage
+};

package/dist/components/dialog/Dialog.d.ts

@@ -0,0 +1,29 @@
+import { Code0Component, Code0ComponentProps } from '../../utils';
+import { default as React } from 'react';
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+export type DialogProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Root>;
+export type DialogTriggerProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Trigger>;
+export type DialogPortalProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Portal>;
+export type DialogCloseProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Close>;
+export type DialogOverlayProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Overlay>;
+export type DialogTitleProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Title>;
+export type DialogDescriptionProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Description>;
+export type DialogHeaderProps = Code0ComponentProps & React.ComponentProps<"div">;
+export type DialogFooterProps = Code0ComponentProps & React.ComponentProps<"div">;
+export type DialogContentProps = Code0ComponentProps & React.ComponentProps<typeof DialogPrimitive.Content> & {
+    showCloseButton?: boolean;
+    title?: string;
+};
+export type DialogStickyContentProps = Code0Component<HTMLDivElement> & {
+    children: React.ReactNode | React.ReactNode[];
+};
+export declare const Dialog: React.FC<DialogProps>;
+export declare const DialogTrigger: React.FC<DialogTriggerProps>;
+export declare const DialogPortal: React.FC<DialogPortalProps>;
+export declare const DialogClose: React.FC<DialogCloseProps>;
+export declare const DialogOverlay: React.FC<DialogOverlayProps>;
+export declare const DialogContent: React.FC<DialogContentProps>;
+export declare const DialogTitle: React.FC<DialogTitleProps>;
+export declare const DialogDescription: React.FC<DialogDescriptionProps>;
+export declare const DialogHeader: React.FC<DialogHeaderProps>;
+export declare const DialogFooter: React.FC<DialogFooterProps>;

package/dist/components/dialog/Dialog.js

@@ -0,0 +1,102 @@
+import { jsx as n, jsxs as f } from "react/jsx-runtime";
+import { c } from "../../_virtual/compiler-runtime.js";
+import * as s from "@radix-ui/react-dialog";
+import "../../utils/contextStore.js";
+import "react";
+import { mergeCode0Props as r } from "../../utils/utils.js";
+import { IconX as g } from "@tabler/icons-react";
+import '../../assets/components/dialog/Dialog.style.css';/* empty css                  */
+import { Button as d } from "../button/Button.js";
+import { Flex as m } from "../flex/Flex.js";
+import { Text as _ } from "../text/Text.js";
+const P = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Root, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, j = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__trigger", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Trigger, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, z = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__portal", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Portal, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, u = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__close", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Close, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, F = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__overlay", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Overlay, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, O = (i) => {
+  const t = c.c(9);
+  let l;
+  t[0] !== i ? (l = r("dialog__content", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  t[2] !== i.showCloseButton || t[3] !== i.title ? (e = i.showCloseButton && /* @__PURE__ */ f(m, { align: "center", justify: "space-between", children: [
+    /* @__PURE__ */ n(_, { hierarchy: "primary", size: "xl", children: i.title }),
+    /* @__PURE__ */ n(u, { asChild: !0, children: /* @__PURE__ */ n(d, { children: /* @__PURE__ */ n(g, { size: 16 }) }) })
+  ] }), t[2] = i.showCloseButton, t[3] = i.title, t[4] = e) : e = t[4];
+  let a;
+  return t[5] !== i.children || t[6] !== o || t[7] !== e ? (a = /* @__PURE__ */ f(s.Content, { ...o, children: [
+    e,
+    i.children
+  ] }), t[5] = i.children, t[6] = o, t[7] = e, t[8] = a) : a = t[8], a;
+}, R = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__title", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Title, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, b = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__description", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n(s.Description, { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, E = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__header", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n("div", { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+}, H = (i) => {
+  const t = c.c(4);
+  let l;
+  t[0] !== i ? (l = r("dialog__footer", i), t[0] = i, t[1] = l) : l = t[1];
+  const o = l;
+  let e;
+  return t[2] !== o ? (e = /* @__PURE__ */ n("div", { ...o }), t[2] = o, t[3] = e) : e = t[3], e;
+};
+export {
+  P as Dialog,
+  u as DialogClose,
+  O as DialogContent,
+  b as DialogDescription,
+  H as DialogFooter,
+  E as DialogHeader,
+  F as DialogOverlay,
+  z as DialogPortal,
+  R as DialogTitle,
+  j as DialogTrigger
+};

package/dist/components/editor/Editor.d.ts

@@ -0,0 +1,29 @@
+import { default as React } from 'react';
+import { Code0Component } from '../../utils';
+import { ValidationProps } from '../form';
+import { Extension } from '@uiw/react-codemirror';
+import { StreamLanguage } from '@codemirror/language';
+import { CompletionContext, CompletionResult } from '@codemirror/autocomplete';
+import { BasicSetupOptions } from '@uiw/codemirror-extensions-basic-setup';
+export type EditorTokenizer = (content: string) => string | null;
+export interface EditorRendererProps {
+    content: string;
+}
+export interface EditorTokenHighlights {
+    [tokenName: string]: (props: EditorRendererProps) => React.ReactNode;
+}
+export interface EditorInputProps extends Omit<Code0Component<HTMLDivElement>, 'onChange' | 'defaultValue' | 'value'>, ValidationProps<any> {
+    language?: 'json' | StreamLanguage<unknown>;
+    tokenizer?: EditorTokenizer;
+    tokenHighlights?: EditorTokenHighlights;
+    suggestions?: (context: CompletionContext) => CompletionResult | React.ReactNode | null;
+    customSuggestionComponent?: boolean;
+    onChange?: (value: any) => void;
+    extensions?: Extension[];
+    disabled?: boolean;
+    readonly?: boolean;
+    showTooltips?: boolean;
+    showValidation?: boolean;
+    basicSetup?: BasicSetupOptions;
+}
+export declare const Editor: React.FC<EditorInputProps>;