@logicplanes/kaeso-ui 0.1.0

package/dist/components/input.js

@@ -0,0 +1,181 @@
+"use client";
+import { t as e } from "../chunks/cn-CidVUKMm.js";
+import { i as t } from "../chunks/context-BELWW79w.js";
+import { r as n } from "../chunks/tooltip-CDu00nzg.js";
+import { a as r, o as i, s as a } from "../chunks/field-d8V94bvZ.js";
+import { a as o, i as s, n as c, r as l, t as u } from "../chunks/input-group-DQqEPFj_.js";
+import { i as d, n as f, r as p, t as m } from "../chunks/input-Biakz6GB.js";
+import { a as h, c as g, i as _, l as v, n as y, o as b, r as x, s as S, t as C } from "../chunks/textarea-Bvk7N2bh.js";
+import { a as w } from "../chunks/tag-BsmQ1xPj.js";
+import { forwardRef as T, useId as E, useRef as D, useState as O } from "react";
+import { jsx as k, jsxs as A } from "react/jsx-runtime";
+import { ViewIcon as j, ViewOffSlashIcon as M } from "@hugeicons/core-free-icons";
+//#region src/components/input/sensitive-input.tsx
+var N = { kind: {
+	secret: { classes: "" },
+	password: { classes: "" }
+} }, P = { kind: "secret" }, F = /* @__PURE__ */ T(function({ kind: n = "secret", defaultRevealed: r = !1, description: i, onKeyDown: a, onKeyUp: o, className: s, ...l }, u) {
+	let d = t(), [f, p] = O(r), [h, g] = O(!1), _ = (e) => g(n === "password" && e.getModifierState?.("CapsLock"));
+	return /* @__PURE__ */ k(m, {
+		ref: u,
+		type: f ? "text" : "password",
+		autoComplete: n === "password" ? "current-password" : "off",
+		autoCorrect: "off",
+		autoCapitalize: "off",
+		spellCheck: !1,
+		"data-1p-ignore": n === "secret" || void 0,
+		"data-lpignore": n === "secret" ? "true" : void 0,
+		className: e(s, f && "mono"),
+		description: h ? d("sensitiveInput.capsLock", "Caps Lock is on.") : i,
+		onKeyDown: (e) => {
+			_(e), a?.(e);
+		},
+		onKeyUp: (e) => {
+			_(e), o?.(e);
+		},
+		trailing: /* @__PURE__ */ k(c.Button, {
+			icon: f ? M : j,
+			"aria-label": f ? d("sensitiveInput.hide", "Hide") : d("sensitiveInput.show", "Show"),
+			onClick: () => p((e) => !e),
+			disabled: l.disabled
+		}),
+		...l
+	});
+});
+process.env.NODE_ENV !== "production" && (F.displayName = "SensitiveInput");
+//#endregion
+//#region src/components/input/otp-input.tsx
+var I = { size: {
+	md: { classes: "size-48 text-title" },
+	sm: { classes: "size-40 text-title-sm" }
+} }, L = { size: "md" }, R = /* @__PURE__ */ T(function({ length: n = 6, value: i, defaultValue: a = "", onValueChange: o, onComplete: s, invalid: c, size: l = "md", disabled: u, className: d, id: f, "aria-label": p, "data-force": m, ...h }, g) {
+	let _ = r(), v = t(), [y, b] = O(a), [x, S] = O(!1), [C, w] = O(0), T = E(), j = D(null), M = (i ?? y).slice(0, n), N = (e) => {
+		let t = e.replace(/\D/g, "").slice(0, n);
+		i === void 0 && b(t), o?.(t), t.length === n && s?.(t);
+	}, P = Math.min(C, n - 1), F = x || m?.includes("focus");
+	return /* @__PURE__ */ A("div", {
+		className: e("relative inline-flex gap-8", d),
+		"data-invalid": c || _?.invalid || void 0,
+		children: [Array.from({ length: n }, (t, r) => {
+			let i = M[r] ?? "", a = F && r === Math.min(M.length, n - 1) && (C >= M.length || r === P);
+			return /* @__PURE__ */ k("div", {
+				"aria-hidden": !0,
+				className: e("flex items-center justify-center rounded-cell-lg font-semibold tabular text-fg material-field transition-control", I.size[l].classes, r === 2 && n === 6 && "mr-8"),
+				...c || _?.invalid ? { "data-invalid": "" } : {},
+				...u ? { "data-disabled": "" } : {},
+				...a ? { "data-focused": "" } : {},
+				children: i || (a ? /* @__PURE__ */ k("span", { className: "h-20 w-1 animate-pulse-quiet bg-fg" }) : null)
+			}, r);
+		}), /* @__PURE__ */ k("input", {
+			ref: (e) => {
+				j.current = e, typeof g == "function" ? g(e) : g && (g.current = e);
+			},
+			id: _?.controlId ?? f ?? `k-otp-${T}`,
+			type: "text",
+			inputMode: "numeric",
+			autoComplete: "one-time-code",
+			pattern: "\\d*",
+			maxLength: n,
+			value: M,
+			disabled: u,
+			"aria-label": p ?? (_ ? void 0 : v("otpInput.label", "Verification code")),
+			..._?.controlProps["aria-describedby"] ? { "aria-describedby": _.controlProps["aria-describedby"] } : {},
+			...c || _?.invalid ? { "aria-invalid": !0 } : {},
+			onChange: (e) => {
+				N(e.target.value), w(e.target.selectionStart ?? e.target.value.length);
+			},
+			onSelect: (e) => w(e.target.selectionStart ?? 0),
+			onFocus: () => S(!0),
+			onBlur: () => S(!1),
+			className: "absolute inset-0 h-full w-full cursor-text bg-transparent text-transparent caret-transparent opacity-0 outline-none disabled:cursor-not-allowed",
+			...h
+		})]
+	});
+});
+process.env.NODE_ENV !== "production" && (R.displayName = "OTPInput");
+//#endregion
+//#region src/components/input/tag-input.tsx
+var z = { size: { md: { classes: "min-h-36 p-4" } } }, B = { size: "md" }, V = /* @__PURE__ */ T(function(o, s) {
+	let { value: c, defaultValue: l = [], onValueChange: u, placeholder: d, validate: f, separators: p = [
+		",",
+		" ",
+		";"
+	], disabled: m, id: h, name: g, className: _, label: v, description: y, error: b, optional: x, required: S, layout: C, "aria-label": T, "data-force": E } = o, j = r(), M = i(o), N = t(), [P, F] = O(l), [I, L] = O(""), R = D(null), B = c ?? P, V = (e) => {
+		c === void 0 && F(e), u?.(e);
+	}, H = RegExp(`[${p.map((e) => e.replace(/[\]\\^-]/g, "\\$&")).join("")}\\n]+`), U = (e) => {
+		let t = e.split(H).map((e) => e.trim()).filter(Boolean).filter((e) => !B.includes(e));
+		t.length && V([...B, ...t]), L("");
+	}, W = B.map((e) => !f || f(e)), G = W.find((e) => e !== !0), K = b ?? (typeof G == "string" ? G : void 0), q = /* @__PURE__ */ A("div", {
+		className: e("flex w-full min-w-0 flex-wrap items-center gap-4 rounded-field material-field transition-control cursor-text", z.size.md.classes, m && "cursor-not-allowed", !(v || y || K) && _),
+		...K || j?.invalid ? { "data-invalid": "" } : {},
+		...m ? { "data-disabled": "" } : {},
+		...E ? { "data-force": E } : {},
+		onMouseDown: (e) => {
+			e.target === e.currentTarget && (e.preventDefault(), R.current?.focus());
+		},
+		children: [
+			B.map((e, t) => {
+				let r = W[t];
+				return /* @__PURE__ */ k(w, {
+					invalid: r !== !0,
+					...m ? {} : {
+						onRemove: () => V(B.filter((t) => t !== e)),
+						removeLabel: N("tagInput.remove", "Remove {tag}", { tag: e })
+					},
+					children: typeof r == "string" ? /* @__PURE__ */ k(n, {
+						content: r,
+						children: /* @__PURE__ */ k("span", { children: e })
+					}) : e
+				}, e);
+			}),
+			/* @__PURE__ */ k("input", {
+				ref: (e) => {
+					R.current = e, typeof s == "function" ? s(e) : s && (s.current = e);
+				},
+				...h ? { id: h } : {},
+				...M.controlProps,
+				...T ? { "aria-label": T } : {},
+				...K ? { "aria-invalid": !0 } : {},
+				disabled: m,
+				required: S && B.length === 0,
+				...S ? { "aria-required": !0 } : {},
+				value: I,
+				placeholder: B.length ? void 0 : d,
+				onChange: (e) => {
+					let t = e.target.value;
+					p.some((e) => t.endsWith(e)) ? U(t) : L(t);
+				},
+				onKeyDown: (e) => {
+					e.key === "Enter" && I.trim() ? (e.preventDefault(), U(I)) : e.key === "Backspace" && !I && B.length && V(B.slice(0, -1));
+				},
+				onPaste: (e) => {
+					let t = e.clipboardData.getData("text");
+					H.test(t) && (e.preventDefault(), U(I + t));
+				},
+				onBlur: () => I.trim() && U(I),
+				className: e("my-4 min-w-80 flex-1 bg-transparent px-8 text-body text-fg outline-none placeholder:text-fg-tertiary disabled:cursor-not-allowed", B.length === 0 && "pl-12")
+			}),
+			g && /* @__PURE__ */ k("input", {
+				type: "hidden",
+				name: g,
+				value: B.join(",")
+			})
+		]
+	});
+	return j ? q : a({
+		label: v,
+		description: y,
+		error: K,
+		optional: x,
+		required: S,
+		layout: C,
+		id: M.wrapId ?? h,
+		disabled: m,
+		className: _
+	}, q);
+});
+process.env.NODE_ENV !== "production" && (V.displayName = "TagInput");
+//#endregion
+export { u as INPUT_ICON_SIZE, m as Input, c as InputGroup, f as KAESO_INPUT_DEFAULT_VARIANTS, l as KAESO_INPUT_GROUP_DEFAULT_VARIANTS, s as KAESO_INPUT_GROUP_VARIANTS, p as KAESO_INPUT_VARIANTS, _ as KAESO_NUMBER_INPUT_DEFAULT_VARIANTS, h as KAESO_NUMBER_INPUT_VARIANTS, L as KAESO_OTP_INPUT_DEFAULT_VARIANTS, I as KAESO_OTP_INPUT_VARIANTS, P as KAESO_SENSITIVE_INPUT_DEFAULT_VARIANTS, N as KAESO_SENSITIVE_INPUT_VARIANTS, B as KAESO_TAG_INPUT_DEFAULT_VARIANTS, z as KAESO_TAG_INPUT_VARIANTS, C as KAESO_TEXTAREA_DEFAULT_VARIANTS, y as KAESO_TEXTAREA_VARIANTS, b as NumberInput, R as OTPInput, d as SearchInput, F as SensitiveInput, V as TagInput, x as Textarea, S as addDecimal, g as compareDecimal, v as groupDecimal, o as useInputGroupSize };
+
+//# sourceMappingURL=input.js.map

