@fangxinyan/lumina 0.2.1 → 0.4.0

package/dist/CommandPalette.d.cts

@@ -0,0 +1,65 @@
+import * as React from 'react';
+
+interface CommandItem {
+    key: string;
+    /** Displayed label; also matched against the search query by default. */
+    label: string;
+    /** Optional secondary line — e.g. "Open recent". */
+    description?: React.ReactNode;
+    /** Leading icon. */
+    icon?: React.ReactNode;
+    /** Right-aligned shortcut hint, e.g. `"⌘P"`. */
+    shortcut?: React.ReactNode;
+    /** Extra search terms beyond `label`. */
+    keywords?: string[];
+    /** Group heading. Items sharing a `group` appear under one heading. */
+    group?: string;
+    /** Ignored by default filter — still shown. */
+    disabled?: boolean;
+    onSelect?: () => void;
+}
+interface CommandPaletteProps {
+    open: boolean;
+    onOpenChange?: (open: boolean) => void;
+    items: CommandItem[];
+    placeholder?: string;
+    /** Custom matcher. Return true to keep the item. */
+    filter?: (item: CommandItem, query: string) => boolean;
+    /** Shown when no item matches the query. */
+    emptyText?: React.ReactNode;
+    /** Reset the query to empty whenever the palette opens. Default true. */
+    resetOnOpen?: boolean;
+    /** Footer node. Pass `null` to hide. */
+    footer?: React.ReactNode;
+    className?: string;
+}
+/**
+ * `CommandPalette` — ⌘K-style action launcher. Search + grouped items +
+ * keyboard nav. Rendered into `document.body`.
+ *
+ * The parent controls `open` via state — wire `Cmd/Ctrl+K` to toggle.
+ *
+ * @example
+ * ```tsx
+ * const [open, setOpen] = React.useState(false);
+ * React.useEffect(() => {
+ *   const h = (e: KeyboardEvent) => {
+ *     if ((e.metaKey || e.ctrlKey) && e.key === "k") { e.preventDefault(); setOpen(o => !o); }
+ *   };
+ *   window.addEventListener("keydown", h);
+ *   return () => window.removeEventListener("keydown", h);
+ * }, []);
+ *
+ * <CommandPalette
+ *   open={open}
+ *   onOpenChange={setOpen}
+ *   items={[
+ *     { key: "new", label: "新建文件", icon: <Icon name="plus" size={14} />, group: "文件", shortcut: "⌘N", onSelect: () => {} },
+ *     ...
+ *   ]}
+ * />
+ * ```
+ */
+declare const CommandPalette: React.FC<CommandPaletteProps>;
+
+export { type CommandItem, CommandPalette, type CommandPaletteProps };

package/dist/CommandPalette.d.ts

@@ -0,0 +1,65 @@
+import * as React from 'react';
+
+interface CommandItem {
+    key: string;
+    /** Displayed label; also matched against the search query by default. */
+    label: string;
+    /** Optional secondary line — e.g. "Open recent". */
+    description?: React.ReactNode;
+    /** Leading icon. */
+    icon?: React.ReactNode;
+    /** Right-aligned shortcut hint, e.g. `"⌘P"`. */
+    shortcut?: React.ReactNode;
+    /** Extra search terms beyond `label`. */
+    keywords?: string[];
+    /** Group heading. Items sharing a `group` appear under one heading. */
+    group?: string;
+    /** Ignored by default filter — still shown. */
+    disabled?: boolean;
+    onSelect?: () => void;
+}
+interface CommandPaletteProps {
+    open: boolean;
+    onOpenChange?: (open: boolean) => void;
+    items: CommandItem[];
+    placeholder?: string;
+    /** Custom matcher. Return true to keep the item. */
+    filter?: (item: CommandItem, query: string) => boolean;
+    /** Shown when no item matches the query. */
+    emptyText?: React.ReactNode;
+    /** Reset the query to empty whenever the palette opens. Default true. */
+    resetOnOpen?: boolean;
+    /** Footer node. Pass `null` to hide. */
+    footer?: React.ReactNode;
+    className?: string;
+}
+/**
+ * `CommandPalette` — ⌘K-style action launcher. Search + grouped items +
+ * keyboard nav. Rendered into `document.body`.
+ *
+ * The parent controls `open` via state — wire `Cmd/Ctrl+K` to toggle.
+ *
+ * @example
+ * ```tsx
+ * const [open, setOpen] = React.useState(false);
+ * React.useEffect(() => {
+ *   const h = (e: KeyboardEvent) => {
+ *     if ((e.metaKey || e.ctrlKey) && e.key === "k") { e.preventDefault(); setOpen(o => !o); }
+ *   };
+ *   window.addEventListener("keydown", h);
+ *   return () => window.removeEventListener("keydown", h);
+ * }, []);
+ *
+ * <CommandPalette
+ *   open={open}
+ *   onOpenChange={setOpen}
+ *   items={[
+ *     { key: "new", label: "新建文件", icon: <Icon name="plus" size={14} />, group: "文件", shortcut: "⌘N", onSelect: () => {} },
+ *     ...
+ *   ]}
+ * />
+ * ```
+ */
+declare const CommandPalette: React.FC<CommandPaletteProps>;
+
+export { type CommandItem, CommandPalette, type CommandPaletteProps };

