@kahitsan/ksui 0.13.0 → 0.13.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kahitsan/ksui",
-  "version": "0.13.0",
+  "version": "0.13.2",
   "description": "ksui is a standalone set of SolidJS UI components for KahitSan/Hilinga and any SolidJS app. Published to the public npm registry and consumed as a normal dependency. Ships source under a `solid` export condition so the consumer's vite-plugin-solid compiles it with only solid-js externalized; it depends on nothing but solid-js + lucide-solid and injects its own CSS.",
   "type": "module",
   "main": "./src/index.ts",

package/src/components/base/AccountAvatar.tsx

@@ -25,7 +25,7 @@ import { getAccountIcon } from "../../utils/account-icons";
 import { buildLogoSrc } from "../../utils/account-logo-url";
 
 // Shared 16-color palette and initials algorithm. Keep in lockstep with
-// the kserp's ~/lib/avatar.ts so the host runtime and the plugin fleet
+// the original ~/lib/avatar.ts so the host runtime and the plugin fleet
 // render the same chip for the same user.  Exported so any future widget
 // (or a caller's inline use) can derive a user's color/initials without
 // rendering the chip itself.

package/src/components/base/AddAttachmentTile.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/components/AddAttachmentTile.tsx (vendored into the plugin remote).
+// Vendored into plugin remotes.
 // Dashed "Add" tile with a small Camera / Image-or-file popover menu.
 
 import { createSignal, onCleanup, onMount, Show } from "solid-js";

package/src/components/base/CameraCapture.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/components/CameraCapture.tsx (vendored into the plugin remote).
+// Vendored into plugin remotes.
 // getUserMedia camera capture modal. Button is ksui's own base primitive.
 
 import { createSignal, onCleanup, onMount, Show } from "solid-js";

package/src/components/base/DataTable.tsx

@@ -1,4 +1,4 @@
-// Source: kserp src/components/ui/DataTable/DataTable.tsx (the host's Tailwind-
+// Source: the host's Tailwind-
 // classed table). Ported into ksui as a DOMAIN-FREE base primitive: a
 // server-side (fetchFn) OR client-side (data) table with debounced search,
 // column sort, pagination / "Show more" load mode, a filters JSX slot, an
@@ -16,7 +16,7 @@
 // library carries no host primitive and no native `<input type="date">`.
 //
 // The public type surface (DataTableRow / DataTableColumn / FetchResult /
-// FetchParams / DataTableProps) mirrors the kernel's `@kserp/host-ui` ambient
+// FetchParams / DataTableProps) mirrors the ambient host-ui type
 // contract EXACTLY, so a caller written against host-ui works unchanged here.
 //
 // Composition note: the date filter renders ksui's own `DatePicker` (a sibling
@@ -58,7 +58,7 @@ const STYLE_ID = "ksui-datatable-style";
 // ---------------------------------------------------------------------------
 //
 // Every color in the injected stylesheet is driven by a `--ksui-dt-*` CSS
-// custom property; the fallback after each `var(...)` is the host kserp
+// custom property; the fallback after each `var(...)` is the host
 // DataTable's exact value (resolved from its Tailwind classes — zinc/amber
 // dark theme). To retint, wrap the table in a container that sets the vars,
 // e.g. `<div style={{ "--ksui-dt-card-bg": "#000", "--ksui-dt-accent": "#0af" }}>`.
@@ -148,7 +148,7 @@ function ensureDataTableStyle(): void {
 }
 
 // ---------------------------------------------------------------------------
