bank20baht-ui 0.0.1

package/dist/overlay.d.ts

@@ -0,0 +1,45 @@
+import { ToastOptions } from './components/primitives/baht-toast.js';
+export type DialogTone = 'info' | 'success' | 'warning' | 'danger';
+export interface DialogOptions {
+    /** Modal heading (also its accessible name). Each API has a dry default. */
+    title?: string;
+    tone?: DialogTone;
+    confirmText?: string;
+    cancelText?: string;
+    /** Secondary monospace block under the message (error detail, payload, …). */
+    detail?: string;
+    /** Allow Escape / scrim-click to cancel. Default true. */
+    dismissible?: boolean;
+}
+export interface PromptOptions extends DialogOptions {
+    placeholder?: string;
+    /** Initial input value. */
+    value?: string;
+}
+export type DialogReason = 'confirm' | 'cancel' | 'escape' | 'scrim' | 'detached';
+export interface DialogResult {
+    confirmed: boolean;
+    reason: DialogReason;
+    /** Input value (prompt only). */
+    value?: string;
+}
+export declare const dialog: {
+    /** Yes/no question. Resolves true only on explicit confirm. */
+    confirm(message: string, options?: DialogOptions): Promise<boolean>;
+    /** One-button notice. Resolves when acknowledged. */
+    alert(message: string, options?: DialogOptions): Promise<void>;
+    /** Error notice — danger tone, optional monospace `detail`. */
+    error(message: string, options?: DialogOptions): Promise<void>;
+    /** Single text input. Resolves the value, or null on cancel/dismiss. */
+    prompt(message: string, options?: PromptOptions): Promise<string | null>;
+};
+type ToastShorthand = Omit<ToastOptions, 'message' | 'tone'>;
+export declare const toast: {
+    show(message: string, options?: Omit<ToastOptions, "message">): number;
+    success: (message: string, options?: ToastShorthand) => number;
+    info: (message: string, options?: ToastShorthand) => number;
+    warning: (message: string, options?: ToastShorthand) => number;
+    danger: (message: string, options?: ToastShorthand) => number;
+    dismiss(id: number): void;
+};
+export {};

package/dist/overlay.js