package/dist/CommandPalette.js

@@ -0,0 +1,5 @@
+export { CommandPalette } from './chunk-6Z24VO3K.js';
+import './chunk-WUOFJPZ4.js';
+import './chunk-QOGROEVD.js';
+//# sourceMappingURL=CommandPalette.js.map
+//# sourceMappingURL=CommandPalette.js.map

package/dist/CommandPalette.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"CommandPalette.js"}

package/dist/ContextMenu-FKW6CQW4.css

@@ -0,0 +1,76 @@
+/* ============ ContextMenu ============ */
+.context-menu {
+  z-index: 5000;
+  padding: 6px;
+  background: var(--bg);
+  border-radius: var(--r-md);
+  box-shadow: var(--neu-float);
+  border: 1px solid var(--divider);
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  animation: menuIn 140ms var(--ease);
+  max-height: calc(100vh - 24px);
+  overflow-y: auto;
+}
+
+.context-menu-item {
+  display: grid;
+  grid-template-columns: 18px 1fr auto;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 10px;
+  min-height: 28px;
+  border: none;
+  background: transparent;
+  box-shadow: none;
+  font: inherit;
+  font-size: 13px;
+  color: var(--fg);
+  text-align: left;
+  border-radius: var(--r-sm);
+  cursor: pointer;
+  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
+    box-shadow var(--dur-fast) var(--ease);
+}
+.context-menu-item:disabled { color: var(--fg-subtle); cursor: not-allowed; }
+.context-menu-item.active:not(:disabled) {
+  background: var(--bg);
+  color: var(--accent-ink);
+  box-shadow: var(--neu-in-sm);
+}
+.context-menu-item.danger { color: var(--danger); }
+.context-menu-item.danger.active:not(:disabled) {
+  background: var(--bg);
+  color: var(--danger);
+  box-shadow: var(--neu-in-sm);
+}
+
+.context-menu-icon {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--fg-muted);
+}
+.context-menu-item.active:not(:disabled) .context-menu-icon { color: inherit; }
+.context-menu-item.danger .context-menu-icon { color: var(--danger); }
+
+.context-menu-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.context-menu-shortcut {
+  font-family: var(--font-mono);
+  font-size: 11px;
+  color: var(--fg-subtle);
+  padding-left: 12px;
+}
+.context-menu-item.active:not(:disabled) .context-menu-shortcut { color: inherit; opacity: 0.8; }
+
+.context-menu-divider {
+  height: 1px;
+  background: var(--divider);
+  margin: 4px 4px;
+}

package/dist/ContextMenu.cjs

@@ -0,0 +1,12 @@
+'use strict';
+
+var chunkWZ73TWB2_cjs = require('./chunk-WZ73TWB2.cjs');
+
+
+
+Object.defineProperty(exports, "ContextMenu", {
+  enumerable: true,
+  get: function () { return chunkWZ73TWB2_cjs.ContextMenu; }
+});
+//# sourceMappingURL=ContextMenu.cjs.map
+//# sourceMappingURL=ContextMenu.cjs.map

package/dist/ContextMenu.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"ContextMenu.cjs"}

package/dist/ContextMenu.d.cts