package/dist/components/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","names":["__icon_ViewOffSlashIcon","__icon_ViewIcon","cn","useUiText","Tooltip","useField","useFieldControl","withField","useInputGroupSize","KAESO_INPUT_GROUP_VARIANTS","InputGroup","KAESO_INPUT_GROUP_DEFAULT_VARIANTS","INPUT_ICON_SIZE","SearchInput","KAESO_INPUT_DEFAULT_VARIANTS","KAESO_INPUT_VARIANTS","Input","KAESO_NUMBER_INPUT_VARIANTS","compareDecimal","KAESO_NUMBER_INPUT_DEFAULT_VARIANTS","groupDecimal","KAESO_TEXTAREA_VARIANTS","NumberInput","Textarea","addDecimal","KAESO_TEXTAREA_DEFAULT_VARIANTS","Tag","KAESO_SENSITIVE_INPUT_VARIANTS","KAESO_SENSITIVE_INPUT_DEFAULT_VARIANTS","SensitiveInput","props","t","revealed","setRevealed","useState","defaultRevealed","caps","setCaps","checkCaps","kind","className","description","onKeyDown","onKeyUp","ViewOffSlashIcon","ViewIcon","r","KAESO_OTP_INPUT_VARIANTS","KAESO_OTP_INPUT_DEFAULT_VARIANTS","OTPInput","ariaLabel","force","field","inner","setInner","defaultValue","focused","setFocused","sel","setSel","auto","useId","input","useRef","current","value","length","set","clean","v","onValueChange","onComplete","active","isFocused","invalid","char","i","isActive","size","disabled","el","ref","id","KAESO_TAG_INPUT_VARIANTS","KAESO_TAG_INPUT_DEFAULT_VARIANTS","TagInput","fc","draft","setDraft","tags","next","splitter","separators","s","add","parts","raw","p","messages","validate","tag","firstError","m","fieldError","error","control","label","message","x","required","placeholder","text","name"],"sources":["../../src/components/input/sensitive-input.tsx","../../src/components/input/otp-input.tsx","../../src/components/input/tag-input.tsx"],"sourcesContent":["import { forwardRef, useState, type KeyboardEvent } from \"react\";\nimport { Input, type InputProps } from \"./input.js\";\nimport { InputGroup } from \"./input-group.js\";\nimport { ViewOffSlashIcon as __icon_ViewOffSlashIcon, ViewIcon as __icon_ViewIcon } from \"@hugeicons/core-free-icons\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_SENSITIVE_INPUT_VARIANTS = {\n  kind: {\n    secret: { classes: \"\" },\n    password: { classes: \"\" },\n  },\n} as const;\nexport const KAESO_SENSITIVE_INPUT_DEFAULT_VARIANTS = { kind: \"secret\" } as const;\n\nexport interface SensitiveInputProps extends Omit<InputProps, \"type\" | \"trailing\"> {\n  kind?: keyof typeof KAESO_SENSITIVE_INPUT_VARIANTS.kind | undefined;\n  defaultRevealed?: boolean | undefined;\n}\n\nexport const SensitiveInput = /* @__PURE__ */ forwardRef<HTMLInputElement, SensitiveInputProps>(function SensitiveInput(\n  { kind = \"secret\", defaultRevealed = false, description, onKeyDown, onKeyUp, className, ...props },\n  ref,\n) {\n  const t = useUiText();\n  const [revealed, setRevealed] = useState(defaultRevealed);\n  const [caps, setCaps] = useState(false);\n  const checkCaps = (e: KeyboardEvent<HTMLInputElement>) => setCaps(kind === \"password\" && e.getModifierState?.(\"CapsLock\"));\n  return (\n    <Input\n      ref={ref}\n      type={revealed ? \"text\" : \"password\"}\n      autoComplete={kind === \"password\" ? \"current-password\" : \"off\"}\n      autoCorrect=\"off\"\n      autoCapitalize=\"off\"\n      spellCheck={false}\n      data-1p-ignore={kind === \"secret\" ? true : undefined}\n      data-lpignore={kind === \"secret\" ? \"true\" : undefined}\n      className={cn(className, revealed && \"mono\")}\n      description={caps ? t(\"sensitiveInput.capsLock\", \"Caps Lock is on.\") : description}\n      onKeyDown={(e) => {\n        checkCaps(e);\n        onKeyDown?.(e);\n      }}\n      onKeyUp={(e) => {\n        checkCaps(e);\n        onKeyUp?.(e);\n      }}\n      trailing={\n        <InputGroup.Button\n          icon={revealed ? __icon_ViewOffSlashIcon : __icon_ViewIcon}\n          aria-label={revealed ? t(\"sensitiveInput.hide\", \"Hide\") : t(\"sensitiveInput.show\", \"Show\")}\n          onClick={() => setRevealed((r) => !r)}\n          disabled={props.disabled}\n        />\n      }\n      {...props}\n    />\n  );\n});\nif (process.env.NODE_ENV !== \"production\") SensitiveInput.displayName = \"SensitiveInput\";\n","import { forwardRef, useId, useRef, useState, type InputHTMLAttributes } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useField } from \"../field/field.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_OTP_INPUT_VARIANTS = {\n  size: {\n    md: { classes: \"size-48 text-title\" },\n    sm: { classes: \"size-40 text-title-sm\" },\n  },\n} as const;\nexport const KAESO_OTP_INPUT_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface OTPInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, \"value\" | \"defaultValue\" | \"onChange\" | \"size\" | \"maxLength\"> {\n  length?: number | undefined;\n  value?: string | undefined;\n  defaultValue?: string | undefined;\n  onValueChange?: ((value: string) => void) | undefined;\n  onComplete?: ((value: string) => void) | undefined;\n  invalid?: boolean | undefined;\n  size?: keyof typeof KAESO_OTP_INPUT_VARIANTS.size | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const OTPInput = /* @__PURE__ */ forwardRef<HTMLInputElement, OTPInputProps>(function OTPInput(\n  {\n    length = 6,\n    value,\n    defaultValue = \"\",\n    onValueChange,\n    onComplete,\n    invalid,\n    size = \"md\",\n    disabled,\n    className,\n    id,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n    ...props\n  },\n  ref,\n) {\n  const field = useField();\n  const t = useUiText();\n  const [inner, setInner] = useState(defaultValue);\n  const [focused, setFocused] = useState(false);\n  const [sel, setSel] = useState(0);\n  const auto = useId();\n  const input = useRef<HTMLInputElement | null>(null);\n  const current = (value ?? inner).slice(0, length);\n  const set = (v: string) => {\n    const clean = v.replace(/\\D/g, \"\").slice(0, length);\n    if (value === undefined) setInner(clean);\n    onValueChange?.(clean);\n    if (clean.length === length) onComplete?.(clean);\n  };\n  const active = Math.min(sel, length - 1);\n  const isFocused = focused || force?.includes(\"focus\");\n  return (\n    <div className={cn(\"relative inline-flex gap-8\", className)} data-invalid={invalid || field?.invalid || undefined}>\n      {Array.from({ length }, (_, i) => {\n        const char = current[i] ?? \"\";\n        const isActive = isFocused && i === Math.min(current.length, length - 1) && (sel >= current.length || i === active);\n        return (\n          <div\n            key={i}\n            aria-hidden\n            className={cn(\n              \"flex items-center justify-center rounded-cell-lg font-semibold tabular text-fg material-field transition-control\",\n              KAESO_OTP_INPUT_VARIANTS.size[size].classes,\n              i === 2 && length === 6 && \"mr-8\",\n            )}\n            {...(invalid || field?.invalid ? { \"data-invalid\": \"\" } : {})}\n            {...(disabled ? { \"data-disabled\": \"\" } : {})}\n            {...(isActive ? { \"data-focused\": \"\" } : {})}\n          >\n            {char || (isActive ? <span className=\"h-20 w-1 animate-pulse-quiet bg-fg\" /> : null)}\n          </div>\n        );\n      })}\n      <input\n        ref={(el) => {\n          input.current = el;\n          if (typeof ref === \"function\") ref(el);\n          else if (ref) ref.current = el;\n        }}\n        id={field?.controlId ?? id ?? `k-otp-${auto}`}\n        type=\"text\"\n        inputMode=\"numeric\"\n        autoComplete=\"one-time-code\"\n        pattern=\"\\d*\"\n        maxLength={length}\n        value={current}\n        disabled={disabled}\n        aria-label={ariaLabel ?? (field ? undefined : t(\"otpInput.label\", \"Verification code\"))}\n        {...(field?.controlProps[\"aria-describedby\"] ? { \"aria-describedby\": field.controlProps[\"aria-describedby\"] } : {})}\n        {...(invalid || field?.invalid ? { \"aria-invalid\": true } : {})}\n        onChange={(e) => {\n          set(e.target.value);\n          setSel(e.target.selectionStart ?? e.target.value.length);\n        }}\n        onSelect={(e) => setSel((e.target as HTMLInputElement).selectionStart ?? 0)}\n        onFocus={() => setFocused(true)}\n        onBlur={() => setFocused(false)}\n        className=\"absolute inset-0 h-full w-full cursor-text bg-transparent text-transparent caret-transparent opacity-0 outline-none disabled:cursor-not-allowed\"\n        {...props}\n      />\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") OTPInput.displayName = \"OTPInput\";\n","import { forwardRef, useRef, useState, type ClipboardEvent, type KeyboardEvent } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { useField, useFieldControl, withField, type FieldWrapProps } from \"../field/field.js\";\nimport { Tag } from \"../tag/tag.js\";\nimport { Tooltip } from \"../tooltip/tooltip.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_TAG_INPUT_VARIANTS = {\n  size: {\n    md: { classes: \"min-h-36 p-4\" },\n  },\n} as const;\nexport const KAESO_TAG_INPUT_DEFAULT_VARIANTS = { size: \"md\" } as const;\n\nexport interface TagInputProps extends FieldWrapProps {\n  value?: string[] | undefined;\n  defaultValue?: string[] | undefined;\n  onValueChange?: ((value: string[]) => void) | undefined;\n  placeholder?: string | undefined;\n  validate?: ((tag: string) => true | string) | undefined;\n  separators?: string[] | undefined;\n  disabled?: boolean | undefined;\n  id?: string | undefined;\n  name?: string | undefined;\n  className?: string | undefined;\n  \"aria-label\"?: string | undefined;\n  \"data-force\"?: string | undefined;\n}\n\nexport const TagInput = /* @__PURE__ */ forwardRef<HTMLInputElement, TagInputProps>(function TagInput(props, ref) {\n  const {\n    value,\n    defaultValue = [],\n    onValueChange,\n    placeholder,\n    validate,\n    separators = [\",\", \" \", \";\"],\n    disabled,\n    id,\n    name,\n    className,\n    label,\n    description,\n    error,\n    optional,\n    required,\n    layout,\n    \"aria-label\": ariaLabel,\n    \"data-force\": force,\n  } = props;\n  const field = useField();\n  const fc = useFieldControl(props);\n  const t = useUiText();\n  const [inner, setInner] = useState<string[]>(defaultValue);\n  const [draft, setDraft] = useState(\"\");\n  const input = useRef<HTMLInputElement | null>(null);\n  const tags = value ?? inner;\n  const set = (next: string[]) => {\n    if (value === undefined) setInner(next);\n    onValueChange?.(next);\n  };\n  const splitter = new RegExp(`[${separators.map((s) => s.replace(/[\\]\\\\^-]/g, \"\\\\$&\")).join(\"\")}\\\\n]+`);\n  const add = (raw: string) => {\n    const parts = raw\n      .split(splitter)\n      .map((p) => p.trim())\n      .filter(Boolean)\n      .filter((p) => !tags.includes(p));\n    if (parts.length) set([...tags, ...parts]);\n    setDraft(\"\");\n  };\n  const messages = tags.map((tag) => (validate ? validate(tag) : true));\n  const firstError = messages.find((m) => m !== true);\n  const fieldError = error ?? (typeof firstError === \"string\" ? firstError : undefined);\n  const control = (\n    <div\n      className={cn(\n        \"flex w-full min-w-0 flex-wrap items-center gap-4 rounded-field material-field transition-control cursor-text\",\n        KAESO_TAG_INPUT_VARIANTS.size.md.classes,\n        disabled && \"cursor-not-allowed\",\n        !(label || description || fieldError) && className,\n      )}\n      {...(fieldError || field?.invalid ? { \"data-invalid\": \"\" } : {})}\n      {...(disabled ? { \"data-disabled\": \"\" } : {})}\n      {...(force ? { \"data-force\": force } : {})}\n      onMouseDown={(e) => {\n        if (e.target === e.currentTarget) {\n          e.preventDefault();\n          input.current?.focus();\n        }\n      }}\n    >\n      {tags.map((tag, i) => {\n        const message = messages[i];\n        return (\n          <Tag\n            key={tag}\n            invalid={message !== true}\n            {...(disabled ? {} : { onRemove: () => set(tags.filter((x) => x !== tag)), removeLabel: t(\"tagInput.remove\", \"Remove {tag}\", { tag }) })}\n          >\n            {typeof message === \"string\" ? (\n              <Tooltip content={message}>\n                <span>{tag}</span>\n              </Tooltip>\n            ) : (\n              tag\n            )}\n          </Tag>\n        );\n      })}\n      <input\n        ref={(el) => {\n          input.current = el;\n          if (typeof ref === \"function\") ref(el);\n          else if (ref) ref.current = el;\n        }}\n        {...(id ? { id } : {})}\n        {...fc.controlProps}\n        {...(ariaLabel ? { \"aria-label\": ariaLabel } : {})}\n        {...(fieldError ? { \"aria-invalid\": true } : {})}\n        disabled={disabled}\n        required={required && tags.length === 0}\n        {...(required ? { \"aria-required\": true } : {})}\n        value={draft}\n        placeholder={tags.length ? undefined : placeholder}\n        onChange={(e) => {\n          const v = e.target.value;\n          if (separators.some((s) => v.endsWith(s))) add(v);\n          else setDraft(v);\n        }}\n        onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n          if (e.key === \"Enter\" && draft.trim()) {\n            e.preventDefault();\n            add(draft);\n          } else if (e.key === \"Backspace\" && !draft && tags.length) {\n            set(tags.slice(0, -1));\n          }\n        }}\n        onPaste={(e: ClipboardEvent<HTMLInputElement>) => {\n          const text = e.clipboardData.getData(\"text\");\n          if (splitter.test(text)) {\n            e.preventDefault();\n            add(draft + text);\n          }\n        }}\n        onBlur={() => draft.trim() && add(draft)}\n        className={cn(\n          \"my-4 min-w-80 flex-1 bg-transparent px-8 text-body text-fg outline-none placeholder:text-fg-tertiary disabled:cursor-not-allowed\",\n          tags.length === 0 && \"pl-12\",\n        )}\n      />\n      {name && <input type=\"hidden\" name={name} value={tags.join(\",\")} />}\n    </div>\n  );\n  if (field) return control;\n  return withField({ label, description, error: fieldError, optional, required, layout, id: fc.wrapId ?? id, disabled, className }, control);\n});\nif (process.env.NODE_ENV !== \"production\") TagInput.displayName = \"TagInput\";\n"],"mappings":"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"}

