@processengine/uikit 0.1.0

package/dist/react/JsonExplorer.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import JsonView from "@uiw/react-json-view";
+const JSON_EXPLORER_THEME = {
+    "--w-rjv-background-color": "transparent",
+    "--w-rjv-font-family": "var(--font-mono)",
+    "--w-rjv-color": "var(--text-medium)",
+    "--w-rjv-line-color": "rgba(29, 31, 53, 0.08)",
+    "--w-rjv-arrow-color": "var(--text-faint)",
+    "--w-rjv-curlybraces-color": "var(--text-faint)",
+    "--w-rjv-brackets-color": "var(--text-faint)",
+    "--w-rjv-colon-color": "var(--text-faint)",
+    "--w-rjv-quotes-color": "var(--text-faint)",
+    "--w-rjv-quotes-string-color": "var(--text-medium)",
+    "--w-rjv-ellipsis-color": "var(--text-faint)",
+    "--w-rjv-type-string-color": "var(--accent-color)",
+    "--w-rjv-type-int-color": "#2563eb",
+    "--w-rjv-type-float-color": "#2563eb",
+    "--w-rjv-type-bigint-color": "#2563eb",
+    "--w-rjv-type-boolean-color": "#7c3aed",
+    "--w-rjv-type-date-color": "#0f766e",
+    "--w-rjv-type-url-color": "#0369a1",
+    "--w-rjv-type-null-color": "var(--text-faint)",
+    "--w-rjv-type-nan-color": "#b45309",
+    "--w-rjv-type-undefined-color": "var(--text-faint)",
+    "--w-rjv-key-string": "var(--text-strong)",
+    "--w-rjv-key-number": "var(--text-strong)",
+};
+function shouldExpandPath(defaultExpanded) {
+    return (_isExpanded, { keys }) => {
+        if (keys.length === 0) {
+            return true;
+        }
+        const path = keys.join(".");
+        return defaultExpanded.some((expectedPath) => path === expectedPath ||
+            path.startsWith(`${expectedPath}.`) ||
+            expectedPath.startsWith(`${path}.`));
+    };
+}
+export function JsonExplorer({ data, defaultExpanded = [], collapsed = 2, className, }) {
+    if (data == null) {
+        return _jsx("p", { className: "app-empty-text", children: "\u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445 \u0434\u043B\u044F \u043E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u044F." });
+    }
+    return (_jsx("div", { className: className, children: _jsx(JsonView, { value: data, collapsed: collapsed, shouldExpandNodeInitially: defaultExpanded.length > 0
+                ? shouldExpandPath(defaultExpanded)
+                : undefined, displayDataTypes: false, shortenTextAfterLength: 80, enableClipboard: true, style: JSON_EXPLORER_THEME }) }));
+}

package/dist/react/JsonPanel.d.ts