@@ -0,0 +1,50 @@
+import * as React from 'react';
+
+interface ContextMenuItem {
+    key: string;
+    /** Omit for `type: "divider"`. */
+    label?: React.ReactNode;
+    icon?: React.ReactNode;
+    /** Right-aligned shortcut hint, e.g. `"⌘C"`. */
+    shortcut?: React.ReactNode;
+    disabled?: boolean;
+    /** Style the item as destructive (red). */
+    danger?: boolean;
+    /** Render a horizontal separator; other fields are ignored. */
+    type?: "divider";
+    onSelect?: () => void;
+}
+interface ContextMenuProps {
+    items: ContextMenuItem[];
+    /**
+     * Any content — right-click anywhere inside the trigger area opens the menu.
+     * Internally wrapped in a `display: contents` span so layout is unaffected
+     * regardless of whether `children` is a DOM element or a React component.
+     */
+    children: React.ReactNode;
+    /** Skip the menu entirely — browser default context menu will be used instead. */
+    disabled?: boolean;
+    /** Minimum panel width in px. Default 180. */
+    minWidth?: number;
+}
+/**
+ * `ContextMenu` — right-click menu. Wraps one child element; suppresses the
+ * browser's native menu and opens a neumorphic replacement at the cursor.
+ *
+ * @example
+ * ```tsx
+ * <ContextMenu
+ *   items={[
+ *     { key: "copy", label: "复制", shortcut: "⌘C", onSelect: copy },
+ *     { key: "cut",  label: "剪切", shortcut: "⌘X", onSelect: cut  },
+ *     { key: "d1",   type: "divider" },
+ *     { key: "del",  label: "删除", danger: true, onSelect: del },
+ *   ]}
+ * >
+ *   <div>右键点击我</div>
+ * </ContextMenu>
+ * ```
+ */
+declare const ContextMenu: React.FC<ContextMenuProps>;
+
+export { ContextMenu, type ContextMenuItem, type ContextMenuProps };

package/dist/ContextMenu.d.ts

@@ -0,0 +1,50 @@
+import * as React from 'react';
+
+interface ContextMenuItem {
+    key: string;
+    /** Omit for `type: "divider"`. */
+    label?: React.ReactNode;
+    icon?: React.ReactNode;
+    /** Right-aligned shortcut hint, e.g. `"⌘C"`. */
+    shortcut?: React.ReactNode;
+    disabled?: boolean;
+    /** Style the item as destructive (red). */
+    danger?: boolean;
+    /** Render a horizontal separator; other fields are ignored. */
+    type?: "divider";
+    onSelect?: () => void;
+}
+interface ContextMenuProps {
+    items: ContextMenuItem[];
+    /**
+     * Any content — right-click anywhere inside the trigger area opens the menu.
+     * Internally wrapped in a `display: contents` span so layout is unaffected
+     * regardless of whether `children` is a DOM element or a React component.
+     */
+    children: React.ReactNode;
+    /** Skip the menu entirely — browser default context menu will be used instead. */
+    disabled?: boolean;
+    /** Minimum panel width in px. Default 180. */
+    minWidth?: number;
+}
+/**
+ * `ContextMenu` — right-click menu. Wraps one child element; suppresses the
+ * browser's native menu and opens a neumorphic replacement at the cursor.
+ *
+ * @example
+ * ```tsx
+ * <ContextMenu
+ *   items={[
+ *     { key: "copy", label: "复制", shortcut: "⌘C", onSelect: copy },
+ *     { key: "cut",  label: "剪切", shortcut: "⌘X", onSelect: cut  },
+ *     { key: "d1",   type: "divider" },
+ *     { key: "del",  label: "删除", danger: true, onSelect: del },
+ *   ]}
+ * >
+ *   <div>右键点击我</div>
+ * </ContextMenu>
+ * ```
+ */
+declare const ContextMenu: React.FC<ContextMenuProps>;
+
+export { ContextMenu, type ContextMenuItem, type ContextMenuProps };

package/dist/ContextMenu.js

@@ -0,0 +1,3 @@
+export { ContextMenu } from './chunk-RFU5HN4E.js';
+//# sourceMappingURL=ContextMenu.js.map
+//# sourceMappingURL=ContextMenu.js.map

package/dist/ContextMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"ContextMenu.js"}

package/dist/Divider.cjs

@@ -1,12 +1,12 @@
 'use strict';
 
-var chunkAXMEZGEG_cjs = require('./chunk-AXMEZGEG.cjs');
+var chunkIZDJCEMF_cjs = require('./chunk-IZDJCEMF.cjs');
 
 
 
 Object.defineProperty(exports, "Divider", {
   enumerable: true,
-  get: function () { return chunkAXMEZGEG_cjs.Divider; }
+  get: function () { return chunkIZDJCEMF_cjs.Divider; }
 });
 //# sourceMappingURL=Divider.cjs.map
 //# sourceMappingURL=Divider.cjs.map