package/dist/components/kaeso/conversation.js

@@ -0,0 +1,204 @@
+"use client";
+import { t as e } from "../../chunks/cn-CidVUKMm.js";
+import { i as t } from "../../chunks/context-BELWW79w.js";
+import { t as n } from "../../chunks/icon-CeNQtobn.js";
+import { t as r } from "../../chunks/banner-BiziJuBZ.js";
+import { t as i } from "../../chunks/json-view-B6KHIWzh.js";
+import { t as a } from "../../chunks/badge-Dkyhs0_j.js";
+import { n as o } from "../../chunks/collapsible-Cw_1aem5.js";
+import { t as s } from "../../chunks/safe-href-G5DBNVwm.js";
+import { Suspense as c, forwardRef as l, lazy as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { Image01Icon as p, Pdf01Icon as m, ToolsIcon as h } from "@hugeicons/core-free-icons";
+//#region src/components/kaeso/conversation.tsx
+var g = /* @__PURE__ */ u(() => import("../../chunks/markdown-C-iJsYnd.js").then((e) => e.o).then((e) => ({ default: e.Markdown }))), _ = { density: {
+	default: { classes: "gap-24" },
+	compact: { classes: "gap-16" }
+} }, v = { density: "default" };
+function y(e) {
+	return {
+		system: e("conversationView.system", "System"),
+		developer: e("conversationView.developer", "Developer"),
+		user: e("conversationView.user", "User"),
+		assistant: e("conversationView.assistant", "Assistant"),
+		tool: e("conversationView.tool", "Tool")
+	};
+}
+var b = (e) => /^data:image\/[a-z0-9.+-]+;/i.test(e) ? e : s(e);
+function x(e) {
+	let t = e.trim();
+	if (!/^[[{]/.test(t)) return !1;
+	try {
+		return JSON.parse(t), !0;
+	} catch {
+		return !1;
+	}
+}
+function S({ text: t, markdown: n, small: r }) {
+	let i = /* @__PURE__ */ d("p", {
+		className: e("max-w-prose whitespace-pre-wrap wrap-break-word text-pretty", r ? "text-small text-fg-secondary" : "text-body text-fg"),
+		children: t
+	});
+	return n ? /* @__PURE__ */ d(c, {
+		fallback: i,
+		children: /* @__PURE__ */ d(g, {
+			text: t,
+			...r ? {
+				size: "small",
+				tone: "secondary"
+			} : {}
+		})
+	}) : i;
+}
+function C({ blocks: e, markdown: s }) {
+	let c = t();
+	return /* @__PURE__ */ d("div", {
+		className: "flex flex-col gap-12",
+		children: e.map((e, t) => {
+			switch (e.type) {
+				case "text": return /* @__PURE__ */ d(S, {
+					text: e.text,
+					markdown: s
+				}, t);
+				case "tool_call": return /* @__PURE__ */ f("div", {
+					className: "flex flex-col gap-8",
+					children: [/* @__PURE__ */ f("span", {
+						className: "inline-flex items-center gap-8 text-small font-medium text-fg-secondary",
+						children: [
+							/* @__PURE__ */ d(n, {
+								icon: h,
+								size: "xs"
+							}),
+							c("conversationView.called", "Called **{name}**", { name: e.name }).split("**").map((e, t) => t % 2 ? /* @__PURE__ */ d("span", {
+								className: "mono text-fg",
+								children: e
+							}, t) : e),
+							e.id && /* @__PURE__ */ d("span", {
+								className: "mono text-fg-tertiary",
+								children: e.id
+							})
+						]
+					}), /* @__PURE__ */ d(i, {
+						value: e.arguments,
+						defaultDepth: 3
+					})]
+				}, t);
+				case "tool_result": return /* @__PURE__ */ f("div", {
+					className: "flex flex-col gap-8 pl-16 hairline-l",
+					children: [/* @__PURE__ */ f("span", {
+						className: "inline-flex items-center gap-8 text-small font-medium text-fg-secondary",
+						children: [
+							c("conversationView.result", "Result"),
+							e.tool_call_id && /* @__PURE__ */ d("span", {
+								className: "mono text-fg-tertiary",
+								children: e.tool_call_id
+							}),
+							e.is_error && /* @__PURE__ */ d(a, {
+								tone: "danger",
+								children: c("conversationView.error", "Error")
+							})
+						]
+					}), typeof e.content == "string" ? s && !x(e.content) ? /* @__PURE__ */ d(S, {
+						text: e.content,
+						markdown: !0
+					}) : /* @__PURE__ */ d("pre", {
+						className: "mono text-small whitespace-pre-wrap wrap-anywhere text-fg",
+						children: e.content
+					}) : /* @__PURE__ */ d(C, {
+						blocks: e.content,
+						markdown: s
+					})]
+				}, t);
+				case "reasoning": return /* @__PURE__ */ d(o, {
+					title: /* @__PURE__ */ d("span", {
+						className: "text-fg-secondary",
+						children: c("conversationView.reasoning", "Reasoning")
+					}),
+					hint: e.redacted ? c("conversationView.redacted", "Redacted by the provider") : void 0,
+					children: e.redacted ? /* @__PURE__ */ d("p", {
+						className: "max-w-prose text-small text-fg-secondary",
+						children: c("conversationView.encrypted", "The provider returned this reasoning in encrypted form.")
+					}) : /* @__PURE__ */ d(S, {
+						text: e.text,
+						markdown: s,
+						small: !0
+					})
+				}, t);
+				case "image": {
+					let r = e.src ? b(e.src) : null;
+					return r ? /* @__PURE__ */ d("a", {
+						href: r,
+						target: "_blank",
+						rel: "noopener noreferrer nofollow",
+						className: "block w-120 overflow-hidden rounded-well ring-over ring-over-line focus-ring",
+						children: /* @__PURE__ */ d("img", {
+							src: r,
+							alt: e.alt ?? c("conversationView.imageInput", "Image input"),
+							className: "block h-120 w-120 object-cover"
+						})
+					}, t) : /* @__PURE__ */ f("span", {
+						className: "inline-flex h-32 w-max items-center gap-8 rounded-pill bg-fill-1 px-12 text-small text-fg-secondary",
+						children: [
+							/* @__PURE__ */ d(n, {
+								icon: p,
+								size: "xs"
+							}),
+							" ",
+							c("conversationView.image", "Image"),
+							" ",
+							e.media_type && /* @__PURE__ */ d("span", {
+								className: "mono",
+								children: e.media_type
+							})
+						]
+					}, t);
+				}
+				case "document": return /* @__PURE__ */ f("span", {
+					className: "inline-flex h-32 w-max items-center gap-8 rounded-pill bg-fill-1 px-12 text-small text-fg-secondary",
+					children: [
+						/* @__PURE__ */ d(n, {
+							icon: m,
+							size: "xs"
+						}),
+						" ",
+						e.name ?? c("conversationView.document", "Document")
+					]
+				}, t);
+				case "refusal": return /* @__PURE__ */ d(r, {
+					tone: "warning",
+					title: c("conversationView.refused", "The model refused."),
+					children: e.text
+				}, t);
+			}
+		})
+	});
+}
+var w = /* @__PURE__ */ l(function({ messages: n, density: r = "default", markdown: i = !1, className: a, footer: o }, s) {
+	let c = y(t());
+	return /* @__PURE__ */ f("div", {
+		ref: s,
+		className: e("flex flex-col", _.density[r].classes, a),
+		children: [n.map((t, n) => /* @__PURE__ */ f("section", {
+			"aria-label": c[t.role],
+			className: "flex flex-col gap-8",
+			children: [/* @__PURE__ */ d("span", {
+				className: e("text-caption font-medium", t.role === "assistant" ? "text-fg" : "text-fg-secondary"),
+				children: c[t.role]
+			}), /* @__PURE__ */ d("div", {
+				className: e(t.role === "system" || t.role === "developer" ? "rounded-well bg-fill-1 px-16 py-12" : ""),
+				children: /* @__PURE__ */ d(C, {
+					blocks: typeof t.content == "string" ? [{
+						type: "text",
+						text: t.content
+					}] : t.content,
+					markdown: i
+				})
+			})]
+		}, n)), o]
+	});
+});
+process.env.NODE_ENV !== "production" && (w.displayName = "ConversationView");
+//#endregion
+export { w as ConversationView, v as KAESO_CONVERSATION_DEFAULT_VARIANTS, _ as KAESO_CONVERSATION_VARIANTS };
+
+//# sourceMappingURL=conversation.js.map

package/dist/components/kaeso/conversation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation.js","names":["__icon_ToolsIcon","__icon_Image01Icon","__icon_Pdf01Icon","cn","useUiText","Icon","Banner","JsonView","Badge","Collapsible","safeHref","LazyMarkdown","n","m","KAESO_CONVERSATION_VARIANTS","KAESO_CONVERSATION_DEFAULT_VARIANTS","roleNames","t","imageHref","src","isJson","s","Prose","plain","small","text","markdown","Suspense","Blocks","blocks","b","i","ToolsIcon","j","part","href","Image01Icon","Pdf01Icon","ConversationView","role","density","className","messages","footer"],"sources":["../../../src/components/kaeso/conversation.tsx"],"sourcesContent":["import { forwardRef, lazy, Suspense, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { ToolsIcon as __icon_ToolsIcon, Image01Icon as __icon_Image01Icon, Pdf01Icon as __icon_Pdf01Icon } from \"@hugeicons/core-free-icons\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Banner } from \"../banner/banner.js\";\nimport { Collapsible } from \"../collapsible/collapsible.js\";\nimport { JsonView } from \"../code-block/json-view.js\";\nimport { Badge } from \"../badge/badge.js\";\nimport { safeHref } from \"../../utils/safe-href.js\";\nimport { useUiText, type UiText } from \"../../i18n/context.js\";\n\nconst LazyMarkdown = /* @__PURE__ */ lazy(() => import(\"../markdown/markdown.js\").then((m) => ({ default: m.Markdown })));\n\nexport const KAESO_CONVERSATION_VARIANTS = {\n  density: {\n    default: { classes: \"gap-24\" },\n    compact: { classes: \"gap-16\" },\n  },\n} as const;\nexport const KAESO_CONVERSATION_DEFAULT_VARIANTS = { density: \"default\" } as const;\n\nexport type ContentBlock =\n  | { type: \"text\"; text: string }\n  | { type: \"tool_call\"; id?: string | undefined; name: string; arguments: unknown }\n  | { type: \"tool_result\"; tool_call_id?: string | undefined; content: string | ContentBlock[]; is_error?: boolean | undefined }\n  | { type: \"reasoning\"; text: string; redacted?: boolean | undefined }\n  | { type: \"image\"; src?: string | undefined; alt?: string | undefined; media_type?: string | undefined }\n  | { type: \"document\"; name?: string | undefined; media_type?: string | undefined }\n  | { type: \"refusal\"; text: string };\n\nexport interface ConversationMessage {\n  role: \"system\" | \"user\" | \"assistant\" | \"tool\" | \"developer\";\n  content: string | ContentBlock[];\n}\n\nfunction roleNames(t: UiText): Record<ConversationMessage[\"role\"], string> {\n  return {\n    system: t(\"conversationView.system\", \"System\"),\n    developer: t(\"conversationView.developer\", \"Developer\"),\n    user: t(\"conversationView.user\", \"User\"),\n    assistant: t(\"conversationView.assistant\", \"Assistant\"),\n    tool: t(\"conversationView.tool\", \"Tool\"),\n  };\n}\n\nconst imageHref = (src: string) => (/^data:image\\/[a-z0-9.+-]+;/i.test(src) ? src : safeHref(src));\n\nfunction isJson(s: string) {\n  const t = s.trim();\n  if (!/^[[{]/.test(t)) return false;\n  try {\n    JSON.parse(t);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nfunction Prose({ text, markdown, small }: { text: string; markdown: boolean; small?: boolean | undefined }) {\n  const plain = (\n    <p className={cn(\"max-w-prose whitespace-pre-wrap wrap-break-word text-pretty\", small ? \"text-small text-fg-secondary\" : \"text-body text-fg\")}>{text}</p>\n  );\n  if (!markdown) return plain;\n  return (\n    <Suspense fallback={plain}>\n      <LazyMarkdown text={text} {...(small ? { size: \"small\" as const, tone: \"secondary\" as const } : {})} />\n    </Suspense>\n  );\n}\n\nfunction Blocks({ blocks, markdown }: { blocks: ContentBlock[]; markdown: boolean }) {\n  const t = useUiText();\n  return (\n    <div className=\"flex flex-col gap-12\">\n      {blocks.map((b, i) => {\n        switch (b.type) {\n          case \"text\":\n            return <Prose key={i} text={b.text} markdown={markdown} />;\n          case \"tool_call\":\n            return (\n              <div key={i} className=\"flex flex-col gap-8\">\n                <span className=\"inline-flex items-center gap-8 text-small font-medium text-fg-secondary\">\n                  <Icon icon={__icon_ToolsIcon} size=\"xs\" />\n                  {t(\"conversationView.called\", \"Called **{name}**\", { name: b.name })\n                    .split(\"**\")\n                    .map((part, j) =>\n                      j % 2 ? (\n                        <span key={j} className=\"mono text-fg\">\n                          {part}\n                        </span>\n                      ) : (\n                        part\n                      ),\n                    )}\n                  {b.id && <span className=\"mono text-fg-tertiary\">{b.id}</span>}\n                </span>\n                <JsonView value={b.arguments} defaultDepth={3} />\n              </div>\n            );\n          case \"tool_result\":\n            return (\n              <div key={i} className=\"flex flex-col gap-8 pl-16 hairline-l\">\n                <span className=\"inline-flex items-center gap-8 text-small font-medium text-fg-secondary\">\n                  {t(\"conversationView.result\", \"Result\")}\n                  {b.tool_call_id && <span className=\"mono text-fg-tertiary\">{b.tool_call_id}</span>}\n                  {b.is_error && <Badge tone=\"danger\">{t(\"conversationView.error\", \"Error\")}</Badge>}\n                </span>\n                {typeof b.content !== \"string\" ? (\n                  <Blocks blocks={b.content} markdown={markdown} />\n                ) : markdown && !isJson(b.content) ? (\n                  <Prose text={b.content} markdown />\n                ) : (\n                  <pre className=\"mono text-small whitespace-pre-wrap wrap-anywhere text-fg\">{b.content}</pre>\n                )}\n              </div>\n            );\n          case \"reasoning\":\n            return (\n              <Collapsible\n                key={i}\n                title={<span className=\"text-fg-secondary\">{t(\"conversationView.reasoning\", \"Reasoning\")}</span>}\n                hint={b.redacted ? t(\"conversationView.redacted\", \"Redacted by the provider\") : undefined}\n              >\n                {b.redacted ? (\n                  <p className=\"max-w-prose text-small text-fg-secondary\">\n                    {t(\"conversationView.encrypted\", \"The provider returned this reasoning in encrypted form.\")}\n                  </p>\n                ) : (\n                  <Prose text={b.text} markdown={markdown} small />\n                )}\n              </Collapsible>\n            );\n          case \"image\": {\n            const href = b.src ? imageHref(b.src) : null;\n            return href ? (\n              <a\n                key={i}\n                href={href}\n                target=\"_blank\"\n                rel=\"noopener noreferrer nofollow\"\n                className=\"block w-120 overflow-hidden rounded-well ring-over ring-over-line focus-ring\"\n              >\n                <img src={href} alt={b.alt ?? t(\"conversationView.imageInput\", \"Image input\")} className=\"block h-120 w-120 object-cover\" />\n              </a>\n            ) : (\n              <span key={i} className=\"inline-flex h-32 w-max items-center gap-8 rounded-pill bg-fill-1 px-12 text-small text-fg-secondary\">\n                <Icon icon={__icon_Image01Icon} size=\"xs\" /> {t(\"conversationView.image\", \"Image\")} {b.media_type && <span className=\"mono\">{b.media_type}</span>}\n              </span>\n            );\n          }\n          case \"document\":\n            return (\n              <span key={i} className=\"inline-flex h-32 w-max items-center gap-8 rounded-pill bg-fill-1 px-12 text-small text-fg-secondary\">\n                <Icon icon={__icon_Pdf01Icon} size=\"xs\" /> {b.name ?? t(\"conversationView.document\", \"Document\")}\n              </span>\n            );\n          case \"refusal\":\n            return (\n              <Banner key={i} tone=\"warning\" title={t(\"conversationView.refused\", \"The model refused.\")}>\n                {b.text}\n              </Banner>\n            );\n        }\n      })}\n    </div>\n  );\n}\n\nexport interface ConversationViewProps {\n  messages: ConversationMessage[];\n  density?: keyof typeof KAESO_CONVERSATION_VARIANTS.density | undefined;\n  markdown?: boolean | undefined;\n  className?: string | undefined;\n  footer?: ReactNode | undefined;\n}\n\nexport const ConversationView = /* @__PURE__ */ forwardRef<HTMLDivElement, ConversationViewProps>(function ConversationView(\n  { messages, density = \"default\", markdown = false, className, footer },\n  ref,\n) {\n  const t = useUiText();\n  const role = roleNames(t);\n  return (\n    <div ref={ref} className={cn(\"flex flex-col\", KAESO_CONVERSATION_VARIANTS.density[density].classes, className)}>\n      {messages.map((m, i) => (\n        <section key={i} aria-label={role[m.role]} className=\"flex flex-col gap-8\">\n          <span className={cn(\"text-caption font-medium\", m.role === \"assistant\" ? \"text-fg\" : \"text-fg-secondary\")}>{role[m.role]}</span>\n          <div className={cn(m.role === \"system\" || m.role === \"developer\" ? \"rounded-well bg-fill-1 px-16 py-12\" : \"\")}>\n            <Blocks blocks={typeof m.content === \"string\" ? [{ type: \"text\", text: m.content }] : m.content} markdown={markdown} />\n          </div>\n        </section>\n      ))}\n      {footer}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") ConversationView.displayName = \"ConversationView\";\n"],"mappings":"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"}

package/dist/components/kaeso/identity.js

@@ -0,0 +1,2 @@
+"use client";
+export { t as KAESO_IDENTITY_DEFAULT_VARIANTS, n as KAESO_IDENTITY_VARIANTS, r as KeyDisplay, i as ModelLabel, a as ProviderBadge, o as ProviderCard, s as RequestTimeline, c as StatusCode, l as providerName } from "../../chunks/identity-DQinp-Ep.js";

package/dist/components/kaeso/moments.js

@@ -0,0 +1,122 @@
+"use client";
+import { t as e } from "../../chunks/cn-CidVUKMm.js";
+import { i as t } from "../../chunks/context-BELWW79w.js";
+import { t as n } from "../../chunks/icon-CeNQtobn.js";
+import { n as r } from "../../chunks/button-BHKAE6ui.js";
+import { t as i } from "../../chunks/use-copy-Dm2ncvMX.js";
+import { t as a } from "../../chunks/copy-button-mAzHjYXq.js";
+import { t as o } from "../../chunks/code-block-BbK6E4Eo.js";
+import { forwardRef as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Alert02Icon as u, Copy01Icon as d, Tick02Icon as f } from "@hugeicons/core-free-icons";
+//#region src/components/kaeso/moments.tsx
+var p = { secret: { md: { classes: "rounded-well bg-fill-1 px-20 py-16" } } }, m = { secret: "md" };
+function h({ baseUrl: e, apiKey: t = "$KAESO_API_KEY", model: n = "gpt-5" }) {
+	let r = t.startsWith("$") ? `os.environ["${t.slice(1)}"]` : `"${t}"`, i = t.startsWith("$") ? `process.env.${t.slice(1)}` : `"${t}"`;
+	return [
+		{
+			label: "Python",
+			lang: "python",
+			code: `from openai import OpenAI\n${t.startsWith("$") ? "import os\n" : ""}\nclient = OpenAI(base_url="${e}/v1", api_key=${r})\n\nresponse = client.responses.create(\n    model="${n}",\n    input="Write one sentence about gateways.",\n)\nprint(response.output_text)`
+		},
+		{
+			label: "Node",
+			lang: "ts",
+			code: `import OpenAI from "openai";\n\nconst client = new OpenAI({ baseURL: "${e}/v1", apiKey: ${i} });\n\nconst response = await client.responses.create({\n  model: "${n}",\n  input: "Write one sentence about gateways.",\n});\nconsole.log(response.output_text);`
+		},
+		{
+			label: "curl",
+			lang: "bash",
+			code: `curl ${e}/v1/responses \\\n  -H "Authorization: Bearer ${t}" \\\n  -H "Content-Type: application/json" \\\n  -d '{"model": "${n}", "input": "Write one sentence about gateways."}'`
+		}
+	];
+}
+var g = /* @__PURE__ */ s(function({ secret: a, name: s, baseUrl: p, model: m, onCopied: g, snippets: _, className: v }, y) {
+	let b = t(), { copied: x, copy: S } = i(2400), C = b("secretReveal.copyKey", "Copy key"), w = b("secretReveal.copied", "Copied");
+	return /* @__PURE__ */ l("div", {
+		ref: y,
+		className: e("flex flex-col gap-24", v),
+		children: [/* @__PURE__ */ l("div", {
+			className: "flex flex-col items-center gap-16 text-center",
+			children: [
+				/* @__PURE__ */ c("div", {
+					tabIndex: 0,
+					role: "textbox",
+					"aria-readonly": !0,
+					"aria-label": typeof s == "string" ? b("secretReveal.secretFor", "Secret for {name}", { name: s }) : b("secretReveal.secret", "Secret"),
+					onClick: (e) => {
+						let t = document.createRange();
+						t.selectNodeContents(e.currentTarget);
+						let n = window.getSelection();
+						n?.removeAllRanges(), n?.addRange(t);
+					},
+					className: "w-full cursor-text rounded-well bg-fill-1 px-20 py-16 mono text-body-lg leading-code break-all text-fg select-all focus-ring",
+					children: a
+				}),
+				/* @__PURE__ */ c(r, {
+					variant: "primary",
+					size: "xl",
+					leadingIcon: x ? f : d,
+					reserveLabels: [C, w],
+					onClick: async () => {
+						await S(a) && g?.();
+					},
+					children: x ? w : C
+				}),
+				/* @__PURE__ */ l("p", {
+					className: "inline-flex items-center gap-6 text-body text-warning-text",
+					children: [/* @__PURE__ */ c(n, {
+						icon: u,
+						size: "sm"
+					}), b("secretReveal.shownOnce", "Shown once. Store it now.")]
+				})
+			]
+		}), _ !== !1 && /* @__PURE__ */ c(o, {
+			tabs: _ ?? h({
+				baseUrl: p,
+				apiKey: a,
+				...m ? { model: m } : {}
+			}),
+			copy: !0
+		})]
+	});
+});
+process.env.NODE_ENV !== "production" && (g.displayName = "SecretReveal");
+var _ = /* @__PURE__ */ s(function({ baseUrl: n, apiKey: r = "$KAESO_API_KEY", model: i, className: s }, u) {
+	let d = t();
+	return /* @__PURE__ */ l("div", {
+		ref: u,
+		className: e("flex flex-col gap-16", s),
+		children: [/* @__PURE__ */ l("div", {
+			className: "grid gap-12 md:grid-cols-2",
+			children: [/* @__PURE__ */ l("div", {
+				className: "flex min-w-0 flex-col gap-6",
+				children: [/* @__PURE__ */ c("span", {
+					className: "text-small font-medium text-fg-secondary",
+					children: d("environmentSnippet.baseUrl", "Base URL")
+				}), /* @__PURE__ */ c(a, {
+					value: `${n}/v1`,
+					label: d("environmentSnippet.copyBaseUrl", "Copy base URL")
+				})]
+			}), /* @__PURE__ */ l("div", {
+				className: "flex min-w-0 flex-col gap-6",
+				children: [/* @__PURE__ */ c("span", {
+					className: "text-small font-medium text-fg-secondary",
+					children: d("environmentSnippet.apiKey", "API key")
+				}), /* @__PURE__ */ c(a, {
+					value: r,
+					label: d("environmentSnippet.copyVariableName", "Copy variable name")
+				})]
+			})]
+		}), /* @__PURE__ */ c(o, { tabs: h({
+			baseUrl: n,
+			apiKey: r,
+			...i ? { model: i } : {}
+		}) })]
+	});
+});
+process.env.NODE_ENV !== "production" && (_.displayName = "EnvironmentSnippet");
+//#endregion
+export { _ as EnvironmentSnippet, m as KAESO_MOMENTS_DEFAULT_VARIANTS, p as KAESO_MOMENTS_VARIANTS, g as SecretReveal, h as sdkSnippets };
+
+//# sourceMappingURL=moments.js.map

package/dist/components/kaeso/moments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"moments.js","names":["__icon_Tick02Icon","__icon_Copy01Icon","__icon_Alert02Icon","cn","useUiText","Icon","Button","useCopy","ClipboardText","CodeBlock","KAESO_MOMENTS_VARIANTS","KAESO_MOMENTS_DEFAULT_VARIANTS","sdkSnippets","envKey","apiKey","nodeKey","baseUrl","model","SecretReveal","t","copyKey","done","className","name","range","selection","secret","copied","Tick02Icon","Copy01Icon","copy","onCopied","Alert02Icon","snippets","EnvironmentSnippet"],"sources":["../../../src/components/kaeso/moments.tsx"],"sourcesContent":["import { forwardRef, type ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { Tick02Icon as __icon_Tick02Icon, Copy01Icon as __icon_Copy01Icon, Alert02Icon as __icon_Alert02Icon } from \"@hugeicons/core-free-icons\";\nimport { useCopy } from \"../../hooks/use-copy.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Button } from \"../button/button.js\";\nimport { CodeBlock, type CodeTab } from \"../code-block/code-block.js\";\nimport { ClipboardText } from \"../copy-button/copy-button.js\";\nimport { useUiText } from \"../../i18n/context.js\";\n\nexport const KAESO_MOMENTS_VARIANTS = {\n  secret: { md: { classes: \"rounded-well bg-fill-1 px-20 py-16\" } },\n} as const;\nexport const KAESO_MOMENTS_DEFAULT_VARIANTS = { secret: \"md\" } as const;\n\nexport interface SnippetOptions {\n  baseUrl: string;\n  apiKey?: string | undefined;\n  model?: string | undefined;\n}\n\nexport function sdkSnippets({ baseUrl, apiKey = \"$KAESO_API_KEY\", model = \"gpt-5\" }: SnippetOptions): CodeTab[] {\n  const envKey = apiKey.startsWith(\"$\") ? `os.environ[\"${apiKey.slice(1)}\"]` : `\"${apiKey}\"`;\n  const nodeKey = apiKey.startsWith(\"$\") ? `process.env.${apiKey.slice(1)}` : `\"${apiKey}\"`;\n  return [\n    {\n      label: \"Python\",\n      lang: \"python\",\n      code: `from openai import OpenAI\\n${apiKey.startsWith(\"$\") ? \"import os\\n\" : \"\"}\\nclient = OpenAI(base_url=\"${baseUrl}/v1\", api_key=${envKey})\\n\\nresponse = client.responses.create(\\n    model=\"${model}\",\\n    input=\"Write one sentence about gateways.\",\\n)\\nprint(response.output_text)`,\n    },\n    {\n      label: \"Node\",\n      lang: \"ts\",\n      code: `import OpenAI from \"openai\";\\n\\nconst client = new OpenAI({ baseURL: \"${baseUrl}/v1\", apiKey: ${nodeKey} });\\n\\nconst response = await client.responses.create({\\n  model: \"${model}\",\\n  input: \"Write one sentence about gateways.\",\\n});\\nconsole.log(response.output_text);`,\n    },\n    {\n      label: \"curl\",\n      lang: \"bash\",\n      code: `curl ${baseUrl}/v1/responses \\\\\\n  -H \"Authorization: Bearer ${apiKey}\" \\\\\\n  -H \"Content-Type: application/json\" \\\\\\n  -d '{\"model\": \"${model}\", \"input\": \"Write one sentence about gateways.\"}'`,\n    },\n  ];\n}\n\nexport interface SecretRevealProps extends SnippetOptions {\n  secret: string;\n  name?: ReactNode | undefined;\n  onCopied?: (() => void) | undefined;\n  snippets?: CodeTab[] | false | undefined;\n  className?: string | undefined;\n}\n\nexport const SecretReveal = /* @__PURE__ */ forwardRef<HTMLDivElement, SecretRevealProps>(function SecretReveal(\n  { secret, name, baseUrl, model, onCopied, snippets, className },\n  ref,\n) {\n  const t = useUiText();\n  const { copied, copy } = useCopy(2400);\n  const copyKey = t(\"secretReveal.copyKey\", \"Copy key\");\n  const done = t(\"secretReveal.copied\", \"Copied\");\n  return (\n    <div ref={ref} className={cn(\"flex flex-col gap-24\", className)}>\n      <div className=\"flex flex-col items-center gap-16 text-center\">\n        <div\n          tabIndex={0}\n          role=\"textbox\"\n          aria-readonly\n          aria-label={typeof name === \"string\" ? t(\"secretReveal.secretFor\", \"Secret for {name}\", { name }) : t(\"secretReveal.secret\", \"Secret\")}\n          onClick={(e) => {\n            const range = document.createRange();\n            range.selectNodeContents(e.currentTarget);\n            const selection = window.getSelection();\n            selection?.removeAllRanges();\n            selection?.addRange(range);\n          }}\n          className=\"w-full cursor-text rounded-well bg-fill-1 px-20 py-16 mono text-body-lg leading-code break-all text-fg select-all focus-ring\"\n        >\n          {secret}\n        </div>\n        <Button\n          variant=\"primary\"\n          size=\"xl\"\n          leadingIcon={copied ? __icon_Tick02Icon : __icon_Copy01Icon}\n          reserveLabels={[copyKey, done]}\n          onClick={async () => {\n            if (await copy(secret)) onCopied?.();\n          }}\n        >\n          {copied ? done : copyKey}\n        </Button>\n        <p className=\"inline-flex items-center gap-6 text-body text-warning-text\">\n          <Icon icon={__icon_Alert02Icon} size=\"sm\" />\n          {t(\"secretReveal.shownOnce\", \"Shown once. Store it now.\")}\n        </p>\n      </div>\n      {snippets !== false && <CodeBlock tabs={snippets ?? sdkSnippets({ baseUrl, apiKey: secret, ...(model ? { model } : {}) })} copy />}\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") SecretReveal.displayName = \"SecretReveal\";\n\nexport const EnvironmentSnippet = /* @__PURE__ */ forwardRef<HTMLDivElement, SnippetOptions & { className?: string | undefined }>(function EnvironmentSnippet(\n  { baseUrl, apiKey = \"$KAESO_API_KEY\", model, className },\n  ref,\n) {\n  const t = useUiText();\n  return (\n    <div ref={ref} className={cn(\"flex flex-col gap-16\", className)}>\n      <div className=\"grid gap-12 md:grid-cols-2\">\n        <div className=\"flex min-w-0 flex-col gap-6\">\n          <span className=\"text-small font-medium text-fg-secondary\">{t(\"environmentSnippet.baseUrl\", \"Base URL\")}</span>\n          <ClipboardText value={`${baseUrl}/v1`} label={t(\"environmentSnippet.copyBaseUrl\", \"Copy base URL\")} />\n        </div>\n        <div className=\"flex min-w-0 flex-col gap-6\">\n          <span className=\"text-small font-medium text-fg-secondary\">{t(\"environmentSnippet.apiKey\", \"API key\")}</span>\n          <ClipboardText value={apiKey} label={t(\"environmentSnippet.copyVariableName\", \"Copy variable name\")} />\n        </div>\n      </div>\n      <CodeBlock tabs={sdkSnippets({ baseUrl, apiKey, ...(model ? { model } : {}) })} />\n    </div>\n  );\n});\nif (process.env.NODE_ENV !== \"production\") EnvironmentSnippet.displayName = \"EnvironmentSnippet\";\n"],"mappings":"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"}

package/dist/components/kaeso/rights.js

@@ -0,0 +1,2 @@
+"use client";
+export { t as KAESO_RIGHTS_MATRIX_DEFAULT_VARIANTS, n as KAESO_RIGHTS_MATRIX_VARIANTS, r as RightsMatrix } from "../../chunks/rights-CXo7zEf6.js";