@fangxinyan/lumina 0.6.13 → 0.6.15

package/dist/DateTimePicker-77ZLZIWO.css

@@ -0,0 +1,224 @@
+/* ============ DateTimePicker ============ */
+.date-time-picker {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  min-width: 220px;
+}
+
+.date-time-picker.disabled {
+  opacity: 0.55;
+  pointer-events: none;
+}
+
+.date-time-picker.readonly .input-wrap {
+  cursor: default;
+}
+
+.date-time-picker .input-wrap {
+  width: 100%;
+}
+
+.date-time-picker.open .input-wrap {
+  box-shadow: var(--neu-shadow-inset);
+}
+
+.date-time-picker-panel {
+  position: fixed;
+  z-index: 1000;
+  width: 476px;
+  padding: var(--gap-2) var(--gap-3);
+  border-radius: var(--r-md);
+  background: var(--bg);
+  box-shadow:
+    0 calc(var(--shadow-offset) * 1.1) calc(var(--shadow-blur) * 1.3) color-mix(in oklch, var(--shadow-dark) 72%, transparent),
+    inset 0 0 0 1px var(--divider);
+  animation: menuIn var(--dur) var(--ease);
+}
+
+.date-time-picker-body {
+  display: grid;
+  grid-template-columns: 272px minmax(0, 168px);
+  gap: var(--gap-3);
+  align-items: start;
+}
+
+.date-time-picker-panel .calendar {
+  width: 100%;
+  padding: 0;
+  background: transparent;
+  box-shadow: none;
+}
+
+.date-time-picker-panel .calendar-head {
+  padding: 0 0 var(--gap-1);
+}
+
+.date-time-picker-panel .calendar-title {
+  padding: var(--gap-1) var(--gap-2);
+  font-size: var(--fs-sm);
+}
+
+.date-time-picker-panel .calendar-title-part {
+  padding: var(--gap-1) 6px;
+  font-size: var(--fs-sm);
+}
+
+.date-time-picker-panel .calendar-grid {
+  gap: 1px;
+  min-height: 222px;
+}
+
+.date-time-picker-panel .calendar-dow {
+  padding: var(--gap-1) 0;
+}
+
+.date-time-picker-panel .calendar-cell {
+  aspect-ratio: auto;
+  height: 32px;
+  font-size: var(--fs-xs);
+  border-radius: 7px;
+}
+
+.date-time-picker-panel .calendar-cell.today::after {
+  bottom: 3px;
+}
+
+.date-time-picker-panel .calendar-select-grid {
+  min-height: 222px;
+  gap: var(--gap-1);
+}
+
+.date-time-picker-panel .calendar-select-option {
+  height: 34px;
+  font-size: var(--fs-xs);
+}
+
+.date-time-picker-time {
+  min-width: 0;
+}
+
+.date-time-picker-time-columns {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  padding: 8px;
+  border-radius: var(--r-sm);
+  background: var(--bg);
+  box-shadow: inset 0 0 0 1px var(--divider);
+  overflow: hidden;
+}
+
+.date-time-picker-panel.without-second .date-time-picker-time-columns {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.date-time-picker-time-column {
+  min-width: 0;
+}
+
+.date-time-picker-time-column + .date-time-picker-time-column {
+  border-left: 1px solid var(--divider);
+}
+
+.date-time-picker-time-label {
+  height: 20px;
+  display: grid;
+  place-items: center;
+  font-size: var(--fs-xs);
+  font-weight: 700;
+  color: var(--fg-muted);
+}
+
+.date-time-picker-time-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  height: 220px;
+  overflow-y: auto;
+  padding: 90px 5px;
+  scroll-padding: 90px 0;
+  scrollbar-width: none;
+  -webkit-mask-image: linear-gradient(to bottom, transparent 0, black 20px, black calc(100% - 20px), transparent 100%);
+  mask-image: linear-gradient(to bottom, transparent 0, black 20px, black calc(100% - 20px), transparent 100%);
+}
+
+.date-time-picker-time-list::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+}
+
+.date-time-picker-time-option {
+  flex: 0 0 28px;
+  width: 100%;
+  height: 28px;
+  border: none;
+  border-radius: 7px;
+  background: transparent;
+  color: var(--fg);
+  cursor: pointer;
+  font: 600 var(--fs-md) var(--font-mono);
+  transition:
+    color var(--dur-fast) var(--ease),
+    background var(--dur-fast) var(--ease),
+    box-shadow var(--dur-fast) var(--ease);
+}
+
+.date-time-picker-time-option:hover:not(:disabled) {
+  color: var(--accent-ink);
+  background: var(--bg);
+  box-shadow: var(--neu-shadow-subtle);
+}
+
+.date-time-picker-time-option.selected {
+  color: var(--accent-ink);
+  background: var(--bg);
+  box-shadow: var(--neu-shadow-subtle);
+}
+
+.date-time-picker-time-option:disabled {
+  color: var(--fg-subtle);
+  cursor: not-allowed;
+  opacity: 0.45;
+}
+
+.date-time-picker-footer {
+  display: flex;
+  align-items: center;
+  gap: var(--gap-2);
+  margin-top: var(--gap-2);
+  padding-top: var(--gap-2);
+  border-top: 1px solid var(--divider);
+}
+
+.date-time-picker-footer-spacer {
+  flex: 1;
+  min-width: 0;
+}
+
+.date-time-picker-footer .btn {
+  min-width: 54px;
+}
+
+@media (max-width: 640px) {
+  .date-time-picker-panel {
+    width: 332px;
+  }
+
+  .date-time-picker-body {
+    display: block;
+  }
+
+  .date-time-picker-time {
+    margin-top: var(--gap-3);
+  }
+
+  .date-time-picker-time-columns {
+    height: auto;
+  }
+
+  .date-time-picker-time-list {
+    height: 118px;
+    padding: 28px 8px;
+    scroll-padding: 28px 0;
+  }
+}