-// Types (mirror the kernel's @kserp/host-ui contract exactly)
+// Types (mirror the host UI kit's type contract exactly)
 // ---------------------------------------------------------------------------
 
 export interface DataTableRow {

package/src/components/base/DatePicker.tsx

@@ -1,4 +1,4 @@
-// Source: kserp src/components/ui/DatePicker/DatePicker.tsx (the host's Tailwind-
+// Source: the host's Tailwind-
 // classed picker). Ported into ksui as a DOMAIN-FREE base primitive: a trigger
 // button labeled with the selected date (or "Pick date"), a calendar popover
 // (month grid, prev/next nav, day selection), single-date AND range mode, an
@@ -50,7 +50,7 @@ import {
 // Shares the DataTable's `--ksui-dt-*` palette (accent / control-bg / border /
 // fg / text / muted / faint), so wrapping a date filter and a table in the same
 // retint container restyles both. Picker-only tones use `--ksui-dp-*`. Fallback
-// after each `var(...)` = the host kserp DatePicker's exact Tailwind value.
+// after each `var(...)` = the host DatePicker's exact Tailwind value.
 //
 //   --ksui-dt-control-bg   popover + trigger + input bg (zinc-900, #18181b)
 //   --ksui-dt-border       borders / dividers (zinc-800/50, rgba(39,39,42,0.5))

package/src/components/base/Modal.tsx

@@ -1,5 +1,5 @@
 // Self-contained modal dialog. Promoted into ksui from the former host kit so
-// the library no longer depends on "@kserp/host-ui": ImageCropper (the only
+// the library no longer depends on the host UI kit: ImageCropper (the only
 // in-library consumer) now imports Modal from here.
 //
 // Like Button/ProgressBar, ksui publishes no sidecar .css — the styles are
@@ -46,9 +46,9 @@ function ensureModalStyle(): void {
 .ksui-modal-sheet-overlay{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center;}
 @media (min-width:640px){.ksui-modal-sheet-overlay{align-items:center;padding:1rem;}}
 .ksui-modal-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(6px);}
-.ksui-modal-card{position:relative;z-index:10;width:100%;background:var(--ksui-modal-bg,#11161f);color:var(--ksui-modal-fg,inherit);border:1px solid var(--ksui-modal-border,rgba(245,158,11,0.3));border-radius:0.75rem;padding:1.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,0.6);max-height:90vh;overflow-x:hidden;overflow-y:auto;}
+.ksui-modal-card{position:relative;z-index:10;width:100%;background:var(--ksui-modal-bg,#18181b);color:var(--ksui-modal-fg,inherit);border:1px solid var(--ksui-modal-border,rgba(245,158,11,0.3));border-radius:0.75rem;padding:1.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,0.6);max-height:90vh;overflow-x:hidden;overflow-y:auto;}
 .ksui-modal-card.danger{border-color:var(--ksui-modal-border-danger,rgba(239,68,68,0.3));}
-.ksui-modal-sheet-card{position:relative;z-index:10;width:100%;background:var(--ksui-modal-bg,#11161f);color:var(--ksui-modal-fg,inherit);border:1px solid var(--ksui-modal-border,rgba(245,158,11,0.3));box-shadow:0 25px 50px -12px rgba(0,0,0,0.6);max-height:92vh;overflow:hidden;overscroll-behavior:contain;}
+.ksui-modal-sheet-card{position:relative;z-index:10;width:100%;background:var(--ksui-modal-bg,#18181b);color:var(--ksui-modal-fg,inherit);border:1px solid var(--ksui-modal-border,rgba(245,158,11,0.3));box-shadow:0 25px 50px -12px rgba(0,0,0,0.6);max-height:92vh;overflow:hidden;overscroll-behavior:contain;}
 .ksui-modal-sheet-card.danger{border-color:var(--ksui-modal-border-danger,rgba(239,68,68,0.3));}
 @media (min-width:640px){.ksui-modal-sheet-card{width:auto;border-radius:0.75rem;max-height:88vh;}}
 `;

package/src/components/base/ProgressBar.tsx

@@ -1,7 +1,7 @@
 // Source: archive/pillar app/pillar-ui/base/ProgressBar/ProgressBar.tsx
-// Ported into kserp so the counter cards can reuse the same realtime
+// Ported into the library so the counter cards can reuse the same realtime
 // progress visualization the session manager uses on the home page.
-// Adapted to kserp's TS + lucide-solid conventions.
+// Adapted to the library's TS + lucide-solid conventions.
 
 import type { Component, JSX } from "solid-js";
 import { createMemo, splitProps, Show } from "solid-js";

package/src/components/composite/MarkdownNotes.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/components/MarkdownNotes.tsx (vendored into the plugin remote).
+// Vendored into plugin remotes.
 //
 // Renders transaction `notes` with a restricted markdown subset and inline
 // client-mention chips (@[Name](client:N)). Adapted for the remote: routing is

package/src/components/composite/MentionTextarea.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/components/MentionTextarea.tsx (vendored into the plugin remote).
+// Vendored into plugin remotes.
 //
 // contenteditable rich-text input with an @-trigger client autocomplete that
 // renders selected mentions as chips. Canonical value is the @[Name](client:ID)

package/src/components/composite/NotFound.tsx

@@ -5,7 +5,7 @@
 // is hard-coded.
 //
 // Unlike the host-owned Button, this is a standalone primitive: it imports only
-// solid-js and lucide-solid, never `@kserp/host-ui` or a router. The default
+// solid-js and lucide-solid, never the host UI kit or a router. The default
 // action renders a plain, self-styled button. Navigation is left to the caller
 // via `onButtonClick` (or `href`, which renders an anchor instead). Callers who
 // want the host Button can pass it through the `action` slot, which fully

package/src/components/composite/VoucherPicker.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/components/VoucherPicker.tsx (vendored into the plugin remote).
+// Vendored into plugin remotes.
 //
 // Cross-plugin picker: fetches the SIBLING vouchers plugin's public API at
 // /api/vouchers and degrades gracefully: when the vouchers plugin isn't

package/src/index.ts

@@ -87,7 +87,7 @@ export { default as DatePicker, type DatePickerProps, type DateRangeValue } from
 // Server-side / client-side data table with debounced search, column sort,
 // pagination + "Show more" load mode, a filters slot, optional date filter, and
 // an onRefetch handle. Ported from the host kit; injects its own CSS, no Tailwind.
-// The type surface mirrors the kernel's @kserp/host-ui contract exactly, so a
+// The type surface mirrors the host UI kit's type contract exactly, so a
 // caller written against host-ui works unchanged here.
 export {
   default as DataTable,
@@ -175,7 +175,7 @@ export {
 export type { ParsedDate } from "./utils/parse-date";
 
 // Self-contained helpers promoted from the former host kit so the library has no
-// "@kserp/host-ui" dependency.
+// the host UI kit dependency.
 export { highlightMatch, HighlightedText, matchesQuery, matchesAny } from "./utils/highlight";
 export { confirm, type ConfirmOptions } from "./utils/confirm";
 export { useFocusTrap, autoFocusOnMount, lockPullToRefresh, unlockPullToRefresh } from "./utils/dom";

package/src/utils/account-icons.ts

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/lib/account-icons.ts (vendored into the plugin remote).
+// Vendored into plugin remotes.
 // Maps an account-icon slug → lucide glyph, with a type-based fallback for
 // accounts that have no custom icon yet. Used by AccountAvatar.
 

package/src/utils/account-logo-url.ts

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/lib/account-logo-url.ts (vendored into the plugin remote).
+// Vendored into plugin remotes.
 //
 // Build the <img src> for a financial account logo. Logos are object-storage
 // only now: s3_link is the public URL and the sole reference (the legacy

package/src/utils/accounts-index.tsx

@@ -1,4 +1,4 @@
-// Source: KahitSan/kserp src/lib/accounts-index.tsx (promoted into the SDK).
+// Promoted into the SDK.
 //
 // Session-scoped index of financial accounts keyed by id. The list rows, the
 // detail payments list, etc. surface accounts by name only (server denormalises

package/src/utils/confirm.tsx

@@ -1,6 +1,6 @@
 // Promise-based confirm dialog. Ported into ksui from the former host kit so the
 // library is self-contained: ExistingAttachmentTile used to import `confirm`
-// from "@kserp/host-ui"; it now imports it from here.
+// from the host UI kit; it now imports it from here.
 //
 // Renders a ksui Modal + Buttons imperatively (outside any component tree) into
 // a transient container appended to <body>, resolves the returned promise when

package/src/utils/highlight.tsx

@@ -1,6 +1,6 @@
 // Search-match highlighting + tiny string-match helpers. Ported into ksui from
 // the former host kit so the library is self-contained: ComboBox and
-// MarkdownNotes used to import `highlightMatch` from "@kserp/host-ui"; they now
+// MarkdownNotes used to import `highlightMatch` from the host UI kit; they now
 // import it from here. Pure functions plus a `<mark>` wrapper.
 //
 // The default highlight tint ships as injected CSS (a `.ksui-mark` class) so the

package/src/utils/integration.ts

@@ -4,7 +4,7 @@
 // runtime context — a permission check (MarkdownNotes gates its client-mention
 // hover card on "clients.view") and the active workspace id (useAccountsIndex
 // re-keys its fetch per workspace). The library used to pull these from
-// "@kserp/host-ui"; it now owns a tiny opt-in registry instead, so it stays a
+// the host UI kit; it now owns a tiny opt-in registry instead, so it stays a
 // standalone dependency-free package.
 //
 // Default behavior with nothing configured (any plain SolidJS consumer):

package/src/utils/parse-date.ts

@@ -1,6 +1,6 @@
 // Natural-language date parser + date string formatters.
 //
-// Ported verbatim from the host kserp DatePicker's `parse-date.ts` so ksui's
+// Ported verbatim from the host DatePicker's `parse-date.ts` so ksui's
 // DatePicker carries no host dependency. Pure functions, no UI, no framework —
 // depends on nothing. Lives in utils/ (not components/) because it renders
 // nothing; the DatePicker component calls it.

package/tailwind.js

@@ -2,21 +2,22 @@
  * @kahitsan/ksui Tailwind CSS plugin
  *
  * Registers all ksui component utility classes so consumers don't need
- * @source directives or manual safelisting. Add to your Tailwind config:
- *
- *   // tailwind.config.js (v3)
- *   plugins: [require("@kahitsan/ksui/tailwind")]
+ * manual safelisting. Load from CSS:
  *
  *   // app.css (v4)
  *   @plugin "@kahitsan/ksui/tailwind";
  *
- * The plugin safelists every Tailwind utility class that ksui components
- * reference in their source, ensuring they survive Tailwind's purge/scan
- * even though the class strings live in node_modules.
+ * This plugin registers .ks-* component classes via addComponents/addUtilities.
+ * Raw Tailwind utilities used by ksui components (bg-amber-600/20, etc.)
+ * require a separate @source directive pointing at the ksui src directory.
+ *
+ * IMPORTANT: This file uses ESM (export default) because the ksui package.json
+ * sets "type": "module". CommonJS (module.exports) will fail to load under
+ * Tailwind v4's @plugin directive, which uses dynamic import().
  */
 
 /** @type {import('tailwindcss').Plugin} */
-module.exports = function ksuiTailwindPlugin({ addUtilities, addComponents }) {
+export default function ksuiTailwindPlugin({ addUtilities, addComponents }) {
   // ─── Button intents ────────────────────────────────────────────────
   // Primary (amber)
   addUtilities({
@@ -272,6 +273,6 @@ module.exports = function ksuiTailwindPlugin({ addUtilities, addComponents }) {
   });
 };
 
-module.exports.meta = {
+export const meta = {
   name: "@kahitsan/ksui",
 };