@@ -0,0 +1,9 @@
+type JsonPanelProps = {
+    value: unknown;
+    emptyMessage?: string;
+    defaultExpanded?: string[];
+    collapsed?: boolean | number;
+};
+export declare function JsonPanel({ value, emptyMessage, defaultExpanded, collapsed, }: JsonPanelProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=JsonPanel.d.ts.map

package/dist/react/JsonPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JsonPanel.d.ts","sourceRoot":"","sources":["../../src/react/JsonPanel.tsx"],"names":[],"mappings":"AAEA,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CAC9B,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,YAA2B,EAC3B,eAAe,EACf,SAAS,GACV,EAAE,cAAc,+BAchB"}

package/dist/react/JsonPanel.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { JsonExplorer } from "./JsonExplorer";
+export function JsonPanel({ value, emptyMessage = "Нет данных", defaultExpanded, collapsed, }) {
+    if (value == null) {
+        return _jsx("p", { className: "app-empty-text", children: emptyMessage });
+    }
+    return (_jsx("div", { className: "app-json-panel", children: _jsx(JsonExplorer, { data: value, collapsed: collapsed, defaultExpanded: defaultExpanded }) }));
+}

package/dist/react/PageHeader.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from "react";
+type PageHeaderProps = {
+    title: string;
+    subtitle?: ReactNode;
+    eyebrow?: string;
+    detail?: boolean;
+};
+export declare function PageHeader({ title, subtitle, eyebrow, detail }: PageHeaderProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=PageHeader.d.ts.map

package/dist/react/PageHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageHeader.d.ts","sourceRoot":"","sources":["../../src/react/PageHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,eAAe,+BAU/E"}

package/dist/react/PageHeader.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "./cn";
+export function PageHeader({ title, subtitle, eyebrow, detail }) {
+    return (_jsxs("header", { className: cn("app-page-header", detail && "app-page-header--detail"), children: [eyebrow ? _jsx("div", { className: "app-page-header__eyebrow", children: eyebrow }) : null, _jsx("h1", { className: "app-page-header__title", id: "page-title", children: title }), subtitle ? _jsx("div", { className: "app-page-header__subtitle", children: subtitle }) : null] }));
+}

package/dist/react/SearchInput.d.ts

@@ -0,0 +1,10 @@
+type SearchInputProps = {
+    label: string;
+    name: string;
+    placeholder: string;
+    value: string;
+    onChange: (value: string) => void;
+};
+export declare function SearchInput({ label, name, placeholder, value, onChange, }: SearchInputProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=SearchInput.d.ts.map

package/dist/react/SearchInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../src/react/SearchInput.tsx"],"names":[],"mappings":"AAEA,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,IAAI,EACJ,WAAW,EACX,KAAK,EACL,QAAQ,GACT,EAAE,gBAAgB,+BAiClB"}

package/dist/react/SearchInput.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+export function SearchInput({ label, name, placeholder, value, onChange, }) {
+    const inputId = useId();
+    return (_jsxs("div", { className: "app-search", children: [_jsx("label", { className: "app-visually-hidden", htmlFor: inputId, children: label }), _jsxs("div", { className: "app-search__field", children: [_jsx("span", { className: "app-search__icon", "aria-hidden": "true", children: _jsxs("svg", { viewBox: "0 0 20 20", fill: "none", children: [_jsx("circle", { cx: "9", cy: "9", r: "5.5", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "M13.5 13.5L17 17", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }) }), _jsx("input", { className: "app-search__input", id: inputId, type: "search", name: name, value: value, onChange: (event) => onChange(event.target.value), placeholder: placeholder, autoComplete: "off" })] })] }));
+}

package/dist/react/StateCard.d.ts

@@ -0,0 +1,9 @@
+type StateCardProps = {
+    title: string;
+    text: string;
+    actionLabel?: string;
+    onAction?: () => void;
+};
+export declare function StateCard({ title, text, actionLabel, onAction, }: StateCardProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=StateCard.d.ts.map

package/dist/react/StateCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StateCard.d.ts","sourceRoot":"","sources":["../../src/react/StateCard.tsx"],"names":[],"mappings":"AAAA,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,GACT,EAAE,cAAc,+BAahB"}

package/dist/react/StateCard.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function StateCard({ title, text, actionLabel, onAction, }) {
+    return (_jsxs("div", { className: "app-state-card", children: [_jsx("p", { className: "app-state-card__title", children: title }), _jsx("p", { className: "app-state-card__text", children: text }), actionLabel && onAction ? (_jsx("button", { className: "app-state-card__action", type: "button", onClick: onAction, children: actionLabel })) : null] }));
+}

package/dist/react/Tabs.d.ts

@@ -0,0 +1,13 @@
+export type TabOption<T extends string> = {
+    id: T;
+    label: string;
+};
+type TabsProps<T extends string> = {
+    activeTab: T;
+    tabs: TabOption<T>[];
+    ariaLabel: string;
+    onChange: (tab: T) => void;
+};
+export declare function Tabs<T extends string>({ activeTab, tabs, ariaLabel, onChange, }: TabsProps<T>): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=Tabs.d.ts.map

package/dist/react/Tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../src/react/Tabs.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,MAAM,IAAI;IACxC,EAAE,EAAE,CAAC,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,MAAM,IAAI;IACjC,SAAS,EAAE,CAAC,CAAC;IACb,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC;CAC5B,CAAC;AAEF,wBAAgB,IAAI,CAAC,CAAC,SAAS,MAAM,EAAE,EACrC,SAAS,EACT,IAAI,EACJ,SAAS,EACT,QAAQ,GACT,EAAE,SAAS,CAAC,CAAC,CAAC,+BAqBd"}

package/dist/react/Tabs.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "./cn";
+export function Tabs({ activeTab, tabs, ariaLabel, onChange, }) {
+    return (_jsx("div", { className: "app-tabs", role: "tablist", "aria-label": ariaLabel, children: tabs.map((tab) => {
+            const isActive = tab.id === activeTab;
+            return (_jsx("button", { className: cn("app-tabs__tab", isActive && "app-tabs__tab--active"), type: "button", role: "tab", "aria-selected": isActive, onClick: () => onChange(tab.id), children: tab.label }, tab.id));
+        }) }));
+}

package/dist/react/cn.d.ts

@@ -0,0 +1,3 @@
+export type ClassValue = string | false | null | undefined;
+export declare function cn(...classes: ClassValue[]): string;
+//# sourceMappingURL=cn.d.ts.map

package/dist/react/cn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.d.ts","sourceRoot":"","sources":["../../src/react/cn.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC;AAE3D,wBAAgB,EAAE,CAAC,GAAG,OAAO,EAAE,UAAU,EAAE,UAE1C"}

package/dist/react/cn.js

@@ -0,0 +1,3 @@
+export function cn(...classes) {
+    return classes.filter(Boolean).join(" ");
+}

package/dist/react/index.d.ts

@@ -0,0 +1,9 @@
+export { cn, type ClassValue } from "./cn";
+export { CopyableValue } from "./CopyableValue";
+export { JsonExplorer } from "./JsonExplorer";
+export { JsonPanel } from "./JsonPanel";
+export { PageHeader } from "./PageHeader";
+export { SearchInput } from "./SearchInput";
+export { StateCard } from "./StateCard";
+export { Tabs, type TabOption } from "./Tabs";
+//# sourceMappingURL=index.d.ts.map

package/dist/react/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,KAAK,UAAU,EAAE,MAAM,MAAM,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC"}

package/dist/react/index.js

@@ -0,0 +1,8 @@
+export { cn } from "./cn";
+export { CopyableValue } from "./CopyableValue";
+export { JsonExplorer } from "./JsonExplorer";
+export { JsonPanel } from "./JsonPanel";
+export { PageHeader } from "./PageHeader";
+export { SearchInput } from "./SearchInput";
+export { StateCard } from "./StateCard";
+export { Tabs } from "./Tabs";