@@ -0,0 +1,121 @@
+import "./chunks/baht-toast-BlZBbneT.js";
+let y = Promise.resolve();
+function N(e) {
+  const t = y.then(e, e);
+  return y = t.catch(() => {
+  }), t;
+}
+function p(e) {
+  return N(() => I(e));
+}
+async function I(e) {
+  var C;
+  const t = document.activeElement, o = e.dismissible !== !1, E = e.tone === "danger" ? "danger" : "primary", a = document.createElement("baht-modal");
+  a.heading = e.title ?? "", a.showClose = !1, a.closeOnScrim = o;
+  const c = document.createElement("div");
+  c.className = `baht-dialog${e.tone ? ` baht-dialog--${e.tone}` : ""}`;
+  const b = document.createElement("p");
+  if (b.className = "baht-dialog-message", b.textContent = e.message, c.appendChild(b), e.detail) {
+    const i = document.createElement("pre");
+    i.className = "baht-dialog-detail", i.textContent = e.detail, c.appendChild(i);
+  }
+  let n = null;
+  e.showInput && (n = document.createElement("input"), n.className = "baht-control baht-dialog-input", n.type = "text", n.value = e.value ?? "", e.placeholder && (n.placeholder = e.placeholder), c.appendChild(n));
+  const u = document.createElement("div");
+  u.className = "baht-dialog-actions";
+  let l = null;
+  e.showCancel && (l = document.createElement("baht-button"), l.className = "baht-dialog-cancel", l.variant = "secondary", l.label = e.cancelText ?? "Cancel", u.appendChild(l));
+  const d = document.createElement("baht-button");
+  d.className = "baht-dialog-confirm", d.variant = E, d.label = e.confirmText ?? "OK", u.appendChild(d), c.appendChild(u), a.appendChild(c), document.body.appendChild(a), a.open = !0;
+  let h;
+  const w = new MutationObserver(() => {
+    a.isConnected || h == null || h();
+  });
+  w.observe(document.documentElement, { childList: !0, subtree: !0 });
+  const g = await new Promise((i) => {
+    let v = !1;
+    const m = (s) => {
+      v || (v = !0, i(s));
+    };
+    h = () => m({ confirmed: !1, reason: "detached" }), d.addEventListener(
+      "click",
+      () => m({ confirmed: !0, reason: "confirm", value: n == null ? void 0 : n.value })
+    ), l == null || l.addEventListener("click", () => m({ confirmed: !1, reason: "cancel" })), a.addEventListener("baht-close", (s) => {
+      if (!o) return;
+      const x = s.detail.reason;
+      m({ confirmed: !1, reason: x === "scrim" ? "scrim" : "escape" });
+    }), n == null || n.addEventListener("keydown", (s) => {
+      s.key === "Enter" && !s.isComposing && m({ confirmed: !0, reason: "confirm", value: s.target.value });
+    }), a.updateComplete.then(() => {
+      var s;
+      return (s = n ?? d.querySelector("button")) == null ? void 0 : s.focus();
+    });
+  });
+  return w.disconnect(), a.open = !1, a.remove(), (C = t == null ? void 0 : t.focus) == null || C.call(t), g;
+}
+const S = {
+  /** Yes/no question. Resolves true only on explicit confirm. */
+  async confirm(e, t = {}) {
+    return (await p({
+      title: "Are you sure?",
+      confirmText: "Confirm",
+      ...t,
+      message: e,
+      showCancel: !0,
+      showInput: !1
+    })).confirmed;
+  },
+  /** One-button notice. Resolves when acknowledged. */
+  async alert(e, t = {}) {
+    await p({
+      title: "Notice",
+      ...t,
+      message: e,
+      showCancel: !1,
+      showInput: !1
+    });
+  },
+  /** Error notice — danger tone, optional monospace `detail`. */
+  async error(e, t = {}) {
+    await p({
+      title: "Something went wrong",
+      tone: "danger",
+      ...t,
+      message: e,
+      showCancel: !1,
+      showInput: !1
+    });
+  },
+  /** Single text input. Resolves the value, or null on cancel/dismiss. */
+  async prompt(e, t = {}) {
+    const o = await p({
+      title: "Input needed",
+      confirmText: "OK",
+      ...t,
+      message: e,
+      showCancel: !0,
+      showInput: !0
+    });
+    return o.confirmed ? o.value ?? "" : null;
+  }
+};
+let r = null;
+function T() {
+  return r != null && r.isConnected || (r = document.querySelector("baht-toast") ?? document.body.appendChild(document.createElement("baht-toast"))), r;
+}
+const f = (e) => (t, o = {}) => L.show(t, { ...o, tone: e }), L = {
+  show(e, t = {}) {
+    return T().show({ message: e, ...t });
+  },
+  success: f("success"),
+  info: f("info"),
+  warning: f("warning"),
+  danger: f("danger"),
+  dismiss(e) {
+    r == null || r.dismiss(e);
+  }
+};
+export {
+  S as dialog,
+  L as toast
+};

package/dist/react.d.ts

