asterui 0.12.29 → 0.12.31
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/chart.d.ts +2 -0
- package/dist/chart.js +5 -0
- package/dist/chart.js.map +1 -0
- package/dist/{index2.js → components/Affix.js} +1 -1
- package/dist/components/Affix.js.map +1 -0
- package/dist/{index4.js → components/Alert.js} +1 -1
- package/dist/components/Alert.js.map +1 -0
- package/dist/{index3.js → components/Anchor.js} +1 -1
- package/dist/components/Anchor.js.map +1 -0
- package/dist/{index5.js → components/Autocomplete.js} +1 -1
- package/dist/components/Autocomplete.js.map +1 -0
- package/dist/{index6.js → components/Avatar.js} +1 -1
- package/dist/components/Avatar.js.map +1 -0
- package/dist/{index7.js → components/Badge.js} +1 -1
- package/dist/components/Badge.js.map +1 -0
- package/dist/components/Breadcrumb.js +38 -0
- package/dist/components/Breadcrumb.js.map +1 -0
- package/dist/{index53.js → components/Browser.js} +1 -1
- package/dist/components/Browser.js.map +1 -0
- package/dist/{index9.js → components/Button.js} +1 -1
- package/dist/components/Button.js.map +1 -0
- package/dist/{index14.js → components/Card.js} +22 -22
- package/dist/{index14.js.map → components/Card.js.map} +1 -1
- package/dist/{index17.js → components/Carousel.js} +1 -1
- package/dist/components/Carousel.js.map +1 -0
- package/dist/{index15.js → components/Cascader.js} +1 -1
- package/dist/components/Cascader.js.map +1 -0
- package/dist/{index16.js → components/Chart.js} +1 -1
- package/dist/components/Chart.js.map +1 -0
- package/dist/{index12.js → components/Chat.js} +1 -1
- package/dist/{index12.js.map → components/Chat.js.map} +1 -1
- package/dist/{index11.js → components/Checkbox.js} +15 -15
- package/dist/components/Checkbox.js.map +1 -0
- package/dist/{index54.js → components/Code.js} +5 -5
- package/dist/{index54.js.map → components/Code.js.map} +1 -1
- package/dist/{index18.js → components/Collapse.js} +1 -1
- package/dist/components/Collapse.js.map +1 -0
- package/dist/components/ColorPicker.d.ts +8 -2
- package/dist/components/ColorPicker.js +366 -0
- package/dist/components/ColorPicker.js.map +1 -0
- package/dist/{index19.js → components/Container.js} +1 -1
- package/dist/components/Container.js.map +1 -0
- package/dist/{index20.js → components/ContextMenu.js} +9 -9
- package/dist/components/ContextMenu.js.map +1 -0
- package/dist/{index10.js → components/CopyButton.js} +2 -2
- package/dist/components/CopyButton.js.map +1 -0
- package/dist/{index21.js → components/Countdown.js} +1 -1
- package/dist/components/Countdown.js.map +1 -0
- package/dist/{index22.js → components/DatePicker.js} +2 -2
- package/dist/components/DatePicker.js.map +1 -0
- package/dist/{index23.js → components/Descriptions.js} +23 -23
- package/dist/components/Descriptions.js.map +1 -0
- package/dist/{index24.js → components/Diff.js} +1 -1
- package/dist/{index24.js.map → components/Diff.js.map} +1 -1
- package/dist/{index26.js → components/Divider.js} +1 -1
- package/dist/components/Divider.js.map +1 -0
- package/dist/{index25.js → components/Dock.js} +1 -1
- package/dist/{index25.js.map → components/Dock.js.map} +1 -1
- package/dist/{index27.js → components/Drawer.js} +1 -1
- package/dist/components/Drawer.js.map +1 -0
- package/dist/{index40.js → components/Dropdown.js} +31 -31
- package/dist/components/Dropdown.js.map +1 -0
- package/dist/{index41.js → components/Empty.js} +1 -1
- package/dist/components/Empty.js.map +1 -0
- package/dist/{index29.js → components/Fieldset.js} +1 -1
- package/dist/components/Fieldset.js.map +1 -0
- package/dist/{index30.js → components/FileInput.js} +1 -1
- package/dist/components/FileInput.js.map +1 -0
- package/dist/{index31.js → components/Filter.js} +1 -1
- package/dist/components/Filter.js.map +1 -0
- package/dist/{index32.js → components/Flex.js} +1 -1
- package/dist/{index32.js.map → components/Flex.js.map} +1 -1
- package/dist/{index33.js → components/FloatButton.js} +1 -1
- package/dist/components/FloatButton.js.map +1 -0
- package/dist/{index34.js → components/Footer.js} +1 -1
- package/dist/components/Footer.js.map +1 -0
- package/dist/{index35.js → components/Form.js} +1 -1
- package/dist/{index35.js.map → components/Form.js.map} +1 -1
- package/dist/{index36.js → components/Grid.js} +6 -6
- package/dist/{index36.js.map → components/Grid.js.map} +1 -1
- package/dist/{index37.js → components/Hero.js} +1 -1
- package/dist/{index37.js.map → components/Hero.js.map} +1 -1
- package/dist/{index38.js → components/HoverGallery.js} +1 -1
- package/dist/components/HoverGallery.js.map +1 -0
- package/dist/{index39.js → components/Image.js} +1 -1
- package/dist/components/Image.js.map +1 -0
- package/dist/{index42.js → components/Input.js} +1 -1
- package/dist/components/Input.js.map +1 -0
- package/dist/{index43.js → components/InputNumber.js} +1 -1
- package/dist/components/InputNumber.js.map +1 -0
- package/dist/components/Join.js +18 -0
- package/dist/{index44.js.map → components/Join.js.map} +1 -1
- package/dist/{index45.js → components/Kbd.js} +1 -1
- package/dist/components/Kbd.js.map +1 -0
- package/dist/{index46.js → components/Layout.js} +16 -16
- package/dist/components/Layout.js.map +1 -0
- package/dist/{index47.js → components/List.js} +17 -17
- package/dist/{index47.js.map → components/List.js.map} +1 -1
- package/dist/{index48.js → components/Loading.js} +1 -1
- package/dist/components/Loading.js.map +1 -0
- package/dist/{index49.js → components/Mask.js} +1 -1
- package/dist/{index49.js.map → components/Mask.js.map} +1 -1
- package/dist/{index50.js → components/Masonry.js} +19 -19
- package/dist/components/Masonry.js.map +1 -0
- package/dist/{index51.js → components/Mention.js} +1 -1
- package/dist/components/Mention.js.map +1 -0
- package/dist/{index52.js → components/Menu.js} +1 -1
- package/dist/{index52.js.map → components/Menu.js.map} +1 -1
- package/dist/{index57.js → components/Modal.js} +23 -23
- package/dist/components/Modal.js.map +1 -0
- package/dist/{index58.js → components/Navbar.js} +1 -1
- package/dist/components/Navbar.js.map +1 -0
- package/dist/{index59.js → components/Notification.js} +1 -1
- package/dist/components/Notification.js.map +1 -0
- package/dist/{index60.js → components/OTPInput.js} +1 -1
- package/dist/components/OTPInput.js.map +1 -0
- package/dist/{index62.js → components/PageLayout.js} +1 -1
- package/dist/components/PageLayout.js.map +1 -0
- package/dist/{index61.js → components/Pagination.js} +18 -18
- package/dist/components/Pagination.js.map +1 -0
- package/dist/{index55.js → components/Phone.js} +1 -1
- package/dist/components/Phone.js.map +1 -0
- package/dist/{index63.js → components/Popconfirm.js} +14 -14
- package/dist/components/Popconfirm.js.map +1 -0
- package/dist/{index64.js → components/Popover.js} +1 -1
- package/dist/components/Popover.js.map +1 -0
- package/dist/{index65.js → components/Progress.js} +1 -1
- package/dist/components/Progress.js.map +1 -0
- package/dist/{index66.js → components/QRCode.js} +1 -1
- package/dist/components/QRCode.js.map +1 -0
- package/dist/{index68.js → components/RadialProgress.js} +1 -1
- package/dist/components/RadialProgress.js.map +1 -0
- package/dist/{index67.js → components/Radio.js} +13 -13
- package/dist/components/Radio.js.map +1 -0
- package/dist/{index69.js → components/Range.js} +1 -1
- package/dist/components/Range.js.map +1 -0
- package/dist/{index70.js → components/Rating.js} +20 -20
- package/dist/components/Rating.js.map +1 -0
- package/dist/{index98.js → components/Responsive.js} +2 -2
- package/dist/components/Responsive.js.map +1 -0
- package/dist/{index71.js → components/Result.js} +1 -1
- package/dist/components/Result.js.map +1 -0
- package/dist/{index73.js → components/Segmented.js} +1 -1
- package/dist/components/Segmented.js.map +1 -0
- package/dist/{index72.js → components/Select.js} +1 -1
- package/dist/components/Select.js.map +1 -0
- package/dist/{index28.js → components/SidebarDrawer.js} +3 -3
- package/dist/components/SidebarDrawer.js.map +1 -0
- package/dist/{index74.js → components/Skeleton.js} +1 -1
- package/dist/components/Skeleton.js.map +1 -0
- package/dist/components/Space.js +61 -0
- package/dist/components/Space.js.map +1 -0
- package/dist/{index76.js → components/Splitter.js} +22 -22
- package/dist/components/Splitter.js.map +1 -0
- package/dist/{index77.js → components/Stat.js} +1 -1
- package/dist/{index77.js.map → components/Stat.js.map} +1 -1
- package/dist/{index78.js → components/Status.js} +1 -1
- package/dist/components/Status.js.map +1 -0
- package/dist/{index79.js → components/Steps.js} +14 -14
- package/dist/components/Steps.js.map +1 -0
- package/dist/{index80.js → components/Table.js} +92 -92
- package/dist/components/Table.js.map +1 -0
- package/dist/components/Tabs.js +83 -0
- package/dist/{index81.js.map → components/Tabs.js.map} +1 -1
- package/dist/{index84.js → components/Tag.js} +1 -1
- package/dist/components/Tag.js.map +1 -0
- package/dist/{index83.js → components/TextRotate.js} +1 -1
- package/dist/components/TextRotate.js.map +1 -0
- package/dist/{index82.js → components/Textarea.js} +1 -1
- package/dist/components/Textarea.js.map +1 -0
- package/dist/{index85.js → components/ThemeController.js} +1 -1
- package/dist/components/ThemeController.js.map +1 -0
- package/dist/{index86.js → components/TimePicker.js} +2 -2
- package/dist/components/TimePicker.js.map +1 -0
- package/dist/{index87.js → components/Timeline.js} +13 -13
- package/dist/components/Timeline.js.map +1 -0
- package/dist/{index88.js → components/Toggle.js} +1 -1
- package/dist/components/Toggle.js.map +1 -0
- package/dist/{index90.js → components/Tooltip.js} +1 -1
- package/dist/components/Tooltip.js.map +1 -0
- package/dist/{index89.js → components/Tour.js} +1 -1
- package/dist/{index89.js.map → components/Tour.js.map} +1 -1
- package/dist/{index91.js → components/Transfer.js} +1 -1
- package/dist/components/Transfer.js.map +1 -0
- package/dist/{index92.js → components/Tree.js} +1 -1
- package/dist/{index92.js.map → components/Tree.js.map} +1 -1
- package/dist/{index93.js → components/TreeSelect.js} +44 -44
- package/dist/components/TreeSelect.js.map +1 -0
- package/dist/{index94.js → components/Typography.js} +1 -1
- package/dist/components/Typography.js.map +1 -0
- package/dist/{index95.js → components/Upload.js} +1 -1
- package/dist/components/Upload.js.map +1 -0
- package/dist/{index96.js → components/VirtualList.js} +2 -2
- package/dist/components/VirtualList.js.map +1 -0
- package/dist/{index97.js → components/Watermark.js} +1 -1
- package/dist/components/Watermark.js.map +1 -0
- package/dist/{index56.js → components/Window.js} +1 -1
- package/dist/components/Window.js.map +1 -0
- package/dist/{index99.js → hooks/useBreakpoint.js} +1 -1
- package/dist/hooks/useBreakpoint.js.map +1 -0
- package/dist/{index104.js → hooks/useClickOutside.js} +1 -1
- package/dist/hooks/useClickOutside.js.map +1 -0
- package/dist/{index101.js → hooks/useClipboard.js} +1 -1
- package/dist/hooks/useClipboard.js.map +1 -0
- package/dist/{index103.js → hooks/useDebounce.js} +1 -1
- package/dist/hooks/useDebounce.js.map +1 -0
- package/dist/{index100.js → hooks/useDisclosure.js} +1 -1
- package/dist/hooks/useDisclosure.js.map +1 -0
- package/dist/{index106.js → hooks/useHover.js} +1 -1
- package/dist/hooks/useHover.js.map +1 -0
- package/dist/{index107.js → hooks/useKeyPress.js} +1 -1
- package/dist/hooks/useKeyPress.js.map +1 -0
- package/dist/{index102.js → hooks/useLocalStorage.js} +1 -1
- package/dist/hooks/useLocalStorage.js.map +1 -0
- package/dist/{index105.js → hooks/usePrevious.js} +1 -1
- package/dist/hooks/usePrevious.js.map +1 -0
- package/dist/{index108.js → hooks/useWindowSize.js} +1 -1
- package/dist/hooks/useWindowSize.js.map +1 -0
- package/dist/index.d.ts +1 -7
- package/dist/index.js +204 -210
- package/dist/index.js.map +1 -1
- package/dist/qrcode.d.ts +2 -0
- package/dist/qrcode.js +5 -0
- package/dist/qrcode.js.map +1 -0
- package/dist/virtuallist.d.ts +2 -0
- package/dist/virtuallist.js +5 -0
- package/dist/virtuallist.js.map +1 -0
- package/package.json +13 -1
- package/dist/index10.js.map +0 -1
- package/dist/index100.js.map +0 -1
- package/dist/index101.js.map +0 -1
- package/dist/index102.js.map +0 -1
- package/dist/index103.js.map +0 -1
- package/dist/index104.js.map +0 -1
- package/dist/index105.js.map +0 -1
- package/dist/index106.js.map +0 -1
- package/dist/index107.js.map +0 -1
- package/dist/index108.js.map +0 -1
- package/dist/index109.js +0 -36
- package/dist/index109.js.map +0 -1
- package/dist/index11.js.map +0 -1
- package/dist/index110.js +0 -523
- package/dist/index110.js.map +0 -1
- package/dist/index111.js +0 -53
- package/dist/index111.js.map +0 -1
- package/dist/index13.js +0 -268
- package/dist/index13.js.map +0 -1
- package/dist/index15.js.map +0 -1
- package/dist/index16.js.map +0 -1
- package/dist/index17.js.map +0 -1
- package/dist/index18.js.map +0 -1
- package/dist/index19.js.map +0 -1
- package/dist/index2.js.map +0 -1
- package/dist/index20.js.map +0 -1
- package/dist/index21.js.map +0 -1
- package/dist/index22.js.map +0 -1
- package/dist/index23.js.map +0 -1
- package/dist/index26.js.map +0 -1
- package/dist/index27.js.map +0 -1
- package/dist/index28.js.map +0 -1
- package/dist/index29.js.map +0 -1
- package/dist/index3.js.map +0 -1
- package/dist/index30.js.map +0 -1
- package/dist/index31.js.map +0 -1
- package/dist/index33.js.map +0 -1
- package/dist/index34.js.map +0 -1
- package/dist/index38.js.map +0 -1
- package/dist/index39.js.map +0 -1
- package/dist/index4.js.map +0 -1
- package/dist/index40.js.map +0 -1
- package/dist/index41.js.map +0 -1
- package/dist/index42.js.map +0 -1
- package/dist/index43.js.map +0 -1
- package/dist/index44.js +0 -18
- package/dist/index45.js.map +0 -1
- package/dist/index46.js.map +0 -1
- package/dist/index48.js.map +0 -1
- package/dist/index5.js.map +0 -1
- package/dist/index50.js.map +0 -1
- package/dist/index51.js.map +0 -1
- package/dist/index53.js.map +0 -1
- package/dist/index55.js.map +0 -1
- package/dist/index56.js.map +0 -1
- package/dist/index57.js.map +0 -1
- package/dist/index58.js.map +0 -1
- package/dist/index59.js.map +0 -1
- package/dist/index6.js.map +0 -1
- package/dist/index60.js.map +0 -1
- package/dist/index61.js.map +0 -1
- package/dist/index62.js.map +0 -1
- package/dist/index63.js.map +0 -1
- package/dist/index64.js.map +0 -1
- package/dist/index65.js.map +0 -1
- package/dist/index66.js.map +0 -1
- package/dist/index67.js.map +0 -1
- package/dist/index68.js.map +0 -1
- package/dist/index69.js.map +0 -1
- package/dist/index7.js.map +0 -1
- package/dist/index70.js.map +0 -1
- package/dist/index71.js.map +0 -1
- package/dist/index72.js.map +0 -1
- package/dist/index73.js.map +0 -1
- package/dist/index74.js.map +0 -1
- package/dist/index75.js +0 -61
- package/dist/index75.js.map +0 -1
- package/dist/index76.js.map +0 -1
- package/dist/index78.js.map +0 -1
- package/dist/index79.js.map +0 -1
- package/dist/index8.js +0 -38
- package/dist/index8.js.map +0 -1
- package/dist/index80.js.map +0 -1
- package/dist/index81.js +0 -83
- package/dist/index82.js.map +0 -1
- package/dist/index83.js.map +0 -1
- package/dist/index84.js.map +0 -1
- package/dist/index85.js.map +0 -1
- package/dist/index86.js.map +0 -1
- package/dist/index87.js.map +0 -1
- package/dist/index88.js.map +0 -1
- package/dist/index9.js.map +0 -1
- package/dist/index90.js.map +0 -1
- package/dist/index91.js.map +0 -1
- package/dist/index93.js.map +0 -1
- package/dist/index94.js.map +0 -1
- package/dist/index95.js.map +0 -1
- package/dist/index96.js.map +0 -1
- package/dist/index97.js.map +0 -1
- package/dist/index98.js.map +0 -1
- package/dist/index99.js.map +0 -1
|
@@ -0,0 +1,366 @@
|
|
|
1
|
+
import { jsxs as P, jsx as f, Fragment as le } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as fe, useState as g, useRef as U, useEffect as V, useCallback as C } from "react";
|
|
3
|
+
const de = [
|
|
4
|
+
"#000000",
|
|
5
|
+
"#434343",
|
|
6
|
+
"#666666",
|
|
7
|
+
"#999999",
|
|
8
|
+
"#b7b7b7",
|
|
9
|
+
"#cccccc",
|
|
10
|
+
"#d9d9d9",
|
|
11
|
+
"#efefef",
|
|
12
|
+
"#f3f3f3",
|
|
13
|
+
"#ffffff",
|
|
14
|
+
"#980000",
|
|
15
|
+
"#ff0000",
|
|
16
|
+
"#ff9900",
|
|
17
|
+
"#ffff00",
|
|
18
|
+
"#00ff00",
|
|
19
|
+
"#00ffff",
|
|
20
|
+
"#4a86e8",
|
|
21
|
+
"#0000ff",
|
|
22
|
+
"#9900ff",
|
|
23
|
+
"#ff00ff",
|
|
24
|
+
"#e6b8af",
|
|
25
|
+
"#f4cccc",
|
|
26
|
+
"#fce5cd",
|
|
27
|
+
"#fff2cc",
|
|
28
|
+
"#d9ead3",
|
|
29
|
+
"#d0e0e3",
|
|
30
|
+
"#c9daf8",
|
|
31
|
+
"#cfe2f3",
|
|
32
|
+
"#d9d2e9",
|
|
33
|
+
"#ead1dc",
|
|
34
|
+
"#dd7e6b",
|
|
35
|
+
"#ea9999",
|
|
36
|
+
"#f9cb9c",
|
|
37
|
+
"#ffe599",
|
|
38
|
+
"#b6d7a8",
|
|
39
|
+
"#a2c4c9",
|
|
40
|
+
"#a4c2f4",
|
|
41
|
+
"#9fc5e8",
|
|
42
|
+
"#b4a7d6",
|
|
43
|
+
"#d5a6bd",
|
|
44
|
+
"#cc4125",
|
|
45
|
+
"#e06666",
|
|
46
|
+
"#f6b26b",
|
|
47
|
+
"#ffd966",
|
|
48
|
+
"#93c47d",
|
|
49
|
+
"#76a5af",
|
|
50
|
+
"#6d9eeb",
|
|
51
|
+
"#6fa8dc",
|
|
52
|
+
"#8e7cc3",
|
|
53
|
+
"#c27ba0",
|
|
54
|
+
"#a61c00",
|
|
55
|
+
"#cc0000",
|
|
56
|
+
"#e69138",
|
|
57
|
+
"#f1c232",
|
|
58
|
+
"#6aa84f",
|
|
59
|
+
"#45818e",
|
|
60
|
+
"#3c78d8",
|
|
61
|
+
"#3d85c6",
|
|
62
|
+
"#674ea7",
|
|
63
|
+
"#a64d79",
|
|
64
|
+
"#85200c",
|
|
65
|
+
"#990000",
|
|
66
|
+
"#b45f06",
|
|
67
|
+
"#bf9000",
|
|
68
|
+
"#38761d",
|
|
69
|
+
"#134f5c",
|
|
70
|
+
"#1155cc",
|
|
71
|
+
"#0b5394",
|
|
72
|
+
"#351c75",
|
|
73
|
+
"#741b47",
|
|
74
|
+
"#5b0f00",
|
|
75
|
+
"#660000",
|
|
76
|
+
"#783f04",
|
|
77
|
+
"#7f6000",
|
|
78
|
+
"#274e13",
|
|
79
|
+
"#0c343d",
|
|
80
|
+
"#1c4587",
|
|
81
|
+
"#073763",
|
|
82
|
+
"#20124d",
|
|
83
|
+
"#4c1130"
|
|
84
|
+
];
|
|
85
|
+
function ue(a, c, s) {
|
|
86
|
+
c /= 100, s /= 100;
|
|
87
|
+
const i = c * Math.min(s, 1 - s), l = (u) => {
|
|
88
|
+
const t = (u + a / 30) % 12, p = s - i * Math.max(Math.min(t - 3, 9 - t, 1), -1);
|
|
89
|
+
return Math.round(255 * p).toString(16).padStart(2, "0");
|
|
90
|
+
};
|
|
91
|
+
return `#${l(0)}${l(8)}${l(4)}`;
|
|
92
|
+
}
|
|
93
|
+
function $(a) {
|
|
94
|
+
const c = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(a);
|
|
95
|
+
if (!c) return { h: 0, s: 100, l: 50 };
|
|
96
|
+
let s = parseInt(c[1], 16) / 255, i = parseInt(c[2], 16) / 255, l = parseInt(c[3], 16) / 255;
|
|
97
|
+
const u = Math.max(s, i, l), t = Math.min(s, i, l);
|
|
98
|
+
let p = 0, L = 0;
|
|
99
|
+
const H = (u + t) / 2;
|
|
100
|
+
if (u !== t) {
|
|
101
|
+
const w = u - t;
|
|
102
|
+
switch (L = H > 0.5 ? w / (2 - u - t) : w / (u + t), u) {
|
|
103
|
+
case s:
|
|
104
|
+
p = ((i - l) / w + (i < l ? 6 : 0)) / 6;
|
|
105
|
+
break;
|
|
106
|
+
case i:
|
|
107
|
+
p = ((l - s) / w + 2) / 6;
|
|
108
|
+
break;
|
|
109
|
+
case l:
|
|
110
|
+
p = ((s - i) / w + 4) / 6;
|
|
111
|
+
break;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
return { h: Math.round(p * 360), s: Math.round(L * 100), l: Math.round(H * 100) };
|
|
115
|
+
}
|
|
116
|
+
function z(a) {
|
|
117
|
+
return /^#[0-9A-Fa-f]{6}$/.test(a);
|
|
118
|
+
}
|
|
119
|
+
function N(a) {
|
|
120
|
+
let c = a.trim();
|
|
121
|
+
return c.startsWith("#") || (c = "#" + c), c.toLowerCase();
|
|
122
|
+
}
|
|
123
|
+
const he = fe(({
|
|
124
|
+
value: a,
|
|
125
|
+
defaultValue: c = "#000000",
|
|
126
|
+
onChange: s,
|
|
127
|
+
mode: i = "both",
|
|
128
|
+
presets: l = de,
|
|
129
|
+
size: u = "md",
|
|
130
|
+
disabled: t = !1,
|
|
131
|
+
showText: p = !1,
|
|
132
|
+
allowClear: L = !1,
|
|
133
|
+
open: H,
|
|
134
|
+
onOpenChange: w,
|
|
135
|
+
className: Y,
|
|
136
|
+
"data-testid": O,
|
|
137
|
+
...W
|
|
138
|
+
}, _) => {
|
|
139
|
+
const q = a !== void 0 ? a : c, [G, y] = g(q), b = a !== void 0 ? a : G, [r, x] = g(() => $(b)), [v, M] = g(b), h = O || "colorpicker", [I, F] = g(!1), [B, X] = g(!1), R = U(null), j = U(null);
|
|
140
|
+
V(() => {
|
|
141
|
+
a !== void 0 && z(a) && (x($(a)), M(a));
|
|
142
|
+
}, [a]);
|
|
143
|
+
const [T, D] = g(null), m = C((e) => {
|
|
144
|
+
x(e);
|
|
145
|
+
const n = ue(e.h, e.s, e.l);
|
|
146
|
+
M(n), a === void 0 && y(n), s?.(n);
|
|
147
|
+
}, [s, a]), K = C((e, n) => {
|
|
148
|
+
if (t) return;
|
|
149
|
+
const o = e.shiftKey ? 10 : 1;
|
|
150
|
+
if (n === "sl") {
|
|
151
|
+
let d = r.s, k = r.l;
|
|
152
|
+
switch (e.key) {
|
|
153
|
+
case "ArrowLeft":
|
|
154
|
+
e.preventDefault(), d = Math.max(0, r.s - o);
|
|
155
|
+
break;
|
|
156
|
+
case "ArrowRight":
|
|
157
|
+
e.preventDefault(), d = Math.min(100, r.s + o);
|
|
158
|
+
break;
|
|
159
|
+
case "ArrowUp":
|
|
160
|
+
e.preventDefault(), k = Math.min(100, r.l + o);
|
|
161
|
+
break;
|
|
162
|
+
case "ArrowDown":
|
|
163
|
+
e.preventDefault(), k = Math.max(0, r.l - o);
|
|
164
|
+
break;
|
|
165
|
+
default:
|
|
166
|
+
return;
|
|
167
|
+
}
|
|
168
|
+
m({ ...r, s: d, l: k });
|
|
169
|
+
} else if (n === "hue") {
|
|
170
|
+
let d = r.h;
|
|
171
|
+
switch (e.key) {
|
|
172
|
+
case "ArrowLeft":
|
|
173
|
+
e.preventDefault(), d = (r.h - o + 360) % 360;
|
|
174
|
+
break;
|
|
175
|
+
case "ArrowRight":
|
|
176
|
+
e.preventDefault(), d = (r.h + o) % 360;
|
|
177
|
+
break;
|
|
178
|
+
default:
|
|
179
|
+
return;
|
|
180
|
+
}
|
|
181
|
+
m({ ...r, h: d });
|
|
182
|
+
}
|
|
183
|
+
}, [t, r, m]), A = C((e, n) => {
|
|
184
|
+
if (!R.current || t) return;
|
|
185
|
+
const o = R.current.getBoundingClientRect(), d = Math.max(0, Math.min(1, (e - o.left) / o.width)), k = Math.max(0, Math.min(1, (n - o.top) / o.height)), ce = Math.round(d * 100), ie = Math.round((1 - k) * 100);
|
|
186
|
+
m({ ...r, s: ce, l: ie });
|
|
187
|
+
}, [r, m, t]), J = (e) => {
|
|
188
|
+
t || (F(!0), A(e.clientX, e.clientY));
|
|
189
|
+
}, E = C((e) => {
|
|
190
|
+
if (!j.current || t) return;
|
|
191
|
+
const n = j.current.getBoundingClientRect(), o = Math.max(0, Math.min(1, (e - n.left) / n.width)), d = Math.round(o * 360);
|
|
192
|
+
m({ ...r, h: d });
|
|
193
|
+
}, [r, m, t]), Q = (e) => {
|
|
194
|
+
t || (X(!0), E(e.clientX));
|
|
195
|
+
};
|
|
196
|
+
V(() => {
|
|
197
|
+
const e = (o) => {
|
|
198
|
+
I ? A(o.clientX, o.clientY) : B && E(o.clientX);
|
|
199
|
+
}, n = () => {
|
|
200
|
+
F(!1), X(!1);
|
|
201
|
+
};
|
|
202
|
+
if (I || B)
|
|
203
|
+
return document.addEventListener("mousemove", e), document.addEventListener("mouseup", n), () => {
|
|
204
|
+
document.removeEventListener("mousemove", e), document.removeEventListener("mouseup", n);
|
|
205
|
+
};
|
|
206
|
+
}, [I, B, A, E]);
|
|
207
|
+
const Z = (e) => {
|
|
208
|
+
const n = e.target.value;
|
|
209
|
+
M(n);
|
|
210
|
+
const o = N(n);
|
|
211
|
+
z(o) && (x($(o)), a === void 0 && y(o), s?.(o));
|
|
212
|
+
}, ee = (e) => {
|
|
213
|
+
if (t) return;
|
|
214
|
+
const n = N(e);
|
|
215
|
+
x($(n)), M(n), a === void 0 && y(n), s?.(n);
|
|
216
|
+
}, te = C(() => {
|
|
217
|
+
if (t) return;
|
|
218
|
+
const e = c;
|
|
219
|
+
x($(e)), M(e), a === void 0 && y(e), s?.(e);
|
|
220
|
+
}, [t, c, a, s]), S = {
|
|
221
|
+
xs: { panel: "w-32 h-32", hue: "h-3", swatch: "w-4 h-4", input: "input-xs" },
|
|
222
|
+
sm: { panel: "w-40 h-40", hue: "h-4", swatch: "w-5 h-5", input: "input-sm" },
|
|
223
|
+
md: { panel: "w-48 h-48", hue: "h-5", swatch: "w-6 h-6", input: "input-md" },
|
|
224
|
+
lg: { panel: "w-56 h-56", hue: "h-6", swatch: "w-7 h-7", input: "input-lg" }
|
|
225
|
+
}[u], ne = i === "picker" || i === "both", re = i === "swatches" || i === "both", ae = r.s / 100, oe = 1 - r.l / 100, se = r.h / 360;
|
|
226
|
+
return /* @__PURE__ */ P(
|
|
227
|
+
"div",
|
|
228
|
+
{
|
|
229
|
+
ref: _,
|
|
230
|
+
className: ["inline-flex flex-col gap-3", t ? "opacity-50 pointer-events-none" : "", Y].filter(Boolean).join(" "),
|
|
231
|
+
"data-testid": h,
|
|
232
|
+
...W,
|
|
233
|
+
children: [
|
|
234
|
+
ne && /* @__PURE__ */ P(le, { children: [
|
|
235
|
+
/* @__PURE__ */ f(
|
|
236
|
+
"div",
|
|
237
|
+
{
|
|
238
|
+
ref: R,
|
|
239
|
+
className: [S.panel, "relative rounded cursor-crosshair select-none", T === "sl" ? "ring-2 ring-primary" : ""].filter(Boolean).join(" "),
|
|
240
|
+
style: {
|
|
241
|
+
background: `
|
|
242
|
+
linear-gradient(to top, #000, transparent),
|
|
243
|
+
linear-gradient(to right, #fff, hsl(${r.h}, 100%, 50%))
|
|
244
|
+
`
|
|
245
|
+
},
|
|
246
|
+
onMouseDown: J,
|
|
247
|
+
onKeyDown: (e) => K(e, "sl"),
|
|
248
|
+
onFocus: () => D("sl"),
|
|
249
|
+
onBlur: () => D(null),
|
|
250
|
+
tabIndex: t ? -1 : 0,
|
|
251
|
+
role: "slider",
|
|
252
|
+
"aria-label": "Color saturation and lightness",
|
|
253
|
+
"aria-valuetext": `Saturation ${r.s}%, Lightness ${r.l}%`,
|
|
254
|
+
"data-testid": `${h}-sl-panel`,
|
|
255
|
+
children: /* @__PURE__ */ f(
|
|
256
|
+
"div",
|
|
257
|
+
{
|
|
258
|
+
className: "absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none",
|
|
259
|
+
style: {
|
|
260
|
+
left: `calc(${ae * 100}% - 8px)`,
|
|
261
|
+
top: `calc(${oe * 100}% - 8px)`,
|
|
262
|
+
boxShadow: "0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)"
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
)
|
|
266
|
+
}
|
|
267
|
+
),
|
|
268
|
+
/* @__PURE__ */ f(
|
|
269
|
+
"div",
|
|
270
|
+
{
|
|
271
|
+
ref: j,
|
|
272
|
+
className: [S.hue, "w-full relative rounded cursor-pointer select-none", T === "hue" ? "ring-2 ring-primary" : ""].filter(Boolean).join(" "),
|
|
273
|
+
style: {
|
|
274
|
+
background: "linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)"
|
|
275
|
+
},
|
|
276
|
+
onMouseDown: Q,
|
|
277
|
+
onKeyDown: (e) => K(e, "hue"),
|
|
278
|
+
onFocus: () => D("hue"),
|
|
279
|
+
onBlur: () => D(null),
|
|
280
|
+
tabIndex: t ? -1 : 0,
|
|
281
|
+
role: "slider",
|
|
282
|
+
"aria-label": "Color hue",
|
|
283
|
+
"aria-valuemin": 0,
|
|
284
|
+
"aria-valuemax": 360,
|
|
285
|
+
"aria-valuenow": r.h,
|
|
286
|
+
"aria-valuetext": `Hue ${r.h} degrees`,
|
|
287
|
+
"data-testid": `${h}-hue-slider`,
|
|
288
|
+
children: /* @__PURE__ */ f(
|
|
289
|
+
"div",
|
|
290
|
+
{
|
|
291
|
+
className: "absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none",
|
|
292
|
+
style: {
|
|
293
|
+
left: `calc(${se * 100}% - 6px)`,
|
|
294
|
+
transform: "translateY(-50%)",
|
|
295
|
+
boxShadow: "0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)"
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
)
|
|
299
|
+
}
|
|
300
|
+
),
|
|
301
|
+
/* @__PURE__ */ P("div", { className: "flex items-center gap-2", children: [
|
|
302
|
+
/* @__PURE__ */ f(
|
|
303
|
+
"div",
|
|
304
|
+
{
|
|
305
|
+
className: "w-8 h-8 rounded border border-base-300 flex-shrink-0",
|
|
306
|
+
style: { backgroundColor: z(N(v)) ? N(v) : b },
|
|
307
|
+
"data-testid": `${h}-preview`,
|
|
308
|
+
"aria-label": `Color preview: ${v}`
|
|
309
|
+
}
|
|
310
|
+
),
|
|
311
|
+
/* @__PURE__ */ f(
|
|
312
|
+
"input",
|
|
313
|
+
{
|
|
314
|
+
type: "text",
|
|
315
|
+
value: v,
|
|
316
|
+
onChange: Z,
|
|
317
|
+
className: ["input", S.input, "w-full font-mono uppercase"].join(" "),
|
|
318
|
+
placeholder: "#000000",
|
|
319
|
+
maxLength: 7,
|
|
320
|
+
disabled: t,
|
|
321
|
+
"aria-label": "Hex color value",
|
|
322
|
+
"data-testid": `${h}-input`
|
|
323
|
+
}
|
|
324
|
+
),
|
|
325
|
+
L && !t && /* @__PURE__ */ f(
|
|
326
|
+
"button",
|
|
327
|
+
{
|
|
328
|
+
type: "button",
|
|
329
|
+
onClick: te,
|
|
330
|
+
className: "btn btn-ghost btn-xs btn-circle",
|
|
331
|
+
"aria-label": "Clear color",
|
|
332
|
+
"data-testid": `${h}-clear`,
|
|
333
|
+
children: /* @__PURE__ */ f("svg", { className: "w-3 h-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ f("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
|
|
334
|
+
}
|
|
335
|
+
)
|
|
336
|
+
] }),
|
|
337
|
+
p && /* @__PURE__ */ f("div", { className: "text-sm font-mono text-base-content/70", "data-testid": `${h}-text`, children: v.toUpperCase() })
|
|
338
|
+
] }),
|
|
339
|
+
re && /* @__PURE__ */ f("div", { className: "grid grid-cols-10 gap-1", role: "listbox", "aria-label": "Color presets", "data-testid": `${h}-swatches`, children: l.map((e, n) => /* @__PURE__ */ f(
|
|
340
|
+
"button",
|
|
341
|
+
{
|
|
342
|
+
type: "button",
|
|
343
|
+
role: "option",
|
|
344
|
+
"aria-selected": b.toLowerCase() === e.toLowerCase(),
|
|
345
|
+
className: [
|
|
346
|
+
S.swatch,
|
|
347
|
+
"rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform",
|
|
348
|
+
b.toLowerCase() === e.toLowerCase() ? "ring-2 ring-primary ring-offset-1" : ""
|
|
349
|
+
].filter(Boolean).join(" "),
|
|
350
|
+
style: { backgroundColor: e },
|
|
351
|
+
onClick: () => ee(e),
|
|
352
|
+
disabled: t,
|
|
353
|
+
"aria-label": `Select color ${e}`,
|
|
354
|
+
"data-testid": `${h}-swatch-${n}`
|
|
355
|
+
},
|
|
356
|
+
`${e}-${n}`
|
|
357
|
+
)) })
|
|
358
|
+
]
|
|
359
|
+
}
|
|
360
|
+
);
|
|
361
|
+
});
|
|
362
|
+
he.displayName = "ColorPicker";
|
|
363
|
+
export {
|
|
364
|
+
he as ColorPicker
|
|
365
|
+
};
|
|
366
|
+
//# sourceMappingURL=ColorPicker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ColorPicker.js","sources":["../../src/components/ColorPicker.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback, forwardRef } from 'react'\n\nexport interface ColorPickerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue'> {\n value?: string\n defaultValue?: string\n onChange?: (color: string) => void\n mode?: 'swatches' | 'picker' | 'both'\n presets?: string[]\n size?: 'xs' | 'sm' | 'md' | 'lg'\n disabled?: boolean\n showText?: boolean\n allowClear?: boolean\n open?: boolean\n onOpenChange?: (open: boolean) => void\n 'data-testid'?: string\n}\n\nconst DEFAULT_PRESETS = [\n '#000000', '#434343', '#666666', '#999999', '#b7b7b7', '#cccccc', '#d9d9d9', '#efefef', '#f3f3f3', '#ffffff',\n '#980000', '#ff0000', '#ff9900', '#ffff00', '#00ff00', '#00ffff', '#4a86e8', '#0000ff', '#9900ff', '#ff00ff',\n '#e6b8af', '#f4cccc', '#fce5cd', '#fff2cc', '#d9ead3', '#d0e0e3', '#c9daf8', '#cfe2f3', '#d9d2e9', '#ead1dc',\n '#dd7e6b', '#ea9999', '#f9cb9c', '#ffe599', '#b6d7a8', '#a2c4c9', '#a4c2f4', '#9fc5e8', '#b4a7d6', '#d5a6bd',\n '#cc4125', '#e06666', '#f6b26b', '#ffd966', '#93c47d', '#76a5af', '#6d9eeb', '#6fa8dc', '#8e7cc3', '#c27ba0',\n '#a61c00', '#cc0000', '#e69138', '#f1c232', '#6aa84f', '#45818e', '#3c78d8', '#3d85c6', '#674ea7', '#a64d79',\n '#85200c', '#990000', '#b45f06', '#bf9000', '#38761d', '#134f5c', '#1155cc', '#0b5394', '#351c75', '#741b47',\n '#5b0f00', '#660000', '#783f04', '#7f6000', '#274e13', '#0c343d', '#1c4587', '#073763', '#20124d', '#4c1130',\n]\n\n// Convert HSL to Hex\nfunction hslToHex(h: number, s: number, l: number): string {\n s /= 100\n l /= 100\n const a = s * Math.min(l, 1 - l)\n const f = (n: number) => {\n const k = (n + h / 30) % 12\n const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1)\n return Math.round(255 * color).toString(16).padStart(2, '0')\n }\n return `#${f(0)}${f(8)}${f(4)}`\n}\n\n// Convert Hex to HSL\nfunction hexToHsl(hex: string): { h: number; s: number; l: number } {\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n if (!result) return { h: 0, s: 100, l: 50 }\n\n let r = parseInt(result[1], 16) / 255\n let g = parseInt(result[2], 16) / 255\n let b = parseInt(result[3], 16) / 255\n\n const max = Math.max(r, g, b)\n const min = Math.min(r, g, b)\n let h = 0\n let s = 0\n const l = (max + min) / 2\n\n if (max !== min) {\n const d = max - min\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min)\n switch (max) {\n case r:\n h = ((g - b) / d + (g < b ? 6 : 0)) / 6\n break\n case g:\n h = ((b - r) / d + 2) / 6\n break\n case b:\n h = ((r - g) / d + 4) / 6\n break\n }\n }\n\n return { h: Math.round(h * 360), s: Math.round(s * 100), l: Math.round(l * 100) }\n}\n\n// Validate hex color\nfunction isValidHex(hex: string): boolean {\n return /^#[0-9A-Fa-f]{6}$/.test(hex)\n}\n\n// Normalize hex (add # if missing, uppercase)\nfunction normalizeHex(hex: string): string {\n let normalized = hex.trim()\n if (!normalized.startsWith('#')) {\n normalized = '#' + normalized\n }\n return normalized.toLowerCase()\n}\n\nexport const ColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(({\n value,\n defaultValue = '#000000',\n onChange,\n mode = 'both',\n presets = DEFAULT_PRESETS,\n size = 'md',\n disabled = false,\n showText = false,\n allowClear = false,\n open: controlledOpen,\n onOpenChange,\n className,\n 'data-testid': testId,\n ...rest\n}, ref) => {\n const initialValue = value !== undefined ? value : defaultValue\n const [internalValue, setInternalValue] = useState(initialValue)\n const currentValue = value !== undefined ? value : internalValue\n\n const [hsl, setHsl] = useState(() => hexToHsl(currentValue))\n const [hexInput, setHexInput] = useState(currentValue)\n const baseTestId = testId || 'colorpicker'\n const [isDraggingSL, setIsDraggingSL] = useState(false)\n const [isDraggingHue, setIsDraggingHue] = useState(false)\n const slPanelRef = useRef<HTMLDivElement>(null)\n const hueSliderRef = useRef<HTMLDivElement>(null)\n\n // Sync internal state when value prop changes\n useEffect(() => {\n if (value !== undefined && isValidHex(value)) {\n setHsl(hexToHsl(value))\n setHexInput(value)\n }\n }, [value])\n\n // Keyboard navigation state\n const [focusedPanel, setFocusedPanel] = useState<'sl' | 'hue' | null>(null)\n\n const updateColor = useCallback((newHsl: { h: number; s: number; l: number }) => {\n setHsl(newHsl)\n const hex = hslToHex(newHsl.h, newHsl.s, newHsl.l)\n setHexInput(hex)\n if (value === undefined) {\n setInternalValue(hex)\n }\n onChange?.(hex)\n }, [onChange, value])\n\n // Keyboard navigation for panels\n const handleKeyDown = useCallback((e: React.KeyboardEvent, panel: 'sl' | 'hue') => {\n if (disabled) return\n const step = e.shiftKey ? 10 : 1\n\n if (panel === 'sl') {\n let newS = hsl.s\n let newL = hsl.l\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault()\n newS = Math.max(0, hsl.s - step)\n break\n case 'ArrowRight':\n e.preventDefault()\n newS = Math.min(100, hsl.s + step)\n break\n case 'ArrowUp':\n e.preventDefault()\n newL = Math.min(100, hsl.l + step)\n break\n case 'ArrowDown':\n e.preventDefault()\n newL = Math.max(0, hsl.l - step)\n break\n default:\n return\n }\n updateColor({ ...hsl, s: newS, l: newL })\n } else if (panel === 'hue') {\n let newH = hsl.h\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault()\n newH = (hsl.h - step + 360) % 360\n break\n case 'ArrowRight':\n e.preventDefault()\n newH = (hsl.h + step) % 360\n break\n default:\n return\n }\n updateColor({ ...hsl, h: newH })\n }\n }, [disabled, hsl, updateColor])\n\n // Saturation/Lightness panel handlers\n const handleSLChange = useCallback((clientX: number, clientY: number) => {\n if (!slPanelRef.current || disabled) return\n const rect = slPanelRef.current.getBoundingClientRect()\n const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n const y = Math.max(0, Math.min(1, (clientY - rect.top) / rect.height))\n\n // Convert x,y to saturation and lightness\n // x = saturation (0-100), y = lightness (100-0)\n const s = Math.round(x * 100)\n const l = Math.round((1 - y) * 100)\n updateColor({ ...hsl, s, l })\n }, [hsl, updateColor, disabled])\n\n const handleSLMouseDown = (e: React.MouseEvent) => {\n if (disabled) return\n setIsDraggingSL(true)\n handleSLChange(e.clientX, e.clientY)\n }\n\n // Hue slider handlers\n const handleHueChange = useCallback((clientX: number) => {\n if (!hueSliderRef.current || disabled) return\n const rect = hueSliderRef.current.getBoundingClientRect()\n const x = Math.max(0, Math.min(1, (clientX - rect.left) / rect.width))\n const h = Math.round(x * 360)\n updateColor({ ...hsl, h })\n }, [hsl, updateColor, disabled])\n\n const handleHueMouseDown = (e: React.MouseEvent) => {\n if (disabled) return\n setIsDraggingHue(true)\n handleHueChange(e.clientX)\n }\n\n // Global mouse handlers for dragging\n useEffect(() => {\n const handleMouseMove = (e: MouseEvent) => {\n if (isDraggingSL) {\n handleSLChange(e.clientX, e.clientY)\n } else if (isDraggingHue) {\n handleHueChange(e.clientX)\n }\n }\n\n const handleMouseUp = () => {\n setIsDraggingSL(false)\n setIsDraggingHue(false)\n }\n\n if (isDraggingSL || isDraggingHue) {\n document.addEventListener('mousemove', handleMouseMove)\n document.addEventListener('mouseup', handleMouseUp)\n return () => {\n document.removeEventListener('mousemove', handleMouseMove)\n document.removeEventListener('mouseup', handleMouseUp)\n }\n }\n }, [isDraggingSL, isDraggingHue, handleSLChange, handleHueChange])\n\n // Hex input handler\n const handleHexChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value\n setHexInput(newValue)\n const normalized = normalizeHex(newValue)\n if (isValidHex(normalized)) {\n setHsl(hexToHsl(normalized))\n if (value === undefined) {\n setInternalValue(normalized)\n }\n onChange?.(normalized)\n }\n }\n\n // Preset click handler\n const handlePresetClick = (color: string) => {\n if (disabled) return\n const normalized = normalizeHex(color)\n setHsl(hexToHsl(normalized))\n setHexInput(normalized)\n if (value === undefined) {\n setInternalValue(normalized)\n }\n onChange?.(normalized)\n }\n\n // Clear handler\n const handleClear = useCallback(() => {\n if (disabled) return\n const cleared = defaultValue\n setHsl(hexToHsl(cleared))\n setHexInput(cleared)\n if (value === undefined) {\n setInternalValue(cleared)\n }\n onChange?.(cleared)\n }, [disabled, defaultValue, value, onChange])\n\n // Size configurations\n const sizeConfig = {\n xs: { panel: 'w-32 h-32', hue: 'h-3', swatch: 'w-4 h-4', input: 'input-xs' },\n sm: { panel: 'w-40 h-40', hue: 'h-4', swatch: 'w-5 h-5', input: 'input-sm' },\n md: { panel: 'w-48 h-48', hue: 'h-5', swatch: 'w-6 h-6', input: 'input-md' },\n lg: { panel: 'w-56 h-56', hue: 'h-6', swatch: 'w-7 h-7', input: 'input-lg' },\n }\n\n const config = sizeConfig[size]\n const showPicker = mode === 'picker' || mode === 'both'\n const showSwatches = mode === 'swatches' || mode === 'both'\n\n // Calculate picker position\n const slX = hsl.s / 100\n const slY = 1 - hsl.l / 100\n const hueX = hsl.h / 360\n\n return (\n <div\n ref={ref}\n className={['inline-flex flex-col gap-3', disabled ? 'opacity-50 pointer-events-none' : '', className].filter(Boolean).join(' ')}\n data-testid={baseTestId}\n {...rest}\n >\n {showPicker && (\n <>\n {/* Saturation/Lightness Panel */}\n <div\n ref={slPanelRef}\n className={[config.panel, 'relative rounded cursor-crosshair select-none', focusedPanel === 'sl' ? 'ring-2 ring-primary' : ''].filter(Boolean).join(' ')}\n style={{\n background: `\n linear-gradient(to top, #000, transparent),\n linear-gradient(to right, #fff, hsl(${hsl.h}, 100%, 50%))\n `,\n }}\n onMouseDown={handleSLMouseDown}\n onKeyDown={(e) => handleKeyDown(e, 'sl')}\n onFocus={() => setFocusedPanel('sl')}\n onBlur={() => setFocusedPanel(null)}\n tabIndex={disabled ? -1 : 0}\n role=\"slider\"\n aria-label=\"Color saturation and lightness\"\n aria-valuetext={`Saturation ${hsl.s}%, Lightness ${hsl.l}%`}\n data-testid={`${baseTestId}-sl-panel`}\n >\n {/* Picker indicator */}\n <div\n className=\"absolute w-4 h-4 border-2 border-white rounded-full shadow-md pointer-events-none\"\n style={{\n left: `calc(${slX * 100}% - 8px)`,\n top: `calc(${slY * 100}% - 8px)`,\n boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n }}\n />\n </div>\n\n {/* Hue Slider */}\n <div\n ref={hueSliderRef}\n className={[config.hue, 'w-full relative rounded cursor-pointer select-none', focusedPanel === 'hue' ? 'ring-2 ring-primary' : ''].filter(Boolean).join(' ')}\n style={{\n background: 'linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00)',\n }}\n onMouseDown={handleHueMouseDown}\n onKeyDown={(e) => handleKeyDown(e, 'hue')}\n onFocus={() => setFocusedPanel('hue')}\n onBlur={() => setFocusedPanel(null)}\n tabIndex={disabled ? -1 : 0}\n role=\"slider\"\n aria-label=\"Color hue\"\n aria-valuemin={0}\n aria-valuemax={360}\n aria-valuenow={hsl.h}\n aria-valuetext={`Hue ${hsl.h} degrees`}\n data-testid={`${baseTestId}-hue-slider`}\n >\n {/* Hue indicator */}\n <div\n className=\"absolute top-1/2 w-3 h-full border-2 border-white rounded-sm shadow-md pointer-events-none\"\n style={{\n left: `calc(${hueX * 100}% - 6px)`,\n transform: 'translateY(-50%)',\n boxShadow: '0 0 0 1px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.3)',\n }}\n />\n </div>\n\n {/* Hex Input and Preview */}\n <div className=\"flex items-center gap-2\">\n <div\n className=\"w-8 h-8 rounded border border-base-300 flex-shrink-0\"\n style={{ backgroundColor: isValidHex(normalizeHex(hexInput)) ? normalizeHex(hexInput) : currentValue }}\n data-testid={`${baseTestId}-preview`}\n aria-label={`Color preview: ${hexInput}`}\n />\n <input\n type=\"text\"\n value={hexInput}\n onChange={handleHexChange}\n className={['input', config.input, 'w-full font-mono uppercase'].join(' ')}\n placeholder=\"#000000\"\n maxLength={7}\n disabled={disabled}\n aria-label=\"Hex color value\"\n data-testid={`${baseTestId}-input`}\n />\n {allowClear && !disabled && (\n <button\n type=\"button\"\n onClick={handleClear}\n className=\"btn btn-ghost btn-xs btn-circle\"\n aria-label=\"Clear color\"\n data-testid={`${baseTestId}-clear`}\n >\n <svg className=\"w-3 h-3\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n )}\n </div>\n\n {/* Show text display */}\n {showText && (\n <div className=\"text-sm font-mono text-base-content/70\" data-testid={`${baseTestId}-text`}>\n {hexInput.toUpperCase()}\n </div>\n )}\n </>\n )}\n\n {showSwatches && (\n <div className=\"grid grid-cols-10 gap-1\" role=\"listbox\" aria-label=\"Color presets\" data-testid={`${baseTestId}-swatches`}>\n {presets.map((color, index) => (\n <button\n key={`${color}-${index}`}\n type=\"button\"\n role=\"option\"\n aria-selected={currentValue.toLowerCase() === color.toLowerCase()}\n className={[\n config.swatch,\n 'rounded border border-base-300 cursor-pointer hover:scale-110 transition-transform',\n currentValue.toLowerCase() === color.toLowerCase() ? 'ring-2 ring-primary ring-offset-1' : ''\n ].filter(Boolean).join(' ')}\n style={{ backgroundColor: color }}\n onClick={() => handlePresetClick(color)}\n disabled={disabled}\n aria-label={`Select color ${color}`}\n data-testid={`${baseTestId}-swatch-${index}`}\n />\n ))}\n </div>\n )}\n </div>\n )\n})\n\nColorPicker.displayName = 'ColorPicker'\n"],"names":["DEFAULT_PRESETS","hslToHex","h","s","l","a","f","n","k","color","hexToHsl","hex","result","r","g","b","max","min","d","isValidHex","normalizeHex","normalized","ColorPicker","forwardRef","value","defaultValue","onChange","mode","presets","size","disabled","showText","allowClear","controlledOpen","onOpenChange","className","testId","rest","ref","initialValue","internalValue","setInternalValue","useState","currentValue","hsl","setHsl","hexInput","setHexInput","baseTestId","isDraggingSL","setIsDraggingSL","isDraggingHue","setIsDraggingHue","slPanelRef","useRef","hueSliderRef","useEffect","focusedPanel","setFocusedPanel","updateColor","useCallback","newHsl","handleKeyDown","panel","step","newS","newL","newH","handleSLChange","clientX","clientY","rect","x","y","handleSLMouseDown","handleHueChange","handleHueMouseDown","handleMouseMove","e","handleMouseUp","handleHexChange","newValue","handlePresetClick","handleClear","cleared","config","showPicker","showSwatches","slX","slY","hueX","jsxs","Fragment","jsx","index"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Container.js","sources":["../../src/components/Container.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Container content */\n children: React.ReactNode\n /** Max width size */\n size?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full'\n /** Center container horizontally */\n centered?: boolean\n /** Add horizontal padding */\n padding?: boolean\n}\n\nconst sizeClasses: Record<string, string> = {\n sm: 'max-w-screen-sm',\n md: 'max-w-screen-md',\n lg: 'max-w-screen-lg',\n xl: 'max-w-screen-xl',\n '2xl': 'max-w-screen-2xl',\n full: 'max-w-full',\n}\n\nexport const Container: React.FC<ContainerProps> = ({\n children,\n size = 'xl',\n centered = true,\n padding = true,\n className = '',\n ...rest\n}) => {\n const classes = [\n sizeClasses[size],\n centered && 'mx-auto',\n padding && 'px-4 sm:px-6 lg:px-8',\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n return <div className={classes} {...rest}>{children}</div>\n}\n"],"names":["sizeClasses","Container","children","size","centered","padding","className","rest","classes"],"mappings":";AAaA,MAAMA,IAAsC;AAAA,EAC1C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,MAAM;AACR,GAEaC,IAAsC,CAAC;AAAA,EAClD,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAU;AAAA,IACdR,EAAYG,CAAI;AAAA,IAChBC,KAAY;AAAA,IACZC,KAAW;AAAA,IACXC;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,2BAAQ,OAAA,EAAI,WAAWE,GAAU,GAAGD,GAAO,UAAAL,GAAS;AACtD;"}
|
|
@@ -6,7 +6,7 @@ const E = W(null), I = () => {
|
|
|
6
6
|
if (!e)
|
|
7
7
|
throw new Error("ContextMenu compound components must be used within a ContextMenu");
|
|
8
8
|
return e;
|
|
9
|
-
},
|
|
9
|
+
}, A = ({
|
|
10
10
|
itemKey: e,
|
|
11
11
|
children: u,
|
|
12
12
|
icon: l,
|
|
@@ -33,7 +33,7 @@ const E = W(null), I = () => {
|
|
|
33
33
|
]
|
|
34
34
|
}
|
|
35
35
|
) });
|
|
36
|
-
},
|
|
36
|
+
}, H = ({ className: e = "" }) => /* @__PURE__ */ n("li", { className: `divider my-1 ${e}` }), K = ({
|
|
37
37
|
itemKey: e,
|
|
38
38
|
label: u,
|
|
39
39
|
icon: l,
|
|
@@ -127,7 +127,7 @@ const E = W(null), I = () => {
|
|
|
127
127
|
]
|
|
128
128
|
}
|
|
129
129
|
);
|
|
130
|
-
},
|
|
130
|
+
}, O = ({
|
|
131
131
|
children: e,
|
|
132
132
|
items: u,
|
|
133
133
|
onSelect: l,
|
|
@@ -188,12 +188,12 @@ const E = W(null), I = () => {
|
|
|
188
188
|
document.body
|
|
189
189
|
)
|
|
190
190
|
] });
|
|
191
|
-
},
|
|
192
|
-
Item:
|
|
193
|
-
Divider:
|
|
194
|
-
SubMenu:
|
|
191
|
+
}, Y = Object.assign(O, {
|
|
192
|
+
Item: A,
|
|
193
|
+
Divider: H,
|
|
194
|
+
SubMenu: K
|
|
195
195
|
});
|
|
196
196
|
export {
|
|
197
|
-
|
|
197
|
+
Y as ContextMenu
|
|
198
198
|
};
|
|
199
|
-
//# sourceMappingURL=
|
|
199
|
+
//# sourceMappingURL=ContextMenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ContextMenu.js","sources":["../../src/components/ContextMenu.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback, createContext, useContext } from 'react'\nimport { createPortal } from 'react-dom'\n\nexport interface ContextMenuItem {\n key: string\n label: React.ReactNode\n icon?: React.ReactNode\n disabled?: boolean\n danger?: boolean\n divider?: boolean\n children?: ContextMenuItem[]\n}\n\nexport interface ContextMenuProps {\n /** Element that triggers the context menu on right-click */\n children: React.ReactNode\n /** Menu items (data-driven pattern) */\n items?: ContextMenuItem[]\n /** Callback when an item is selected */\n onSelect?: (key: string) => void\n /** Whether the context menu is disabled */\n disabled?: boolean\n /** Additional CSS classes for the menu */\n className?: string\n}\n\nexport interface ContextMenuItemProps {\n /** Unique key for the item */\n itemKey: string\n /** Item content */\n children: React.ReactNode\n /** Icon to display before label */\n icon?: React.ReactNode\n /** Whether the item is disabled */\n disabled?: boolean\n /** Show as danger/destructive action */\n danger?: boolean\n /** Additional CSS classes */\n className?: string\n}\n\nexport interface ContextMenuDividerProps {\n /** Additional CSS classes */\n className?: string\n}\n\nexport interface ContextMenuSubMenuProps {\n /** Unique key for the submenu */\n itemKey: string\n /** Submenu label */\n label: React.ReactNode\n /** Icon to display before label */\n icon?: React.ReactNode\n /** Whether the submenu is disabled */\n disabled?: boolean\n /** Submenu items */\n children: React.ReactNode\n /** Additional CSS classes */\n className?: string\n}\n\ninterface ContextMenuContextValue {\n onSelect: (key: string) => void\n onClose: () => void\n}\n\ninterface MenuPosition {\n x: number\n y: number\n}\n\nconst ContextMenuContext = createContext<ContextMenuContextValue | null>(null)\n\nconst useContextMenuContext = () => {\n const context = useContext(ContextMenuContext)\n if (!context) {\n throw new Error('ContextMenu compound components must be used within a ContextMenu')\n }\n return context\n}\n\n// Compound pattern components\nconst ContextMenuItemComponent: React.FC<ContextMenuItemProps> = ({\n itemKey,\n children,\n icon,\n disabled = false,\n danger = false,\n className = '',\n}) => {\n const { onSelect, onClose } = useContextMenuContext()\n\n const handleClick = () => {\n if (disabled) return\n onSelect(itemKey)\n onClose()\n }\n\n return (\n <li className={className}>\n <button\n onClick={handleClick}\n disabled={disabled}\n className={`\n flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n ${danger ? 'text-error hover:bg-error/10' : ''}\n `}\n >\n {icon && <span className=\"w-4 h-4\">{icon}</span>}\n <span className=\"flex-1\">{children}</span>\n </button>\n </li>\n )\n}\n\nconst ContextMenuDividerComponent: React.FC<ContextMenuDividerProps> = ({ className = '' }) => {\n return <li className={`divider my-1 ${className}`}></li>\n}\n\nconst ContextMenuSubMenuComponent: React.FC<ContextMenuSubMenuProps> = ({\n itemKey: _itemKey,\n label,\n icon,\n disabled = false,\n children,\n className = '',\n}) => {\n const [showSubmenu, setShowSubmenu] = useState(false)\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n const handleMouseEnter = () => {\n if (disabled) return\n if (timeoutRef.current) clearTimeout(timeoutRef.current)\n setShowSubmenu(true)\n }\n\n const handleMouseLeave = () => {\n timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n }\n\n return (\n <li\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className={`relative ${className}`}\n >\n <button\n disabled={disabled}\n className={`\n flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n ${disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n `}\n >\n {icon && <span className=\"w-4 h-4\">{icon}</span>}\n <span className=\"flex-1\">{label}</span>\n <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n </svg>\n </button>\n {showSubmenu && (\n <ul\n className=\"menu bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {children}\n </ul>\n )}\n </li>\n )\n}\n\n// Data-driven pattern internal component\nconst MenuItem: React.FC<{\n item: ContextMenuItem\n onSelect: (key: string) => void\n onClose: () => void\n}> = ({ item, onSelect, onClose }) => {\n const [showSubmenu, setShowSubmenu] = useState(false)\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null)\n\n if (item.divider) {\n return <li className=\"divider my-1\"></li>\n }\n\n const handleClick = () => {\n if (item.disabled) return\n if (item.children && item.children.length > 0) return\n onSelect(item.key)\n onClose()\n }\n\n const hasSubmenu = item.children && item.children.length > 0\n\n const handleMouseEnter = () => {\n if (!hasSubmenu) return\n if (timeoutRef.current) clearTimeout(timeoutRef.current)\n setShowSubmenu(true)\n }\n\n const handleMouseLeave = () => {\n if (!hasSubmenu) return\n timeoutRef.current = setTimeout(() => setShowSubmenu(false), 100)\n }\n\n return (\n <li\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n className=\"relative\"\n >\n <button\n onClick={handleClick}\n disabled={item.disabled}\n className={`\n flex items-center gap-2 w-full px-4 py-2 text-left text-sm\n ${item.disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-base-200'}\n ${item.danger ? 'text-error hover:bg-error/10' : ''}\n `}\n >\n {item.icon && <span className=\"w-4 h-4\">{item.icon}</span>}\n <span className=\"flex-1\">{item.label}</span>\n {hasSubmenu && (\n <svg className=\"w-4 h-4\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M9 5l7 7-7 7\" />\n </svg>\n )}\n </button>\n {hasSubmenu && showSubmenu && (\n <ul\n className=\"menu bg-base-100 rounded-box shadow-lg border border-base-300 absolute left-full top-0 min-w-[160px] z-50 p-1\"\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {item.children!.map((child) => (\n <MenuItem key={child.key} item={child} onSelect={onSelect} onClose={onClose} />\n ))}\n </ul>\n )}\n </li>\n )\n}\n\nconst ContextMenuRoot: React.FC<ContextMenuProps> = ({\n children,\n items,\n onSelect,\n disabled = false,\n className = '',\n}) => {\n const [visible, setVisible] = useState(false)\n const [position, setPosition] = useState<MenuPosition>({ x: 0, y: 0 })\n const menuRef = useRef<HTMLUListElement>(null)\n const triggerRef = useRef<HTMLDivElement>(null)\n\n const handleContextMenu = useCallback(\n (e: React.MouseEvent) => {\n if (disabled) return\n e.preventDefault()\n e.stopPropagation()\n\n // Calculate position, ensuring menu stays within viewport\n let x = e.clientX\n let y = e.clientY\n\n // We'll adjust after render when we know menu dimensions\n setPosition({ x, y })\n setVisible(true)\n },\n [disabled]\n )\n\n const handleClose = useCallback(() => {\n setVisible(false)\n }, [])\n\n const handleSelect = useCallback(\n (key: string) => {\n onSelect?.(key)\n },\n [onSelect]\n )\n\n // Adjust position after menu renders to keep it in viewport\n useEffect(() => {\n if (visible && menuRef.current) {\n const menu = menuRef.current\n const rect = menu.getBoundingClientRect()\n const viewportWidth = window.innerWidth\n const viewportHeight = window.innerHeight\n\n let { x, y } = position\n\n if (x + rect.width > viewportWidth) {\n x = viewportWidth - rect.width - 8\n }\n if (y + rect.height > viewportHeight) {\n y = viewportHeight - rect.height - 8\n }\n\n if (x !== position.x || y !== position.y) {\n setPosition({ x, y })\n }\n }\n }, [visible, position])\n\n // Close on click outside or escape\n useEffect(() => {\n if (!visible) return\n\n const handleClickOutside = (e: MouseEvent) => {\n if (menuRef.current && !menuRef.current.contains(e.target as Node)) {\n handleClose()\n }\n }\n\n const handleEscape = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n handleClose()\n }\n }\n\n const handleScroll = () => {\n handleClose()\n }\n\n document.addEventListener('mousedown', handleClickOutside)\n document.addEventListener('keydown', handleEscape)\n document.addEventListener('scroll', handleScroll, true)\n\n return () => {\n document.removeEventListener('mousedown', handleClickOutside)\n document.removeEventListener('keydown', handleEscape)\n document.removeEventListener('scroll', handleScroll, true)\n }\n }, [visible, handleClose])\n\n // Determine if using data-driven or compound pattern\n // Find menu content children (not the trigger element)\n const childArray = React.Children.toArray(children)\n const triggerChild = childArray[0]\n const menuChildren = childArray.slice(1)\n const useDataDriven = items && items.length > 0\n\n const contextValue: ContextMenuContextValue = {\n onSelect: handleSelect,\n onClose: handleClose,\n }\n\n return (\n <>\n <div ref={triggerRef} onContextMenu={handleContextMenu} className=\"inline-block\">\n {triggerChild}\n </div>\n {visible &&\n createPortal(\n <ContextMenuContext.Provider value={contextValue}>\n <ul\n ref={menuRef}\n className={`menu bg-base-100 rounded-box shadow-lg border border-base-300 min-w-[160px] p-1 fixed z-[9999] ${className}`}\n style={{ left: position.x, top: position.y }}\n >\n {useDataDriven\n ? items!.map((item) => (\n <MenuItem key={item.key} item={item} onSelect={handleSelect} onClose={handleClose} />\n ))\n : menuChildren}\n </ul>\n </ContextMenuContext.Provider>,\n document.body\n )}\n </>\n )\n}\n\n// Assign compound components\nexport const ContextMenu = Object.assign(ContextMenuRoot, {\n Item: ContextMenuItemComponent,\n Divider: ContextMenuDividerComponent,\n SubMenu: ContextMenuSubMenuComponent,\n})\n"],"names":["ContextMenuContext","createContext","useContextMenuContext","context","useContext","ContextMenuItemComponent","itemKey","children","icon","disabled","danger","className","onSelect","onClose","jsx","jsxs","ContextMenuDividerComponent","ContextMenuSubMenuComponent","_itemKey","label","showSubmenu","setShowSubmenu","useState","timeoutRef","useRef","handleMouseEnter","handleMouseLeave","MenuItem","item","handleClick","hasSubmenu","child","ContextMenuRoot","items","visible","setVisible","position","setPosition","menuRef","triggerRef","handleContextMenu","useCallback","e","x","y","handleClose","handleSelect","key","useEffect","rect","viewportWidth","viewportHeight","handleClickOutside","handleEscape","handleScroll","childArray","React","triggerChild","menuChildren","useDataDriven","contextValue","Fragment","createPortal","ContextMenu"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { useClipboard as z } from "
|
|
2
|
+
import { useClipboard as z } from "../hooks/useClipboard.js";
|
|
3
3
|
const W = () => /* @__PURE__ */ n(
|
|
4
4
|
"svg",
|
|
5
5
|
{
|
|
@@ -93,4 +93,4 @@ F.displayName = "CopyButton";
|
|
|
93
93
|
export {
|
|
94
94
|
F as CopyButton
|
|
95
95
|
};
|
|
96
|
-
//# sourceMappingURL=
|
|
96
|
+
//# sourceMappingURL=CopyButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CopyButton.js","sources":["../../src/components/CopyButton.tsx"],"sourcesContent":["import React from 'react'\nimport { useClipboard } from '../hooks/useClipboard'\n\nexport interface CopyButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onError'> {\n /** Text to copy to clipboard */\n text: string\n /** Duration in ms to show copied state */\n timeout?: number\n /** Button color */\n color?: 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'neutral'\n /** Button style variant */\n variant?: 'solid' | 'outline' | 'dash' | 'soft' | 'ghost' | 'link'\n /** Button size */\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n /** Button shape */\n shape?: 'square' | 'circle'\n /** Custom icon for default state */\n icon?: React.ReactNode\n /** Custom icon for copied state */\n copiedIcon?: React.ReactNode\n /** Custom content for default state (overrides icon) */\n children?: React.ReactNode\n /** Custom content for copied state */\n copiedChildren?: React.ReactNode\n /** Callback when copy succeeds */\n onCopy?: () => void\n /** Callback when copy fails */\n onError?: (error: Error) => void\n /** Show tooltip with copy status */\n showTooltip?: boolean\n /** Tooltip text for default state */\n tooltipText?: string\n /** Tooltip text for copied state */\n copiedTooltipText?: string\n}\n\nconst CopyIcon: React.FC = () => (\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z\" />\n </svg>\n)\n\nconst CheckIcon: React.FC = () => (\n <svg\n className=\"w-4 h-4\"\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\" d=\"m4.5 12.75 6 6 9-13.5\" />\n </svg>\n)\n\nexport const CopyButton: React.FC<CopyButtonProps> = ({\n text,\n timeout = 2000,\n color,\n variant,\n size = 'md',\n shape,\n icon,\n copiedIcon,\n children,\n copiedChildren,\n onCopy,\n onError,\n showTooltip = false,\n tooltipText = 'Copy',\n copiedTooltipText = 'Copied!',\n className = '',\n disabled,\n onClick,\n ...rest\n}) => {\n const { copy, copied } = useClipboard(timeout)\n\n const handleClick = async (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n if (disabled) return\n\n const success = await copy(text)\n if (success) {\n onCopy?.()\n } else {\n onError?.(new Error('Failed to copy to clipboard'))\n }\n }\n\n const colorClasses = {\n primary: 'btn-primary',\n secondary: 'btn-secondary',\n accent: 'btn-accent',\n info: 'btn-info',\n success: 'btn-success',\n warning: 'btn-warning',\n error: 'btn-error',\n neutral: 'btn-neutral',\n }\n\n const variantClasses = {\n solid: '',\n outline: 'btn-outline',\n dash: 'btn-dash',\n soft: 'btn-soft',\n ghost: 'btn-ghost',\n link: 'btn-link',\n }\n\n const sizeClasses = {\n xs: 'btn-xs',\n sm: 'btn-sm',\n md: '',\n lg: 'btn-lg',\n xl: 'btn-xl',\n }\n\n const shapeClasses = {\n square: 'btn-square',\n circle: 'btn-circle',\n }\n\n const classes = [\n 'btn',\n color && colorClasses[color],\n copied && 'btn-success',\n variant && variantClasses[variant],\n sizeClasses[size],\n shape && shapeClasses[shape],\n className,\n ]\n .filter(Boolean)\n .join(' ')\n\n const defaultIcon = icon ?? <CopyIcon />\n const successIcon = copiedIcon ?? <CheckIcon />\n\n const content = copied\n ? (copiedChildren ?? successIcon)\n : (children ?? defaultIcon)\n\n const button = (\n <button\n type=\"button\"\n className={classes}\n onClick={handleClick}\n disabled={disabled}\n aria-label={copied ? copiedTooltipText : tooltipText}\n {...rest}\n >\n {content}\n </button>\n )\n\n if (showTooltip) {\n return (\n <div className=\"tooltip\" data-tip={copied ? copiedTooltipText : tooltipText}>\n {button}\n </div>\n )\n }\n\n return button\n}\n\nCopyButton.displayName = 'CopyButton'\n"],"names":["CopyIcon","jsx","CheckIcon","CopyButton","text","timeout","color","variant","size","shape","icon","copiedIcon","children","copiedChildren","onCopy","onError","showTooltip","tooltipText","copiedTooltipText","className","disabled","onClick","rest","copy","copied","useClipboard","handleClick","e","colorClasses","variantClasses","sizeClasses","shapeClasses","classes","button"],"mappings":";;AAoCA,MAAMA,IAAqB,MACzB,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,QAAO;AAAA,IAEP,UAAA,gBAAAA,EAAC,UAAK,eAAc,SAAQ,gBAAe,SAAQ,aAAY,KAAI,GAAE,wHAAA,CAAwH;AAAA,EAAA;AAC/L,GAGIC,IAAsB,MAC1B,gBAAAD;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,QAAO;AAAA,IAEP,UAAA,gBAAAA,EAAC,UAAK,eAAc,SAAQ,gBAAe,SAAQ,aAAY,KAAI,GAAE,wBAAA,CAAwB;AAAA,EAAA;AAC/F,GAGWE,IAAwC,CAAC;AAAA,EACpD,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,aAAAC,IAAc;AAAA,EACd,mBAAAC,IAAoB;AAAA,EACpB,WAAAC,IAAY;AAAA,EACZ,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,EAAE,MAAAC,GAAM,QAAAC,MAAWC,EAAapB,CAAO,GAEvCqB,IAAc,OAAOC,MAA2C;AAEpE,QADAN,IAAUM,CAAC,GACPP,EAAU;AAGd,IADgB,MAAMG,EAAKnB,CAAI,IAE7BU,IAAA,IAEAC,IAAU,IAAI,MAAM,6BAA6B,CAAC;AAAA,EAEtD,GAEMa,IAAe;AAAA,IACnB,SAAS;AAAA,IACT,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS;AAAA,EAAA,GAGLC,IAAiB;AAAA,IACrB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,IACP,MAAM;AAAA,EAAA,GAGFC,IAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,GAGAC,IAAe;AAAA,IACnB,QAAQ;AAAA,IACR,QAAQ;AAAA,EAAA,GAGJC,IAAU;AAAA,IACd;AAAA,IACA1B,KAASsB,EAAatB,CAAK;AAAA,IAC3BkB,KAAU;AAAA,IACVjB,KAAWsB,EAAetB,CAAO;AAAA,IACjCuB,EAAYtB,CAAI;AAAA,IAChBC,KAASsB,EAAatB,CAAK;AAAA,IAC3BU;AAAA,EAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG,GASLc,IACJ,gBAAAhC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW+B;AAAA,MACX,SAASN;AAAA,MACT,UAAAN;AAAA,MACA,cAAYI,IAASN,IAAoBD;AAAA,MACxC,GAAGK;AAAA,MAEH,UAbWE,IACXX,MAHeF,KAAc,gBAAAV,EAACC,GAAA,CAAA,CAAU,KAIxCU,MALeF,KAAQ,gBAAAT,EAACD,GAAA,CAAA,CAAS;AAAA,IAgBjC;AAAA,EAAA;AAIL,SAAIgB,IAEA,gBAAAf,EAAC,SAAI,WAAU,WAAU,YAAUuB,IAASN,IAAoBD,GAC7D,UAAAgB,EAAA,CACH,IAIGA;AACT;AAEA9B,EAAW,cAAc;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Countdown.js","sources":["../../src/components/Countdown.tsx"],"sourcesContent":["import React, { useEffect, useState, useCallback } from 'react'\n\nexport interface CountdownProps {\n /** Target timestamp in milliseconds or Date object */\n value: number | Date\n /** Format string: 'D' days, 'H' hours, 'M' minutes, 'S' seconds */\n format?: string\n /** Callback when countdown reaches zero */\n onFinish?: () => void\n /** Callback on each tick with remaining time */\n onChange?: (value: number) => void\n /** Additional CSS classes */\n className?: string\n /** Size variant */\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n /** Show labels under each unit */\n showLabels?: boolean\n /** Custom labels */\n labels?: {\n days?: string\n hours?: string\n minutes?: string\n seconds?: string\n }\n /** Show box style around each unit */\n boxed?: boolean\n}\n\ninterface TimeLeft {\n days: number\n hours: number\n minutes: number\n seconds: number\n}\n\nconst calculateTimeLeft = (targetTime: number): TimeLeft => {\n const difference = targetTime - Date.now()\n\n if (difference <= 0) {\n return { days: 0, hours: 0, minutes: 0, seconds: 0 }\n }\n\n return {\n days: Math.floor(difference / (1000 * 60 * 60 * 24)),\n hours: Math.floor((difference / (1000 * 60 * 60)) % 24),\n minutes: Math.floor((difference / 1000 / 60) % 60),\n seconds: Math.floor((difference / 1000) % 60),\n }\n}\n\nconst CountdownUnit: React.FC<{\n value: number\n label?: string\n size?: CountdownProps['size']\n showLabel?: boolean\n boxed?: boolean\n}> = ({ value, label, size, showLabel, boxed }) => {\n const sizeClasses = {\n xs: 'text-lg',\n sm: 'text-2xl',\n md: 'text-4xl',\n lg: 'text-5xl',\n xl: 'text-6xl',\n }\n\n const content = (\n <span className={`countdown font-mono ${sizeClasses[size || 'md']}`}>\n <span\n style={{ '--value': value, '--digits': 2 } as React.CSSProperties}\n aria-live=\"polite\"\n aria-label={String(value)}\n >\n {String(value).padStart(2, '0')}\n </span>\n </span>\n )\n\n if (boxed) {\n return (\n <div className=\"flex flex-col items-center bg-neutral text-neutral-content rounded-box p-2\">\n {content}\n {showLabel && label && <span className=\"text-xs mt-1\">{label}</span>}\n </div>\n )\n }\n\n if (showLabel) {\n return (\n <div className=\"flex flex-col items-center\">\n {content}\n {label && <span className=\"text-xs text-base-content/70\">{label}</span>}\n </div>\n )\n }\n\n return content\n}\n\nexport const Countdown: React.FC<CountdownProps> = ({\n value,\n format = 'HH:MM:SS',\n onFinish,\n onChange,\n className = '',\n size = 'md',\n showLabels = false,\n labels = {},\n boxed = false,\n}) => {\n const targetTime = value instanceof Date ? value.getTime() : value\n const [timeLeft, setTimeLeft] = useState<TimeLeft>(() => calculateTimeLeft(targetTime))\n const [finished, setFinished] = useState(false)\n\n const defaultLabels = {\n days: labels.days || 'days',\n hours: labels.hours || 'hours',\n minutes: labels.minutes || 'min',\n seconds: labels.seconds || 'sec',\n }\n\n const tick = useCallback(() => {\n const newTimeLeft = calculateTimeLeft(targetTime)\n setTimeLeft(newTimeLeft)\n\n const remaining = targetTime - Date.now()\n onChange?.(Math.max(0, remaining))\n\n if (remaining <= 0 && !finished) {\n setFinished(true)\n onFinish?.()\n }\n }, [targetTime, onChange, onFinish, finished])\n\n useEffect(() => {\n const timer = setInterval(tick, 1000)\n tick() // Initial tick\n\n return () => clearInterval(timer)\n }, [tick])\n\n const showDays = format.includes('D')\n const showHours = format.includes('H')\n const showMinutes = format.includes('M')\n const showSeconds = format.includes('S')\n\n const separatorSize = size === 'lg' || size === 'xl' ? 'text-3xl' : size === 'md' ? 'text-2xl' : 'text-xl'\n const showSeparators = !showLabels && !boxed\n\n return (\n <div className={`flex gap-4 items-center ${className}`}>\n {showDays && (\n <>\n <CountdownUnit\n value={timeLeft.days}\n label={defaultLabels.days}\n size={size}\n showLabel={showLabels}\n boxed={boxed}\n />\n {showSeparators && (showHours || showMinutes || showSeconds) && (\n <span className={separatorSize}>:</span>\n )}\n </>\n )}\n {showHours && (\n <>\n <CountdownUnit\n value={timeLeft.hours}\n label={defaultLabels.hours}\n size={size}\n showLabel={showLabels}\n boxed={boxed}\n />\n {showSeparators && (showMinutes || showSeconds) && (\n <span className={separatorSize}>:</span>\n )}\n </>\n )}\n {showMinutes && (\n <>\n <CountdownUnit\n value={timeLeft.minutes}\n label={defaultLabels.minutes}\n size={size}\n showLabel={showLabels}\n boxed={boxed}\n />\n {showSeparators && showSeconds && <span className={separatorSize}>:</span>}\n </>\n )}\n {showSeconds && (\n <CountdownUnit\n value={timeLeft.seconds}\n label={defaultLabels.seconds}\n size={size}\n showLabel={showLabels}\n boxed={boxed}\n />\n )}\n </div>\n )\n}\n\nCountdown.displayName = 'Countdown'\n"],"names":["calculateTimeLeft","targetTime","difference","CountdownUnit","value","label","size","showLabel","boxed","content","jsx","jsxs","Countdown","format","onFinish","onChange","className","showLabels","labels","timeLeft","setTimeLeft","useState","finished","setFinished","defaultLabels","tick","useCallback","newTimeLeft","remaining","useEffect","timer","showDays","showHours","showMinutes","showSeconds","separatorSize","showSeparators","Fragment"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs as m, jsx as n } from "react/jsx-runtime";
|
|
2
2
|
import { useState as h, useRef as j, useEffect as y } from "react";
|
|
3
|
-
import { Input as T } from "./
|
|
3
|
+
import { Input as T } from "./Input.js";
|
|
4
4
|
const $ = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], I = [
|
|
5
5
|
"January",
|
|
6
6
|
"February",
|
|
@@ -184,4 +184,4 @@ const B = ({
|
|
|
184
184
|
export {
|
|
185
185
|
B as DatePicker
|
|
186
186
|
};
|
|
187
|
-
//# sourceMappingURL=
|
|
187
|
+
//# sourceMappingURL=DatePicker.js.map
|