package/dist/Divider.js

@@ -1,3 +1,3 @@
-export { Divider } from './chunk-OYGFMXAA.js';
+export { Divider } from './chunk-5N7347MI.js';
 //# sourceMappingURL=Divider.js.map
 //# sourceMappingURL=Divider.js.map

package/dist/Drawer.cjs

@@ -1,13 +1,13 @@
 'use strict';
 
-var chunkAEJJGUEN_cjs = require('./chunk-AEJJGUEN.cjs');
-require('./chunk-YVO7XO4W.cjs');
+var chunkN73JGXYZ_cjs = require('./chunk-N73JGXYZ.cjs');
+require('./chunk-YCHUHMNP.cjs');
 
 
 
 Object.defineProperty(exports, "Drawer", {
   enumerable: true,
-  get: function () { return chunkAEJJGUEN_cjs.Drawer; }
+  get: function () { return chunkN73JGXYZ_cjs.Drawer; }
 });
 //# sourceMappingURL=Drawer.cjs.map
 //# sourceMappingURL=Drawer.cjs.map

package/dist/Drawer.js

@@ -1,4 +1,4 @@
-export { Drawer } from './chunk-IWVKITPN.js';
-import './chunk-GEYMWUW6.js';
+export { Drawer } from './chunk-FXQGPHK2.js';
+import './chunk-QOGROEVD.js';
 //# sourceMappingURL=Drawer.js.map
 //# sourceMappingURL=Drawer.js.map

package/dist/Empty.cjs

@@ -1,20 +1,20 @@
 'use strict';
 
-var chunkF7HW2PYR_cjs = require('./chunk-F7HW2PYR.cjs');
+var chunkXUT2Z2L6_cjs = require('./chunk-XUT2Z2L6.cjs');
 
 
 
 Object.defineProperty(exports, "Empty", {
   enumerable: true,
-  get: function () { return chunkF7HW2PYR_cjs.Empty; }
+  get: function () { return chunkXUT2Z2L6_cjs.Empty; }
 });
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
-  get: function () { return chunkF7HW2PYR_cjs.Skeleton; }
+  get: function () { return chunkXUT2Z2L6_cjs.Skeleton; }
 });
 Object.defineProperty(exports, "Spinner", {
   enumerable: true,
-  get: function () { return chunkF7HW2PYR_cjs.Spinner; }
+  get: function () { return chunkXUT2Z2L6_cjs.Spinner; }
 });
 //# sourceMappingURL=Empty.cjs.map
 //# sourceMappingURL=Empty.cjs.map

package/dist/Empty.js

@@ -1,3 +1,3 @@
-export { Empty, Skeleton, Spinner } from './chunk-Z7P6QGMT.js';
+export { Empty, Skeleton, Spinner } from './chunk-GR5STMOA.js';
 //# sourceMappingURL=Empty.js.map
 //# sourceMappingURL=Empty.js.map

package/dist/Form-5GRVZNDO.css

@@ -0,0 +1,67 @@
+/* ============ Form ============ */
+.lumina-form { display: flex; flex-direction: column; gap: 18px; }
+.lumina-form.layout-inline {
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: 12px;
+}
+.lumina-form.layout-inline .form-item { flex: 0 0 auto; }
+
+.form-item {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  min-width: 0;
+}
+.lumina-form.layout-horizontal .form-item {
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 12px;
+}
+.lumina-form.layout-horizontal .form-item-label {
+  flex: 0 0 auto;
+  min-width: 96px;
+  padding-top: 10px;
+  text-align: right;
+}
+.lumina-form.layout-horizontal .form-item-control { flex: 1; min-width: 0; }
+
+.form-item-label {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--fg);
+  padding-left: 2px;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+.form-item-required {
+  color: var(--danger);
+  font-weight: 600;
+  margin-right: 2px;
+}
+.form-item-control { min-width: 0; }
+
+.form-item-error {
+  font-size: 12px;
+  color: var(--danger);
+  padding-left: 2px;
+  animation: fadeIn 140ms var(--ease);
+}
+.form-item-help {
+  font-size: 12px;
+  color: var(--fg-subtle);
+  padding-left: 2px;
+}
+.form-item-extra {
+  font-size: 11.5px;
+  color: var(--fg-subtle);
+  padding-left: 2px;
+  opacity: 0.85;
+}
+
+.form-item.has-error .input-wrap,
+.form-item.has-error .select-trigger {
+  box-shadow: var(--neu-in-sm), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
+}