@@ -0,0 +1,191 @@
+import { default as React } from 'react';
+import { FieldDescriptor, FieldOption, FormDefinition, NestedData, Registry, WorkflowDefinition } from './core/index.js';
+import { AccordionItem, BadgeTone, ButtonSize, ButtonVariant, CellRenderer, CodeVariant, Crumb, ListItem, TimelineItem } from './components/primitives/index.js';
+import { BahtFormOptions } from './components/baht-form.js';
+/**
+ * Base attributes shared by every custom element (style, event handlers, …).
+ * `class` is included alongside React's `className` — web-component users often
+ * reach for the plain HTML attribute, and both work on custom elements.
+ */
+type WC<Props = object> = React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement> & {
+    class?: string;
+} & Props, HTMLElement>;
+/** Shared props of the form-field primitives (all extend BahtFieldBase). */
+type FieldProps = {
+    field?: FieldDescriptor;
+    value?: unknown;
+    disabled?: boolean;
+    readonly?: boolean;
+    required?: boolean;
+    error?: string | null;
+};
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements {
+            'baht-form': WC<{
+                form?: FormDefinition;
+                value?: Record<string, unknown>;
+                registry?: Registry;
+                options?: BahtFormOptions;
+            }>;
+            'baht-workflow': WC<{
+                workflow?: WorkflowDefinition;
+                value?: NestedData;
+                registry?: Registry;
+                'validate-gate'?: boolean;
+                'next-label'?: string;
+                'submit-label'?: string;
+                'back-label'?: string;
+                'show-back'?: boolean;
+            }>;
+            'baht-input': WC<FieldProps>;
+            'baht-textarea': WC<FieldProps>;
+            'baht-number': WC<FieldProps>;
+            'baht-select': WC<FieldProps>;
+            'baht-multiselect': WC<FieldProps>;
+            'baht-checkbox': WC<FieldProps>;
+            'baht-radio': WC<FieldProps>;
+            'baht-toggle': WC<FieldProps>;
+            'baht-datepicker': WC<FieldProps>;
+            'baht-file': WC<FieldProps>;
+            'baht-text': WC<{
+                field?: FieldDescriptor;
+            }>;
+            'baht-button': WC<{
+                variant?: ButtonVariant;
+                size?: ButtonSize;
+                disabled?: boolean;
+                type?: 'button' | 'submit';
+                label?: string;
+                icon?: string;
+                'icon-only'?: boolean;
+            }>;
+            'baht-badge': WC<{
+                tone?: BadgeTone;
+                label?: string;
+                dot?: boolean;
+            }>;
+            'baht-card': WC<{
+                heading?: string;
+                subtitle?: string;
+                hero?: boolean;
+            }>;
+            'baht-alert': WC<{
+                tone?: 'info' | 'success' | 'warning' | 'danger';
+                heading?: string;
+                message?: string;
+                dismissible?: boolean;
+            }>;
+            'baht-code': WC<{
+                variant?: CodeVariant;
+                code?: string;
+            }>;
+            'baht-link': WC<{
+                href?: string;
+                label?: string;
+                external?: boolean;
+            }>;
+            'baht-spinner': WC<{
+                size?: 'sm' | 'md' | 'lg';
+                label?: string;
+            }>;
+            'baht-skeleton': WC<{
+                variant?: 'rect' | 'text' | 'circle';
+                width?: string;
+                height?: string;
+            }>;
+            'baht-tooltip': WC<{
+                text?: string;
+                position?: 'top' | 'bottom' | 'left' | 'right';
+            }>;
+            'baht-fieldset': WC<{
+                legend?: string;
+                disabled?: boolean;
+            }>;
+            'baht-table': WC<{
+                items?: Record<string, unknown>[];
+                columns?: Record<string, string>;
+                renderers?: Record<string, CellRenderer>;
+                loading?: boolean;
+                error?: boolean;
+                'error-message'?: string;
+                'empty-message'?: string;
+                'show-index'?: boolean;
+                'index-offset'?: number;
+                'skeleton-rows'?: number;
+                'row-key'?: string;
+                clickable?: boolean;
+                page?: number;
+                'total-pages'?: number;
+            }>;
+            'baht-list': WC<{
+                items?: ListItem[];
+                loading?: boolean;
+                error?: boolean;
+                'error-message'?: string;
+                'empty-message'?: string;
+                'skeleton-rows'?: number;
+                clickable?: boolean;
+            }>;
+            'baht-accordion': WC<{
+                items?: AccordionItem[];
+                multiple?: boolean;
+            }>;
+            'baht-timeline': WC<{
+                items?: TimelineItem[];
+            }>;
+            'baht-breadcrumbs': WC<{
+                items?: Crumb[];
+                separator?: string;
+            }>;
+            'baht-filter': WC<{
+                options?: FieldOption[];
+                selected?: string[];
+                multiple?: boolean;
+                disabled?: boolean;
+            }>;
+            'baht-pagination': WC<{
+                page?: number;
+                'total-pages'?: number;
+                variant?: 'numbered' | 'compact';
+                siblings?: number;
+            }>;
+            'baht-progress': WC<{
+                value?: number | null;
+                tone?: 'primary' | 'success' | 'warning' | 'danger';
+                'show-label'?: boolean;
+                label?: string;
+            }>;
+            'baht-range': WC<{
+                value?: number;
+                min?: number;
+                max?: number;
+                step?: number;
+                label?: string;
+                disabled?: boolean;
+                'show-value'?: boolean;
+            }>;
+            'baht-rating': WC<{
+                value?: number;
+                max?: number;
+                readonly?: boolean;
+            }>;
+            'baht-otp': WC<{
+                length?: number;
+                value?: string;
+                disabled?: boolean;
+                mode?: 'numeric' | 'text';
+            }>;
+            'baht-modal': WC<{
+                open?: boolean;
+                heading?: string;
+                'show-close'?: boolean;
+                'close-on-scrim'?: boolean;
+            }>;
+            'baht-toast': WC<{
+                duration?: number;
+            }>;
+        }
+    }
+}
+export {};

package/dist/react.js

@@ -0,0 +1 @@
+