package/dist/DateTimePicker.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+var chunk26AJ7OY3_cjs = require('./chunk-26AJ7OY3.cjs');
+require('./chunk-YB3IWIOJ.cjs');
+require('./chunk-VS3I5OKA.cjs');
+require('./chunk-RZEFKXL3.cjs');
+require('./chunk-SW2HMNCA.cjs');
+require('./chunk-4KDABJSY.cjs');
+require('./chunk-QMX67CVT.cjs');
+
+
+
+Object.defineProperty(exports, "DateTimePicker", {
+  enumerable: true,
+  get: function () { return chunk26AJ7OY3_cjs.DateTimePicker; }
+});

package/dist/DateTimePicker.d.cts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import { TimePickerValue } from './TimePicker.cjs';
+
+type DateTimePickerFormat = "YYYY-MM-DD HH:mm" | "YYYY-MM-DD HH:mm:ss";
+type DateTimePickerSize = "sm" | "md" | "lg";
+interface DateTimePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    /** Controlled selected date and time. Use `null` for an empty picker. */
+    value?: Date | null;
+    /** Initial selected date and time when uncontrolled. */
+    defaultValue?: Date | null;
+    /** Fires when the date-time changes or is cleared. */
+    onChange?: (date: Date | null, dateString: string) => void;
+    /** Display and input format. */
+    format?: DateTimePickerFormat | ((date: Date) => string);
+    /** Show the seconds column. Overrides `format` display if true. */
+    showSecond?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    invalid?: boolean;
+    size?: DateTimePickerSize;
+    /** Show a clear button when a value is selected. */
+    allowClear?: boolean;
+    /** Selectable hour increment. Default 1. */
+    hourStep?: number;
+    /** Selectable minute increment. Default 1. */
+    minuteStep?: number;
+    /** Selectable second increment. Default 1. */
+    secondStep?: number;
+    /** Min selectable date-time. */
+    min?: Date;
+    /** Max selectable date-time. */
+    max?: Date;
+    /** Predicate that disables individual days in the calendar. */
+    disabledDate?: (date: Date) => boolean;
+    /** Predicate that disables individual times for the active date. */
+    disabledTime?: (time: TimePickerValue, date: Date) => boolean;
+    /** Where the panel appears relative to the trigger. */
+    placement?: "top" | "bottom" | "left" | "right";
+    /** Controlled panel open state. */
+    open?: boolean;
+    /** Initial panel open state when uncontrolled. */
+    defaultOpen?: boolean;
+    /** Called when panel open state changes. */
+    onOpenChange?: (open: boolean) => void;
+    /** Class for the popped-out panel. */
+    popupClassName?: string;
+    /** Alias for `popupClassName`. */
+    dropdownClassName?: string;
+    className?: string;
+}
+/**
+ * `DateTimePicker` — input-triggered date and time picker built from
+ * `Calendar` plus compact hour / minute / optional second columns.
+ *
+ * @example
+ * <DateTimePicker value={startAt} onChange={setStartAt} minuteStep={15} />
+ */
+declare const DateTimePicker: React.ForwardRefExoticComponent<DateTimePickerProps & React.RefAttributes<HTMLDivElement>>;
+
+export { DateTimePicker, type DateTimePickerFormat, type DateTimePickerProps, type DateTimePickerSize };

