@a4ui/core 0.8.0 → 0.8.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +75 -29
- package/dist/elements.css +29 -0
- package/dist/elements.iife.js +1 -1
- package/dist/elements.js +14 -5
- package/dist/index.d.ts +3 -1
- package/dist/index.js +2216 -1908
- package/dist/ui/Calendar.d.ts +4 -4
- package/dist/ui/DateTimeField.d.ts +28 -0
- package/dist/ui/TimeField.d.ts +27 -0
- package/dist/ui/internal/CalendarCore.d.ts +22 -0
- package/package.json +17 -6
package/dist/ui/Calendar.d.ts
CHANGED
|
@@ -7,10 +7,10 @@ export interface CalendarProps {
|
|
|
7
7
|
class?: string;
|
|
8
8
|
}
|
|
9
9
|
/**
|
|
10
|
-
* Full-month calendar: a header with
|
|
11
|
-
*
|
|
12
|
-
*
|
|
13
|
-
* day
|
|
10
|
+
* Full-month calendar: a header with month/year navigation and a 6×7 grid of
|
|
11
|
+
* day buttons. Click the month or year in the header to jump straight to a month
|
|
12
|
+
* or year picker; the double chevrons step a whole year at a time. The selected
|
|
13
|
+
* day is filled and "today" gets a ring. Theme-agnostic, always visible.
|
|
14
14
|
*
|
|
15
15
|
* @example
|
|
16
16
|
* ```tsx
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
export interface DateTimeFieldProps {
|
|
3
|
+
/** Selected moment as `YYYY-MM-DD HH:MM` (local), or `''` for none. */
|
|
4
|
+
value: string;
|
|
5
|
+
/** Called with the combined `YYYY-MM-DD HH:MM` (either part may be missing). */
|
|
6
|
+
onChange: (value: string) => void;
|
|
7
|
+
/** 12-hour time display with AM/PM. @default false */
|
|
8
|
+
hour12?: boolean;
|
|
9
|
+
/** Minute increment for the time options. @default 5 */
|
|
10
|
+
minuteStep?: number;
|
|
11
|
+
/** Placeholder for the date half. */
|
|
12
|
+
dateLabel?: string;
|
|
13
|
+
/** Placeholder for the time half. */
|
|
14
|
+
timeLabel?: string;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
class?: string;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Date + time picker built from {@link DateField} and {@link TimeField}. Speaks a
|
|
20
|
+
* single `YYYY-MM-DD HH:MM` string; the two halves fill in independently.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* const [when, setWhen] = createSignal('2026-07-15 09:30')
|
|
25
|
+
* <DateTimeField value={when()} onChange={setWhen} hour12 />
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
export declare function DateTimeField(props: DateTimeFieldProps): JSX.Element;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
export interface TimeFieldProps {
|
|
3
|
+
/** Selected time as canonical 24h "HH:MM" (e.g. "15:05"), or "" for none. */
|
|
4
|
+
value: string;
|
|
5
|
+
/** Called with the newly picked time as "HH:MM" (24h). */
|
|
6
|
+
onChange: (value: string) => void;
|
|
7
|
+
/** 12-hour display with AM/PM instead of 24-hour. @default false */
|
|
8
|
+
hour12?: boolean;
|
|
9
|
+
/** Minute increment for the options list. @default 5 */
|
|
10
|
+
minuteStep?: number;
|
|
11
|
+
/** Placeholder shown on the trigger when value is empty. */
|
|
12
|
+
label?: string;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
class?: string;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* Compact hand-rolled hour/minute (/ AM-PM) column picker (no Kobalte primitive
|
|
18
|
+
* covers this yet). Trigger button opens a portaled popover; closes on outside
|
|
19
|
+
* click, Escape, scroll, or resize. Speaks plain 24h `HH:MM` strings.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* const [time, setTime] = createSignal('15:05')
|
|
24
|
+
* <TimeField value={time()} onChange={setTime} label="Start time" hour12 />
|
|
25
|
+
* ```
|
|
26
|
+
*/
|
|
27
|
+
export declare function TimeField(props: TimeFieldProps): JSX.Element;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { JSX } from 'solid-js';
|
|
2
|
+
export interface CalendarCoreProps {
|
|
3
|
+
/** Currently selected day (for highlight); undefined = none. */
|
|
4
|
+
selected?: Date;
|
|
5
|
+
/** Called with the newly picked day. */
|
|
6
|
+
onPick: (date: Date) => void;
|
|
7
|
+
/** 0 = Sunday-first, 1 = Monday-first. @default 0 */
|
|
8
|
+
weekStart?: 0 | 1;
|
|
9
|
+
/** Full month names, January…December order (12). */
|
|
10
|
+
months?: string[];
|
|
11
|
+
/** Weekday headers in DISPLAY order, matching `weekStart` (7). */
|
|
12
|
+
weekdays?: string[];
|
|
13
|
+
/** Month first shown (its year/month seed the view). @default today */
|
|
14
|
+
initialView?: Date;
|
|
15
|
+
class?: string;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* The interactive calendar body: a header (year/month jumps + drill-down) and a
|
|
19
|
+
* grid that switches between day, month, and year views. Stateless about
|
|
20
|
+
* open/closed — the caller decides where it lives.
|
|
21
|
+
*/
|
|
22
|
+
export declare function CalendarCore(props: CalendarCoreProps): JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@a4ui/core",
|
|
3
|
-
"version": "0.8.
|
|
3
|
+
"version": "0.8.1",
|
|
4
4
|
"description": "A4ui — Spatial Glass design system & component library for SolidJS (Kobalte behavior + Tailwind glass tokens + motion).",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
@@ -37,14 +37,23 @@
|
|
|
37
37
|
"exports": {
|
|
38
38
|
".": {
|
|
39
39
|
"types": "./dist/index.d.ts",
|
|
40
|
-
"import": "./dist/index.js"
|
|
40
|
+
"import": "./dist/index.js",
|
|
41
|
+
"default": "./dist/index.js"
|
|
42
|
+
},
|
|
43
|
+
"./preset": {
|
|
44
|
+
"import": "./preset.js",
|
|
45
|
+
"default": "./preset.js"
|
|
41
46
|
},
|
|
42
|
-
"./preset": "./preset.js",
|
|
43
47
|
"./styles.css": "./dist/styles.css",
|
|
44
48
|
"./elements": {
|
|
45
|
-
"import": "./dist/elements.js"
|
|
49
|
+
"import": "./dist/elements.js",
|
|
50
|
+
"default": "./dist/elements.js"
|
|
46
51
|
},
|
|
47
|
-
"./elements.css": "./dist/elements.css"
|
|
52
|
+
"./elements.css": "./dist/elements.css",
|
|
53
|
+
"./package.json": "./package.json"
|
|
54
|
+
},
|
|
55
|
+
"engines": {
|
|
56
|
+
"node": ">=20"
|
|
48
57
|
},
|
|
49
58
|
"publishConfig": {
|
|
50
59
|
"access": "public"
|
|
@@ -65,7 +74,9 @@
|
|
|
65
74
|
"test:ui": "playwright test --ui",
|
|
66
75
|
"test:a11y": "playwright test a11y --project=desktop",
|
|
67
76
|
"test:report": "playwright show-report",
|
|
68
|
-
"
|
|
77
|
+
"test:package": "node scripts/test-package.mjs",
|
|
78
|
+
"validate": "npm run typecheck && npm run lint && npm run test:unit && npm run build",
|
|
79
|
+
"prepublishOnly": "npm run validate",
|
|
69
80
|
"prepare": "husky"
|
|
70
81
|
},
|
|
71
82
|
"lint-staged": {
|