npm - sodas-validation-ui - Versions diffs - 0.1.0 - Mend

sodas-validation-ui 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/README.md +16 -0
package/dist/sodas-validation-ui.css +1 -0
package/dist/sodas-validation-ui.js +518 -0
package/dist/sodas-validation-ui.umd.cjs +1 -0
package/dist/vite.svg +1 -0
package/package.json +56 -0

package/README.md ADDED Viewed

@@ -0,0 +1,16 @@
+# React + Vite
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+Currently, two official plugins are available:
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+## React Compiler
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+## Expanding the ESLint configuration
+If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) for information on how to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project.

package/dist/sodas-validation-ui.css ADDED Viewed

@@ -0,0 +1 @@

+ .validation-rules-editor{font-family:system-ui,-apple-system,sans-serif;font-size:14px;color:#333}.validation-rules-editor--empty{padding:1rem;color:#c00}.validation-rules-editor__toolbar{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.validation-rules-editor__add-label{font-weight:600}.validation-rules-editor__add-select{padding:.35rem .5rem;border:1px solid #ccc;border-radius:4px;min-width:180px}.validation-rules-editor__append-btn{padding:.35rem .75rem;font-size:14px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer}.validation-rules-editor__append-btn:hover:not(:disabled){background:#f0f0f0}.validation-rules-editor__append-btn:disabled{opacity:.6;cursor:not-allowed}.validation-rules-editor__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem}.validation-rules-editor__rule{margin:0}.validation-rules-editor__rule-card{border:1px solid #ddd;border-radius:8px;padding:1rem;background:#fafafa}.validation-rules-editor__rule-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.validation-rules-editor__rule-type{font-weight:600;color:#555}.validation-rules-editor__rule-remove{padding:.25rem .5rem;font-size:12px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer}.validation-rules-editor__rule-remove:hover{background:#f0f0f0}.validation-rules-editor__fields,.validation-rules-editor__type-fields{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem}.validation-rules-editor__field{display:flex;flex-direction:column;gap:.2rem;min-width:120px}.validation-rules-editor__field--checkbox{flex-direction:row;align-items:center;min-width:auto}.validation-rules-editor__field-label{font-size:12px;color:#666}.validation-rules-editor__field-input{padding:.35rem .5rem;border:1px solid #ccc;border-radius:4px;font-size:14px}.validation-rules-editor__field--checkbox .validation-rules-editor__field-input{width:auto;margin-right:.35rem}.validation-rules-editor__empty{margin:.5rem 0 0;color:#666;font-size:13px}.template-editor{font-family:system-ui,-apple-system,sans-serif;font-size:14px;color:#333}.template-editor--empty{padding:1rem;color:#c00}.template-editor__meta{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.template-editor__field{display:flex;flex-direction:column;gap:.35rem}.template-editor__field-label{font-size:12px;font-weight:600;color:#555}.template-editor__field-input{padding:.5rem .6rem;border:1px solid #ccc;border-radius:4px;font-size:14px}.template-editor__field-input--textarea{min-height:4rem;resize:vertical}.template-editor__rules{border-top:1px solid #e0e0e0;padding-top:1.5rem}.template-editor__rules-title{margin:0 0 1rem;font-size:1rem;font-weight:600;color:#333}.quality-requirement-editor{font-family:system-ui,-apple-system,sans-serif;font-size:14px;color:#333}.quality-requirement-editor--empty{padding:1rem;color:#c00}.quality-requirement-editor__meta{margin-bottom:1.5rem}.quality-requirement-editor__field{display:flex;flex-direction:column;gap:.35rem}.quality-requirement-editor__field-label{font-size:12px;font-weight:600;color:#555}.quality-requirement-editor__field-input{padding:.5rem .6rem;border:1px solid #ccc;border-radius:4px;font-size:14px}.quality-requirement-editor__nodes{border-top:1px solid #e0e0e0;padding-top:1.5rem}.quality-requirement-editor__nodes-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.quality-requirement-editor__nodes-title{margin:0;font-size:1rem;font-weight:600;color:#333}.quality-requirement-editor__add-node-btn{padding:.35rem .75rem;font-size:14px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer}.quality-requirement-editor__add-node-btn:hover{background:#f0f0f0}.quality-requirement-editor__empty-nodes{margin:0 0 1rem;color:#666;font-size:13px}.quality-requirement-editor__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.25rem}.quality-requirement-editor__node{margin:0}.quality-requirement-editor__node-card{border:1px solid #ddd;border-radius:8px;padding:1rem;background:#fafafa}.quality-requirement-editor__node-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.quality-requirement-editor__node-index{font-weight:600;color:#555}.quality-requirement-editor__node-remove{padding:.25rem .5rem;font-size:12px;border:1px solid #ccc;border-radius:4px;background:#fff;cursor:pointer}.quality-requirement-editor__node-remove:hover{background:#f0f0f0}.quality-requirement-editor__node-fields{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;margin-bottom:1rem}.quality-requirement-editor__node-fields .quality-requirement-editor__field{min-width:160px}.quality-requirement-editor__node-rules{border-top:1px solid #e8e8e8;padding-top:1rem}.quality-requirement-editor__node-rules-title{margin:0 0 .75rem;font-size:13px;font-weight:600;color:#555}

package/dist/sodas-validation-ui.js ADDED Viewed

@@ -0,0 +1,518 @@
+import { jsx as a, jsxs as i, Fragment as N } from "react/jsx-runtime";
+import { useState as b, useCallback as T, useRef as C } from "react";
+import { VALIDATION_TYPE as s, COMPARISION_OPERATOR as g, CUSTOM_CONDITION_TYPE as q, OUTLIER_METHOD as A, EXPECTED_TYPE as E, DATETIME_FORMAT_TYPE as O, createRule as R } from "sodas-sdk";
+function I() {
+  const [, e] = b(0);
+  return T(() => e((n) => n + 1), []);
+}
+const S = {
+  [s.DATA_TYPE]: "Data Type",
+  [s.RANGE]: "Range",
+  [s.PATTERN]: "Pattern",
+  [s.UNIQUENESS]: "Uniqueness",
+  [s.CUSTOM]: "Custom",
+  [s.COMPLETENESS]: "Completeness",
+  [s.LENGTH]: "Length",
+  [s.ALLOWED_VALUES]: "Allowed Values",
+  [s.OUTLIER]: "Outlier",
+  [s.STATISTICAL]: "Statistical"
+}, f = Object.entries(g).map(([e, n]) => ({ value: n, label: e })), L = Object.entries(q).map(([e, n]) => ({ value: n, label: e })), k = Object.entries(A).map(([e, n]) => ({ value: n, label: e })), P = Object.entries(E).map(([e, n]) => ({ value: n, label: e })), U = Object.entries(O).map(([e, n]) => ({ value: n, label: e }));
+function M({ validationRules: e }) {
+  const n = I(), [c, l] = b(""), t = (u) => {
+    if (!Array.isArray(e)) return;
+    const m = R(u);
+    e.push(m), n();
+  }, r = () => {
+    c && t(c);
+  }, o = (u) => {
+    Array.isArray(e) && (e.splice(u, 1), n());
+  }, p = (u, m, h) => {
+    m === "column" ? u.setColumn(h) : m === "name" && u.setName(h), n();
+  };
+  return Array.isArray(e) ? /* @__PURE__ */ i("div", { className: "validation-rules-editor", children: [
+    /* @__PURE__ */ i("div", { className: "validation-rules-editor__toolbar", children: [
+      /* @__PURE__ */ a("label", { className: "validation-rules-editor__add-label", children: "Add rule:" }),
+      /* @__PURE__ */ i(
+        "select",
+        {
+          className: "validation-rules-editor__add-select",
+          value: c,
+          onChange: (u) => l(u.target.value),
+          "aria-label": "Validation rule type",
+          children: [
+            /* @__PURE__ */ a("option", { value: "", children: "-- Select type --" }),
+            Object.entries(S).map(([u, m]) => /* @__PURE__ */ a("option", { value: u, children: m }, u))
+          ]
+        }
+      ),
+      /* @__PURE__ */ a(
+        "button",
+        {
+          type: "button",
+          className: "validation-rules-editor__append-btn",
+          onClick: r,
+          disabled: !c,
+          "aria-label": "Append rule",
+          children: "Append"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a("ul", { className: "validation-rules-editor__list", children: e.map((u, m) => /* @__PURE__ */ a("li", { className: "validation-rules-editor__rule", children: /* @__PURE__ */ a(
+      D,
+      {
+        rule: u,
+        index: m,
+        onRemove: () => o(m),
+        onCommonChange: p,
+        forceUpdate: n
+      }
+    ) }, m)) }),
+    e.length === 0 && /* @__PURE__ */ a("p", { className: "validation-rules-editor__empty", children: "No rules. Select a type and click Append to add one." })
+  ] }) : /* @__PURE__ */ a("div", { className: "validation-rules-editor validation-rules-editor--empty", children: "validationRules must be an array" });
+}
+function D({ rule: e, index: n, onRemove: c, onCommonChange: l, forceUpdate: t }) {
+  const r = e.getType;
+  return /* @__PURE__ */ i("div", { className: "validation-rules-editor__rule-card", children: [
+    /* @__PURE__ */ i("div", { className: "validation-rules-editor__rule-header", children: [
+      /* @__PURE__ */ a("span", { className: "validation-rules-editor__rule-type", children: S[r] ?? r }),
+      /* @__PURE__ */ a(
+        "button",
+        {
+          type: "button",
+          className: "validation-rules-editor__rule-remove",
+          onClick: c,
+          "aria-label": `Remove rule ${n + 1}`,
+          children: "Remove"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ i("div", { className: "validation-rules-editor__fields", children: [
+      /* @__PURE__ */ a(d, { label: "Column", value: e.getColumn, onChange: (o) => l(e, "column", o) }),
+      /* @__PURE__ */ a(d, { label: "Name", value: e.getName, onChange: (o) => l(e, "name", o) })
+    ] }),
+    /* @__PURE__ */ a("div", { className: "validation-rules-editor__type-fields", children: /* @__PURE__ */ a(x, { rule: e, type: r, forceUpdate: t }) })
+  ] });
+}
+function d({ label: e, value: n = "", type: c = "text", onChange: l, options: t, checkbox: r }) {
+  return t ? /* @__PURE__ */ i("label", { className: "validation-rules-editor__field", children: [
+    /* @__PURE__ */ a("span", { className: "validation-rules-editor__field-label", children: e }),
+    /* @__PURE__ */ a(
+      "select",
+      {
+        className: "validation-rules-editor__field-input",
+        value: n,
+        onChange: (o) => l(o.target.value),
+        "aria-label": e,
+        children: t.map((o) => /* @__PURE__ */ a("option", { value: o.value, children: o.label }, o.value))
+      }
+    )
+  ] }) : c === "checkbox" || r ? /* @__PURE__ */ i("label", { className: "validation-rules-editor__field validation-rules-editor__field--checkbox", children: [
+    /* @__PURE__ */ a(
+      "input",
+      {
+        type: "checkbox",
+        className: "validation-rules-editor__field-input",
+        checked: !!n,
+        onChange: (o) => l(o.target.checked),
+        "aria-label": e
+      }
+    ),
+    /* @__PURE__ */ a("span", { className: "validation-rules-editor__field-label", children: e })
+  ] }) : /* @__PURE__ */ i("label", { className: "validation-rules-editor__field", children: [
+    /* @__PURE__ */ a("span", { className: "validation-rules-editor__field-label", children: e }),
+    /* @__PURE__ */ a(
+      "input",
+      {
+        type: c,
+        className: "validation-rules-editor__field-input",
+        value: n,
+        onChange: (o) => l(o.target.value),
+        "aria-label": e
+      }
+    )
+  ] });
+}
+function x({ rule: e, type: n, forceUpdate: c }) {
+  const l = (t, r) => {
+    typeof t == "function" && t.call(e, r), c();
+  };
+  switch (n) {
+    case s.UNIQUENESS:
+      return /* @__PURE__ */ a(
+        d,
+        {
+          label: "Unique",
+          type: "checkbox",
+          value: e.getUnique,
+          onChange: (t) => l(e.setUnique, !!t),
+          checkbox: !0
+        }
+      );
+    case s.PATTERN:
+      return /* @__PURE__ */ a(
+        d,
+        {
+          label: "Pattern",
+          value: e.getPattern ?? "",
+          onChange: (t) => l(e.setPattern, t)
+        }
+      );
+    case s.RANGE:
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Min value",
+            type: "number",
+            value: String(e.getMinValue ?? 0),
+            onChange: (t) => l(e.setMinValue, Number(t) || 0)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Max value",
+            type: "number",
+            value: String(e.getMaxValue ?? 0),
+            onChange: (t) => l(e.setMaxValue, Number(t) || 0)
+          }
+        )
+      ] });
+    case s.LENGTH:
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Min length",
+            type: "number",
+            value: String(e.getMinLength ?? 0),
+            onChange: (t) => l(e.setMinLength, Number(t) || 0)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Max length",
+            type: "number",
+            value: String(e.getMaxLength ?? 0),
+            onChange: (t) => l(e.setMaxLength, Number(t) || 0)
+          }
+        )
+      ] });
+    case s.ALLOWED_VALUES: {
+      const t = e.getAllowedValues ?? [], r = Array.isArray(t) ? t.join(", ") : "";
+      return /* @__PURE__ */ a(
+        d,
+        {
+          label: "Allowed values (comma-separated)",
+          value: r,
+          onChange: (o) => l(e.setAllowedValues, o.split(",").map((p) => p.trim()).filter(Boolean))
+        }
+      );
+    }
+    case s.COMPLETENESS:
+      return /* @__PURE__ */ a(
+        d,
+        {
+          label: "Min completeness",
+          type: "number",
+          value: String(e.getMinCompleteness ?? 0),
+          onChange: (t) => l(e.setMinCompleteness, Number(t) || 0)
+        }
+      );
+    case s.DATA_TYPE:
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Expected type",
+            value: e.getExpectedType ?? E.STRING,
+            options: P,
+            onChange: (t) => l(e.setExpectedType, t)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Datetime format",
+            value: e.getDatetimeFormat ?? O.YYYY_MM_DD_HH_MM_SS,
+            options: U,
+            onChange: (t) => l(e.setDatetimeFormat, t)
+          }
+        )
+      ] });
+    case s.OUTLIER:
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Method",
+            value: e.getMethod ?? A.Z_SCORE,
+            options: k,
+            onChange: (t) => l(e.setMethod, t)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Threshold",
+            type: "number",
+            value: String(e.getThreshold ?? 0),
+            onChange: (t) => l(e.setThreshold, Number(t) || 0)
+          }
+        )
+      ] });
+    case s.STATISTICAL:
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Check",
+            value: e.getCheck ?? "",
+            onChange: (t) => l(e.setCheck, t)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Threshold",
+            type: "number",
+            value: String(e.getThreshold ?? 0),
+            onChange: (t) => l(e.setThreshold, Number(t) || 0)
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Comparison",
+            value: e.getComparision ?? g.EQUAL,
+            options: f,
+            onChange: (t) => l(e.setComparision, t)
+          }
+        )
+      ] });
+    case s.CUSTOM: {
+      const t = e.getCondition ?? {};
+      return /* @__PURE__ */ i(N, { children: [
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Condition type",
+            value: t.type ?? q.ALL,
+            options: L,
+            onChange: (r) => l(e.setCondition, {
+              ...t,
+              type: r
+            })
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Threshold (threholder)",
+            type: "number",
+            value: String(t.threholder ?? 0),
+            onChange: (r) => l(e.setCondition, {
+              ...t,
+              threholder: Number(r) || 0
+            })
+          }
+        ),
+        /* @__PURE__ */ a(
+          d,
+          {
+            label: "Comparison",
+            value: t.comparision ?? g.EQUAL,
+            options: f,
+            onChange: (r) => l(e.setCondition, {
+              ...t,
+              comparision: r
+            })
+          }
+        )
+      ] });
+    }
+    default:
+      return null;
+  }
+}
+function V() {
+  const [, e] = b(0);
+  return T(() => e((n) => n + 1), []);
+}
+function w({ template: e }) {
+  const n = V(), c = C(e);
+  if (c.current = e, e == null || typeof e != "object")
+    return /* @__PURE__ */ a("div", { className: "template-editor template-editor--empty", children: "template must be an object" });
+  const l = c.current;
+  Array.isArray(l.validationRules) || (l.validationRules = []);
+  const t = (m) => {
+    l.name = m.target.value, n();
+  }, r = (m) => {
+    l.description = m.target.value, n();
+  }, o = l.name ?? "", p = l.description ?? "", u = l.validationRules;
+  return /* @__PURE__ */ i("div", { className: "template-editor", children: [
+    /* @__PURE__ */ i("div", { className: "template-editor__meta", children: [
+      /* @__PURE__ */ i("label", { className: "template-editor__field", children: [
+        /* @__PURE__ */ a("span", { className: "template-editor__field-label", children: "Name" }),
+        /* @__PURE__ */ a(
+          "input",
+          {
+            type: "text",
+            className: "template-editor__field-input",
+            value: o,
+            onChange: t,
+            placeholder: "Template name",
+            "aria-label": "Template name"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ i("label", { className: "template-editor__field", children: [
+        /* @__PURE__ */ a("span", { className: "template-editor__field-label", children: "Description" }),
+        /* @__PURE__ */ a(
+          "textarea",
+          {
+            className: "template-editor__field-input template-editor__field-input--textarea",
+            value: p,
+            onChange: r,
+            placeholder: "Template description",
+            rows: 3,
+            "aria-label": "Template description"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { className: "template-editor__rules", children: [
+      /* @__PURE__ */ a("h3", { className: "template-editor__rules-title", children: "Validation Rules" }),
+      /* @__PURE__ */ a(M, { validationRules: u })
+    ] })
+  ] });
+}
+function j() {
+  const [, e] = b(0);
+  return T(() => e((n) => n + 1), []);
+}
+function G({ qualityRequirement: e }) {
+  const n = j(), c = C(e);
+  if (c.current = e, e == null || typeof e != "object")
+    return /* @__PURE__ */ a("div", { className: "quality-requirement-editor quality-requirement-editor--empty", children: "qualityRequirement must be an object" });
+  const l = c.current;
+  Array.isArray(l.nodes) || (l.nodes = []);
+  const t = (h) => {
+    l.name = h.target.value, n();
+  }, r = () => {
+    l.nodes.push({
+      node_name: "",
+      hook: "",
+      validation_rules: []
+    }), n();
+  }, o = (h) => {
+    l.nodes.splice(h, 1), n();
+  }, p = (h, _, y) => {
+    const v = l.nodes[h];
+    v && (v[_] = y, n());
+  }, u = l.name ?? "", m = l.nodes;
+  return /* @__PURE__ */ i("div", { className: "quality-requirement-editor", children: [
+    /* @__PURE__ */ a("div", { className: "quality-requirement-editor__meta", children: /* @__PURE__ */ i("label", { className: "quality-requirement-editor__field", children: [
+      /* @__PURE__ */ a("span", { className: "quality-requirement-editor__field-label", children: "Name" }),
+      /* @__PURE__ */ a(
+        "input",
+        {
+          type: "text",
+          className: "quality-requirement-editor__field-input",
+          value: u,
+          onChange: t,
+          placeholder: "Quality requirement name",
+          "aria-label": "Quality requirement name"
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ i("div", { className: "quality-requirement-editor__nodes", children: [
+      /* @__PURE__ */ i("div", { className: "quality-requirement-editor__nodes-header", children: [
+        /* @__PURE__ */ a("h3", { className: "quality-requirement-editor__nodes-title", children: "Nodes" }),
+        /* @__PURE__ */ a(
+          "button",
+          {
+            type: "button",
+            className: "quality-requirement-editor__add-node-btn",
+            onClick: r,
+            "aria-label": "Add node",
+            children: "Add node"
+          }
+        )
+      ] }),
+      m.length === 0 && /* @__PURE__ */ a("p", { className: "quality-requirement-editor__empty-nodes", children: 'No nodes. Click "Add node" to add one.' }),
+      /* @__PURE__ */ a("ul", { className: "quality-requirement-editor__list", children: m.map((h, _) => /* @__PURE__ */ a("li", { className: "quality-requirement-editor__node", children: /* @__PURE__ */ a(
+        Y,
+        {
+          node: h,
+          index: _,
+          onRemove: () => o(_),
+          onFieldChange: (y, v) => p(_, y, v)
+        }
+      ) }, _)) })
+    ] })
+  ] });
+}
+function Y({ node: e, index: n, onRemove: c, onFieldChange: l }) {
+  const t = C(e);
+  t.current = e;
+  const r = t.current;
+  return Array.isArray(r.validation_rules) || (r.validation_rules = []), /* @__PURE__ */ i("div", { className: "quality-requirement-editor__node-card", children: [
+    /* @__PURE__ */ i("div", { className: "quality-requirement-editor__node-header", children: [
+      /* @__PURE__ */ i("span", { className: "quality-requirement-editor__node-index", children: [
+        "Node ",
+        n + 1
+      ] }),
+      /* @__PURE__ */ a(
+        "button",
+        {
+          type: "button",
+          className: "quality-requirement-editor__node-remove",
+          onClick: c,
+          "aria-label": `Remove node ${n + 1}`,
+          children: "Remove"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ i("div", { className: "quality-requirement-editor__node-fields", children: [
+      /* @__PURE__ */ i("label", { className: "quality-requirement-editor__field", children: [
+        /* @__PURE__ */ a("span", { className: "quality-requirement-editor__field-label", children: "Node name" }),
+        /* @__PURE__ */ a(
+          "input",
+          {
+            type: "text",
+            className: "quality-requirement-editor__field-input",
+            value: r.node_name ?? "",
+            onChange: (o) => l("node_name", o.target.value),
+            placeholder: "node_name",
+            "aria-label": "Node name"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ i("label", { className: "quality-requirement-editor__field", children: [
+        /* @__PURE__ */ a("span", { className: "quality-requirement-editor__field-label", children: "Hook" }),
+        /* @__PURE__ */ a(
+          "input",
+          {
+            type: "text",
+            className: "quality-requirement-editor__field-input",
+            value: r.hook ?? "",
+            onChange: (o) => l("hook", o.target.value),
+            placeholder: "hook",
+            "aria-label": "Hook"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { className: "quality-requirement-editor__node-rules", children: [
+      /* @__PURE__ */ a("h4", { className: "quality-requirement-editor__node-rules-title", children: "Validation rules" }),
+      /* @__PURE__ */ a(M, { validationRules: r.validation_rules })
+    ] })
+  ] });
+}
+export {
+  G as QualityRequirementEditor,
+  w as TemplateEditor,
+  M as ValidationRulesEditor
+};

package/dist/sodas-validation-ui.umd.cjs ADDED Viewed

@@ -0,0 +1 @@

package/dist/vite.svg ADDED Viewed

@@ -0,0 +1 @@

+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json ADDED Viewed

@@ -0,0 +1,56 @@
+{
+  "name": "sodas-validation-ui",
+  "version": "0.1.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "main": "dist/sodas-validation-ui.umd.cjs",
+  "module": "dist/sodas-validation-ui.js",
+  "exports": {
+    ".": {
+      "import": "./dist/sodas-validation-ui.js",
+      "require": "./dist/sodas-validation-ui.umd.cjs"
+    },
+    "./style.css": "./dist/sodas-validation-ui.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0",
+    "sodas-sdk": ">=1.7.0"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.0.0",
+    "@eslint/js": "^9.39.1",
+    "@storybook/addon-a11y": "^10.2.4",
+    "@storybook/addon-docs": "^10.2.4",
+    "@storybook/addon-onboarding": "^10.2.4",
+    "@storybook/addon-vitest": "^10.2.4",
+    "@storybook/react-vite": "^10.2.4",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/coverage-v8": "^4.0.18",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "globals": "^16.5.0",
+    "playwright": "^1.58.1",
+    "prop-types": "^15.8.1",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "storybook": "^10.2.4",
+    "vite": "^7.2.4",
+    "sodas-sdk": "^1.7.0",
+    "vitest": "^4.0.18"
+  }
+}