package/dist/DateTimePicker.d.ts

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import { TimePickerValue } from './TimePicker.js';
+
+type DateTimePickerFormat = "YYYY-MM-DD HH:mm" | "YYYY-MM-DD HH:mm:ss";
+type DateTimePickerSize = "sm" | "md" | "lg";
+interface DateTimePickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    /** Controlled selected date and time. Use `null` for an empty picker. */
+    value?: Date | null;
+    /** Initial selected date and time when uncontrolled. */
+    defaultValue?: Date | null;
+    /** Fires when the date-time changes or is cleared. */
+    onChange?: (date: Date | null, dateString: string) => void;
+    /** Display and input format. */
+    format?: DateTimePickerFormat | ((date: Date) => string);
+    /** Show the seconds column. Overrides `format` display if true. */
+    showSecond?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    invalid?: boolean;
+    size?: DateTimePickerSize;
+    /** Show a clear button when a value is selected. */
+    allowClear?: boolean;
+    /** Selectable hour increment. Default 1. */
+    hourStep?: number;
+    /** Selectable minute increment. Default 1. */
+    minuteStep?: number;
+    /** Selectable second increment. Default 1. */
+    secondStep?: number;
+    /** Min selectable date-time. */
+    min?: Date;
+    /** Max selectable date-time. */
+    max?: Date;
+    /** Predicate that disables individual days in the calendar. */
+    disabledDate?: (date: Date) => boolean;
+    /** Predicate that disables individual times for the active date. */
+    disabledTime?: (time: TimePickerValue, date: Date) => boolean;
+    /** Where the panel appears relative to the trigger. */
+    placement?: "top" | "bottom" | "left" | "right";
+    /** Controlled panel open state. */
+    open?: boolean;
+    /** Initial panel open state when uncontrolled. */
+    defaultOpen?: boolean;
+    /** Called when panel open state changes. */
+    onOpenChange?: (open: boolean) => void;
+    /** Class for the popped-out panel. */
+    popupClassName?: string;
+    /** Alias for `popupClassName`. */
+    dropdownClassName?: string;
+    className?: string;
+}
+/**
+ * `DateTimePicker` — input-triggered date and time picker built from
+ * `Calendar` plus compact hour / minute / optional second columns.
+ *
+ * @example
+ * <DateTimePicker value={startAt} onChange={setStartAt} minuteStep={15} />
+ */
+declare const DateTimePicker: React.ForwardRefExoticComponent<DateTimePickerProps & React.RefAttributes<HTMLDivElement>>;
+
+export { DateTimePicker, type DateTimePickerFormat, type DateTimePickerProps, type DateTimePickerSize };

package/dist/DateTimePicker.js

@@ -0,0 +1,7 @@
+export { DateTimePicker } from './chunk-CUBKHQ63.js';
+import './chunk-DUFRASGO.js';
+import './chunk-IOAOG5L7.js';
+import './chunk-S7IHWY24.js';
+import './chunk-IPSNC5VZ.js';
+import './chunk-I7TOBKJO.js';
+import './chunk-FDZG27IG.js';

package/dist/Divider.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunk7NAN7OVX_cjs = require('./chunk-7NAN7OVX.cjs');
+var chunkP2OQTJZP_cjs = require('./chunk-P2OQTJZP.cjs');
 
 
 
 Object.defineProperty(exports, "Divider", {
   enumerable: true,
-  get: function () { return chunk7NAN7OVX_cjs.Divider; }
+  get: function () { return chunkP2OQTJZP_cjs.Divider; }
 });

package/dist/Divider.js

@@ -1 +1 @@
-export { Divider } from './chunk-NZBOHEQA.js';
+export { Divider } from './chunk-HBO7ZDEQ.js';

