@fangxinyan/lumina 0.1.5 → 0.2.0
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/dist/{Accordion-GSBY5T5U.css → Accordion-3TQPKNN3.css} +8 -1
- package/dist/Accordion.cjs +2 -2
- package/dist/Accordion.d.cts +12 -0
- package/dist/Accordion.d.ts +12 -0
- package/dist/Accordion.js +1 -1
- package/dist/{Alert-LSKBYDRI.css → Alert-JJ7GB3UU.css} +11 -0
- package/dist/Alert.cjs +2 -2
- package/dist/Alert.d.cts +4 -0
- package/dist/Alert.d.ts +4 -0
- package/dist/Alert.js +1 -1
- package/dist/{Avatar-OXDSG5Q6.css → Avatar-R5A4AFKZ.css} +4 -0
- package/dist/Avatar.cjs +2 -2
- package/dist/Avatar.d.cts +2 -0
- package/dist/Avatar.d.ts +2 -0
- package/dist/Avatar.js +1 -1
- package/dist/{Button-5UI7QXGU.css → Button-SDQD25AG.css} +2 -0
- package/dist/Button.cjs +3 -3
- package/dist/Button.d.cts +2 -0
- package/dist/Button.d.ts +2 -0
- package/dist/Button.js +1 -1
- package/dist/Calendar.cjs +2 -2
- package/dist/Calendar.d.cts +8 -0
- package/dist/Calendar.d.ts +8 -0
- package/dist/Calendar.js +1 -1
- package/dist/{Card-2CHHFD4Y.css → Card-RG7ECXL2.css} +11 -0
- package/dist/Card.cjs +3 -3
- package/dist/Card.d.cts +2 -0
- package/dist/Card.d.ts +2 -0
- package/dist/Card.js +1 -1
- package/dist/{Divider-Z37INS5E.css → Divider-OEE4Q2KS.css} +31 -0
- package/dist/Divider.cjs +2 -2
- package/dist/Divider.d.cts +7 -0
- package/dist/Divider.d.ts +7 -0
- package/dist/Divider.js +1 -1
- package/dist/Drawer-IPGB4CXH.css +101 -0
- package/dist/Drawer.cjs +13 -0
- package/dist/Drawer.cjs.map +1 -0
- package/dist/Drawer.d.cts +45 -0
- package/dist/Drawer.d.ts +45 -0
- package/dist/Drawer.js +4 -0
- package/dist/Drawer.js.map +1 -0
- package/dist/{Empty-VM23UNLQ.css → Empty-NQ72W3D7.css} +22 -0
- package/dist/Empty.cjs +4 -4
- package/dist/Empty.d.cts +42 -2
- package/dist/Empty.d.ts +42 -2
- package/dist/Empty.js +1 -1
- package/dist/Input-33CAH4O6.css +134 -0
- package/dist/Input.cjs +3 -3
- package/dist/Input.d.cts +17 -1
- package/dist/Input.d.ts +17 -1
- package/dist/Input.js +1 -1
- package/dist/Modal-N4YVLEWW.css +72 -0
- package/dist/Modal.cjs +3 -7
- package/dist/Modal.d.cts +37 -8
- package/dist/Modal.d.ts +37 -8
- package/dist/Modal.js +2 -2
- package/dist/{Pagination-6FFOI4NM.css → Pagination-YIRYJUXP.css} +33 -0
- package/dist/Pagination.cjs +5 -2
- package/dist/Pagination.d.cts +14 -0
- package/dist/Pagination.d.ts +14 -0
- package/dist/Pagination.js +4 -1
- package/dist/Select.cjs +3 -3
- package/dist/Select.js +2 -2
- package/dist/{Slider-RE4HZQKF.css → Slider-X4PVA65R.css} +51 -2
- package/dist/Slider.cjs +2 -2
- package/dist/Slider.d.cts +20 -5
- package/dist/Slider.d.ts +20 -5
- package/dist/Slider.js +1 -1
- package/dist/Switch-36KJNDXM.css +92 -0
- package/dist/Switch.cjs +2 -2
- package/dist/Switch.d.cts +4 -0
- package/dist/Switch.d.ts +4 -0
- package/dist/Switch.js +1 -1
- package/dist/Table-ADVN6LXP.css +295 -0
- package/dist/Table.cjs +7 -3
- package/dist/Table.d.cts +103 -7
- package/dist/Table.d.ts +103 -7
- package/dist/Table.js +5 -1
- package/dist/{Tabs-A27TSZOP.css → Tabs-RHK6XAFF.css} +7 -0
- package/dist/Tabs.cjs +3 -3
- package/dist/Tabs.d.cts +2 -0
- package/dist/Tabs.d.ts +2 -0
- package/dist/Tabs.js +1 -1
- package/dist/{Tag-EYOY3UWG.css → Tag-FGDY3W7E.css} +2 -0
- package/dist/Tag.cjs +3 -3
- package/dist/Tag.d.cts +5 -0
- package/dist/Tag.d.ts +5 -0
- package/dist/Tag.js +1 -1
- package/dist/chunk-437LB2V4.js +111 -0
- package/dist/chunk-437LB2V4.js.map +1 -0
- package/dist/chunk-4MR4GVTD.js +73 -0
- package/dist/chunk-4MR4GVTD.js.map +1 -0
- package/dist/{chunk-OXYFB2ZI.js → chunk-4U4OY5RA.js} +11 -5
- package/dist/chunk-4U4OY5RA.js.map +1 -0
- package/dist/chunk-55NTFU7Y.js +476 -0
- package/dist/chunk-55NTFU7Y.js.map +1 -0
- package/dist/{chunk-5EYI27B6.js → chunk-77BVQNAQ.js} +5 -3
- package/dist/chunk-77BVQNAQ.js.map +1 -0
- package/dist/chunk-AEJJGUEN.cjs +127 -0
- package/dist/chunk-AEJJGUEN.cjs.map +1 -0
- package/dist/{chunk-3QWHDCHJ.js → chunk-AJZKESHB.js} +13 -4
- package/dist/chunk-AJZKESHB.js.map +1 -0
- package/dist/{chunk-NZPJ7BUB.cjs → chunk-AXMEZGEG.cjs} +13 -4
- package/dist/chunk-AXMEZGEG.cjs.map +1 -0
- package/dist/{chunk-HTP6UEVR.js → chunk-BBPNQ44M.js} +22 -6
- package/dist/chunk-BBPNQ44M.js.map +1 -0
- package/dist/chunk-CCBHZYE6.cjs +150 -0
- package/dist/chunk-CCBHZYE6.cjs.map +1 -0
- package/dist/{chunk-KGYLUZOU.cjs → chunk-EPFYIR63.cjs} +5 -5
- package/dist/{chunk-KGYLUZOU.cjs.map → chunk-EPFYIR63.cjs.map} +1 -1
- package/dist/chunk-F7HW2PYR.cjs +119 -0
- package/dist/chunk-F7HW2PYR.cjs.map +1 -0
- package/dist/chunk-GIVMKGZN.js +39 -0
- package/dist/chunk-GIVMKGZN.js.map +1 -0
- package/dist/{chunk-FMG3ZPGK.js → chunk-H6FCIJOP.js} +5 -3
- package/dist/chunk-H6FCIJOP.js.map +1 -0
- package/dist/{chunk-ALFDP5WX.cjs → chunk-IDM6JJLP.cjs} +22 -6
- package/dist/chunk-IDM6JJLP.cjs.map +1 -0
- package/dist/chunk-IFERLHCL.cjs +499 -0
- package/dist/chunk-IFERLHCL.cjs.map +1 -0
- package/dist/chunk-IWVKITPN.js +102 -0
- package/dist/chunk-IWVKITPN.js.map +1 -0
- package/dist/{chunk-I2ERCHFV.cjs → chunk-JKLQOB2F.cjs} +11 -5
- package/dist/chunk-JKLQOB2F.cjs.map +1 -0
- package/dist/{chunk-IGHLSNXT.cjs → chunk-K7PVJLW4.cjs} +51 -4
- package/dist/chunk-K7PVJLW4.cjs.map +1 -0
- package/dist/chunk-LDENBYRC.cjs +210 -0
- package/dist/chunk-LDENBYRC.cjs.map +1 -0
- package/dist/chunk-LSLYY5FN.js +125 -0
- package/dist/chunk-LSLYY5FN.js.map +1 -0
- package/dist/chunk-NSUD5B22.js +187 -0
- package/dist/chunk-NSUD5B22.js.map +1 -0
- package/dist/{chunk-AAMYURWQ.cjs → chunk-OPTTHURA.cjs} +5 -3
- package/dist/chunk-OPTTHURA.cjs.map +1 -0
- package/dist/{chunk-F3NHM4GX.js → chunk-OYGFMXAA.js} +13 -4
- package/dist/chunk-OYGFMXAA.js.map +1 -0
- package/dist/chunk-PBBHUUXU.cjs +133 -0
- package/dist/chunk-PBBHUUXU.cjs.map +1 -0
- package/dist/chunk-RDLPX7RK.cjs +95 -0
- package/dist/chunk-RDLPX7RK.cjs.map +1 -0
- package/dist/{chunk-XFRP2MBR.js → chunk-TYQ5CN2C.js} +51 -4
- package/dist/chunk-TYQ5CN2C.js.map +1 -0
- package/dist/{chunk-7CKHWCEA.cjs → chunk-TZSWDH5T.cjs} +5 -3
- package/dist/chunk-TZSWDH5T.cjs.map +1 -0
- package/dist/{chunk-VMHNKD3N.cjs → chunk-URF6RBW6.cjs} +13 -4
- package/dist/chunk-URF6RBW6.cjs.map +1 -0
- package/dist/{chunk-G3UWXSNQ.js → chunk-V34OPWKZ.js} +5 -4
- package/dist/chunk-V34OPWKZ.js.map +1 -0
- package/dist/{chunk-ITGCHU3Y.cjs → chunk-VICGQC6G.cjs} +5 -4
- package/dist/chunk-VICGQC6G.cjs.map +1 -0
- package/dist/chunk-YEOARJKR.cjs +40 -0
- package/dist/chunk-YEOARJKR.cjs.map +1 -0
- package/dist/chunk-Z5X5AMLA.cjs +41 -0
- package/dist/chunk-Z5X5AMLA.cjs.map +1 -0
- package/dist/chunk-Z7P6QGMT.js +115 -0
- package/dist/chunk-Z7P6QGMT.js.map +1 -0
- package/dist/{chunk-OYH6A7IQ.js → chunk-ZVCMXDTP.js} +3 -3
- package/dist/{chunk-OYH6A7IQ.js.map → chunk-ZVCMXDTP.js.map} +1 -1
- package/dist/chunk-ZWP4LSS3.js +38 -0
- package/dist/chunk-ZWP4LSS3.js.map +1 -0
- package/dist/index.cjs +57 -56
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +6 -5
- package/dist/index.d.ts +6 -5
- package/dist/index.js +19 -18
- package/dist/index.js.map +1 -1
- package/dist/styles.css +566 -50
- package/package.json +1 -1
- package/dist/Input-Z526ARZP.css +0 -66
- package/dist/Modal-AYKNIWWQ.css +0 -79
- package/dist/Switch-NP7KKJOX.css +0 -44
- package/dist/Table-ZDPGWLH3.css +0 -139
- package/dist/chunk-2VA2HSL4.cjs +0 -121
- package/dist/chunk-2VA2HSL4.cjs.map +0 -1
- package/dist/chunk-2W2AJUZW.js +0 -118
- package/dist/chunk-2W2AJUZW.js.map +0 -1
- package/dist/chunk-3QWHDCHJ.js.map +0 -1
- package/dist/chunk-4AA22BOG.js +0 -63
- package/dist/chunk-4AA22BOG.js.map +0 -1
- package/dist/chunk-5EYI27B6.js.map +0 -1
- package/dist/chunk-77NP67ML.cjs +0 -70
- package/dist/chunk-77NP67ML.cjs.map +0 -1
- package/dist/chunk-7CKHWCEA.cjs.map +0 -1
- package/dist/chunk-7NM5BRUX.js +0 -91
- package/dist/chunk-7NM5BRUX.js.map +0 -1
- package/dist/chunk-7UJI437T.js +0 -49
- package/dist/chunk-7UJI437T.js.map +0 -1
- package/dist/chunk-AAMYURWQ.cjs.map +0 -1
- package/dist/chunk-ALFDP5WX.cjs.map +0 -1
- package/dist/chunk-F3NHM4GX.js.map +0 -1
- package/dist/chunk-FMG3ZPGK.js.map +0 -1
- package/dist/chunk-G3UWXSNQ.js.map +0 -1
- package/dist/chunk-HTP6UEVR.js.map +0 -1
- package/dist/chunk-I2ERCHFV.cjs.map +0 -1
- package/dist/chunk-IBZAGURN.cjs +0 -71
- package/dist/chunk-IBZAGURN.cjs.map +0 -1
- package/dist/chunk-IGHLSNXT.cjs.map +0 -1
- package/dist/chunk-ITGCHU3Y.cjs.map +0 -1
- package/dist/chunk-JNFCTYJT.cjs +0 -31
- package/dist/chunk-JNFCTYJT.cjs.map +0 -1
- package/dist/chunk-JWFVSBVX.cjs +0 -30
- package/dist/chunk-JWFVSBVX.cjs.map +0 -1
- package/dist/chunk-K67KIKX4.cjs +0 -67
- package/dist/chunk-K67KIKX4.cjs.map +0 -1
- package/dist/chunk-KF4MCHZL.cjs +0 -105
- package/dist/chunk-KF4MCHZL.cjs.map +0 -1
- package/dist/chunk-M6OTFXZA.js +0 -48
- package/dist/chunk-M6OTFXZA.js.map +0 -1
- package/dist/chunk-NWJW5KLN.js +0 -29
- package/dist/chunk-NWJW5KLN.js.map +0 -1
- package/dist/chunk-NZPJ7BUB.cjs.map +0 -1
- package/dist/chunk-OXYFB2ZI.js.map +0 -1
- package/dist/chunk-Q33V7MSK.js +0 -79
- package/dist/chunk-Q33V7MSK.js.map +0 -1
- package/dist/chunk-QT7SJITQ.cjs +0 -114
- package/dist/chunk-QT7SJITQ.cjs.map +0 -1
- package/dist/chunk-VMHNKD3N.cjs.map +0 -1
- package/dist/chunk-VXITDXLW.js +0 -28
- package/dist/chunk-VXITDXLW.js.map +0 -1
- package/dist/chunk-XFRP2MBR.js.map +0 -1
package/dist/Tabs.d.ts
CHANGED
|
@@ -13,6 +13,8 @@ interface TabsProps {
|
|
|
13
13
|
defaultActiveKey?: string;
|
|
14
14
|
onChange?: (key: string) => void;
|
|
15
15
|
variant?: "line" | "pill" | "segmented";
|
|
16
|
+
/** Center-align the tab bar horizontally. */
|
|
17
|
+
centered?: boolean;
|
|
16
18
|
className?: string;
|
|
17
19
|
}
|
|
18
20
|
/** `Tabs` — switchable sections. */
|
package/dist/Tabs.js
CHANGED
|
@@ -22,7 +22,9 @@
|
|
|
22
22
|
.tag.solid.success { background: var(--success); color: white; box-shadow: 0 2px 6px color-mix(in oklch, var(--success) 35%, transparent); }
|
|
23
23
|
.tag.solid.warning { background: var(--warning); color: white; box-shadow: 0 2px 6px color-mix(in oklch, var(--warning) 35%, transparent); }
|
|
24
24
|
.tag.solid.danger { background: var(--danger); color: white; box-shadow: 0 2px 6px color-mix(in oklch, var(--danger) 35%, transparent); }
|
|
25
|
+
.tag.borderless { background: transparent; box-shadow: none; }
|
|
25
26
|
.tag .dot { width: 6px; height: 6px; border-radius: 999px; background: currentColor; }
|
|
27
|
+
.tag .tag-ico { color: currentColor; display: inline-flex; }
|
|
26
28
|
.tag .x { cursor: pointer; color: var(--fg-subtle); margin-left: 2px; display: inline-flex; }
|
|
27
29
|
.tag .x:hover { color: var(--fg); }
|
|
28
30
|
|
package/dist/Tag.cjs
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var chunkURF6RBW6_cjs = require('./chunk-URF6RBW6.cjs');
|
|
4
4
|
require('./chunk-YVO7XO4W.cjs');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
Object.defineProperty(exports, "Badge", {
|
|
9
9
|
enumerable: true,
|
|
10
|
-
get: function () { return
|
|
10
|
+
get: function () { return chunkURF6RBW6_cjs.Badge; }
|
|
11
11
|
});
|
|
12
12
|
Object.defineProperty(exports, "Tag", {
|
|
13
13
|
enumerable: true,
|
|
14
|
-
get: function () { return
|
|
14
|
+
get: function () { return chunkURF6RBW6_cjs.Tag; }
|
|
15
15
|
});
|
|
16
16
|
//# sourceMappingURL=Tag.cjs.map
|
|
17
17
|
//# sourceMappingURL=Tag.cjs.map
|
package/dist/Tag.d.cts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { IconName } from './Icon.cjs';
|
|
2
3
|
|
|
3
4
|
type TagTone = "neutral" | "accent" | "info" | "success" | "warning" | "danger";
|
|
4
5
|
interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
@@ -6,9 +7,13 @@ interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
|
6
7
|
solid?: boolean;
|
|
7
8
|
/** Render a leading colored dot. */
|
|
8
9
|
dot?: boolean;
|
|
10
|
+
/** Leading icon (uses the built-in `Icon` component). */
|
|
11
|
+
icon?: IconName;
|
|
9
12
|
/** Show a close button. */
|
|
10
13
|
removable?: boolean;
|
|
11
14
|
onRemove?: () => void;
|
|
15
|
+
/** Whether to render the tag outline/flat shadow. Defaults to `true`. */
|
|
16
|
+
bordered?: boolean;
|
|
12
17
|
children?: React.ReactNode;
|
|
13
18
|
}
|
|
14
19
|
/** `Tag` — small label/pill. */
|
package/dist/Tag.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { IconName } from './Icon.js';
|
|
2
3
|
|
|
3
4
|
type TagTone = "neutral" | "accent" | "info" | "success" | "warning" | "danger";
|
|
4
5
|
interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
@@ -6,9 +7,13 @@ interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
|
6
7
|
solid?: boolean;
|
|
7
8
|
/** Render a leading colored dot. */
|
|
8
9
|
dot?: boolean;
|
|
10
|
+
/** Leading icon (uses the built-in `Icon` component). */
|
|
11
|
+
icon?: IconName;
|
|
9
12
|
/** Show a close button. */
|
|
10
13
|
removable?: boolean;
|
|
11
14
|
onRemove?: () => void;
|
|
15
|
+
/** Whether to render the tag outline/flat shadow. Defaults to `true`. */
|
|
16
|
+
bordered?: boolean;
|
|
12
17
|
children?: React.ReactNode;
|
|
13
18
|
}
|
|
14
19
|
/** `Tag` — small label/pill. */
|
package/dist/Tag.js
CHANGED
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
import './tokens-HWQ7KWPG.css';
|
|
2
|
+
import './shared-NJHRNLRH.css';
|
|
3
|
+
import './Slider-X4PVA65R.css';
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
|
+
|
|
7
|
+
// src/components/Slider/Slider.tsx
|
|
8
|
+
var asArray = (v, fallback) => {
|
|
9
|
+
if (v === void 0) return [fallback];
|
|
10
|
+
return Array.isArray(v) ? [...v] : [v];
|
|
11
|
+
};
|
|
12
|
+
var Slider = (props) => {
|
|
13
|
+
const {
|
|
14
|
+
min = 0,
|
|
15
|
+
max = 100,
|
|
16
|
+
step = 1,
|
|
17
|
+
disabled,
|
|
18
|
+
showValue,
|
|
19
|
+
tone = "accent",
|
|
20
|
+
marks,
|
|
21
|
+
className = ""
|
|
22
|
+
} = props;
|
|
23
|
+
const range = props.range === true;
|
|
24
|
+
const value = props.value;
|
|
25
|
+
const defaultValue = props.defaultValue;
|
|
26
|
+
const onChange = props.onChange;
|
|
27
|
+
const initial = React.useMemo(() => {
|
|
28
|
+
if (defaultValue !== void 0) return asArray(defaultValue, 0);
|
|
29
|
+
return range ? [min, max] : [0];
|
|
30
|
+
}, []);
|
|
31
|
+
const [inner, setInner] = React.useState(initial);
|
|
32
|
+
const isControlled = value !== void 0;
|
|
33
|
+
const nums = isControlled ? asArray(value, range ? min : 0) : inner;
|
|
34
|
+
const pctOf = (n) => (n - min) / (max - min) * 100;
|
|
35
|
+
const emit = (arr) => {
|
|
36
|
+
if (range) {
|
|
37
|
+
onChange?.([arr[0], arr[1]]);
|
|
38
|
+
} else {
|
|
39
|
+
onChange?.(arr[0]);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
const updateAt = (index, next) => {
|
|
43
|
+
const clamped = Math.max(min, Math.min(max, next));
|
|
44
|
+
const out = [...nums];
|
|
45
|
+
out[index] = clamped;
|
|
46
|
+
if (range && out.length === 2 && out[0] > out[1]) {
|
|
47
|
+
out.sort((a, b) => a - b);
|
|
48
|
+
}
|
|
49
|
+
if (!isControlled) setInner(out);
|
|
50
|
+
emit(out);
|
|
51
|
+
};
|
|
52
|
+
const handleMarkClick = (mark) => {
|
|
53
|
+
if (disabled) return;
|
|
54
|
+
if (!range) {
|
|
55
|
+
updateAt(0, mark);
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
const [a, b] = nums;
|
|
59
|
+
const closerIndex = Math.abs(a - mark) <= Math.abs(b - mark) ? 0 : 1;
|
|
60
|
+
updateAt(closerIndex, mark);
|
|
61
|
+
};
|
|
62
|
+
const fillLeft = range ? pctOf(Math.min(nums[0], nums[1])) : 0;
|
|
63
|
+
const fillRight = range ? 100 - pctOf(Math.max(nums[0], nums[1])) : 100 - pctOf(nums[0]);
|
|
64
|
+
return /* @__PURE__ */ jsxs("div", { className: `slider ${tone} ${disabled ? "disabled" : ""} ${marks ? "has-marks" : ""} ${className}`, children: [
|
|
65
|
+
/* @__PURE__ */ jsx("div", { className: "slider-track", children: /* @__PURE__ */ jsx(
|
|
66
|
+
"div",
|
|
67
|
+
{
|
|
68
|
+
className: "slider-fill",
|
|
69
|
+
style: { left: `${fillLeft}%`, right: `${fillRight}%` }
|
|
70
|
+
}
|
|
71
|
+
) }),
|
|
72
|
+
nums.map((n, i) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
73
|
+
/* @__PURE__ */ jsx("div", { className: "slider-thumb", style: { left: `${pctOf(n)}%` } }),
|
|
74
|
+
/* @__PURE__ */ jsx(
|
|
75
|
+
"input",
|
|
76
|
+
{
|
|
77
|
+
type: "range",
|
|
78
|
+
min,
|
|
79
|
+
max,
|
|
80
|
+
step,
|
|
81
|
+
value: n,
|
|
82
|
+
disabled,
|
|
83
|
+
onChange: (e) => updateAt(i, Number(e.target.value))
|
|
84
|
+
}
|
|
85
|
+
)
|
|
86
|
+
] }, i)),
|
|
87
|
+
showValue && /* @__PURE__ */ jsx("span", { className: "slider-value", children: range ? `${nums[0]} \u2013 ${nums[1]}` : nums[0] }),
|
|
88
|
+
marks && /* @__PURE__ */ jsx("div", { className: "slider-marks", children: Object.entries(marks).map(([k, label]) => {
|
|
89
|
+
const n = Number(k);
|
|
90
|
+
const left = pctOf(n);
|
|
91
|
+
const active = range ? n >= Math.min(nums[0], nums[1]) && n <= Math.max(nums[0], nums[1]) : n <= nums[0];
|
|
92
|
+
return /* @__PURE__ */ jsxs(
|
|
93
|
+
"span",
|
|
94
|
+
{
|
|
95
|
+
className: `slider-mark ${active ? "active" : ""}`,
|
|
96
|
+
style: { left: `${left}%` },
|
|
97
|
+
onClick: () => handleMarkClick(n),
|
|
98
|
+
children: [
|
|
99
|
+
/* @__PURE__ */ jsx("span", { className: "slider-mark-dot" }),
|
|
100
|
+
/* @__PURE__ */ jsx("span", { className: "slider-mark-label", children: label })
|
|
101
|
+
]
|
|
102
|
+
},
|
|
103
|
+
k
|
|
104
|
+
);
|
|
105
|
+
}) })
|
|
106
|
+
] });
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
export { Slider };
|
|
110
|
+
//# sourceMappingURL=chunk-437LB2V4.js.map
|
|
111
|
+
//# sourceMappingURL=chunk-437LB2V4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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","file":"chunk-437LB2V4.js","sourcesContent":["import \"../../styles/tokens.css\";\nimport \"../../styles/shared.css\";\nimport \"./Slider.css\";\nimport * as React from \"react\";\n\nexport type SliderSingleValue = number;\nexport type SliderRangeValue = [number, number];\nexport type SliderValue = SliderSingleValue | SliderRangeValue;\n\ninterface SliderBaseProps {\n min?: number;\n max?: number;\n step?: number;\n disabled?: boolean;\n showValue?: boolean;\n tone?: \"accent\" | \"success\" | \"warning\" | \"danger\";\n /** Tick marks with labels. Clicking a mark snaps to it. */\n marks?: Record<number, React.ReactNode>;\n className?: string;\n}\n\nexport interface SliderSingleProps extends SliderBaseProps {\n range?: false;\n value?: number;\n defaultValue?: number;\n onChange?: (value: number) => void;\n}\n\nexport interface SliderRangeProps extends SliderBaseProps {\n range: true;\n value?: SliderRangeValue;\n defaultValue?: SliderRangeValue;\n onChange?: (value: SliderRangeValue) => void;\n}\n\nexport type SliderProps = SliderSingleProps | SliderRangeProps;\n\nconst asArray = (v: SliderValue | undefined, fallback: number): number[] => {\n if (v === undefined) return [fallback];\n return Array.isArray(v) ? [...v] : [v];\n};\n\n/** `Slider` — neumorphic range input with grooved track. */\nexport const Slider: React.FC<SliderProps> = (props) => {\n const {\n min = 0,\n max = 100,\n step = 1,\n disabled,\n showValue,\n tone = \"accent\",\n marks,\n className = \"\",\n } = props;\n\n const range = (props as SliderRangeProps).range === true;\n const value = (props as { value?: SliderValue }).value;\n const defaultValue = (props as { defaultValue?: SliderValue }).defaultValue;\n const onChange = (props as { onChange?: (v: SliderValue) => void }).onChange;\n\n const initial = React.useMemo<number[]>(() => {\n if (defaultValue !== undefined) return asArray(defaultValue, 0);\n return range ? [min, max] : [0];\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const [inner, setInner] = React.useState<number[]>(initial);\n const isControlled = value !== undefined;\n const nums = isControlled ? asArray(value, range ? min : 0) : inner;\n\n const pctOf = (n: number) => ((n - min) / (max - min)) * 100;\n\n const emit = (arr: number[]) => {\n if (range) {\n onChange?.([arr[0], arr[1]] as SliderRangeValue);\n } else {\n onChange?.(arr[0]);\n }\n };\n\n const updateAt = (index: number, next: number) => {\n const clamped = Math.max(min, Math.min(max, next));\n const out = [...nums];\n out[index] = clamped;\n if (range && out.length === 2 && out[0] > out[1]) {\n out.sort((a, b) => a - b);\n }\n if (!isControlled) setInner(out);\n emit(out);\n };\n\n const handleMarkClick = (mark: number) => {\n if (disabled) return;\n if (!range) {\n updateAt(0, mark);\n return;\n }\n const [a, b] = nums;\n const closerIndex = Math.abs(a - mark) <= Math.abs(b - mark) ? 0 : 1;\n updateAt(closerIndex, mark);\n };\n\n const fillLeft = range ? pctOf(Math.min(nums[0], nums[1])) : 0;\n const fillRight = range\n ? 100 - pctOf(Math.max(nums[0], nums[1]))\n : 100 - pctOf(nums[0]);\n\n return (\n <div className={`slider ${tone} ${disabled ? \"disabled\" : \"\"} ${marks ? \"has-marks\" : \"\"} ${className}`}>\n <div className=\"slider-track\">\n <div\n className=\"slider-fill\"\n style={{ left: `${fillLeft}%`, right: `${fillRight}%` }}\n />\n </div>\n {nums.map((n, i) => (\n <React.Fragment key={i}>\n <div className=\"slider-thumb\" style={{ left: `${pctOf(n)}%` }} />\n <input\n type=\"range\"\n min={min}\n max={max}\n step={step}\n value={n}\n disabled={disabled}\n onChange={(e) => updateAt(i, Number(e.target.value))}\n />\n </React.Fragment>\n ))}\n {showValue && (\n <span className=\"slider-value\">\n {range ? `${nums[0]} – ${nums[1]}` : nums[0]}\n </span>\n )}\n {marks && (\n <div className=\"slider-marks\">\n {Object.entries(marks).map(([k, label]) => {\n const n = Number(k);\n const left = pctOf(n);\n const active = range\n ? n >= Math.min(nums[0], nums[1]) && n <= Math.max(nums[0], nums[1])\n : n <= nums[0];\n return (\n <span\n key={k}\n className={`slider-mark ${active ? \"active\" : \"\"}`}\n style={{ left: `${left}%` }}\n onClick={() => handleMarkClick(n)}\n >\n <span className=\"slider-mark-dot\" />\n <span className=\"slider-mark-label\">{label}</span>\n </span>\n );\n })}\n </div>\n )}\n </div>\n );\n};\n"]}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import { Icon } from './chunk-GEYMWUW6.js';
|
|
2
|
+
import './tokens-HWQ7KWPG.css';
|
|
3
|
+
import './shared-NJHRNLRH.css';
|
|
4
|
+
import './Accordion-3TQPKNN3.css';
|
|
5
|
+
import * as React from 'react';
|
|
6
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
var Accordion = ({
|
|
9
|
+
items,
|
|
10
|
+
multiple = false,
|
|
11
|
+
accordion = false,
|
|
12
|
+
collapsible = "header",
|
|
13
|
+
activeKeys,
|
|
14
|
+
defaultActiveKeys = [],
|
|
15
|
+
onChange,
|
|
16
|
+
className = ""
|
|
17
|
+
}) => {
|
|
18
|
+
const [inner, setInner] = React.useState(defaultActiveKeys);
|
|
19
|
+
const isControlled = activeKeys !== void 0;
|
|
20
|
+
const keys = isControlled ? activeKeys : inner;
|
|
21
|
+
const singleOpen = accordion || !multiple;
|
|
22
|
+
const toggle = (k, itemDisabled) => {
|
|
23
|
+
if (collapsible === "disabled" || itemDisabled) return;
|
|
24
|
+
const next = keys.includes(k) ? keys.filter((x) => x !== k) : singleOpen ? [k] : [...keys, k];
|
|
25
|
+
if (!isControlled) setInner(next);
|
|
26
|
+
onChange?.(next);
|
|
27
|
+
};
|
|
28
|
+
return /* @__PURE__ */ jsx("div", { className: `accordion ${className}`, children: items.map((it) => {
|
|
29
|
+
const open = keys.includes(it.key);
|
|
30
|
+
const isDisabled = it.disabled || collapsible === "disabled";
|
|
31
|
+
const headerClickable = collapsible === "header" && !isDisabled;
|
|
32
|
+
return /* @__PURE__ */ jsxs(
|
|
33
|
+
"div",
|
|
34
|
+
{
|
|
35
|
+
className: `accordion-item ${open ? "open" : ""} ${isDisabled ? "disabled" : ""} ${collapsible === "icon" ? "icon-only" : ""}`,
|
|
36
|
+
children: [
|
|
37
|
+
/* @__PURE__ */ jsxs(
|
|
38
|
+
"button",
|
|
39
|
+
{
|
|
40
|
+
type: "button",
|
|
41
|
+
className: "accordion-head",
|
|
42
|
+
disabled: isDisabled,
|
|
43
|
+
onClick: () => headerClickable && toggle(it.key, it.disabled),
|
|
44
|
+
"aria-expanded": open,
|
|
45
|
+
children: [
|
|
46
|
+
/* @__PURE__ */ jsx("span", { children: it.title }),
|
|
47
|
+
/* @__PURE__ */ jsx(
|
|
48
|
+
"span",
|
|
49
|
+
{
|
|
50
|
+
className: `accordion-chev${collapsible === "icon" ? " clickable" : ""}`,
|
|
51
|
+
onClick: (e) => {
|
|
52
|
+
if (collapsible === "icon" && !isDisabled) {
|
|
53
|
+
e.stopPropagation();
|
|
54
|
+
toggle(it.key, it.disabled);
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
children: /* @__PURE__ */ jsx(Icon, { name: "chevDown", size: 16 })
|
|
58
|
+
}
|
|
59
|
+
)
|
|
60
|
+
]
|
|
61
|
+
}
|
|
62
|
+
),
|
|
63
|
+
/* @__PURE__ */ jsx("div", { className: "accordion-body", children: /* @__PURE__ */ jsx("div", { className: "accordion-body-inner", children: it.content }) })
|
|
64
|
+
]
|
|
65
|
+
},
|
|
66
|
+
it.key
|
|
67
|
+
);
|
|
68
|
+
}) });
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
export { Accordion };
|
|
72
|
+
//# sourceMappingURL=chunk-4MR4GVTD.js.map
|
|
73
|
+
//# sourceMappingURL=chunk-4MR4GVTD.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"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","file":"chunk-4MR4GVTD.js","sourcesContent":["import \"../../styles/tokens.css\";\nimport \"../../styles/shared.css\";\nimport \"./Accordion.css\";\nimport * as React from \"react\";\nimport { Icon } from \"../Icon\";\n\nexport interface AccordionItem {\n key: string;\n title: React.ReactNode;\n content: React.ReactNode;\n disabled?: boolean;\n}\n\nexport interface AccordionProps {\n items: AccordionItem[];\n /** If true, multiple sections can be open at once. */\n multiple?: boolean;\n /**\n * Accordion mode — at most one item open at a time. Takes precedence over `multiple`\n * when both are set.\n */\n accordion?: boolean;\n /**\n * What triggers expansion.\n * - `\"header\"` (default): clicking anywhere on the header toggles.\n * - `\"icon\"`: only the chevron icon is clickable.\n * - `\"disabled\"`: the panel cannot be toggled.\n */\n collapsible?: \"header\" | \"icon\" | \"disabled\";\n activeKeys?: string[];\n defaultActiveKeys?: string[];\n onChange?: (keys: string[]) => void;\n className?: string;\n}\n\n/** `Accordion` — collapsible sections. */\nexport const Accordion: React.FC<AccordionProps> = ({\n items,\n multiple = false,\n accordion = false,\n collapsible = \"header\",\n activeKeys,\n defaultActiveKeys = [],\n onChange,\n className = \"\",\n}) => {\n const [inner, setInner] = React.useState<string[]>(defaultActiveKeys);\n const isControlled = activeKeys !== undefined;\n const keys = isControlled ? activeKeys! : inner;\n\n // accordion takes precedence over multiple\n const singleOpen = accordion || !multiple;\n\n const toggle = (k: string, itemDisabled?: boolean) => {\n if (collapsible === \"disabled\" || itemDisabled) return;\n const next = keys.includes(k)\n ? keys.filter((x) => x !== k)\n : singleOpen\n ? [k]\n : [...keys, k];\n if (!isControlled) setInner(next);\n onChange?.(next);\n };\n\n return (\n <div className={`accordion ${className}`}>\n {items.map((it) => {\n const open = keys.includes(it.key);\n const isDisabled = it.disabled || collapsible === \"disabled\";\n const headerClickable = collapsible === \"header\" && !isDisabled;\n return (\n <div\n key={it.key}\n className={`accordion-item ${open ? \"open\" : \"\"} ${isDisabled ? \"disabled\" : \"\"} ${collapsible === \"icon\" ? \"icon-only\" : \"\"}`}\n >\n <button\n type=\"button\"\n className=\"accordion-head\"\n disabled={isDisabled}\n onClick={() => headerClickable && toggle(it.key, it.disabled)}\n aria-expanded={open}\n >\n <span>{it.title}</span>\n <span\n className={`accordion-chev${collapsible === \"icon\" ? \" clickable\" : \"\"}`}\n onClick={(e) => {\n if (collapsible === \"icon\" && !isDisabled) {\n e.stopPropagation();\n toggle(it.key, it.disabled);\n }\n }}\n >\n <Icon name=\"chevDown\" size={16} />\n </span>\n </button>\n <div className=\"accordion-body\">\n <div className=\"accordion-body-inner\">{it.content}</div>\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n"]}
|
|
@@ -1,13 +1,19 @@
|
|
|
1
1
|
import './tokens-HWQ7KWPG.css';
|
|
2
2
|
import './shared-NJHRNLRH.css';
|
|
3
|
-
import './Card-
|
|
3
|
+
import './Card-RG7ECXL2.css';
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
6
6
|
|
|
7
7
|
// src/components/Card/Card.tsx
|
|
8
8
|
var Card = React.forwardRef(
|
|
9
|
-
({ variant = "raised", padding = "md", className = "", children, ...rest }, ref) => {
|
|
10
|
-
const cls = [
|
|
9
|
+
({ variant = "raised", padding = "md", hoverable, className = "", children, ...rest }, ref) => {
|
|
10
|
+
const cls = [
|
|
11
|
+
"card",
|
|
12
|
+
variant,
|
|
13
|
+
padding !== "md" && `pad-${padding}`,
|
|
14
|
+
hoverable && "hoverable",
|
|
15
|
+
className
|
|
16
|
+
].filter(Boolean).join(" ");
|
|
11
17
|
return /* @__PURE__ */ jsx("div", { ref, className: cls, ...rest, children });
|
|
12
18
|
}
|
|
13
19
|
);
|
|
@@ -31,5 +37,5 @@ var Panel = ({
|
|
|
31
37
|
] });
|
|
32
38
|
|
|
33
39
|
export { Card, Panel };
|
|
34
|
-
//# sourceMappingURL=chunk-
|
|
35
|
-
//# sourceMappingURL=chunk-
|
|
40
|
+
//# sourceMappingURL=chunk-4U4OY5RA.js.map
|
|
41
|
+
//# sourceMappingURL=chunk-4U4OY5RA.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Card/Card.tsx"],"names":[],"mappings":";;;;;;;AAkBO,IAAM,IAAA,GAAa,KAAA,CAAA,UAAA;AAAA,EACxB,CAAC,EAAE,OAAA,GAAU,QAAA,EAAU,OAAA,GAAU,IAAA,EAAM,SAAA,EAAW,SAAA,GAAY,EAAA,EAAI,QAAA,EAAU,GAAG,IAAA,IAAQ,GAAA,KAAQ;AAC7F,IAAA,MAAM,GAAA,GAAM;AAAA,MACV,MAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA,KAAY,IAAA,IAAQ,CAAA,IAAA,EAAO,OAAO,CAAA,CAAA;AAAA,MAClC,SAAA,IAAa,WAAA;AAAA,MACb;AAAA,KACF,CACG,MAAA,CAAO,OAAO,CAAA,CACd,KAAK,GAAG,CAAA;AACX,IAAA,2BACG,KAAA,EAAA,EAAI,GAAA,EAAU,WAAW,GAAA,EAAM,GAAG,MAChC,QAAA,EACH,CAAA;AAAA,EAEJ;AACF;AACA,IAAA,CAAK,WAAA,GAAc,MAAA;AAYZ,IAAM,QAA8B,CAAC;AAAA,EAC1C,KAAA;AAAA,EACA,WAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,GAAG;AACL,CAAA,0BACG,KAAA,EAAA,EAAI,SAAA,EAAW,SAAS,SAAS,CAAA,CAAA,EAAK,GAAG,IAAA,EACtC,QAAA,EAAA;AAAA,EAAA,CAAA,KAAA,IAAS,OAAA,qBACT,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,YAAA,EACb,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,cAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,oBAAS,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,aAAA,EAAe,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,MAC7C,WAAA,oBAAe,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,cAAc,QAAA,EAAA,WAAA,EAAY;AAAA,KAAA,EAC3D,CAAA;AAAA,IACC,OAAA,oBAAW,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iBAAiB,QAAA,EAAA,OAAA,EAAQ;AAAA,GAAA,EACtD,CAAA;AAAA,kBAEF,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,YAAA,EAAc,QAAA,EAAS;AAAA,CAAA,EACxC","file":"chunk-4U4OY5RA.js","sourcesContent":["import \"../../styles/tokens.css\";\nimport \"../../styles/shared.css\";\nimport \"./Card.css\";\nimport * as React from \"react\";\n\nexport interface CardProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Visual variant. `raised` protrudes; `sunken` recesses; `flat` is subtle. */\n variant?: \"raised\" | \"sunken\" | \"flat\";\n /** Inner padding. */\n padding?: \"none\" | \"sm\" | \"md\" | \"lg\";\n /** When true, the card raises and lifts on hover. */\n hoverable?: boolean;\n children?: React.ReactNode;\n}\n\n/**\n * `Card` — neumorphic surface container. Use to group related content.\n */\nexport const Card = React.forwardRef<HTMLDivElement, CardProps>(\n ({ variant = \"raised\", padding = \"md\", hoverable, className = \"\", children, ...rest }, ref) => {\n const cls = [\n \"card\",\n variant,\n padding !== \"md\" && `pad-${padding}`,\n hoverable && \"hoverable\",\n className,\n ]\n .filter(Boolean)\n .join(\" \");\n return (\n <div ref={ref} className={cls} {...rest}>\n {children}\n </div>\n );\n }\n);\nCard.displayName = \"Card\";\n\nexport interface PanelProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"title\"> {\n title?: React.ReactNode;\n description?: React.ReactNode;\n actions?: React.ReactNode;\n children?: React.ReactNode;\n}\n\n/**\n * `Panel` — a titled `Card` with optional actions row.\n */\nexport const Panel: React.FC<PanelProps> = ({\n title,\n description,\n actions,\n children,\n className = \"\",\n ...rest\n}) => (\n <div className={`panel ${className}`} {...rest}>\n {(title || actions) && (\n <div className=\"panel-head\">\n <div className=\"panel-titles\">\n {title && <div className=\"panel-title\">{title}</div>}\n {description && <div className=\"panel-desc\">{description}</div>}\n </div>\n {actions && <div className=\"panel-actions\">{actions}</div>}\n </div>\n )}\n <div className=\"panel-body\">{children}</div>\n </div>\n);\n"]}
|