package/dist/Form.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+var chunkQVFEKGKI_cjs = require('./chunk-QVFEKGKI.cjs');
+
+
+
+Object.defineProperty(exports, "Form", {
+  enumerable: true,
+  get: function () { return chunkQVFEKGKI_cjs.Form; }
+});
+Object.defineProperty(exports, "FormItem", {
+  enumerable: true,
+  get: function () { return chunkQVFEKGKI_cjs.FormItem; }
+});
+Object.defineProperty(exports, "useForm", {
+  enumerable: true,
+  get: function () { return chunkQVFEKGKI_cjs.useForm; }
+});
+//# sourceMappingURL=Form.cjs.map
+//# sourceMappingURL=Form.cjs.map

package/dist/Form.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"Form.cjs"}

package/dist/Form.d.cts

@@ -0,0 +1,85 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+type FormLayout = "horizontal" | "vertical" | "inline";
+type Rule = {
+    required?: boolean;
+    message?: string;
+    pattern?: RegExp;
+    min?: number;
+    max?: number;
+    len?: number;
+    type?: "string" | "number" | "email" | "url" | "array";
+    whitespace?: boolean;
+    validator?: (rule: Rule, value: unknown) => Promise<void> | void;
+};
+interface ErrorField {
+    name: string;
+    errors: string[];
+}
+interface FormInstance<V extends Record<string, unknown> = Record<string, unknown>> {
+    getFieldValue: <T = unknown>(name: string) => T;
+    getFieldsValue: (names?: string[]) => V;
+    setFieldValue: (name: string, value: unknown) => void;
+    setFieldsValue: (values: Partial<V>) => void;
+    resetFields: (names?: string[]) => void;
+    validateFields: (names?: string[]) => Promise<V>;
+    isFieldTouched: (name: string) => boolean;
+    getFieldError: (name: string) => string[];
+    /** Programmatic submit — runs validate then onFinish/onFinishFailed. */
+    submit: () => void;
+}
+/** `Form.useForm()` — create a form instance. Same shape as antd's hook. */
+declare function useForm<V extends Record<string, unknown> = Record<string, unknown>>(): [FormInstance<V>];
+interface FormProps<V extends Record<string, unknown> = Record<string, unknown>> extends Omit<React.FormHTMLAttributes<HTMLFormElement>, "onChange" | "onSubmit"> {
+    form?: FormInstance<V>;
+    layout?: FormLayout;
+    initialValues?: Partial<V>;
+    onFinish?: (values: V) => void;
+    onFinishFailed?: (info: {
+        values: Partial<V>;
+        errorFields: ErrorField[];
+    }) => void;
+    onValuesChange?: (changed: Partial<V>, all: V) => void;
+    /** Show the `*` mark before required field labels. Default true. */
+    requiredMark?: boolean;
+    /** Disable all fields inside. */
+    disabled?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const FormRoot: <V extends Record<string, unknown> = Record<string, unknown>>(props: FormProps<V>) => react_jsx_runtime.JSX.Element;
+interface FormItemProps {
+    /** Field key. Omit for layout-only wrappers (no value binding). */
+    name?: string;
+    label?: React.ReactNode;
+    rules?: Rule[];
+    /** Render no wrapper — emit only the (bound) child. */
+    noStyle?: boolean;
+    /** Inject value into this prop name on the child. Default `"value"`. */
+    valuePropName?: string;
+    /** Listen for changes on this event name. Default `"onChange"`. */
+    trigger?: string;
+    /** Event names that trigger validation. Default `["onChange"]`. */
+    validateTrigger?: string | string[];
+    /** Initial value (used when the form instance has no value yet). */
+    initialValue?: unknown;
+    /** Extra help text shown under the field. Hidden when an error is shown. */
+    help?: React.ReactNode;
+    /** Supplementary description below the help line. */
+    extra?: React.ReactNode;
+    /** Explicitly mark the field as required (cosmetic). */
+    required?: boolean;
+    /** Hide the entire item (still keeps the field in the form). */
+    hidden?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+declare const FormItem: React.FC<FormItemProps>;
+declare const Form: typeof FormRoot & {
+    Item: typeof FormItem;
+    useForm: typeof useForm;
+};
+
+export { type ErrorField, Form, type FormInstance, FormItem, type FormItemProps, type FormLayout, type FormProps, type Rule, useForm };