package/dist/{Drawer-7N3URAJ6.css → Drawer-7KICRM4L.css}

@@ -2,7 +2,7 @@
 .drawer-overlay {
   position: fixed;
   inset: 0;
-  background: color-mix(in oklch, var(--bg-sunken) 50%, transparent);
+  background: var(--drawer-mask-bg, var(--mask-bg));
   backdrop-filter: blur(4px);
   z-index: 150;
   animation: fadeIn var(--dur) var(--ease);

package/dist/Drawer.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
-var chunk23HN42SP_cjs = require('./chunk-23HN42SP.cjs');
-require('./chunk-OCQC2ZSV.cjs');
+var chunkULUD3FED_cjs = require('./chunk-ULUD3FED.cjs');
+require('./chunk-QMX67CVT.cjs');
 
 
 
 Object.defineProperty(exports, "Drawer", {
   enumerable: true,
-  get: function () { return chunk23HN42SP_cjs.Drawer; }
+  get: function () { return chunkULUD3FED_cjs.Drawer; }
 });

package/dist/Drawer.d.cts

@@ -21,6 +21,10 @@ interface DrawerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"
     mask?: boolean;
     /** Close when clicking the mask. Default true. Ignored when `mask` is false. */
     maskClosable?: boolean;
+    /** Class name forwarded to the mask overlay. */
+    maskClassName?: string;
+    /** Inline style forwarded to the mask overlay. */
+    maskStyle?: React.CSSProperties;
     /** Close on Escape key. Default true. */
     keyboard?: boolean;
     /** Show the close (×) button in the header. Default true. */

package/dist/Drawer.d.ts

@@ -21,6 +21,10 @@ interface DrawerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"
     mask?: boolean;
     /** Close when clicking the mask. Default true. Ignored when `mask` is false. */
     maskClosable?: boolean;
+    /** Class name forwarded to the mask overlay. */
+    maskClassName?: string;
+    /** Inline style forwarded to the mask overlay. */
+    maskStyle?: React.CSSProperties;
     /** Close on Escape key. Default true. */
     keyboard?: boolean;
     /** Show the close (×) button in the header. Default true. */

package/dist/Drawer.js

@@ -1,2 +1,2 @@
-export { Drawer } from './chunk-A7BI7YWZ.js';
-import './chunk-HHBXCBZP.js';
+export { Drawer } from './chunk-WMGMIE2D.js';
+import './chunk-FDZG27IG.js';

package/dist/Empty.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkZZH4UIPN_cjs = require('./chunk-ZZH4UIPN.cjs');
+var chunkES7AWMNH_cjs = require('./chunk-ES7AWMNH.cjs');
 
 
 
 Object.defineProperty(exports, "Empty", {
   enumerable: true,
-  get: function () { return chunkZZH4UIPN_cjs.Empty; }
+  get: function () { return chunkES7AWMNH_cjs.Empty; }
 });

package/dist/Empty.js

@@ -1 +1 @@
-export { Empty } from './chunk-7RNT6KN4.js';
+export { Empty } from './chunk-6MEOLYNQ.js';

package/dist/Form.cjs

@@ -1,18 +1,18 @@
 'use strict';
 
-var chunkZLMJVSBO_cjs = require('./chunk-ZLMJVSBO.cjs');
+var chunkFDUQPAQE_cjs = require('./chunk-FDUQPAQE.cjs');
 
 
 
 Object.defineProperty(exports, "Form", {
   enumerable: true,
-  get: function () { return chunkZLMJVSBO_cjs.Form; }
+  get: function () { return chunkFDUQPAQE_cjs.Form; }
 });
 Object.defineProperty(exports, "FormItem", {
   enumerable: true,
-  get: function () { return chunkZLMJVSBO_cjs.FormItem; }
+  get: function () { return chunkFDUQPAQE_cjs.FormItem; }
 });
 Object.defineProperty(exports, "useForm", {
   enumerable: true,
-  get: function () { return chunkZLMJVSBO_cjs.useForm; }
+  get: function () { return chunkFDUQPAQE_cjs.useForm; }
 });

package/dist/Form.js

@@ -1 +1 @@
-export { Form, FormItem, useForm } from './chunk-XJTDCWKP.js';
+export { Form, FormItem, useForm } from './chunk-ZR4IMROK.js';