zebflow 0.6.1

Reactive web automation platform — pipelines, templates, and real-time collaboration in a single binary.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44

import { cx } from "zeb";

const studioTableThClass =
  "px-[0.8rem] py-[0.65rem] border-b border-border-soft text-left text-[0.68rem] font-mono uppercase tracking-[0.12em] text-body-soft";

const studioTableTdClassInner =
  "px-[0.8rem] py-[0.65rem] border-b border-border-soft text-left text-[0.8rem] text-body";

/** For behaviors that create `<td>` in JS — same string as `StudioTd`. */
export const studioTableTdClass = studioTableTdClassInner;

export function StudioTable({ variant = "default", className, children, ...rest }) {
  const tableClass =
    variant === "dbGrid" ? "w-full border-collapse project-table" : "w-full border-collapse";
  return (
    <table className={cx(tableClass, className)} {...rest}>
      {children}
    </table>
  );
}

export function StudioThead({ className, children, ...rest }) {
  return (
    <thead className={cx("bg-surface-2", className)} {...rest}>
      {children}
    </thead>
  );
}

export function StudioTh({ className, children, ...rest }) {
  return (
    <th className={cx(studioTableThClass, className)} {...rest}>
      {children}
    </th>
  );
}

export function StudioTd({ className, children, ...rest }) {
  return (
    <td className={cx(studioTableTdClassInner, className)} {...rest}>
      {children}
    </td>
  );
}