eidos-ui 3.1.0 → 3.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/README.md +4 -0
- package/dist/Header.types-0XovUp0T.d.ts +79 -0
- package/dist/Header.types-Ce5Cj301.d.cts +79 -0
- package/dist/{Navigation.types-CpS3EYNz.d.ts → Navigation.types-By5HfPTi.d.ts} +8 -0
- package/dist/{Navigation.types-sUO9wqOp.d.cts → Navigation.types-_MrYqqUI.d.cts} +8 -0
- package/dist/{SegmentedControl.types-Dm4SnwCK.d.cts → SegmentedControl.types-BofrEYyd.d.cts} +16 -1
- package/dist/{SegmentedControl.types-CK8EiShd.d.ts → SegmentedControl.types-cjLwwBAm.d.ts} +16 -1
- package/dist/alert/index.cjs +4 -4
- package/dist/alert/index.js +3 -3
- package/dist/button/index.cjs +3 -3
- package/dist/button/index.js +2 -2
- package/dist/chip/index.cjs +3 -3
- package/dist/chip/index.js +2 -2
- package/dist/{chunk-RWOX2NJN.js → chunk-25PSIDPC.js} +2 -2
- package/dist/{chunk-IFVT5UCY.js → chunk-2QEKSRVX.js} +14 -10
- package/dist/chunk-2QEKSRVX.js.map +1 -0
- package/dist/{chunk-4BKTBV2I.js → chunk-2R77XZEP.js} +6 -2
- package/dist/chunk-2R77XZEP.js.map +1 -0
- package/dist/{chunk-H5HWFOWZ.js → chunk-2WP27QAN.js} +8 -8
- package/dist/{chunk-EXITZVB2.js → chunk-3RLGH45H.js} +6 -6
- package/dist/{chunk-442U3W6R.cjs → chunk-4MZ7HEQC.cjs} +5 -5
- package/dist/{chunk-442U3W6R.cjs.map → chunk-4MZ7HEQC.cjs.map} +1 -1
- package/dist/{chunk-R4PU2TBM.js → chunk-4ZWAJTNH.js} +3 -3
- package/dist/{chunk-RHOT7AEI.cjs → chunk-55J4LEKT.cjs} +8 -7
- package/dist/chunk-55J4LEKT.cjs.map +1 -0
- package/dist/{chunk-REVK7IGN.js → chunk-5WH3JMR5.js} +8 -7
- package/dist/chunk-5WH3JMR5.js.map +1 -0
- package/dist/{chunk-GT22EGJP.cjs → chunk-65PC3YDT.cjs} +14 -10
- package/dist/chunk-65PC3YDT.cjs.map +1 -0
- package/dist/{chunk-KQD7CQ4Z.cjs → chunk-6CSUUQ5M.cjs} +10 -6
- package/dist/chunk-6CSUUQ5M.cjs.map +1 -0
- package/dist/{chunk-GR2PMCVN.cjs → chunk-75TDY7XF.cjs} +5 -5
- package/dist/{chunk-GR2PMCVN.cjs.map → chunk-75TDY7XF.cjs.map} +1 -1
- package/dist/{chunk-FRUOA2QU.cjs → chunk-75VXB3H2.cjs} +7 -3
- package/dist/chunk-75VXB3H2.cjs.map +1 -0
- package/dist/{chunk-F26VIKNF.js → chunk-ATL7325T.js} +3 -3
- package/dist/{chunk-TEJIPPZR.js → chunk-BC5I2MYB.js} +7 -4
- package/dist/chunk-BC5I2MYB.js.map +1 -0
- package/dist/{chunk-GHQ6SQPI.js → chunk-BHVHM66Z.js} +6 -6
- package/dist/{chunk-N2IGZIEX.cjs → chunk-CJGFRPAS.cjs} +3 -3
- package/dist/{chunk-N2IGZIEX.cjs.map → chunk-CJGFRPAS.cjs.map} +1 -1
- package/dist/{chunk-GEHL4LKK.cjs → chunk-CUJBNRJJ.cjs} +8 -2
- package/dist/chunk-CUJBNRJJ.cjs.map +1 -0
- package/dist/{chunk-DAXZRNNO.cjs → chunk-D2SKXRKP.cjs} +8 -8
- package/dist/{chunk-DAXZRNNO.cjs.map → chunk-D2SKXRKP.cjs.map} +1 -1
- package/dist/{chunk-KBG77JHC.js → chunk-EAJHEYZM.js} +8 -2
- package/dist/chunk-EAJHEYZM.js.map +1 -0
- package/dist/{chunk-G77YR73R.cjs → chunk-EBSKRZXI.cjs} +8 -8
- package/dist/{chunk-G77YR73R.cjs.map → chunk-EBSKRZXI.cjs.map} +1 -1
- package/dist/{chunk-B5G5XVFJ.cjs → chunk-EH42ND5Q.cjs} +5 -5
- package/dist/{chunk-B5G5XVFJ.cjs.map → chunk-EH42ND5Q.cjs.map} +1 -1
- package/dist/{chunk-WUBQJVB7.cjs → chunk-EL3YXTOW.cjs} +9 -6
- package/dist/chunk-EL3YXTOW.cjs.map +1 -0
- package/dist/{chunk-Y53HCLGW.js → chunk-FALDCW2E.js} +2 -2
- package/dist/{chunk-D5IY2HUV.cjs → chunk-FXZJL2AM.cjs} +5 -5
- package/dist/{chunk-D5IY2HUV.cjs.map → chunk-FXZJL2AM.cjs.map} +1 -1
- package/dist/{chunk-KJZUYC4X.cjs → chunk-HI6WCX4T.cjs} +10 -9
- package/dist/chunk-HI6WCX4T.cjs.map +1 -0
- package/dist/{chunk-LFWPQYWX.cjs → chunk-I3CSPYHG.cjs} +3 -3
- package/dist/{chunk-LFWPQYWX.cjs.map → chunk-I3CSPYHG.cjs.map} +1 -1
- package/dist/{chunk-EZME5CLK.cjs → chunk-J5RMLZ4P.cjs} +3 -3
- package/dist/{chunk-EZME5CLK.cjs.map → chunk-J5RMLZ4P.cjs.map} +1 -1
- package/dist/{chunk-VHMOKXUT.js → chunk-JRLUZDKA.js} +8 -7
- package/dist/chunk-JRLUZDKA.js.map +1 -0
- package/dist/{chunk-LIFUHQH5.cjs → chunk-KBGFDHKD.cjs} +19 -19
- package/dist/{chunk-LIFUHQH5.cjs.map → chunk-KBGFDHKD.cjs.map} +1 -1
- package/dist/{chunk-ZHFPV43D.js → chunk-KNQ6NN6L.js} +5 -5
- package/dist/{chunk-2ZY7M72Q.js → chunk-KQJ3IAFT.js} +10 -7
- package/dist/chunk-KQJ3IAFT.js.map +1 -0
- package/dist/{chunk-74MBKLYI.js → chunk-L23WWO3D.js} +9 -5
- package/dist/chunk-L23WWO3D.js.map +1 -0
- package/dist/{chunk-YJXZR7RL.js → chunk-L5Q6UDY3.js} +4 -4
- package/dist/{chunk-5BX4Q76D.cjs → chunk-LVHZBCTA.cjs} +3 -3
- package/dist/{chunk-5BX4Q76D.cjs.map → chunk-LVHZBCTA.cjs.map} +1 -1
- package/dist/{chunk-SENVA467.js → chunk-M7PF4FKQ.js} +6 -2
- package/dist/chunk-M7PF4FKQ.js.map +1 -0
- package/dist/chunk-ND526PMG.cjs +145 -0
- package/dist/chunk-ND526PMG.cjs.map +1 -0
- package/dist/{chunk-TRLBYA5G.cjs → chunk-NEYLNRVG.cjs} +5 -5
- package/dist/{chunk-TRLBYA5G.cjs.map → chunk-NEYLNRVG.cjs.map} +1 -1
- package/dist/{chunk-ZEZK664O.js → chunk-NWJ6NETE.js} +13 -13
- package/dist/{chunk-U5FHQ73U.cjs → chunk-NZO2I5AL.cjs} +15 -12
- package/dist/chunk-NZO2I5AL.cjs.map +1 -0
- package/dist/{chunk-5ZL6PYU3.js → chunk-O2AACVSF.js} +3 -3
- package/dist/chunk-O3LG7B2J.cjs +186 -0
- package/dist/chunk-O3LG7B2J.cjs.map +1 -0
- package/dist/{chunk-SHYSLWQG.js → chunk-OAK7HFOJ.js} +4 -4
- package/dist/{chunk-QF2RAUPB.cjs → chunk-OAPOGYA5.cjs} +7 -3
- package/dist/chunk-OAPOGYA5.cjs.map +1 -0
- package/dist/{chunk-SKEWTQJ7.cjs → chunk-OMLXP2CK.cjs} +7 -7
- package/dist/{chunk-SKEWTQJ7.cjs.map → chunk-OMLXP2CK.cjs.map} +1 -1
- package/dist/{chunk-VSTQEHVZ.js → chunk-PR7CVQ4R.js} +10 -7
- package/dist/chunk-PR7CVQ4R.js.map +1 -0
- package/dist/{chunk-6HUHH6Y4.cjs → chunk-Q6ICDKQZ.cjs} +22 -19
- package/dist/chunk-Q6ICDKQZ.cjs.map +1 -0
- package/dist/{chunk-NGVOXM7P.js → chunk-QIITXVRG.js} +4 -4
- package/dist/{chunk-GI6VJYOS.js → chunk-QUDVJUZU.js} +3 -3
- package/dist/chunk-QZX3A4FX.js +886 -0
- package/dist/chunk-QZX3A4FX.js.map +1 -0
- package/dist/chunk-R3WPVTGY.cjs +886 -0
- package/dist/chunk-R3WPVTGY.cjs.map +1 -0
- package/dist/{chunk-SN6EWQDJ.js → chunk-RYOQYYDO.js} +3 -3
- package/dist/chunk-S4S4LB63.js +186 -0
- package/dist/chunk-S4S4LB63.js.map +1 -0
- package/dist/{chunk-67RFMV6K.js → chunk-T2KB3DJJ.js} +2 -2
- package/dist/{chunk-5VM2256W.cjs → chunk-TEVZHN5I.cjs} +11 -10
- package/dist/chunk-TEVZHN5I.cjs.map +1 -0
- package/dist/{chunk-RKA2OJRT.js → chunk-TJC7UELT.js} +18 -18
- package/dist/{chunk-SKTDGCWJ.cjs → chunk-UOOGS6N7.cjs} +48 -48
- package/dist/{chunk-SKTDGCWJ.cjs.map → chunk-UOOGS6N7.cjs.map} +1 -1
- package/dist/{chunk-SE7MWOC7.cjs → chunk-VRQBDTLT.cjs} +32 -32
- package/dist/{chunk-SE7MWOC7.cjs.map → chunk-VRQBDTLT.cjs.map} +1 -1
- package/dist/{chunk-AXBYJ2OY.cjs → chunk-WFEORBLC.cjs} +8 -8
- package/dist/{chunk-AXBYJ2OY.cjs.map → chunk-WFEORBLC.cjs.map} +1 -1
- package/dist/chunk-WKDT2XFQ.js +145 -0
- package/dist/chunk-WKDT2XFQ.js.map +1 -0
- package/dist/{chunk-APK5OQRV.cjs → chunk-WWYJNWJY.cjs} +6 -6
- package/dist/{chunk-APK5OQRV.cjs.map → chunk-WWYJNWJY.cjs.map} +1 -1
- package/dist/{chunk-A7WQINIG.js → chunk-X3U7SDOZ.js} +7 -6
- package/dist/chunk-X3U7SDOZ.js.map +1 -0
- package/dist/{chunk-LEMCJW57.js → chunk-YDPEHUMH.js} +2 -2
- package/dist/{chunk-GGSII6Y2.cjs → chunk-ZGT4LT5Y.cjs} +33 -33
- package/dist/{chunk-GGSII6Y2.cjs.map → chunk-ZGT4LT5Y.cjs.map} +1 -1
- package/dist/{chunk-LUL6RZ4M.cjs → chunk-ZNWIHUHZ.cjs} +3 -3
- package/dist/{chunk-LUL6RZ4M.cjs.map → chunk-ZNWIHUHZ.cjs.map} +1 -1
- package/dist/{chunk-S3CT536K.js → chunk-ZPDETHQ7.js} +2 -2
- package/dist/color-picker/index.cjs +4 -3
- package/dist/color-picker/index.cjs.map +1 -1
- package/dist/color-picker/index.js +3 -2
- package/dist/combobox/index.cjs +5 -5
- package/dist/combobox/index.js +4 -4
- package/dist/context-menu/index.cjs +5 -5
- package/dist/context-menu/index.js +4 -4
- package/dist/conversation/index.cjs +28 -0
- package/dist/conversation/index.cjs.map +1 -0
- package/dist/conversation/index.d.cts +254 -0
- package/dist/conversation/index.d.ts +254 -0
- package/dist/conversation/index.js +28 -0
- package/dist/conversation/index.js.map +1 -0
- package/dist/data-grid/index.cjs +16 -16
- package/dist/data-grid/index.d.cts +1 -1
- package/dist/data-grid/index.d.ts +1 -1
- package/dist/data-grid/index.js +15 -15
- package/dist/date-picker/index.cjs +7 -7
- package/dist/date-picker/index.js +6 -6
- package/dist/drawer/index.cjs +4 -4
- package/dist/drawer/index.js +3 -3
- package/dist/dropdown/index.cjs +3 -2
- package/dist/dropdown/index.cjs.map +1 -1
- package/dist/dropdown/index.js +2 -1
- package/dist/header/index.cjs +8 -4
- package/dist/header/index.cjs.map +1 -1
- package/dist/header/index.d.cts +35 -4
- package/dist/header/index.d.ts +35 -4
- package/dist/header/index.js +9 -5
- package/dist/index.cjs +66 -56
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1147 -295
- package/dist/index.d.cts +5 -4
- package/dist/index.d.ts +5 -4
- package/dist/index.js +84 -74
- package/dist/inline-edit/index.cjs +4 -4
- package/dist/inline-edit/index.js +3 -3
- package/dist/input/index.cjs +3 -3
- package/dist/input/index.js +2 -2
- package/dist/menu/index.cjs +4 -4
- package/dist/menu/index.js +3 -3
- package/dist/modal/index.cjs +4 -4
- package/dist/modal/index.js +3 -3
- package/dist/navigation/index.cjs +4 -4
- package/dist/navigation/index.d.cts +2 -2
- package/dist/navigation/index.d.ts +2 -2
- package/dist/navigation/index.js +3 -3
- package/dist/number-input/index.cjs +3 -2
- package/dist/number-input/index.cjs.map +1 -1
- package/dist/number-input/index.js +2 -1
- package/dist/page-layout/index.cjs +10 -9
- package/dist/page-layout/index.cjs.map +1 -1
- package/dist/page-layout/index.d.cts +2 -2
- package/dist/page-layout/index.d.ts +2 -2
- package/dist/page-layout/index.js +9 -8
- package/dist/pagination/index.cjs +7 -7
- package/dist/pagination/index.js +6 -6
- package/dist/segmented-control/index.cjs +3 -3
- package/dist/segmented-control/index.d.cts +2 -2
- package/dist/segmented-control/index.d.ts +2 -2
- package/dist/segmented-control/index.js +2 -2
- package/dist/select/index.cjs +5 -5
- package/dist/select/index.js +4 -4
- package/dist/snackbar/index.cjs +4 -4
- package/dist/snackbar/index.js +3 -3
- package/dist/split-button/index.cjs +5 -5
- package/dist/split-button/index.js +4 -4
- package/dist/table/index.cjs +16 -16
- package/dist/table/index.cjs.map +1 -1
- package/dist/table/index.js +15 -15
- package/dist/tabs/index.cjs +3 -3
- package/dist/tabs/index.js +2 -2
- package/dist/tag-input/index.cjs +5 -5
- package/dist/tag-input/index.js +4 -4
- package/dist/textarea/index.cjs +3 -3
- package/dist/textarea/index.js +2 -2
- package/dist/theme-editor/index.cjs +11 -11
- package/dist/theme-editor/index.js +10 -10
- package/dist/theme-provider/index.cjs +3 -3
- package/dist/theme-provider/index.js +2 -2
- package/dist/toolbar/index.cjs +6 -6
- package/dist/toolbar/index.js +5 -5
- package/package.json +1 -1
- package/dist/Header.types-B3QtuiL-.d.cts +0 -21
- package/dist/Header.types-C6w0FBY8.d.ts +0 -21
- package/dist/chunk-2ZY7M72Q.js.map +0 -1
- package/dist/chunk-4BKTBV2I.js.map +0 -1
- package/dist/chunk-5VM2256W.cjs.map +0 -1
- package/dist/chunk-6HUHH6Y4.cjs.map +0 -1
- package/dist/chunk-74MBKLYI.js.map +0 -1
- package/dist/chunk-A7WQINIG.js.map +0 -1
- package/dist/chunk-AAA6TR5I.cjs +0 -67
- package/dist/chunk-AAA6TR5I.cjs.map +0 -1
- package/dist/chunk-FRUOA2QU.cjs.map +0 -1
- package/dist/chunk-GEHL4LKK.cjs.map +0 -1
- package/dist/chunk-GT22EGJP.cjs.map +0 -1
- package/dist/chunk-IFVT5UCY.js.map +0 -1
- package/dist/chunk-KBG77JHC.js.map +0 -1
- package/dist/chunk-KJZUYC4X.cjs.map +0 -1
- package/dist/chunk-KQD7CQ4Z.cjs.map +0 -1
- package/dist/chunk-O5WEKLNF.js +0 -21
- package/dist/chunk-O5WEKLNF.js.map +0 -1
- package/dist/chunk-P7IQY5YH.js +0 -67
- package/dist/chunk-P7IQY5YH.js.map +0 -1
- package/dist/chunk-QF2RAUPB.cjs.map +0 -1
- package/dist/chunk-REVK7IGN.js.map +0 -1
- package/dist/chunk-RHOT7AEI.cjs.map +0 -1
- package/dist/chunk-SENVA467.js.map +0 -1
- package/dist/chunk-TEJIPPZR.js.map +0 -1
- package/dist/chunk-U5FHQ73U.cjs.map +0 -1
- package/dist/chunk-VHMOKXUT.js.map +0 -1
- package/dist/chunk-VSTQEHVZ.js.map +0 -1
- package/dist/chunk-WUBQJVB7.cjs.map +0 -1
- package/dist/chunk-Z4SLV6WG.cjs +0 -21
- package/dist/chunk-Z4SLV6WG.cjs.map +0 -1
- /package/dist/{chunk-RWOX2NJN.js.map → chunk-25PSIDPC.js.map} +0 -0
- /package/dist/{chunk-H5HWFOWZ.js.map → chunk-2WP27QAN.js.map} +0 -0
- /package/dist/{chunk-EXITZVB2.js.map → chunk-3RLGH45H.js.map} +0 -0
- /package/dist/{chunk-R4PU2TBM.js.map → chunk-4ZWAJTNH.js.map} +0 -0
- /package/dist/{chunk-F26VIKNF.js.map → chunk-ATL7325T.js.map} +0 -0
- /package/dist/{chunk-GHQ6SQPI.js.map → chunk-BHVHM66Z.js.map} +0 -0
- /package/dist/{chunk-Y53HCLGW.js.map → chunk-FALDCW2E.js.map} +0 -0
- /package/dist/{chunk-ZHFPV43D.js.map → chunk-KNQ6NN6L.js.map} +0 -0
- /package/dist/{chunk-YJXZR7RL.js.map → chunk-L5Q6UDY3.js.map} +0 -0
- /package/dist/{chunk-ZEZK664O.js.map → chunk-NWJ6NETE.js.map} +0 -0
- /package/dist/{chunk-5ZL6PYU3.js.map → chunk-O2AACVSF.js.map} +0 -0
- /package/dist/{chunk-SHYSLWQG.js.map → chunk-OAK7HFOJ.js.map} +0 -0
- /package/dist/{chunk-NGVOXM7P.js.map → chunk-QIITXVRG.js.map} +0 -0
- /package/dist/{chunk-GI6VJYOS.js.map → chunk-QUDVJUZU.js.map} +0 -0
- /package/dist/{chunk-SN6EWQDJ.js.map → chunk-RYOQYYDO.js.map} +0 -0
- /package/dist/{chunk-67RFMV6K.js.map → chunk-T2KB3DJJ.js.map} +0 -0
- /package/dist/{chunk-RKA2OJRT.js.map → chunk-TJC7UELT.js.map} +0 -0
- /package/dist/{chunk-LEMCJW57.js.map → chunk-YDPEHUMH.js.map} +0 -0
- /package/dist/{chunk-S3CT536K.js.map → chunk-ZPDETHQ7.js.map} +0 -0
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import {
|
|
2
2
|
Dropdown
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-2R77XZEP.js";
|
|
4
4
|
import {
|
|
5
5
|
Kbd
|
|
6
6
|
} from "./chunk-LYH3EKKQ.js";
|
|
7
|
-
import {
|
|
8
|
-
renderIcon
|
|
9
|
-
} from "./chunk-KBG77JHC.js";
|
|
10
7
|
import {
|
|
11
8
|
Tooltip
|
|
12
9
|
} from "./chunk-YV57RSPD.js";
|
|
10
|
+
import {
|
|
11
|
+
renderIcon
|
|
12
|
+
} from "./chunk-EAJHEYZM.js";
|
|
13
13
|
|
|
14
14
|
// src/components/Menu/Menu.component.tsx
|
|
15
15
|
import { useCallback } from "react";
|
|
@@ -122,4 +122,4 @@ export {
|
|
|
122
122
|
MenuPanel,
|
|
123
123
|
Menu
|
|
124
124
|
};
|
|
125
|
-
//# sourceMappingURL=chunk-
|
|
125
|
+
//# sourceMappingURL=chunk-KNQ6NN6L.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
devWarn
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-EAJHEYZM.js";
|
|
4
4
|
|
|
5
5
|
// src/components/ThemeProvider/ThemeProvider.component.tsx
|
|
6
6
|
import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
@@ -115,10 +115,12 @@ var MIN_STEP_DELTA = 0.012;
|
|
|
115
115
|
var buildRamp = (base) => {
|
|
116
116
|
const { l: baseL, c: baseC, h } = hexToOklch(base);
|
|
117
117
|
const anchor = RAMP_CURVE[BASE_STEP].l;
|
|
118
|
-
const
|
|
119
|
-
const
|
|
120
|
-
const
|
|
121
|
-
const
|
|
118
|
+
const curveLight = RAMP_CURVE[50].l;
|
|
119
|
+
const curveDark = RAMP_CURVE[900].l;
|
|
120
|
+
const lightTarget = baseL >= curveLight ? Math.min(LIGHT_CEILING, baseL + 0.02) : curveLight;
|
|
121
|
+
const darkTarget = baseL <= curveDark ? Math.max(DARK_FLOOR * 0.2, baseL - 0.02) : curveDark;
|
|
122
|
+
const lightSpan = curveLight - anchor;
|
|
123
|
+
const darkSpan = anchor - curveDark;
|
|
122
124
|
const out = {};
|
|
123
125
|
for (const step of RAMP_STEPS) {
|
|
124
126
|
if (step === BASE_STEP) {
|
|
@@ -127,7 +129,8 @@ var buildRamp = (base) => {
|
|
|
127
129
|
}
|
|
128
130
|
const { l: curveL, chroma } = RAMP_CURVE[step];
|
|
129
131
|
const offset = curveL - anchor;
|
|
130
|
-
const
|
|
132
|
+
const t = offset > 0 ? offset / lightSpan : -offset / darkSpan;
|
|
133
|
+
const l = offset > 0 ? baseL + t * (lightTarget - baseL) : baseL - t * (baseL - darkTarget);
|
|
131
134
|
out[step] = oklchToHex({ l, c: baseC * chroma, h });
|
|
132
135
|
}
|
|
133
136
|
return enforceSeparation(out, h, baseC);
|
|
@@ -518,4 +521,4 @@ export {
|
|
|
518
521
|
isFontAvailable,
|
|
519
522
|
isFontStackAvailable
|
|
520
523
|
};
|
|
521
|
-
//# sourceMappingURL=chunk-
|
|
524
|
+
//# sourceMappingURL=chunk-KQJ3IAFT.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ThemeProvider/ThemeProvider.component.tsx","../src/components/ThemeProvider/ThemeProvider.context.tsx","../src/components/ThemeProvider/ThemeProvider.color.ts","../src/components/ThemeProvider/ThemeProvider.tokens.ts","../src/components/ThemeProvider/ThemeProvider.fonts.ts"],"sourcesContent":["import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { devWarn } from '../../utils';\nimport { ThemeContext } from './ThemeProvider.context';\nimport { buildTokens, diffFromDefault, resolveTheme, themeToCss } from './ThemeProvider.tokens';\nimport type { ThemeConfig, ThemeContextValue, ThemeProviderProps } from './ThemeProvider.types';\n\nconst EMPTY_THEME: ThemeConfig = {};\n\n/**\n * Number of providers currently mounted.\n *\n * Because tokens are written to `document.documentElement` (see the component\n * comment for why), providers do not compose: two of them target the same\n * element, so whichever applied a given token last wins for the entire page -\n * including for the subtree of the other one. That looks like a broken theme\n * rather than a misuse, so it is worth saying out loud.\n */\nlet mountedProviders = 0;\n\n/** Merges `patch` over `base` one level into `colors`/`typography`. */\nconst mergeTheme = (base: ThemeConfig, patch: ThemeConfig): ThemeConfig => ({\n colors: { ...base.colors, ...patch.colors },\n typography: { ...base.typography, ...patch.typography },\n});\n\n/**\n * Applies a theme by writing CSS custom properties to `document.documentElement`.\n *\n * Two deliberate choices worth knowing:\n *\n * **The target is `documentElement`, not a wrapper element.** Every overlay in\n * this library (`Dropdown`, `Modal`, `Drawer`, `Snackbar`, `Tooltip`, …) portals\n * to `document.body`, so tokens scoped to a wrapper `<div>` would leave every\n * popup rendering the preset instead.\n *\n * **Properties are set through the CSSOM** (`style.setProperty`), which no CSP\n * directive gates - `style-src` and `style-src-attr` only cover the `style`\n * HTML attribute and stylesheet loads. Nothing here needs a nonce, and no\n * `<style>` element is ever created. See `ContentSecurityPolicy.mdx`.\n *\n * Under SSR the server sends the preset from `dist/index.css` and the theme is\n * applied on hydration; use `toCss()` if you need a themed first paint.\n */\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n children,\n theme: controlledTheme,\n defaultTheme: initialTheme,\n onThemeChange,\n}) => {\n const isControlled = controlledTheme !== undefined;\n const [uncontrolledTheme, setUncontrolledTheme] = useState<ThemeConfig>(\n initialTheme ?? EMPTY_THEME,\n );\n const theme = isControlled ? controlledTheme : uncontrolledTheme;\n\n useEffect(() => {\n mountedProviders += 1;\n if (mountedProviders > 1) {\n devWarn(\n 'theme-multiple-providers',\n `ThemeProvider: ${mountedProviders} providers are mounted at once. They all write to document.documentElement, so the last one to apply each token wins for the whole page - nested or sibling providers cannot theme separate subtrees. Use a single provider at your app root.`,\n );\n }\n return () => {\n mountedProviders -= 1;\n };\n }, []);\n\n const resolvedTheme = useMemo(() => resolveTheme(theme), [theme]);\n const tokens = useMemo(() => diffFromDefault(buildTokens(resolvedTheme)), [resolvedTheme]);\n\n // Names written on the previous pass, so properties dropped from the theme\n // are removed rather than left behind at their last value.\n const appliedRef = useRef<string[]>([]);\n\n useLayoutEffect(() => {\n if (typeof document === 'undefined') return;\n const root = document.documentElement;\n\n for (const name of appliedRef.current) {\n if (!(name in tokens)) root.style.removeProperty(name);\n }\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(name, value);\n }\n appliedRef.current = Object.keys(tokens);\n\n return () => {\n for (const name of appliedRef.current) {\n root.style.removeProperty(name);\n }\n appliedRef.current = [];\n };\n }, [tokens]);\n\n const commit = useCallback(\n (next: ThemeConfig) => {\n if (!isControlled) setUncontrolledTheme(next);\n onThemeChange?.(next);\n },\n [isControlled, onThemeChange],\n );\n\n const setTheme = useCallback((next: ThemeConfig) => commit(next), [commit]);\n\n const updateTheme = useCallback(\n (patch: ThemeConfig) => commit(mergeTheme(theme, patch)),\n [commit, theme],\n );\n\n const resetTheme = useCallback(() => commit(EMPTY_THEME), [commit]);\n\n const toCss = useCallback(() => themeToCss(resolvedTheme), [resolvedTheme]);\n\n const value = useMemo<ThemeContextValue>(\n () => ({\n theme,\n resolvedTheme,\n setTheme,\n updateTheme,\n resetTheme,\n isDefault: Object.keys(tokens).length === 0,\n toCss,\n }),\n [theme, resolvedTheme, setTheme, updateTheme, resetTheme, tokens, toCss],\n );\n\n return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n};\n\nThemeProvider.displayName = 'ThemeProvider';\n","import { createContext, useContext } from 'react';\nimport type { ThemeContextValue } from './ThemeProvider.types';\n\nexport const ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\n/**\n * Reads the active theme. Throws outside a `ThemeProvider`, matching\n * `useSnackbarContext` - a silent fallback would make a missing provider look\n * like a theme that simply is not applying.\n */\nexport const useTheme = (): ThemeContextValue => {\n const context = useContext(ThemeContext);\n if (!context) {\n throw new Error('useTheme must be used within a ThemeProvider');\n }\n return context;\n};\n","/**\n * Colour maths for the theme system.\n *\n * All conversions are done in JS and emitted as `#rrggbb`, so browser support\n * for `oklch()` is irrelevant here - nothing in the generated CSS uses a modern\n * colour function.\n *\n * OKLab is used rather than HSL for every interpolation. HSL lightness\n * interpolation is ~40 lines shorter but produces muddy, desaturated ramps for\n * exactly the saturated brand hues this feature exists to support, because its\n * \"lightness\" is not perceptual.\n */\n\n// ============================================================================\n// sRGB <-> OKLab\n// ============================================================================\n\nexport interface Oklch {\n /** Perceptual lightness, 0-1. */\n l: number;\n /** Chroma (colourfulness), 0 to ~0.4 in sRGB. */\n c: number;\n /** Hue angle in radians. */\n h: number;\n}\n\nconst srgbToLinear = (v: number): number =>\n v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);\n\nconst linearToSrgb = (v: number): number =>\n v <= 0.0031308 ? 12.92 * v : 1.055 * Math.pow(v, 1 / 2.4) - 0.055;\n\nconst clamp01 = (v: number): number => (v < 0 ? 0 : v > 1 ? 1 : v);\n\n/** Parses `#rgb` / `#rrggbb` into 0-1 sRGB channels. Returns null if unparseable. */\nexport const parseHex = (hex: string): [number, number, number] | null => {\n if (typeof hex !== 'string') return null;\n const raw = hex.trim().replace(/^#/, '');\n const full =\n raw.length === 3\n ? raw\n .split('')\n .map((c) => c + c)\n .join('')\n : raw;\n if (!/^[0-9a-fA-F]{6}$/.test(full)) return null;\n const n = parseInt(full, 16);\n return [((n >> 16) & 255) / 255, ((n >> 8) & 255) / 255, (n & 255) / 255];\n};\n\nexport const isValidHex = (hex: string): boolean => parseHex(hex) !== null;\n\nconst toHex = ([r, g, b]: [number, number, number]): string =>\n '#' +\n [r, g, b]\n .map((v) =>\n Math.round(clamp01(v) * 255)\n .toString(16)\n .padStart(2, '0'),\n )\n .join('');\n\n/** `#rrggbb` -> the comma-separated triple the `--x-rgb` tokens use. */\nexport const hexToRgbTriple = (hex: string): string => {\n const rgb = parseHex(hex);\n if (!rgb) return '0, 0, 0';\n return rgb.map((v) => Math.round(v * 255)).join(', ');\n};\n\nconst linearToOklab = ([r, g, b]: [number, number, number]): [number, number, number] => {\n const l = Math.cbrt(0.4122214708 * r + 0.5363325363 * g + 0.0514459929 * b);\n const m = Math.cbrt(0.2119034982 * r + 0.6806995451 * g + 0.1073969566 * b);\n const s = Math.cbrt(0.0883024619 * r + 0.2817188376 * g + 0.6299787005 * b);\n return [\n 0.2104542553 * l + 0.793617785 * m - 0.0040720468 * s,\n 1.9779984951 * l - 2.428592205 * m + 0.4505937099 * s,\n 0.0259040371 * l + 0.7827717662 * m - 0.808675766 * s,\n ];\n};\n\nconst oklabToLinear = ([L, A, B]: [number, number, number]): [number, number, number] => {\n const l = (L + 0.3963377774 * A + 0.2158037573 * B) ** 3;\n const m = (L - 0.1055613458 * A - 0.0638541728 * B) ** 3;\n const s = (L - 0.0894841775 * A - 1.291485548 * B) ** 3;\n return [\n 4.0767416621 * l - 3.3077115913 * m + 0.2309699292 * s,\n -1.2684380046 * l + 2.6097574011 * m - 0.3413193965 * s,\n -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s,\n ];\n};\n\nexport const hexToOklch = (hex: string): Oklch => {\n const rgb = parseHex(hex) ?? [0, 0, 0];\n const [l, a, b] = linearToOklab(rgb.map(srgbToLinear) as [number, number, number]);\n return { l, c: Math.hypot(a, b), h: Math.atan2(b, a) };\n};\n\nconst inGamut = ([r, g, b]: [number, number, number]): boolean =>\n [r, g, b].every((v) => v >= -1e-4 && v <= 1 + 1e-4);\n\n/**\n * Largest chroma that still fits in sRGB at this lightness and hue.\n *\n * Needed because OKLab is a much larger space than sRGB: naively keeping a\n * colour's chroma while changing its lightness frequently lands outside the\n * gamut, where channels clip and the hue visibly shifts.\n */\nconst maxChroma = (l: number, h: number): number => {\n let lo = 0;\n let hi = 0.45;\n for (let i = 0; i < 24; i++) {\n const mid = (lo + hi) / 2;\n if (inGamut(oklabToLinear([l, mid * Math.cos(h), mid * Math.sin(h)]))) lo = mid;\n else hi = mid;\n }\n return lo;\n};\n\nexport const oklchToHex = ({ l, c, h }: Oklch): string => {\n const lc = clamp01(l);\n const cc = Math.min(Math.max(c, 0), maxChroma(lc, h));\n return toHex(\n oklabToLinear([lc, cc * Math.cos(h), cc * Math.sin(h)]).map(linearToSrgb) as [\n number,\n number,\n number,\n ],\n );\n};\n\n// ============================================================================\n// WCAG 2.1 contrast\n// ============================================================================\n\n/**\n * WCAG 2.1 is used rather than APCA. APCA models perception better but is\n * still a draft (targeted at WCAG 3), while WCAG 2 is what consumers are\n * actually audited against. Its known weakness - mis-ranking some mid-tone\n * blues and greens - is accepted for that reason.\n */\nexport const relativeLuminance = (hex: string): number => {\n const [r, g, b] = (parseHex(hex) ?? [0, 0, 0]).map(srgbToLinear);\n return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\n/** Contrast ratio between two colours, 1 (identical) to 21 (black on white). */\nexport const contrastRatio = (a: string, b: string): number => {\n const [x, y] = [relativeLuminance(a), relativeLuminance(b)];\n return (Math.max(x, y) + 0.05) / (Math.min(x, y) + 0.05);\n};\n\n/** The two foreground candidates, matching `--white` and `--gray-900`. */\nexport const CONTRAST_LIGHT = '#ffffff';\nexport const CONTRAST_DARK = '#0f172a';\n\n/**\n * Foreground to place on `fill`.\n *\n * White wins unless it drops below 3:1, at which point the better of the two\n * candidates is used. The threshold is deliberately 3:1 rather than \"whichever\n * scores higher\": on mid-tone reds the dark candidate often scores marginally\n * better while looking plainly wrong, and every preset base clears 4.5:1\n * against white anyway.\n */\nexport const pickContrast = (fill: string): string => {\n const onLight = contrastRatio(fill, CONTRAST_LIGHT);\n if (onLight >= 3) return CONTRAST_LIGHT;\n return onLight >= contrastRatio(fill, CONTRAST_DARK) ? CONTRAST_LIGHT : CONTRAST_DARK;\n};\n\n// ============================================================================\n// Ramp generation\n// ============================================================================\n\n/** The ramp steps, in the order `--x-50` … `--x-900` are declared. */\nexport const RAMP_STEPS = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900] as const;\n\nexport type RampStep = (typeof RAMP_STEPS)[number];\n\n/** The step the supplied base colour occupies; the ramp is built around it. */\nconst BASE_STEP = 500;\n\n/**\n * Target lightness per step, and how much of the base's chroma to keep.\n *\n * Measured from the preset indigo ramp, so feeding the preset primary through\n * `buildRamp` lands close to the shipped `--primary-*` values rather than\n * something arbitrary. It is deliberately not an exact reproduction - see the\n * note on `buildRamp`.\n */\nconst RAMP_CURVE: Record<RampStep, { l: number; chroma: number }> = {\n 50: { l: 0.962, chroma: 0.09 },\n 100: { l: 0.93, chroma: 0.16 },\n 200: { l: 0.87, chroma: 0.3 },\n 300: { l: 0.785, chroma: 0.51 },\n 400: { l: 0.68, chroma: 0.77 },\n 500: { l: 0.558, chroma: 1.0 },\n 600: { l: 0.511, chroma: 1.12 },\n 700: { l: 0.457, chroma: 1.05 },\n 800: { l: 0.398, chroma: 0.87 },\n 900: { l: 0.359, chroma: 0.66 },\n};\n\n/** Ceiling/floor the generated ends aim for, leaving the base itself untouched. */\nconst LIGHT_CEILING = 0.985;\nconst DARK_FLOOR = 0.22;\n\n/** Minimum lightness gap between adjacent steps, so none can collapse together. */\nconst MIN_STEP_DELTA = 0.012;\n\n/**\n * Generates a 50-900 ramp around `base`, which is placed at the 500 step.\n *\n * The base's own hue is always preserved, and `--x-500` is returned as the base\n * hex verbatim, so the colour a consumer picked is never silently replaced.\n *\n * The curve above is *rescaled* to whatever lightness headroom the base leaves,\n * rather than being applied absolutely or simply shifted:\n *\n * - Applying it absolutely would reassign the base - pick a pale yellow and\n * `--x-500` would come back a mid-olive, contradicting `--x-color`.\n * - Shifting it so 500 sits at the base's lightness pushes the light end past\n * `l = 1`, where it clips and 50/100/200/300 all come out pure white.\n *\n * The ends are **absolute**, not relative to the base: step 50 lands near-white\n * and step 900 near-dark whatever lightness the base has, with the remaining\n * steps interpolated between the base and those anchors. Only a base that is\n * already past an anchor compresses that side into what headroom is left.\n *\n * Getting this wrong is subtle. An earlier version offset every step *from the\n * base* by the curve's own distances, capped so the preset reproduced exactly.\n * That looks right - and reproduces the preset ramp perfectly - but it makes the\n * tints relative: a dark navy base (`#1a1a2e`) returned `--primary-50: #8a8a8c`,\n * a mid grey rather than a tint, because 50 sits only 0.404 lightness above 500\n * on the curve. Every consumer of the tint end broke visibly - `Navigation`'s\n * active item paints `--primary-50` and turned into a charcoal pill.\n *\n * Two inputs are genuinely degenerate and are handled rather than solved: a\n * base at or above `LIGHT_CEILING` has no room for tints, and one with zero\n * chroma (pure white, black, any gray) has no saturation to separate them with\n * either. For those the light end converges, and `isRampViable` reports it so\n * the caller can warn. Realistic light picks are fine - `#fde047` still yields\n * five distinct tints.\n */\nexport const buildRamp = (base: string): Record<RampStep, string> => {\n const { l: baseL, c: baseC, h } = hexToOklch(base);\n const anchor = RAMP_CURVE[BASE_STEP].l;\n\n // Where the ends of the scale sit, independent of the base. A base already\n // lighter than the curve's own 50 (or darker than its 900) has nowhere left\n // to go, so that side compresses into the remaining headroom instead.\n const curveLight = RAMP_CURVE[50].l;\n const curveDark = RAMP_CURVE[900].l;\n const lightTarget = baseL >= curveLight ? Math.min(LIGHT_CEILING, baseL + 0.02) : curveLight;\n const darkTarget = baseL <= curveDark ? Math.max(DARK_FLOOR * 0.2, baseL - 0.02) : curveDark;\n\n const lightSpan = curveLight - anchor;\n const darkSpan = anchor - curveDark;\n\n const out = {} as Record<RampStep, string>;\n for (const step of RAMP_STEPS) {\n if (step === BASE_STEP) {\n out[step] = base;\n continue;\n }\n const { l: curveL, chroma } = RAMP_CURVE[step];\n const offset = curveL - anchor;\n // How far along its half of the curve this step sits: 0 at the base, 1 at\n // the end. Interpolating that fraction between the base and the target\n // keeps the curve's shape while pinning where it ends up.\n const t = offset > 0 ? offset / lightSpan : -offset / darkSpan;\n const l = offset > 0 ? baseL + t * (lightTarget - baseL) : baseL - t * (baseL - darkTarget);\n out[step] = oklchToHex({ l, c: baseC * chroma, h });\n }\n\n return enforceSeparation(out, h, baseC);\n};\n\n/**\n * Walks outward from the base step, pushing any step that ended up too close to\n * its neighbour further away. Only bites for extreme inputs (near-white,\n * near-black, zero-chroma), where the rescale above has almost no room left.\n */\nconst enforceSeparation = (\n ramp: Record<RampStep, string>,\n h: number,\n baseC: number,\n): Record<RampStep, string> => {\n const baseIndex = RAMP_STEPS.indexOf(BASE_STEP);\n const lightness = RAMP_STEPS.map((s) => hexToOklch(ramp[s]).l);\n\n // Lighter steps: walk from the base toward 50, each must be lighter.\n for (let i = baseIndex - 1; i >= 0; i--) {\n const limit = lightness[i + 1] + MIN_STEP_DELTA;\n if (lightness[i] < limit) lightness[i] = Math.min(1, limit);\n }\n // Darker steps: walk from the base toward 900, each must be darker.\n for (let i = baseIndex + 1; i < RAMP_STEPS.length; i++) {\n const limit = lightness[i - 1] - MIN_STEP_DELTA;\n if (lightness[i] > limit) lightness[i] = Math.max(0, limit);\n }\n\n const out = {} as Record<RampStep, string>;\n RAMP_STEPS.forEach((step, i) => {\n if (step === BASE_STEP) {\n out[step] = ramp[step];\n return;\n }\n out[step] = oklchToHex({\n l: lightness[i],\n c: baseC * RAMP_CURVE[step].chroma,\n h,\n });\n });\n return out;\n};\n\n/** How far `--x-dark` / `--x-light` sit from the base, in OKLab lightness. */\nconst DARK_DELTA = 0.086;\nconst LIGHT_DELTA = 0.169;\n\n/** Below this lightness there is no room left to darken, so the hover lightens. */\nconst HOVER_INVERT_BELOW = DARK_DELTA * 1.5;\n\n/**\n * The hover/active colour. Must differ *visibly* from the base and stay legible\n * as text on white, since `--x-dark` is used both as a fill (Button, Chip\n * hovers) and as text (Snackbar, link hover in `global.scss`).\n *\n * A fixed ramp step is not good enough: for a near-white base the 600 step\n * lands barely darker than the base and the hover reads as no change at all.\n * Hence a guaranteed delta.\n *\n * For a base that is already near-black the delta is applied *upwards* instead.\n * Clamping to a floor would return a colour lighter than the base while still\n * being named \"dark\", and returning the base unchanged would leave the control\n * with no hover affordance at all; lightening is what dark-surface design\n * systems do anyway.\n */\nexport const deriveDark = (base: string): string => {\n const { l, c, h } = hexToOklch(base);\n const target = l < HOVER_INVERT_BELOW ? l + DARK_DELTA : l - DARK_DELTA;\n return oklchToHex({ l: target, c, h });\n};\n\n/**\n * The light companion. Lightening has a hard ceiling, so for an already-pale\n * base this lands very close to it - acceptable, as `--x-light` is a public\n * token that nothing inside the library currently consumes.\n */\nexport const deriveLight = (base: string): string => {\n const { l, c, h } = hexToOklch(base);\n return oklchToHex({ l: Math.min(LIGHT_CEILING, l + LIGHT_DELTA), c, h });\n};\n\n/**\n * Whether `base` leaves enough lightness headroom to generate a usable 50-900\n * ramp. False only for near-white and near-black, where the tint or shade end\n * necessarily converges - the caller surfaces that as a developer warning\n * rather than silently shipping identical tokens.\n *\n * Deliberately does not test chroma: an unsaturated gray separates perfectly\n * well by lightness alone, and a saturated light colour like `#fde047` still\n * produces five distinct tints. Only the extremes genuinely fail.\n */\nexport const isRampViable = (base: string): boolean => {\n const { l } = hexToOklch(base);\n return l < 0.95 && l > 0.12;\n};\n","import { devWarn } from '../../utils';\nimport {\n RAMP_STEPS,\n buildRamp,\n deriveDark,\n deriveLight,\n hexToRgbTriple,\n isValidHex,\n isRampViable,\n pickContrast,\n} from './ThemeProvider.color';\nimport type {\n ResolvedTheme,\n ThemeColorKey,\n ThemeColorValue,\n ThemeConfig,\n} from './ThemeProvider.types';\n\nexport const THEME_COLOR_KEYS: readonly ThemeColorKey[] = [\n 'primary',\n 'secondary',\n 'success',\n 'danger',\n 'warning',\n 'info',\n 'hyperlink',\n] as const;\n\n/**\n * `hyperlink` is link text on a surface, never a fill, so it has no\n * `--hyperlink-contrast` token - nothing in the library would read it.\n */\nconst FILL_COLOR_KEYS: readonly ThemeColorKey[] = [\n 'primary',\n 'secondary',\n 'success',\n 'danger',\n 'warning',\n 'info',\n] as const;\n\n/** Only `primary` has a 50-900 ramp in `variables.scss`. */\nconst RAMP_COLOR_KEY: ThemeColorKey = 'primary';\n\n/** The eight preset `--font-size-*` values, in declaration order. */\nconst FONT_SIZE_STEPS: readonly [string, number][] = [\n ['xs', 0.75],\n ['sm', 0.875],\n ['base', 1],\n ['md', 1.1],\n ['lg', 1.125],\n ['xl', 1.25],\n ['2xl', 1.5],\n ['3xl', 1.875],\n] as const;\n\n/**\n * The shipped values from `src/styles/variables.scss`.\n *\n * This is a literal copy, not something derived: the ramp is hand-tuned and no\n * generator reproduces it byte for byte. Keeping it literal means a theme equal\n * to the preset writes no CSS properties at all, so default rendering is\n * identical to `dist/index.css`.\n *\n * Must be kept in sync with `variables.scss` by hand. The bases are all chosen\n * to clear WCAG AA against white text; see the comment at the top of that file.\n */\nexport const defaultTheme: Required<ThemeConfig> = {\n colors: {\n primary: '#5c5de8',\n secondary: '#617087',\n success: '#007f57',\n danger: '#d6272f',\n warning: '#9c6300',\n info: '#007a90',\n hyperlink: '#007b84',\n },\n typography: {\n fontFamily:\n \"'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif\",\n monoFamily:\n \"'JetBrains Mono', 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Source Code Pro', monospace\",\n fontScale: 1,\n },\n};\n\n/** The preset `--primary-*` ramp, needed so an unthemed primary emits nothing. */\nconst DEFAULT_PRIMARY_RAMP: Record<number, string> = {\n 50: '#eef2ff',\n 100: '#e0e7ff',\n 200: '#c7d2fe',\n 300: '#a5b4fc',\n 400: '#818cf8',\n 500: '#5c5de8',\n 600: '#4f46e5',\n 700: '#4338ca',\n 800: '#3730a3',\n 900: '#312e81',\n};\n\nexport const FONT_SCALE_MIN = 0.875;\nexport const FONT_SCALE_MAX = 1.25;\n\nconst normalizeColor = (value: ThemeColorValue): { base: string; contrast?: string } =>\n typeof value === 'string' ? { base: value } : value;\n\n/** Fills every absent field from the preset. */\nexport const resolveTheme = (theme: ThemeConfig): ResolvedTheme => {\n const colors = {} as ResolvedTheme['colors'];\n\n for (const key of THEME_COLOR_KEYS) {\n const supplied = theme.colors?.[key];\n const fallback = normalizeColor(defaultTheme.colors[key]!);\n if (supplied === undefined) {\n colors[key] = fallback;\n continue;\n }\n const { base, contrast } = normalizeColor(supplied);\n if (!isValidHex(base)) {\n devWarn(\n `theme-color-${key}`,\n `ThemeProvider: colors.${key} is not a valid hex colour (received ${JSON.stringify(base)}). Falling back to the preset.`,\n );\n colors[key] = fallback;\n continue;\n }\n if (contrast !== undefined && !isValidHex(contrast)) {\n devWarn(\n `theme-contrast-${key}`,\n `ThemeProvider: colors.${key}.contrast is not a valid hex colour (received ${JSON.stringify(contrast)}). It will be computed instead.`,\n );\n colors[key] = { base };\n continue;\n }\n colors[key] = contrast === undefined ? { base } : { base, contrast };\n }\n\n const scale = theme.typography?.fontScale;\n let fontScale = defaultTheme.typography.fontScale!;\n if (scale !== undefined) {\n if (!Number.isFinite(scale) || scale < FONT_SCALE_MIN || scale > FONT_SCALE_MAX) {\n devWarn(\n 'theme-font-scale',\n `ThemeProvider: typography.fontScale must be between ${FONT_SCALE_MIN} and ${FONT_SCALE_MAX} (received ${String(scale)}). Falling back to ${fontScale}.`,\n );\n } else {\n fontScale = scale;\n }\n }\n\n return {\n colors,\n typography: {\n fontFamily: theme.typography?.fontFamily || defaultTheme.typography.fontFamily!,\n monoFamily: theme.typography?.monoFamily || defaultTheme.typography.monoFamily!,\n fontScale,\n },\n };\n};\n\n/**\n * Expands a resolved theme into the flat `--token: value` map to apply.\n *\n * Every family contributes `--x-color`, `--x-rgb`, `--x-dark` and `--x-light`;\n * the six fill families also get `--x-contrast`, and `primary` additionally\n * gets the full `--primary-50…900` ramp.\n */\nexport const buildTokens = (resolved: ResolvedTheme): Record<string, string> => {\n const tokens: Record<string, string> = {};\n\n for (const key of THEME_COLOR_KEYS) {\n const { base, contrast } = resolved.colors[key];\n tokens[`--${key}-color`] = base;\n tokens[`--${key}-rgb`] = hexToRgbTriple(base);\n tokens[`--${key}-dark`] = deriveDark(base);\n tokens[`--${key}-light`] = deriveLight(base);\n\n if (FILL_COLOR_KEYS.includes(key)) {\n tokens[`--${key}-contrast`] = contrast ?? pickContrast(base);\n }\n\n if (key === RAMP_COLOR_KEY) {\n const isPreset = base === normalizeColor(defaultTheme.colors[key]!).base;\n // The preset ramp is hand-tuned, so reuse it verbatim rather than\n // regenerating a near-identical one.\n const ramp = isPreset ? DEFAULT_PRIMARY_RAMP : buildRamp(base);\n if (!isPreset && !isRampViable(base)) {\n devWarn(\n `theme-ramp-${key}`,\n `ThemeProvider: colors.${key} (${base}) is too light or too dark to generate a usable --${key}-50…900 scale; several steps will be identical. Pick a colour with more headroom.`,\n );\n }\n for (const step of RAMP_STEPS) {\n tokens[`--${key}-${step}`] = ramp[step];\n }\n }\n }\n\n const { fontFamily, monoFamily, fontScale } = resolved.typography;\n tokens['--font-family-primary'] = fontFamily;\n tokens['--font-family-mono'] = monoFamily;\n for (const [name, rem] of FONT_SIZE_STEPS) {\n // Trailing zeros trimmed so 1 * 0.75 reads as `0.75rem`, not `0.750rem`.\n tokens[`--font-size-${name}`] = `${parseFloat((rem * fontScale).toFixed(4))}rem`;\n }\n\n return tokens;\n};\n\n/** Tokens for the preset, used to tell which of them are actually overrides. */\nconst DEFAULT_TOKENS = buildTokens(resolveTheme(defaultTheme));\n\n/**\n * Only the tokens that differ from the preset.\n *\n * This is what makes an unthemed `ThemeProvider` a no-op: it writes nothing, so\n * `dist/index.css` stays authoritative and there is no inline-style churn on\n * `documentElement` for values that already match.\n */\nexport const diffFromDefault = (tokens: Record<string, string>): Record<string, string> => {\n const diff: Record<string, string> = {};\n for (const [name, value] of Object.entries(tokens)) {\n if (DEFAULT_TOKENS[name] !== value) diff[name] = value;\n }\n return diff;\n};\n\n/**\n * The resolved theme as a `:root { … }` block.\n *\n * Paste the output into your own stylesheet to bake a theme in at build time -\n * that avoids the brief flash of the preset that any runtime theme has when the\n * value arrives after first paint, and needs no JavaScript at all.\n */\nexport const themeToCss = (resolved: ResolvedTheme): string => {\n const tokens = buildTokens(resolved);\n const body = Object.entries(tokens)\n .map(([name, value]) => ` ${name}: ${value};`)\n .join('\\n');\n return `:root {\\n${body}\\n}`;\n};\n","/**\n * Runtime font registration for the theme system.\n *\n * `--font-family-primary` only *names* families - it cannot make a font\n * available. Selecting \"Plus Jakarta Sans\" on a machine that doesn't have it\n * installed silently falls through to the next stack entry, which is why a\n * theme needs a way to supply the font data itself.\n *\n * ## Why this is CSP-safe\n *\n * Fonts are registered with the CSS Font Loading API from an `ArrayBuffer`:\n *\n * ```ts\n * document.fonts.add(new FontFace(family, buffer));\n * ```\n *\n * CSP's `font-src` directive governs *fetching* a font resource by URL - it is\n * what gates `@font-face { src: url(...) }` and the string form of the\n * `FontFace` constructor. The binary form performs no fetch at all, so there is\n * no request for `font-src` to check and no allowance to configure. Notably\n * this also avoids `blob:` URLs, which *would* require `font-src blob:`.\n *\n * No `<style>` element is created either, so nothing here needs a nonce - the\n * same position as the rest of the theme system.\n */\n\n/** A font registered at runtime, as listed by the editor. */\nexport interface RegisteredFont {\n /** The family name to reference in a font stack. */\n family: string;\n /** Where it came from, so the UI can distinguish uploads from built-ins. */\n source: 'upload';\n}\n\n/**\n * Turns a filename into a usable CSS family name.\n *\n * Deliberately conservative: the real family name lives in the font's internal\n * `name` table, and parsing SFNT tables to read it would be a disproportionate\n * amount of binary handling for a label. The filename is what the user\n * recognises anyway.\n */\nexport const familyNameFromFile = (filename: string): string => {\n const base = filename.replace(/\\.[^.]+$/, '');\n const cleaned = base\n // Strip the weight/style suffixes font vendors append.\n .replace(/[-_](regular|normal|book|roman)$/i, '')\n .replace(/[-_]+/g, ' ')\n // A quoted family name may contain spaces but not quotes or control chars.\n .replace(/[\"'\\\\]/g, '')\n .replace(/\\s+/g, ' ')\n .trim();\n return cleaned || 'Custom Font';\n};\n\n/** Wraps a family name for use in a CSS font stack if it needs quoting. */\nexport const quoteFamily = (family: string): string =>\n /^[a-zA-Z][a-zA-Z0-9-]*$/.test(family) ? family : `'${family}'`;\n\n/**\n * Builds a full stack from a custom family, keeping sensible fallbacks so the\n * page stays readable if the font is ever unavailable.\n */\nexport const toFontStack = (family: string, mono = false): string =>\n mono\n ? `${quoteFamily(family)}, 'SF Mono', Monaco, monospace`\n : `${quoteFamily(family)}, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif`;\n\n/** Font formats accepted for upload, as an `accept` attribute value. */\nexport const FONT_ACCEPT = '.woff2,.woff,.ttf,.otf';\n\nconst SUPPORTED_EXTENSIONS = /\\.(woff2|woff|ttf|otf)$/i;\n\nexport const isSupportedFontFile = (filename: string): boolean =>\n SUPPORTED_EXTENSIONS.test(filename);\n\n/**\n * Registers font data with the document so a theme can reference its family.\n *\n * Resolves with the family name actually registered. Rejects if the data is not\n * a font the browser can parse, or if the Font Loading API is unavailable\n * (notably during SSR, where there is no `document` to register against).\n */\nexport const registerFontFace = async (family: string, data: ArrayBuffer): Promise<string> => {\n if (typeof document === 'undefined' || !document.fonts) {\n throw new Error('registerFontFace requires a document with the CSS Font Loading API.');\n }\n\n // ArrayBuffer source - no URL is fetched, so CSP's font-src never applies.\n const face = new FontFace(family, data);\n await face.load();\n document.fonts.add(face);\n // No cache invalidation needed: only positive results are cached, and this\n // family could not have been cached positive while it was still unavailable.\n // `document.fonts.add` also fires `loadingdone`, which wakes subscribers.\n return family;\n};\n\n/** Reads a File and registers it, returning the family name it was given. */\nexport const registerFontFile = async (file: File, family?: string): Promise<string> => {\n if (!isSupportedFontFile(file.name)) {\n throw new Error(`Unsupported font format: ${file.name}. Use ${FONT_ACCEPT}.`);\n }\n const buffer = await file.arrayBuffer();\n return registerFontFace(family ?? familyNameFromFile(file.name), buffer);\n};\n\n/**\n * CSS generic families, which always resolve and must never be reported\n * missing. They also cannot be probed by the method below, since asking for\n * `monospace, monospace` measures identically to `monospace` alone.\n */\nconst GENERIC_FAMILIES = new Set([\n 'serif',\n 'sans-serif',\n 'monospace',\n 'cursive',\n 'fantasy',\n 'system-ui',\n 'ui-serif',\n 'ui-sans-serif',\n 'ui-monospace',\n 'ui-rounded',\n 'math',\n 'emoji',\n 'fangsong',\n 'inherit',\n 'initial',\n 'unset',\n]);\n\n/**\n * Mixed-width glyphs, so a real font is very unlikely to measure identically\n * to a fallback by coincidence.\n */\nconst PROBE_TEXT = 'mmmmmmmmmmlliI0OWw@';\n\n/** Two structurally different fallbacks - a font need only differ from one. */\nconst PROBE_FALLBACKS = ['monospace', 'serif'] as const;\n\n/**\n * Cached per family - **positive results only**.\n *\n * A negative answer is not stable: web fonts load asynchronously (always, with\n * `font-display: swap`), so a family probed during the first render is\n * legitimately unavailable and becomes available moments later. Caching that\n * `false` pinned the answer forever, which showed a permanent \"not installed\"\n * warning for fonts that had in fact loaded.\n *\n * A positive answer cannot go stale the same way - a loaded font is not\n * unloaded - so those are worth keeping. Re-probing the misses costs one canvas\n * measurement each.\n */\nconst availabilityCache = new Map<string, true>();\n\n/**\n * Notifies when the set of usable fonts changes, so a caller rendering an\n * availability state can re-check.\n *\n * Both signals are needed: `loadingdone` covers fonts that begin loading after\n * subscription, while `ready` covers those already in flight when the listener\n * was attached - which is the common case for a stylesheet's `@font-face`\n * rules, since they start loading before any component mounts.\n */\nexport const subscribeToFontLoads = (onChange: () => void): (() => void) => {\n if (typeof document === 'undefined' || !document.fonts) return () => {};\n\n let active = true;\n const handler = () => {\n if (active) onChange();\n };\n\n document.fonts.addEventListener('loadingdone', handler);\n void document.fonts.ready.then(handler);\n\n return () => {\n active = false;\n document.fonts.removeEventListener('loadingdone', handler);\n };\n};\n\n/**\n * Whether a font family will actually render, rather than silently falling\n * through to the next entry in the stack.\n *\n * **`document.fonts.check` cannot answer this.** Per spec it reports whether\n * the faces *in the FontFaceSet* matching the query are loaded, so with no\n * matching face it returns `true` vacuously. Verified in a real browser: it\n * answers `true` for `'Totally Not A Real Font 12345'`, and therefore for every\n * uninstalled system font too. Using it here produced a check that could never\n * fail.\n *\n * Instead the family is measured on a canvas against two fallbacks. If it\n * resolves to anything real, the text measures differently from at least one\n * fallback alone; if it does not resolve, the browser renders that fallback and\n * the widths match exactly.\n */\nexport const isFontAvailable = (family: string): boolean => {\n const name = family.trim().replace(/^['\"]|['\"]$/g, '');\n if (!name) return true;\n if (GENERIC_FAMILIES.has(name.toLowerCase())) return true;\n if (typeof document === 'undefined') return true;\n\n if (availabilityCache.get(name)) return true;\n\n try {\n const context = document.createElement('canvas').getContext('2d');\n if (!context) return true;\n\n const available = PROBE_FALLBACKS.some((fallback) => {\n context.font = `100px ${fallback}`;\n const baseline = context.measureText(PROBE_TEXT).width;\n context.font = `100px ${quoteFamily(name)}, ${fallback}`;\n // An invalid font shorthand leaves `font` untouched, which measures as\n // the baseline and correctly reports the family as unavailable.\n return Math.abs(context.measureText(PROBE_TEXT).width - baseline) > 0.5;\n });\n\n if (available) availabilityCache.set(name, true);\n return available;\n } catch {\n // Never report a font missing because probing itself failed - and don't\n // cache a failure, so a later call can still get a real answer.\n return true;\n }\n};\n\n/** Whether the first family in a stack will render. */\nexport const isFontStackAvailable = (stack: string): boolean =>\n isFontAvailable(stack.split(',')[0] ?? '');\n"],"mappings":"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","names":["value"]}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
|
+
dualModifier,
|
|
3
|
+
fullWidthModifier,
|
|
2
4
|
renderIcon
|
|
3
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-EAJHEYZM.js";
|
|
4
6
|
|
|
5
7
|
// src/components/Tabs/Tabs.component.tsx
|
|
6
8
|
import React, { useState, useRef, useContext, useEffect, useLayoutEffect } from "react";
|
|
@@ -45,7 +47,7 @@ var Tab = ({
|
|
|
45
47
|
`eidos-tab--${size}`,
|
|
46
48
|
isActive && "eidos-tab--active",
|
|
47
49
|
disabled && "eidos-tab--disabled",
|
|
48
|
-
fullWidth && "eidos-tab
|
|
50
|
+
fullWidth && fullWidthModifier("eidos-tab"),
|
|
49
51
|
className
|
|
50
52
|
].filter(Boolean).join(" ");
|
|
51
53
|
return /* @__PURE__ */ jsxs(
|
|
@@ -186,11 +188,11 @@ var Tabs = ({
|
|
|
186
188
|
const listClasses = [
|
|
187
189
|
"eidos-tabs-list",
|
|
188
190
|
`eidos-tabs-list--${size}`,
|
|
189
|
-
fullWidth && "eidos-tabs-list
|
|
191
|
+
fullWidth && fullWidthModifier("eidos-tabs-list"),
|
|
190
192
|
// With buttons, they are the affordance - a native scrollbar underneath
|
|
191
193
|
// them is redundant, and on a space-taking one it would also sit over the
|
|
192
194
|
// `line` variant's rule.
|
|
193
|
-
hasScrollButtons && "eidos-tabs-list
|
|
195
|
+
hasScrollButtons && dualModifier("eidos-tabs-list", "hide-scrollbar", "hideScrollbar")
|
|
194
196
|
].filter(Boolean).join(" ");
|
|
195
197
|
const showPrevButton = hasScrollButtons && scrollState.canScrollPrev;
|
|
196
198
|
const showNextButton = hasScrollButtons && scrollState.canScrollNext;
|
|
@@ -216,6 +218,7 @@ var Tabs = ({
|
|
|
216
218
|
type: "button",
|
|
217
219
|
className: scrollButtonClasses("prev"),
|
|
218
220
|
onClick: () => scrollByStep(-1),
|
|
221
|
+
onMouseDown: (event) => event.preventDefault(),
|
|
219
222
|
tabIndex: -1,
|
|
220
223
|
"aria-hidden": "true",
|
|
221
224
|
children: /* @__PURE__ */ jsx(ChevronLeft, { className: "eidos-tabs-scroll-button-icon" })
|
|
@@ -231,6 +234,7 @@ var Tabs = ({
|
|
|
231
234
|
type: "button",
|
|
232
235
|
className: scrollButtonClasses("next"),
|
|
233
236
|
onClick: () => scrollByStep(1),
|
|
237
|
+
onMouseDown: (event) => event.preventDefault(),
|
|
234
238
|
tabIndex: -1,
|
|
235
239
|
"aria-hidden": "true",
|
|
236
240
|
children: /* @__PURE__ */ jsx(ChevronRight, { className: "eidos-tabs-scroll-button-icon" })
|
|
@@ -247,4 +251,4 @@ export {
|
|
|
247
251
|
TabPanel,
|
|
248
252
|
Tabs
|
|
249
253
|
};
|
|
250
|
-
//# sourceMappingURL=chunk-
|
|
254
|
+
//# sourceMappingURL=chunk-L23WWO3D.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Tabs/Tabs.component.tsx"],"sourcesContent":["import React, { useState, useRef, useContext, useEffect, useLayoutEffect } from 'react';\nimport { ChevronLeft, ChevronRight } from 'lucide-react';\nimport { renderIcon, dualModifier, fullWidthModifier } from '../../utils';\nimport type { TabsProps, TabProps, TabPanelProps, TabsContextValue } from './Tabs.types';\n\n// ============================================================================\n// CONTEXT\n// ============================================================================\n\nconst TabsContext = React.createContext<TabsContextValue | null>(null);\n\nconst useTabsContext = (): TabsContextValue => {\n const ctx = useContext(TabsContext);\n if (!ctx) throw new Error('Tab/TabPanel must be used inside <Tabs>');\n return ctx;\n};\n\n// ============================================================================\n// TAB - individual tab trigger button\n// Defined before Tabs so Tabs can use `child.type === Tab` for child separation.\n// ============================================================================\n\nexport const Tab: React.FC<TabProps> = ({\n value,\n children,\n disabled = false,\n icon,\n className = '',\n}) => {\n const { activeValue, onSelect, size, fullWidth, listRef } = useTabsContext();\n const isActive = activeValue === value;\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLButtonElement>) => {\n const list = listRef.current;\n if (!list) return;\n\n const allTabs = Array.from(\n list.querySelectorAll('[role=\"tab\"]:not([disabled])'),\n ) as HTMLElement[];\n const currentIndex = allTabs.indexOf(e.currentTarget);\n if (currentIndex === -1) return;\n\n let targetIndex = -1;\n if (e.key === 'ArrowRight') targetIndex = (currentIndex + 1) % allTabs.length;\n else if (e.key === 'ArrowLeft')\n targetIndex = (currentIndex - 1 + allTabs.length) % allTabs.length;\n else if (e.key === 'Home') targetIndex = 0;\n else if (e.key === 'End') targetIndex = allTabs.length - 1;\n\n if (targetIndex !== -1) {\n e.preventDefault();\n allTabs[targetIndex].focus();\n }\n };\n\n const tabClasses = [\n 'eidos-tab',\n `eidos-tab--${size}`,\n isActive && 'eidos-tab--active',\n disabled && 'eidos-tab--disabled',\n fullWidth && fullWidthModifier('eidos-tab'),\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <button\n id={`eidos-tab-${value}`}\n role=\"tab\"\n aria-selected={isActive}\n aria-controls={`eidos-tabpanel-${value}`}\n tabIndex={isActive ? 0 : -1}\n disabled={disabled}\n className={tabClasses}\n onClick={() => !disabled && onSelect(value)}\n onKeyDown={handleKeyDown}\n type=\"button\"\n >\n {icon && <span className=\"eidos-tab-icon\">{renderIcon(icon, 'eidos-tab-icon-svg')}</span>}\n <span className=\"eidos-tab-label\">{children}</span>\n </button>\n );\n};\n\nTab.displayName = 'Tab';\n\n// ============================================================================\n// TAB PANEL - content region shown when its value matches the active tab\n// Defined before Tabs for the same `child.type === TabPanel` check.\n// ============================================================================\n\nexport const TabPanel: React.FC<TabPanelProps> = ({ value, children, className = '' }) => {\n const { activeValue } = useTabsContext();\n const isActive = activeValue === value;\n\n if (!isActive) return null;\n\n return (\n <div\n id={`eidos-tabpanel-${value}`}\n role=\"tabpanel\"\n aria-labelledby={`eidos-tab-${value}`}\n tabIndex={0}\n className={['eidos-tab-panel', className].filter(Boolean).join(' ')}\n >\n {children}\n </div>\n );\n};\n\nTabPanel.displayName = 'TabPanel';\n\n// ============================================================================\n// TABS - root container; provides context, separates tab/panel children\n// ============================================================================\n\nexport const Tabs: React.FC<TabsProps> = ({\n value,\n defaultValue,\n onChange,\n variant = 'line',\n size = 'md',\n color = 'primary',\n fullWidth = false,\n scrollButtons = 'auto',\n className = '',\n children,\n}) => {\n const isControlled = value !== undefined;\n const [localValue, setLocalValue] = useState(defaultValue ?? '');\n const activeValue = isControlled ? value! : localValue;\n\n // Separate Tab and TabPanel children so the list and panels render in\n // distinct DOM regions, regardless of how the consumer orders them.\n const tabChildren: React.ReactElement[] = [];\n const panelChildren: React.ReactElement[] = [];\n\n React.Children.forEach(children, (child) => {\n if (!React.isValidElement(child)) return;\n if (child.type === Tab) {\n tabChildren.push(child);\n } else if (child.type === TabPanel) {\n panelChildren.push(child);\n }\n });\n\n const listRef = useRef<HTMLDivElement>(null);\n const indicatorRef = useRef<HTMLSpanElement>(null);\n // Tracks whether the indicator has been positioned at least once so we can\n // skip the CSS transition on the very first render and avoid it animating\n // from the top-left corner to the initial tab.\n const hasPositioned = useRef(false);\n\n useLayoutEffect(() => {\n if (variant !== 'line') return;\n const list = listRef.current;\n const indicator = indicatorRef.current;\n if (!list || !indicator) return;\n\n const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n if (!activeTab) return;\n\n // Suppress the CSS transition on the initial paint so the indicator snaps\n // into place rather than sliding from 0.\n if (!hasPositioned.current) {\n indicator.style.transition = 'none';\n }\n\n indicator.style.left = `${activeTab.offsetLeft}px`;\n indicator.style.width = `${activeTab.offsetWidth}px`;\n\n if (!hasPositioned.current) {\n // Force a synchronous reflow so the browser commits the no-transition\n // position before we re-enable the transition for future clicks.\n void indicator.offsetWidth;\n indicator.style.transition = '';\n hasPositioned.current = true;\n }\n }, [activeValue, variant, fullWidth]);\n\n // The list scrolls horizontally when the strip is wider than its container,\n // so an activated tab can sit outside the scrollport - reachable by keyboard\n // (`End`) or by a controlled `value` change, but invisible. `scrollLeft` is\n // adjusted directly rather than via `scrollIntoView`, which walks the whole\n // ancestor chain and would scroll the page vertically when the strip is below\n // the fold.\n useLayoutEffect(() => {\n const list = listRef.current;\n if (!list) return;\n\n const activeTab = list.querySelector('[aria-selected=\"true\"]') as HTMLElement | null;\n if (!activeTab) return;\n\n const left = activeTab.offsetLeft;\n const right = left + activeTab.offsetWidth;\n\n if (left < list.scrollLeft) {\n list.scrollLeft = left;\n } else if (right > list.scrollLeft + list.clientWidth) {\n list.scrollLeft = right - list.clientWidth;\n }\n }, [activeValue]);\n\n // Whether either end of the strip has content hidden past it. Drives both\n // the presence of the scroll buttons (neither end scrollable = the strip\n // fits, so no buttons) and their disabled state at the extremes.\n const [scrollState, setScrollState] = useState({ canScrollPrev: false, canScrollNext: false });\n const hasScrollButtons = scrollButtons !== 'none';\n\n useEffect(() => {\n if (!hasScrollButtons) return;\n const list = listRef.current;\n if (!list) return;\n\n const update = () => {\n const maxScroll = list.scrollWidth - list.clientWidth;\n // 1px of tolerance: fractional layout widths leave a sub-pixel remainder\n // at either end that would otherwise keep a button enabled for a scroll\n // that can no longer move anything.\n const canScrollPrev = list.scrollLeft > 1;\n const canScrollNext = list.scrollLeft < maxScroll - 1;\n setScrollState((previous) =>\n previous.canScrollPrev === canScrollPrev && previous.canScrollNext === canScrollNext\n ? previous\n : { canScrollPrev, canScrollNext },\n );\n };\n\n update();\n list.addEventListener('scroll', update, { passive: true });\n\n // The list's own box stays the same width when a tab's label reflows or a\n // font finishes loading, so the tabs have to be observed as well as the\n // container - only their sizes tell us the strip started overflowing.\n const observer = new ResizeObserver(update);\n observer.observe(list);\n Array.from(list.children).forEach((child) => observer.observe(child));\n\n return () => {\n list.removeEventListener('scroll', update);\n observer.disconnect();\n };\n }, [hasScrollButtons, tabChildren.length, size, variant, fullWidth]);\n\n const scrollByStep = (direction: -1 | 1) => {\n const list = listRef.current;\n if (!list) return;\n\n // A step just short of a full page keeps a tab of context on screen, the\n // same way a paged scrollbar click does.\n const step = list.clientWidth * 0.8;\n const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n list.scrollBy({ left: direction * step, behavior: reducedMotion ? 'auto' : 'smooth' });\n };\n\n const onSelect = (newValue: string) => {\n if (!isControlled) {\n setLocalValue(newValue);\n }\n onChange?.(newValue);\n };\n\n const rootClasses = ['eidos-tabs', `eidos-tabs--${variant}`, `eidos-tabs--${color}`, className]\n .filter(Boolean)\n .join(' ');\n\n const listClasses = [\n 'eidos-tabs-list',\n `eidos-tabs-list--${size}`,\n fullWidth && fullWidthModifier('eidos-tabs-list'),\n // With buttons, they are the affordance - a native scrollbar underneath\n // them is redundant, and on a space-taking one it would also sit over the\n // `line` variant's rule.\n hasScrollButtons && dualModifier('eidos-tabs-list', 'hide-scrollbar', 'hideScrollbar'),\n ]\n .filter(Boolean)\n .join(' ');\n\n // Each button exists only while its own direction has somewhere to go: none\n // at all when the strip fits, and none at the end you have reached. A\n // disabled button would be pointing at nothing. They are positioned\n // absolutely, so appearing and disappearing never moves the tabs.\n const showPrevButton = hasScrollButtons && scrollState.canScrollPrev;\n const showNextButton = hasScrollButtons && scrollState.canScrollNext;\n\n const scrollButtonClasses = (direction: 'prev' | 'next') =>\n [\n 'eidos-tabs-scroll-button',\n `eidos-tabs-scroll-button--${direction}`,\n `eidos-tabs-scroll-button--${size}`,\n ].join(' ');\n\n const contextValue: TabsContextValue = {\n activeValue,\n onSelect,\n variant,\n size,\n color,\n fullWidth,\n listRef,\n };\n\n return (\n <TabsContext.Provider value={contextValue}>\n <div className={rootClasses}>\n {/* The buttons are siblings of the tab list, never children of it:\n `role=\"tablist\"` only accepts tabs. They are also hidden from\n assistive tech and skipped by Tab, because they are a pointer\n affordance for something the keyboard already does - arrow keys\n move between tabs and scroll the active one into view. */}\n <div className=\"eidos-tabs-bar\">\n {showPrevButton && (\n <button\n type=\"button\"\n className={scrollButtonClasses('prev')}\n onClick={() => scrollByStep(-1)}\n // `tabIndex={-1}` keeps these out of the tab order but does not\n // stop a click from focusing them, and focus inside an\n // `aria-hidden` subtree is an error the browser reports\n // (\"Blocked aria-hidden on an element because its descendant\n // retained focus\"). Suppressing the default mousedown keeps\n // them unfocusable by pointer too; the click still fires.\n // `inert` would prevent the click as well, so it is no help.\n onMouseDown={(event) => event.preventDefault()}\n tabIndex={-1}\n aria-hidden=\"true\"\n >\n <ChevronLeft className=\"eidos-tabs-scroll-button-icon\" />\n </button>\n )}\n\n <div ref={listRef} className={listClasses} role=\"tablist\">\n {tabChildren}\n {variant === 'line' && (\n <span ref={indicatorRef} className=\"eidos-tabs-indicator\" aria-hidden=\"true\" />\n )}\n </div>\n\n {showNextButton && (\n <button\n type=\"button\"\n className={scrollButtonClasses('next')}\n onClick={() => scrollByStep(1)}\n onMouseDown={(event) => event.preventDefault()} // see the prev button\n tabIndex={-1}\n aria-hidden=\"true\"\n >\n <ChevronRight className=\"eidos-tabs-scroll-button-icon\" />\n </button>\n )}\n </div>\n\n <div className=\"eidos-tabs-panels\">{panelChildren}</div>\n </div>\n </TabsContext.Provider>\n );\n};\n\nTabs.displayName = 'Tabs';\n"],"mappings":"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","names":[]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
renderIcon
|
|
3
|
-
} from "./chunk-KBG77JHC.js";
|
|
4
1
|
import {
|
|
5
2
|
Tooltip
|
|
6
3
|
} from "./chunk-YV57RSPD.js";
|
|
4
|
+
import {
|
|
5
|
+
renderIcon
|
|
6
|
+
} from "./chunk-EAJHEYZM.js";
|
|
7
7
|
|
|
8
8
|
// src/components/Button/Button.component.tsx
|
|
9
9
|
import { LoaderCircle } from "lucide-react";
|
|
@@ -66,4 +66,4 @@ export {
|
|
|
66
66
|
Button,
|
|
67
67
|
IconButton
|
|
68
68
|
};
|
|
69
|
-
//# sourceMappingURL=chunk-
|
|
69
|
+
//# sourceMappingURL=chunk-L5Q6UDY3.js.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunk75VXB3H2cjs = require('./chunk-75VXB3H2.cjs');
|
|
4
4
|
|
|
5
5
|
// src/components/ColorPicker/ColorPicker.component.tsx
|
|
6
6
|
var _react = require('react');
|
|
@@ -496,7 +496,7 @@ var ColorPicker = ({
|
|
|
496
496
|
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: rootClasses, children: [
|
|
497
497
|
label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "eidos-color-picker-label", children: label }),
|
|
498
498
|
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
499
|
-
|
|
499
|
+
_chunk75VXB3H2cjs.Dropdown,
|
|
500
500
|
{
|
|
501
501
|
trigger: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
502
502
|
"button",
|
|
@@ -531,4 +531,4 @@ ColorPicker.displayName = "ColorPicker";
|
|
|
531
531
|
|
|
532
532
|
|
|
533
533
|
exports.ColorPicker = ColorPicker;
|
|
534
|
-
//# sourceMappingURL=chunk-
|
|
534
|
+
//# sourceMappingURL=chunk-LVHZBCTA.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-5BX4Q76D.cjs","../src/components/ColorPicker/ColorPicker.component.tsx"],"names":[],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACJA,8BAAgE;AAChE,2CAA4B;AAqfpB,+CAAA;AAveR,IAAM,iBAAA,EAA6B;AAAA,EACjC,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA;AAMA,SAAS,QAAA,CAAS,CAAA,EAAW,CAAA,EAAW,CAAA,EAAqB;AAE3D,EAAA,MAAM,GAAA,EAAK,EAAA,EAAI,GAAA;AACf,EAAA,MAAM,GAAA,EAAK,EAAA,EAAI,GAAA;AACf,EAAA,MAAM,EAAA,EAAI,GAAA,EAAK,EAAA;AACf,EAAA,MAAM,EAAA,EAAI,EAAA,EAAA,CAAK,EAAA,EAAI,IAAA,CAAK,GAAA,CAAM,EAAA,EAAI,GAAA,EAAM,EAAA,EAAK,CAAC,CAAA,CAAA;AAC9C,EAAA,MAAM,EAAA,EAAI,GAAA,EAAK,CAAA;AAEf,EAAA,IAAI,CAAA,EAAW,CAAA,EAAW,CAAA;AAC1B,EAAA,GAAA,CAAI,EAAA,EAAI,EAAA,EAAI;AACV,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN,EAAA,KAAA,GAAA,CAAW,EAAA,EAAI,GAAA,EAAK;AAClB,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN,EAAA,KAAA,GAAA,CAAW,EAAA,EAAI,GAAA,EAAK;AAClB,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN,EAAA,KAAA,GAAA,CAAW,EAAA,EAAI,GAAA,EAAK;AAClB,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN,EAAA,KAAA,GAAA,CAAW,EAAA,EAAI,GAAA,EAAK;AAClB,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN,EAAA,KAAO;AACL,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AACJ,IAAA,EAAA,EAAI,CAAA;AAAA,EACN;AAEA,EAAA,OAAO;AAAA,IACL,CAAA,EAAG,IAAA,CAAK,KAAA,CAAA,CAAO,EAAA,EAAI,CAAA,EAAA,EAAK,GAAG,CAAA;AAAA,IAC3B,CAAA,EAAG,IAAA,CAAK,KAAA,CAAA,CAAO,EAAA,EAAI,CAAA,EAAA,EAAK,GAAG,CAAA;AAAA,IAC3B,CAAA,EAAG,IAAA,CAAK,KAAA,CAAA,CAAO,EAAA,EAAI,CAAA,EAAA,EAAK,GAAG;AAAA,EAC7B,CAAA;AACF;AAEA,SAAS,QAAA,CAAS,CAAA,EAAW,CAAA,EAAW,CAAA,EAAqB;AAE3D,EAAA,MAAM,GAAA,EAAK,EAAA,EAAI,GAAA;AACf,EAAA,MAAM,GAAA,EAAK,EAAA,EAAI,GAAA;AACf,EAAA,MAAM,GAAA,EAAK,EAAA,EAAI,GAAA;AAEf,EAAA,MAAM,IAAA,EAAM,IAAA,CAAK,GAAA,CAAI,EAAA,EAAI,EAAA,EAAI,EAAE,CAAA;AAC/B,EAAA,MAAM,IAAA,EAAM,IAAA,CAAK,GAAA,CAAI,EAAA,EAAI,EAAA,EAAI,EAAE,CAAA;AAC/B,EAAA,MAAM,MAAA,EAAQ,IAAA,EAAM,GAAA;AAEpB,EAAA,MAAM,EAAA,EAAI,IAAA,EAAM,GAAA;AAChB,EAAA,MAAM,EAAA,EAAI,IAAA,IAAQ,EAAA,EAAI,EAAA,EAAK,MAAA,EAAQ,IAAA,EAAO,GAAA;AAE1C,EAAA,IAAI,EAAA,EAAI,CAAA;AACR,EAAA,GAAA,CAAI,MAAA,IAAU,CAAA,EAAG;AACf,IAAA,GAAA,CAAI,IAAA,IAAQ,EAAA,EAAI,EAAA,EAAA,CAAM,GAAA,EAAK,EAAA,EAAA,EAAM,MAAA,EAAS,CAAA;AAAA,IAAA,KAAA,GAAA,CACjC,IAAA,IAAQ,EAAA,EAAI,EAAA,EAAA,CAAK,GAAA,EAAK,EAAA,EAAA,EAAM,MAAA,EAAQ,CAAA;AAAA,IAAA,KACxC,EAAA,EAAA,CAAK,GAAA,EAAK,EAAA,EAAA,EAAM,MAAA,EAAQ,CAAA;AAC7B,IAAA,EAAA,EAAI,EAAA,EAAI,EAAA;AACR,IAAA,GAAA,CAAI,EAAA,EAAI,CAAA,EAAG,EAAA,GAAK,GAAA;AAAA,EAClB;AASA,EAAA,OAAO,EAAE,CAAA,EAAG,CAAA,EAAG,EAAE,CAAA;AACnB;AAEA,SAAS,QAAA,CAAS,CAAA,EAAW,CAAA,EAAW,CAAA,EAAmB;AACzD,EAAA,MAAM,GAAA,EAAK,CAAC,CAAA,EAAA,GACV,IAAA,CAAK,KAAA,CAAM,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,IAAA,CAAK,GAAA,CAAI,GAAA,EAAK,CAAC,CAAC,CAAC,CAAA,CACrC,QAAA,CAAS,EAAE,CAAA,CACX,QAAA,CAAS,CAAA,EAAG,GAAG,CAAA;AACpB,EAAA,OAAO,CAAA,CAAA,EAAI,EAAA,CAAG,CAAC,CAAC,CAAA,EAAA;AAClB;AAEkB;AACF,EAAA;AACY,EAAA;AAET,EAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACJ,EAAA;AACI,IAAA;AACA,IAAA;AACA,IAAA;AACV,EAAA;AACE,IAAA;AACT,EAAA;AAEgB,EAAA;AACC,EAAA;AACnB;AAEkB;AAED,EAAA;AACA,EAAA;AACA,EAAA;AAEE,EAAA;AACA,EAAA;AACH,EAAA;AACG,EAAA;AAET,EAAA;AACA,EAAA;AAES,EAAA;AACF,IAAA;AACG,IAAA;AACP,IAAA;AACM,IAAA;AACP,IAAA;AACG,IAAA;AACb,EAAA;AAEiB,EAAA;AACnB;AAEkB;AAED,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AACA,EAAA;AAEW,EAAA;AACd,EAAA;AACN,IAAA;AACA,IAAA;AACA,IAAA;AACS,EAAA;AACT,IAAA;AACA,IAAA;AACA,IAAA;AACS,EAAA;AACT,IAAA;AACA,IAAA;AACA,IAAA;AACS,EAAA;AACT,IAAA;AACA,IAAA;AACA,IAAA;AACS,EAAA;AACT,IAAA;AACA,IAAA;AACA,IAAA;AACC,EAAA;AACD,IAAA;AACA,IAAA;AACA,IAAA;AACN,EAAA;AAEO,EAAA;AACU,IAAA;AACA,IAAA;AACA,IAAA;AACjB,EAAA;AACF;AAMS;AACK,EAAA;AAEC,EAAA;AACN,IAAA;AACI,MAAA;AACJ,IAAA;AACI,MAAA;AAGG,IAAA;AACE,MAAA;AACL,MAAA;AAGT,IAAA;AACF,EAAA;AACF;AAES;AACQ,EAAA;AAGT,EAAA;AACY,EAAA;AAGD,EAAA;AACH,EAAA;AACL,IAAA;AACO,MAAA;AACA,MAAA;AACA,MAAA;AACd,IAAA;AACF,EAAA;AAGiB,EAAA;AACH,EAAA;AACL,IAAA;AACI,MAAA;AACA,MAAA;AACA,MAAA;AACX,IAAA;AACF,EAAA;AAEO,EAAA;AACT;AAGkB;AACJ,EAAA;AACC,EAAA;AACf;AAMwD;AACtD,EAAA;AACA,EAAA;AACA,EAAA;AACS,EAAA;AACG,EAAA;AACG,EAAA;AACJ,EAAA;AACA,EAAA;AACJ,EAAA;AACE,EAAA;AACT,EAAA;AACY,EAAA;AACR;AAEE,EAAA;AAGM,EAAA;AACE,EAAA;AACP,EAAA;AACA,EAAA;AACL,IAAA;AACF,EAAA;AACe,EAAA;AAGA,EAAA;AACE,EAAA;AAEA,EAAA;AACR,EAAA;AAEH,EAAA;AACU,EAAA;AAGV,EAAA;AACM,EAAA;AAEN,EAAA;AACA,EAAA;AAGA,EAAA;AAKA,EAAA;AAGA,EAAA;AACA,EAAA;AAMU,EAAA;AACA,IAAA;AACF,IAAA;AACF,IAAA;AACK,IAAA;AACT,IAAA;AACO,MAAA;AACb,IAAA;AAGI,IAAA;AACS,IAAA;AACR,IAAA;AACU,MAAA;AACf,IAAA;AACS,EAAA;AAGK,EAAA;AACD,IAAA;AACP,MAAA;AACO,QAAA;AACA,QAAA;AACX,MAAA;AACI,MAAA;AACN,IAAA;AACG,EAAA;AAIC,EAAA;AACS,IAAA;AACJ,IAAA;AAEJ,IAAA;AACU,MAAA;AACf,IAAA;AAEY,IAAA;AACA,IAAA;AACA,oBAAA;AACT,EAAA;AAGC,EAAA;AACqC,IAAA;AACzB,MAAA;AACZ,MAAA;AAEW,MAAA;AACL,QAAA;AACD,QAAA;AACC,QAAA;AACI,QAAA;AACA,QAAA;AACC,QAAA;AACb,MAAA;AAEO,MAAA;AAED,MAAA;AACA,MAAA;AACK,QAAA;AACA,QAAA;AACT,QAAA;AACF,MAAA;AAEA,MAAA;AACS,MAAA;AACA,MAAA;AACX,IAAA;AACW,IAAA;AACb,EAAA;AAGM,EAAA;AACwC,IAAA;AAC7B,MAAA;AACf,IAAA;AACW,IAAA;AACb,EAAA;AAGM,EAAA;AACwC,IAAA;AAC/B,MAAA;AACb,IAAA;AACW,IAAA;AACb,EAAA;AAGM,EAAA;AACJ,IAAA;AACa,IAAA;AACV,EAAA;AAGC,EAAA;AACQ,IAAA;AACF,IAAA;AAEK,MAAA;AACb,MAAA;AACF,IAAA;AACe,IAAA;AACJ,IAAA;AAEE,IAAA;AACA,EAAA;AAGT,EAAA;AACa,IAAA;AACH,MAAA;AACF,MAAA;AACC,MAAA;AACb,IAAA;AACW,IAAA;AACb,EAAA;AAGM,EAAA;AACS,IAAA;AACH,IAAA;AAGI,MAAA;AACN,MAAA;AACJ,MAAA;AAEW,IAAA;AAEZ,IAAA;AACA,EAAA;AAKC,EAAA;AAEA,EAAA;AACJ,IAAA;AACE,MAAA;AACA,MAAA;AACA,MAAA;AACA,MAAA;AACA,MAAA;AACS,IAAA;AACX,IAAA;AACA,IAAA;AACF,EAAA;AAUE,EAAA;AAAC,IAAA;AAAA,IAAA;AACY,MAAA;AAKX,MAAA;AAAA,wBAAA;AAAC,UAAA;AAAA,UAAA;AACM,YAAA;AACL,YAAA;AACO,YAAA;AACL,cAAA;AACE,gBAAA;AACA,gBAAA;AACA,cAAA;AACJ,YAAA;AACA,YAAA;AACK,YAAA;AAEL,YAAA;AAAC,cAAA;AAAA,cAAA;AACC,gBAAA;AACA,gBAAA;AAAO;AAAA;AAGL,kBAAA;AACA,kBAAA;AACA,kBAAA;AACF,gBAAA;AAAA,cAAA;AACF,YAAA;AAAA,UAAA;AACF,QAAA;AAGA,wBAAA;AAEE,0BAAA;AAAC,YAAA;AAAA,YAAA;AACC,cAAA;AACA,cAAA;AACK,cAAA;AACA,cAAA;AACL,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AAAW,YAAA;AACb,UAAA;AAGC,UAAA;AAEG,4BAAA;AACA,4BAAA;AAAC,cAAA;AAAA,cAAA;AACC,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,gBAAA;AAAW,cAAA;AACb,YAAA;AACF,UAAA;AAEJ,QAAA;AAGA,wBAAA;AACE,0BAAA;AAEK,YAAA;AAAA,YAAA;AAEC,cAAA;AACA,cAAA;AACE,gBAAA;AACA,gBAAA;AAEC,cAAA;AAEH,cAAA;AACA,cAAA;AACA,cAAA;AAEC,cAAA;AAAgB,YAAA;AAZZ,YAAA;AAeX,UAAA;AAEA,0BAAA;AAAC,YAAA;AAAA,YAAA;AACC,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AACE,gBAAA;AACF,cAAA;AACA,cAAA;AACE,gBAAA;AACA,gBAAA;AACF,cAAA;AACA,cAAA;AACE,gBAAA;AACA,gBAAA;AACE,kBAAA;AACF,gBAAA;AACF,cAAA;AAAA,YAAA;AACF,UAAA;AAEA,0BAAA;AAAC,YAAA;AAAA,YAAA;AACC,cAAA;AACA,cAAA;AAGA,cAAA;AACA,cAAA;AACA,cAAA;AACA,cAAA;AAEC,cAAA;AAA+C,YAAA;AAClD,UAAA;AACF,QAAA;AAGC,QAAA;AAGM,UAAA;AAAA,UAAA;AAEM,YAAA;AACL,YAAA;AACE,cAAA;AACA,cAAA;AAEC,YAAA;AAEI,YAAA;AACP,YAAA;AACA,YAAA;AACA,YAAA;AACO,YAAA;AAAA,UAAA;AAZF,UAAA;AAeX,QAAA;AAAA,MAAA;AAAA,IAAA;AAEJ,EAAA;AAII,EAAA;AACJ,IAAA;AACA,IAAA;AACY,IAAA;AACZ,IAAA;AAEe,EAAA;AAIL,EAAA;AAER,IAAA;AACY,MAAA;AACT,MAAA;AACH,IAAA;AAEJ,EAAA;AAIE,EAAA;AACY,IAAA;AACV,oBAAA;AAAC,MAAA;AAAA,MAAA;AAEG,QAAA;AAAC,UAAA;AAAA,UAAA;AACM,YAAA;AACL,YAAA;AACA,YAAA;AACA,YAAA;AAEA,YAAA;AAAA,8BAAA;AAAC,gBAAA;AAAA,gBAAA;AACC,kBAAA;AACA,kBAAA;AAAgC,gBAAA;AAClC,cAAA;AACA,8BAAA;AAA+D,YAAA;AAAA,UAAA;AACjE,QAAA;AAEO,QAAA;AACC,QAAA;AACC,QAAA;AACD,QAAA;AACV,QAAA;AAAA,MAAA;AACF,IAAA;AACF,EAAA;AAEJ;AAEY;ADxJO;AACA;AACA;AACA","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-5BX4Q76D.cjs","sourcesContent":[null,"import React, { useState, useRef, useEffect, useCallback } from 'react';\nimport { Copy, Check } from 'lucide-react';\nimport { Dropdown } from '../Dropdown/Dropdown.component';\nimport type {\n ColorPickerProps,\n HSVColor,\n RGBColor,\n HSLColor,\n ColorFormat,\n} from './ColorPicker.types';\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_SWATCHES: string[] = [\n '#ef4444',\n '#f97316',\n '#f59e0b',\n '#10b981',\n '#06b6d4',\n '#6366f1',\n '#8b5cf6',\n '#ec4899',\n '#64748b',\n '#1e293b',\n];\n\n// ============================================================================\n// Pure colour-utility functions\n// ============================================================================\n\nfunction hsvToRgb(h: number, s: number, v: number): RGBColor {\n // h: 0–360, s: 0–100, v: 0–100 → r,g,b: 0–255\n const sn = s / 100;\n const vn = v / 100;\n const c = vn * sn;\n const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n const m = vn - c;\n\n let r: number, g: number, b: number;\n if (h < 60) {\n r = c;\n g = x;\n b = 0;\n } else if (h < 120) {\n r = x;\n g = c;\n b = 0;\n } else if (h < 180) {\n r = 0;\n g = c;\n b = x;\n } else if (h < 240) {\n r = 0;\n g = x;\n b = c;\n } else if (h < 300) {\n r = x;\n g = 0;\n b = c;\n } else {\n r = c;\n g = 0;\n b = x;\n }\n\n return {\n r: Math.round((r + m) * 255),\n g: Math.round((g + m) * 255),\n b: Math.round((b + m) * 255),\n };\n}\n\nfunction rgbToHsv(r: number, g: number, b: number): HSVColor {\n // r,g,b: 0–255 → h: 0–360, s: 0–100, v: 0–100\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const delta = max - min;\n\n const v = max * 100;\n const s = max === 0 ? 0 : (delta / max) * 100;\n\n let h = 0;\n if (delta !== 0) {\n if (max === rn) h = ((gn - bn) / delta) % 6;\n else if (max === gn) h = (bn - rn) / delta + 2;\n else h = (rn - gn) / delta + 4;\n h = h * 60;\n if (h < 0) h += 360;\n }\n\n // Deliberately NOT rounded. HSV is this component's internal state, and\n // rounding s/v to whole percent makes the hex -> HSV -> hex round trip lossy:\n // `#5c5de8` came back as `#5d5de8`, so a controlled `value` displayed a\n // different colour than the one passed in, and any interaction committed the\n // drifted value. `hsvToRgb` already rounds to whole channels at the end, so\n // precision is only needed in between. Every consumer of these floats (the\n // hue gradient, the thumb offsets, the hue slider) accepts them.\n return { h, s, v };\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const ch = (n: number) =>\n Math.round(Math.max(0, Math.min(255, n)))\n .toString(16)\n .padStart(2, '0');\n return `#${ch(r)}${ch(g)}${ch(b)}`;\n}\n\nfunction hexToRgb(hex: string): RGBColor | null {\n const c = hex.trim().replace(/^#/, '');\n let r: number, g: number, b: number;\n\n if (c.length === 3) {\n r = parseInt(c[0] + c[0], 16);\n g = parseInt(c[1] + c[1], 16);\n b = parseInt(c[2] + c[2], 16);\n } else if (c.length === 6) {\n r = parseInt(c.slice(0, 2), 16);\n g = parseInt(c.slice(2, 4), 16);\n b = parseInt(c.slice(4, 6), 16);\n } else {\n return null;\n }\n\n if (isNaN(r) || isNaN(g) || isNaN(b)) return null;\n return { r, g, b };\n}\n\nfunction rgbToHsl(r: number, g: number, b: number): HSLColor {\n // r,g,b: 0–255 → h: 0–360, s: 0–100, l: 0–100\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const delta = max - min;\n const l = (max + min) / 2;\n\n let h = 0;\n let s = 0;\n\n if (delta !== 0) {\n s = delta / (1 - Math.abs(2 * l - 1));\n if (max === rn) h = ((gn - bn) / delta) % 6;\n else if (max === gn) h = (bn - rn) / delta + 2;\n else h = (rn - gn) / delta + 4;\n h = h * 60;\n if (h < 0) h += 360;\n }\n\n return { h: Math.round(h), s: Math.round(s * 100), l: Math.round(l * 100) };\n}\n\nfunction hslToRgb(h: number, s: number, l: number): RGBColor {\n // h: 0–360, s: 0–100, l: 0–100 → r,g,b: 0–255\n const sn = s / 100;\n const ln = l / 100;\n const c = (1 - Math.abs(2 * ln - 1)) * sn;\n const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n const m = ln - c / 2;\n\n let r: number, g: number, b: number;\n if (h < 60) {\n r = c;\n g = x;\n b = 0;\n } else if (h < 120) {\n r = x;\n g = c;\n b = 0;\n } else if (h < 180) {\n r = 0;\n g = c;\n b = x;\n } else if (h < 240) {\n r = 0;\n g = x;\n b = c;\n } else if (h < 300) {\n r = x;\n g = 0;\n b = c;\n } else {\n r = c;\n g = 0;\n b = x;\n }\n\n return {\n r: Math.round((r + m) * 255),\n g: Math.round((g + m) * 255),\n b: Math.round((b + m) * 255),\n };\n}\n\n// ============================================================================\n// Format helpers\n// ============================================================================\n\nfunction colorToText(hsv: HSVColor, alpha: number, fmt: ColorFormat): string {\n const rgb = hsvToRgb(hsv.h, hsv.s, hsv.v);\n\n switch (fmt) {\n case 'hex':\n return rgbToHex(rgb.r, rgb.g, rgb.b);\n case 'rgb':\n return alpha < 1\n ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha.toFixed(2)})`\n : `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;\n case 'hsl': {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n return alpha < 1\n ? `hsla(${hsl.h}, ${hsl.s}%, ${hsl.l}%, ${alpha.toFixed(2)})`\n : `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;\n }\n }\n}\n\nfunction parseColorText(text: string): RGBColor | null {\n const t = text.trim();\n\n // Try hex (with or without leading #)\n const hexCandidate = t.startsWith('#') ? t : /^[0-9a-f]{3,6}$/i.test(t) ? `#${t}` : null;\n if (hexCandidate) return hexToRgb(hexCandidate);\n\n // Try rgb() / rgba()\n const rgbMatch = t.match(/rgba?\\(\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*(\\d+)/i);\n if (rgbMatch) {\n return {\n r: parseInt(rgbMatch[1], 10),\n g: parseInt(rgbMatch[2], 10),\n b: parseInt(rgbMatch[3], 10),\n };\n }\n\n // Try hsl() / hsla()\n const hslMatch = t.match(/hsla?\\(\\s*(\\d+)\\s*,\\s*(\\d+)%?\\s*,\\s*(\\d+)%?/i);\n if (hslMatch) {\n return hslToRgb(\n parseInt(hslMatch[1], 10),\n parseInt(hslMatch[2], 10),\n parseInt(hslMatch[3], 10),\n );\n }\n\n return null;\n}\n\n/** Parse a hex string to HSVColor, falling back to red on failure. */\nfunction hexToHsv(hex: string): HSVColor {\n const rgb = hexToRgb(hex);\n return rgb ? rgbToHsv(rgb.r, rgb.g, rgb.b) : { h: 0, s: 100, v: 100 };\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n value,\n defaultValue,\n onChange,\n format = 'hex',\n showAlpha = false,\n showSwatches = true,\n swatches = DEFAULT_SWATCHES,\n disabled = false,\n size = 'md',\n inline = false,\n label,\n className = '',\n}) => {\n // ── Initial hex (only used on first render by useState) ──────────────────\n const initialHex = value ?? defaultValue ?? '#6366f1';\n\n // ── State ─────────────────────────────────────────────────────────────────\n const [hsv, setHsv] = useState<HSVColor>(() => hexToHsv(initialHex));\n const [alpha, setAlpha] = useState<number>(1);\n const [activeFormat, setActiveFormat] = useState<ColorFormat>(format);\n const [inputText, setInputText] = useState<string>(() =>\n colorToText(hexToHsv(initialHex), 1, format),\n );\n const [copied, setCopied] = useState(false);\n\n // ── Refs - give event handlers always-fresh values without stale closures ──\n const hsvRef = useRef<HSVColor>(hsv);\n hsvRef.current = hsv;\n\n const alphaRef = useRef<number>(alpha);\n alphaRef.current = alpha;\n\n const activeFormatRef = useRef<ColorFormat>(activeFormat);\n activeFormatRef.current = activeFormat;\n\n // onChange is stored in a ref so applyColor never becomes stale\n const onChangeRef = useRef<ColorPickerProps['onChange']>(onChange);\n onChangeRef.current = onChange;\n\n const inputFocusedRef = useRef(false);\n const canvasRef = useRef<HTMLDivElement>(null);\n\n // Refs for in-flight drag listeners - cleaned up on mouseup and on unmount\n const dragHandlersRef = useRef<{\n move: (e: MouseEvent) => void;\n up: () => void;\n } | null>(null);\n\n const copiedTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n // ── Derived ───────────────────────────────────────────────────────────────\n const currentRgb = hsvToRgb(hsv.h, hsv.s, hsv.v);\n const currentHex = rgbToHex(currentRgb.r, currentRgb.g, currentRgb.b);\n\n // ── Sync from controlled `value` prop ─────────────────────────────────────\n // Runs only when `value` changes. We normalize both sides to the same\n // hex format before comparing so that round-trip conversions don't trigger\n // spurious updates (which would overwrite the preserved hue when s/v = 0).\n useEffect(() => {\n if (value === undefined) return;\n const rgb = hexToRgb(value);\n if (!rgb) return;\n const newHsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n const newNormalised = rgbToHex(\n ...(Object.values(hsvToRgb(newHsv.h, newHsv.s, newHsv.v)) as [number, number, number]),\n );\n // currentHex is captured from this render - guards against echo loops\n // when the parent echoes back our own onChange emission\n if (newNormalised === currentHex) return;\n setHsv(newHsv);\n if (!inputFocusedRef.current) {\n setInputText(colorToText(newHsv, alphaRef.current, activeFormatRef.current));\n }\n }, [value, currentHex]);\n\n // ── Cleanup drag listeners and timers on unmount ──────────────────────────\n useEffect(() => {\n return () => {\n if (dragHandlersRef.current) {\n document.removeEventListener('mousemove', dragHandlersRef.current.move);\n document.removeEventListener('mouseup', dragHandlersRef.current.up);\n }\n if (copiedTimerRef.current) clearTimeout(copiedTimerRef.current);\n };\n }, []);\n\n // ── Core: apply a new HSV + alpha, emit onChange ───────────────────────────\n // Stable (empty dep array) - reads live values exclusively via refs.\n const applyColor = useCallback((newHsv: HSVColor, newAlpha: number) => {\n setHsv(newHsv);\n setAlpha(newAlpha);\n\n if (!inputFocusedRef.current) {\n setInputText(colorToText(newHsv, newAlpha, activeFormatRef.current));\n }\n\n const rgb = hsvToRgb(newHsv.h, newHsv.s, newHsv.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b);\n onChangeRef.current?.(hex);\n }, []);\n\n // ── 2-D saturation / brightness canvas ────────────────────────────────────\n const handleCanvasMouseDown = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (disabled) return;\n e.preventDefault();\n\n const pick = (clientX: number, clientY: number) => {\n const canvas = canvasRef.current;\n if (!canvas) return;\n const rect = canvas.getBoundingClientRect();\n const s = Math.max(0, Math.min(100, ((clientX - rect.left) / rect.width) * 100));\n const v = Math.max(0, Math.min(100, 100 - ((clientY - rect.top) / rect.height) * 100));\n applyColor({ h: hsvRef.current.h, s, v }, alphaRef.current);\n };\n\n pick(e.clientX, e.clientY);\n\n const handleMouseMove = (me: MouseEvent) => pick(me.clientX, me.clientY);\n const handleMouseUp = () => {\n document.removeEventListener('mousemove', handleMouseMove);\n document.removeEventListener('mouseup', handleMouseUp);\n dragHandlersRef.current = null;\n };\n\n dragHandlersRef.current = { move: handleMouseMove, up: handleMouseUp };\n document.addEventListener('mousemove', handleMouseMove);\n document.addEventListener('mouseup', handleMouseUp);\n },\n [disabled, applyColor],\n );\n\n // ── Hue slider ────────────────────────────────────────────────────────────\n const handleHueChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n applyColor({ ...hsvRef.current, h: Number(e.target.value) }, alphaRef.current);\n },\n [applyColor],\n );\n\n // ── Alpha slider ──────────────────────────────────────────────────────────\n const handleAlphaChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n applyColor(hsvRef.current, Number(e.target.value) / 100);\n },\n [applyColor],\n );\n\n // ── Format toggle ─────────────────────────────────────────────────────────\n const handleFormatChange = useCallback((fmt: ColorFormat) => {\n setActiveFormat(fmt);\n setInputText(colorToText(hsvRef.current, alphaRef.current, fmt));\n }, []);\n\n // ── Text-input commit (Enter / blur) ──────────────────────────────────────\n const handleInputCommit = useCallback(() => {\n const rgb = parseColorText(inputText);\n if (!rgb) {\n // Invalid - reset to the current valid colour\n setInputText(colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current));\n return;\n }\n const newHsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n applyColor(newHsv, alphaRef.current);\n // Always normalise the text after a commit (even if the input still has focus)\n setInputText(colorToText(newHsv, alphaRef.current, activeFormatRef.current));\n }, [inputText, applyColor]);\n\n // ── Swatch click ──────────────────────────────────────────────────────────\n const handleSwatchClick = useCallback(\n (hex: string) => {\n const rgb = hexToRgb(hex);\n if (!rgb) return;\n applyColor(rgbToHsv(rgb.r, rgb.g, rgb.b), alphaRef.current);\n },\n [applyColor],\n );\n\n // ── Copy to clipboard ─────────────────────────────────────────────────────\n const handleCopy = useCallback(() => {\n const text = colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current);\n navigator.clipboard\n .writeText(text)\n .then(() => {\n setCopied(true);\n if (copiedTimerRef.current) clearTimeout(copiedTimerRef.current);\n copiedTimerRef.current = setTimeout(() => setCopied(false), 2000);\n })\n .catch(() => {\n // Clipboard access denied - silently ignore\n });\n }, []);\n\n // ── Alpha-slider background gradient ─────────────────────────────────────\n // We use a transparent-to-current-colour gradient layered over a checkerboard\n // so the alpha slider always shows the correct colour transition.\n const transparentColor = `rgba(${currentRgb.r}, ${currentRgb.g}, ${currentRgb.b}, 0)`;\n\n const alphaTrackBg = {\n backgroundImage: [\n `linear-gradient(to right, ${transparentColor}, ${currentHex})`,\n 'linear-gradient(45deg, #e2e8f0 25%, transparent 25%)',\n 'linear-gradient(-45deg, #e2e8f0 25%, transparent 25%)',\n 'linear-gradient(45deg, transparent 75%, #e2e8f0 75%)',\n 'linear-gradient(-45deg, transparent 75%, #e2e8f0 75%)',\n ].join(', '),\n backgroundSize: '100%, 8px 8px, 8px 8px, 8px 8px, 8px 8px',\n backgroundPosition: '0 0, 0 0, 0 4px, 4px -4px, -4px 0',\n };\n\n // ── Picker panel (shared between inline and popover modes) ────────────────\n //\n // The size modifier has to live on the panel itself, not only on the root:\n // in popover mode the panel is portaled to document.body by Dropdown, so\n // anything inside it that sized itself off a `.eidos-color-picker--{size}`\n // ancestor matched nothing and collapsed. That is what removed the\n // saturation/brightness canvas entirely from every non-inline picker.\n const panel = (\n <div\n className={`eidos-color-picker-panel eidos-color-picker-panel--${size}${\n inline ? ' eidos-color-picker-panel--inline' : ''\n }`}\n >\n {/* 2-D sat / brightness canvas */}\n <div\n ref={canvasRef}\n className=\"eidos-color-picker-canvas\"\n style={{\n background: [\n 'linear-gradient(to top, #000, transparent)',\n `linear-gradient(to right, #fff, hsl(${hsv.h}, 100%, 50%))`,\n ].join(', '),\n }}\n onMouseDown={handleCanvasMouseDown}\n role=\"presentation\"\n >\n <div\n className=\"eidos-color-picker-thumb\"\n style={{\n // Rounded for display only - hsv.s/v are unrounded floats so the\n // hex round trip stays lossless (see rgbToHsv).\n left: `${hsv.s.toFixed(2)}%`,\n top: `${(100 - hsv.v).toFixed(2)}%`,\n background: currentHex,\n }}\n />\n </div>\n\n {/* Sliders */}\n <div className=\"eidos-color-picker-sliders\">\n {/* Hue */}\n <input\n type=\"range\"\n className=\"eidos-color-picker-hue\"\n min={0}\n max={360}\n step={1}\n value={hsv.h}\n disabled={disabled}\n onChange={handleHueChange}\n aria-label=\"Hue\"\n />\n\n {/* Alpha */}\n {showAlpha && (\n <div className=\"eidos-color-picker-alpha-wrapper\">\n <div className=\"eidos-color-picker-alpha-bg\" style={alphaTrackBg} />\n <input\n type=\"range\"\n className=\"eidos-color-picker-alpha\"\n min={0}\n max={100}\n step={1}\n value={Math.round(alpha * 100)}\n disabled={disabled}\n onChange={handleAlphaChange}\n aria-label=\"Opacity\"\n />\n </div>\n )}\n </div>\n\n {/* Text input + format toggles + copy */}\n <div className=\"eidos-color-picker-inputs\">\n <div className=\"eidos-color-picker-format-btns\" role=\"group\" aria-label=\"Colour format\">\n {(['hex', 'rgb', 'hsl'] as ColorFormat[]).map((fmt) => (\n <button\n key={fmt}\n type=\"button\"\n className={[\n 'eidos-color-picker-format-btn',\n activeFormat === fmt && 'eidos-color-picker-format-btn--active',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => handleFormatChange(fmt)}\n disabled={disabled}\n aria-pressed={activeFormat === fmt}\n >\n {fmt.toUpperCase()}\n </button>\n ))}\n </div>\n\n <input\n type=\"text\"\n className=\"eidos-color-picker-input\"\n value={inputText}\n disabled={disabled}\n spellCheck={false}\n aria-label=\"Colour value\"\n onChange={(e) => setInputText(e.target.value)}\n onFocus={() => {\n inputFocusedRef.current = true;\n }}\n onBlur={() => {\n inputFocusedRef.current = false;\n handleInputCommit();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter') handleInputCommit();\n if (e.key === 'Escape') {\n setInputText(colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current));\n }\n }}\n />\n\n <button\n type=\"button\"\n className={['eidos-color-picker-copy', copied && 'eidos-color-picker-copy--copied']\n .filter(Boolean)\n .join(' ')}\n onClick={handleCopy}\n disabled={disabled}\n aria-label=\"Copy colour value\"\n title=\"Copy colour value\"\n >\n {copied ? <Check size={14} /> : <Copy size={14} />}\n </button>\n </div>\n\n {/* Swatches */}\n {showSwatches && (\n <div className=\"eidos-color-picker-swatches\" role=\"group\" aria-label=\"Colour presets\">\n {swatches.map((swatchHex) => (\n <button\n key={swatchHex}\n type=\"button\"\n className={[\n 'eidos-color-picker-swatch',\n currentHex === swatchHex && 'eidos-color-picker-swatch--active',\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ background: swatchHex }}\n onClick={() => handleSwatchClick(swatchHex)}\n disabled={disabled}\n aria-label={`Select ${swatchHex}`}\n title={swatchHex}\n />\n ))}\n </div>\n )}\n </div>\n );\n\n // ── Root element classes ───────────────────────────────────────────────────\n const rootClasses = [\n 'eidos-color-picker',\n `eidos-color-picker--${size}`,\n disabled && 'eidos-color-picker--disabled',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // ── Inline mode ───────────────────────────────────────────────────────────\n if (inline) {\n return (\n <div className={rootClasses}>\n {label && <span className=\"eidos-color-picker-label\">{label}</span>}\n {panel}\n </div>\n );\n }\n\n // ── Popover (trigger + Dropdown) ──────────────────────────────────────────\n return (\n <div className={rootClasses}>\n {label && <span className=\"eidos-color-picker-label\">{label}</span>}\n <Dropdown\n trigger={\n <button\n type=\"button\"\n className=\"eidos-color-picker-trigger\"\n disabled={disabled}\n aria-label={label ?? 'Open colour picker'}\n >\n <span\n className=\"eidos-color-picker-trigger-swatch\"\n style={{ background: currentHex }}\n />\n <span className=\"eidos-color-picker-trigger-value\">{currentHex}</span>\n </button>\n }\n content={panel}\n placement=\"bottom\"\n autoWidth={false}\n minWidth={260}\n disabled={disabled}\n />\n </div>\n );\n};\n\nColorPicker.displayName = 'ColorPicker';\n"]}
|
|
1
|
+
{"version":3,"sources":["/home/runner/work/eidos-ui/eidos-ui/dist/chunk-LVHZBCTA.cjs","../src/components/ColorPicker/ColorPicker.component.tsx"],"names":[],"mappings":"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","file":"/home/runner/work/eidos-ui/eidos-ui/dist/chunk-LVHZBCTA.cjs","sourcesContent":[null,"import React, { useState, useRef, useEffect, useCallback } from 'react';\nimport { Copy, Check } from 'lucide-react';\nimport { Dropdown } from '../Dropdown/Dropdown.component';\nimport type {\n ColorPickerProps,\n HSVColor,\n RGBColor,\n HSLColor,\n ColorFormat,\n} from './ColorPicker.types';\n\n// ============================================================================\n// Constants\n// ============================================================================\n\nconst DEFAULT_SWATCHES: string[] = [\n '#ef4444',\n '#f97316',\n '#f59e0b',\n '#10b981',\n '#06b6d4',\n '#6366f1',\n '#8b5cf6',\n '#ec4899',\n '#64748b',\n '#1e293b',\n];\n\n// ============================================================================\n// Pure colour-utility functions\n// ============================================================================\n\nfunction hsvToRgb(h: number, s: number, v: number): RGBColor {\n // h: 0–360, s: 0–100, v: 0–100 → r,g,b: 0–255\n const sn = s / 100;\n const vn = v / 100;\n const c = vn * sn;\n const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n const m = vn - c;\n\n let r: number, g: number, b: number;\n if (h < 60) {\n r = c;\n g = x;\n b = 0;\n } else if (h < 120) {\n r = x;\n g = c;\n b = 0;\n } else if (h < 180) {\n r = 0;\n g = c;\n b = x;\n } else if (h < 240) {\n r = 0;\n g = x;\n b = c;\n } else if (h < 300) {\n r = x;\n g = 0;\n b = c;\n } else {\n r = c;\n g = 0;\n b = x;\n }\n\n return {\n r: Math.round((r + m) * 255),\n g: Math.round((g + m) * 255),\n b: Math.round((b + m) * 255),\n };\n}\n\nfunction rgbToHsv(r: number, g: number, b: number): HSVColor {\n // r,g,b: 0–255 → h: 0–360, s: 0–100, v: 0–100\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const delta = max - min;\n\n const v = max * 100;\n const s = max === 0 ? 0 : (delta / max) * 100;\n\n let h = 0;\n if (delta !== 0) {\n if (max === rn) h = ((gn - bn) / delta) % 6;\n else if (max === gn) h = (bn - rn) / delta + 2;\n else h = (rn - gn) / delta + 4;\n h = h * 60;\n if (h < 0) h += 360;\n }\n\n // Deliberately NOT rounded. HSV is this component's internal state, and\n // rounding s/v to whole percent makes the hex -> HSV -> hex round trip lossy:\n // `#5c5de8` came back as `#5d5de8`, so a controlled `value` displayed a\n // different colour than the one passed in, and any interaction committed the\n // drifted value. `hsvToRgb` already rounds to whole channels at the end, so\n // precision is only needed in between. Every consumer of these floats (the\n // hue gradient, the thumb offsets, the hue slider) accepts them.\n return { h, s, v };\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n const ch = (n: number) =>\n Math.round(Math.max(0, Math.min(255, n)))\n .toString(16)\n .padStart(2, '0');\n return `#${ch(r)}${ch(g)}${ch(b)}`;\n}\n\nfunction hexToRgb(hex: string): RGBColor | null {\n const c = hex.trim().replace(/^#/, '');\n let r: number, g: number, b: number;\n\n if (c.length === 3) {\n r = parseInt(c[0] + c[0], 16);\n g = parseInt(c[1] + c[1], 16);\n b = parseInt(c[2] + c[2], 16);\n } else if (c.length === 6) {\n r = parseInt(c.slice(0, 2), 16);\n g = parseInt(c.slice(2, 4), 16);\n b = parseInt(c.slice(4, 6), 16);\n } else {\n return null;\n }\n\n if (isNaN(r) || isNaN(g) || isNaN(b)) return null;\n return { r, g, b };\n}\n\nfunction rgbToHsl(r: number, g: number, b: number): HSLColor {\n // r,g,b: 0–255 → h: 0–360, s: 0–100, l: 0–100\n const rn = r / 255;\n const gn = g / 255;\n const bn = b / 255;\n\n const max = Math.max(rn, gn, bn);\n const min = Math.min(rn, gn, bn);\n const delta = max - min;\n const l = (max + min) / 2;\n\n let h = 0;\n let s = 0;\n\n if (delta !== 0) {\n s = delta / (1 - Math.abs(2 * l - 1));\n if (max === rn) h = ((gn - bn) / delta) % 6;\n else if (max === gn) h = (bn - rn) / delta + 2;\n else h = (rn - gn) / delta + 4;\n h = h * 60;\n if (h < 0) h += 360;\n }\n\n return { h: Math.round(h), s: Math.round(s * 100), l: Math.round(l * 100) };\n}\n\nfunction hslToRgb(h: number, s: number, l: number): RGBColor {\n // h: 0–360, s: 0–100, l: 0–100 → r,g,b: 0–255\n const sn = s / 100;\n const ln = l / 100;\n const c = (1 - Math.abs(2 * ln - 1)) * sn;\n const x = c * (1 - Math.abs(((h / 60) % 2) - 1));\n const m = ln - c / 2;\n\n let r: number, g: number, b: number;\n if (h < 60) {\n r = c;\n g = x;\n b = 0;\n } else if (h < 120) {\n r = x;\n g = c;\n b = 0;\n } else if (h < 180) {\n r = 0;\n g = c;\n b = x;\n } else if (h < 240) {\n r = 0;\n g = x;\n b = c;\n } else if (h < 300) {\n r = x;\n g = 0;\n b = c;\n } else {\n r = c;\n g = 0;\n b = x;\n }\n\n return {\n r: Math.round((r + m) * 255),\n g: Math.round((g + m) * 255),\n b: Math.round((b + m) * 255),\n };\n}\n\n// ============================================================================\n// Format helpers\n// ============================================================================\n\nfunction colorToText(hsv: HSVColor, alpha: number, fmt: ColorFormat): string {\n const rgb = hsvToRgb(hsv.h, hsv.s, hsv.v);\n\n switch (fmt) {\n case 'hex':\n return rgbToHex(rgb.r, rgb.g, rgb.b);\n case 'rgb':\n return alpha < 1\n ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha.toFixed(2)})`\n : `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;\n case 'hsl': {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n return alpha < 1\n ? `hsla(${hsl.h}, ${hsl.s}%, ${hsl.l}%, ${alpha.toFixed(2)})`\n : `hsl(${hsl.h}, ${hsl.s}%, ${hsl.l}%)`;\n }\n }\n}\n\nfunction parseColorText(text: string): RGBColor | null {\n const t = text.trim();\n\n // Try hex (with or without leading #)\n const hexCandidate = t.startsWith('#') ? t : /^[0-9a-f]{3,6}$/i.test(t) ? `#${t}` : null;\n if (hexCandidate) return hexToRgb(hexCandidate);\n\n // Try rgb() / rgba()\n const rgbMatch = t.match(/rgba?\\(\\s*(\\d+)\\s*,\\s*(\\d+)\\s*,\\s*(\\d+)/i);\n if (rgbMatch) {\n return {\n r: parseInt(rgbMatch[1], 10),\n g: parseInt(rgbMatch[2], 10),\n b: parseInt(rgbMatch[3], 10),\n };\n }\n\n // Try hsl() / hsla()\n const hslMatch = t.match(/hsla?\\(\\s*(\\d+)\\s*,\\s*(\\d+)%?\\s*,\\s*(\\d+)%?/i);\n if (hslMatch) {\n return hslToRgb(\n parseInt(hslMatch[1], 10),\n parseInt(hslMatch[2], 10),\n parseInt(hslMatch[3], 10),\n );\n }\n\n return null;\n}\n\n/** Parse a hex string to HSVColor, falling back to red on failure. */\nfunction hexToHsv(hex: string): HSVColor {\n const rgb = hexToRgb(hex);\n return rgb ? rgbToHsv(rgb.r, rgb.g, rgb.b) : { h: 0, s: 100, v: 100 };\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const ColorPicker: React.FC<ColorPickerProps> = ({\n value,\n defaultValue,\n onChange,\n format = 'hex',\n showAlpha = false,\n showSwatches = true,\n swatches = DEFAULT_SWATCHES,\n disabled = false,\n size = 'md',\n inline = false,\n label,\n className = '',\n}) => {\n // ── Initial hex (only used on first render by useState) ──────────────────\n const initialHex = value ?? defaultValue ?? '#6366f1';\n\n // ── State ─────────────────────────────────────────────────────────────────\n const [hsv, setHsv] = useState<HSVColor>(() => hexToHsv(initialHex));\n const [alpha, setAlpha] = useState<number>(1);\n const [activeFormat, setActiveFormat] = useState<ColorFormat>(format);\n const [inputText, setInputText] = useState<string>(() =>\n colorToText(hexToHsv(initialHex), 1, format),\n );\n const [copied, setCopied] = useState(false);\n\n // ── Refs - give event handlers always-fresh values without stale closures ──\n const hsvRef = useRef<HSVColor>(hsv);\n hsvRef.current = hsv;\n\n const alphaRef = useRef<number>(alpha);\n alphaRef.current = alpha;\n\n const activeFormatRef = useRef<ColorFormat>(activeFormat);\n activeFormatRef.current = activeFormat;\n\n // onChange is stored in a ref so applyColor never becomes stale\n const onChangeRef = useRef<ColorPickerProps['onChange']>(onChange);\n onChangeRef.current = onChange;\n\n const inputFocusedRef = useRef(false);\n const canvasRef = useRef<HTMLDivElement>(null);\n\n // Refs for in-flight drag listeners - cleaned up on mouseup and on unmount\n const dragHandlersRef = useRef<{\n move: (e: MouseEvent) => void;\n up: () => void;\n } | null>(null);\n\n const copiedTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n // ── Derived ───────────────────────────────────────────────────────────────\n const currentRgb = hsvToRgb(hsv.h, hsv.s, hsv.v);\n const currentHex = rgbToHex(currentRgb.r, currentRgb.g, currentRgb.b);\n\n // ── Sync from controlled `value` prop ─────────────────────────────────────\n // Runs only when `value` changes. We normalize both sides to the same\n // hex format before comparing so that round-trip conversions don't trigger\n // spurious updates (which would overwrite the preserved hue when s/v = 0).\n useEffect(() => {\n if (value === undefined) return;\n const rgb = hexToRgb(value);\n if (!rgb) return;\n const newHsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n const newNormalised = rgbToHex(\n ...(Object.values(hsvToRgb(newHsv.h, newHsv.s, newHsv.v)) as [number, number, number]),\n );\n // currentHex is captured from this render - guards against echo loops\n // when the parent echoes back our own onChange emission\n if (newNormalised === currentHex) return;\n setHsv(newHsv);\n if (!inputFocusedRef.current) {\n setInputText(colorToText(newHsv, alphaRef.current, activeFormatRef.current));\n }\n }, [value, currentHex]);\n\n // ── Cleanup drag listeners and timers on unmount ──────────────────────────\n useEffect(() => {\n return () => {\n if (dragHandlersRef.current) {\n document.removeEventListener('mousemove', dragHandlersRef.current.move);\n document.removeEventListener('mouseup', dragHandlersRef.current.up);\n }\n if (copiedTimerRef.current) clearTimeout(copiedTimerRef.current);\n };\n }, []);\n\n // ── Core: apply a new HSV + alpha, emit onChange ───────────────────────────\n // Stable (empty dep array) - reads live values exclusively via refs.\n const applyColor = useCallback((newHsv: HSVColor, newAlpha: number) => {\n setHsv(newHsv);\n setAlpha(newAlpha);\n\n if (!inputFocusedRef.current) {\n setInputText(colorToText(newHsv, newAlpha, activeFormatRef.current));\n }\n\n const rgb = hsvToRgb(newHsv.h, newHsv.s, newHsv.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b);\n onChangeRef.current?.(hex);\n }, []);\n\n // ── 2-D saturation / brightness canvas ────────────────────────────────────\n const handleCanvasMouseDown = useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n if (disabled) return;\n e.preventDefault();\n\n const pick = (clientX: number, clientY: number) => {\n const canvas = canvasRef.current;\n if (!canvas) return;\n const rect = canvas.getBoundingClientRect();\n const s = Math.max(0, Math.min(100, ((clientX - rect.left) / rect.width) * 100));\n const v = Math.max(0, Math.min(100, 100 - ((clientY - rect.top) / rect.height) * 100));\n applyColor({ h: hsvRef.current.h, s, v }, alphaRef.current);\n };\n\n pick(e.clientX, e.clientY);\n\n const handleMouseMove = (me: MouseEvent) => pick(me.clientX, me.clientY);\n const handleMouseUp = () => {\n document.removeEventListener('mousemove', handleMouseMove);\n document.removeEventListener('mouseup', handleMouseUp);\n dragHandlersRef.current = null;\n };\n\n dragHandlersRef.current = { move: handleMouseMove, up: handleMouseUp };\n document.addEventListener('mousemove', handleMouseMove);\n document.addEventListener('mouseup', handleMouseUp);\n },\n [disabled, applyColor],\n );\n\n // ── Hue slider ────────────────────────────────────────────────────────────\n const handleHueChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n applyColor({ ...hsvRef.current, h: Number(e.target.value) }, alphaRef.current);\n },\n [applyColor],\n );\n\n // ── Alpha slider ──────────────────────────────────────────────────────────\n const handleAlphaChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n applyColor(hsvRef.current, Number(e.target.value) / 100);\n },\n [applyColor],\n );\n\n // ── Format toggle ─────────────────────────────────────────────────────────\n const handleFormatChange = useCallback((fmt: ColorFormat) => {\n setActiveFormat(fmt);\n setInputText(colorToText(hsvRef.current, alphaRef.current, fmt));\n }, []);\n\n // ── Text-input commit (Enter / blur) ──────────────────────────────────────\n const handleInputCommit = useCallback(() => {\n const rgb = parseColorText(inputText);\n if (!rgb) {\n // Invalid - reset to the current valid colour\n setInputText(colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current));\n return;\n }\n const newHsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n applyColor(newHsv, alphaRef.current);\n // Always normalise the text after a commit (even if the input still has focus)\n setInputText(colorToText(newHsv, alphaRef.current, activeFormatRef.current));\n }, [inputText, applyColor]);\n\n // ── Swatch click ──────────────────────────────────────────────────────────\n const handleSwatchClick = useCallback(\n (hex: string) => {\n const rgb = hexToRgb(hex);\n if (!rgb) return;\n applyColor(rgbToHsv(rgb.r, rgb.g, rgb.b), alphaRef.current);\n },\n [applyColor],\n );\n\n // ── Copy to clipboard ─────────────────────────────────────────────────────\n const handleCopy = useCallback(() => {\n const text = colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current);\n navigator.clipboard\n .writeText(text)\n .then(() => {\n setCopied(true);\n if (copiedTimerRef.current) clearTimeout(copiedTimerRef.current);\n copiedTimerRef.current = setTimeout(() => setCopied(false), 2000);\n })\n .catch(() => {\n // Clipboard access denied - silently ignore\n });\n }, []);\n\n // ── Alpha-slider background gradient ─────────────────────────────────────\n // We use a transparent-to-current-colour gradient layered over a checkerboard\n // so the alpha slider always shows the correct colour transition.\n const transparentColor = `rgba(${currentRgb.r}, ${currentRgb.g}, ${currentRgb.b}, 0)`;\n\n const alphaTrackBg = {\n backgroundImage: [\n `linear-gradient(to right, ${transparentColor}, ${currentHex})`,\n 'linear-gradient(45deg, #e2e8f0 25%, transparent 25%)',\n 'linear-gradient(-45deg, #e2e8f0 25%, transparent 25%)',\n 'linear-gradient(45deg, transparent 75%, #e2e8f0 75%)',\n 'linear-gradient(-45deg, transparent 75%, #e2e8f0 75%)',\n ].join(', '),\n backgroundSize: '100%, 8px 8px, 8px 8px, 8px 8px, 8px 8px',\n backgroundPosition: '0 0, 0 0, 0 4px, 4px -4px, -4px 0',\n };\n\n // ── Picker panel (shared between inline and popover modes) ────────────────\n //\n // The size modifier has to live on the panel itself, not only on the root:\n // in popover mode the panel is portaled to document.body by Dropdown, so\n // anything inside it that sized itself off a `.eidos-color-picker--{size}`\n // ancestor matched nothing and collapsed. That is what removed the\n // saturation/brightness canvas entirely from every non-inline picker.\n const panel = (\n <div\n className={`eidos-color-picker-panel eidos-color-picker-panel--${size}${\n inline ? ' eidos-color-picker-panel--inline' : ''\n }`}\n >\n {/* 2-D sat / brightness canvas */}\n <div\n ref={canvasRef}\n className=\"eidos-color-picker-canvas\"\n style={{\n background: [\n 'linear-gradient(to top, #000, transparent)',\n `linear-gradient(to right, #fff, hsl(${hsv.h}, 100%, 50%))`,\n ].join(', '),\n }}\n onMouseDown={handleCanvasMouseDown}\n role=\"presentation\"\n >\n <div\n className=\"eidos-color-picker-thumb\"\n style={{\n // Rounded for display only - hsv.s/v are unrounded floats so the\n // hex round trip stays lossless (see rgbToHsv).\n left: `${hsv.s.toFixed(2)}%`,\n top: `${(100 - hsv.v).toFixed(2)}%`,\n background: currentHex,\n }}\n />\n </div>\n\n {/* Sliders */}\n <div className=\"eidos-color-picker-sliders\">\n {/* Hue */}\n <input\n type=\"range\"\n className=\"eidos-color-picker-hue\"\n min={0}\n max={360}\n step={1}\n value={hsv.h}\n disabled={disabled}\n onChange={handleHueChange}\n aria-label=\"Hue\"\n />\n\n {/* Alpha */}\n {showAlpha && (\n <div className=\"eidos-color-picker-alpha-wrapper\">\n <div className=\"eidos-color-picker-alpha-bg\" style={alphaTrackBg} />\n <input\n type=\"range\"\n className=\"eidos-color-picker-alpha\"\n min={0}\n max={100}\n step={1}\n value={Math.round(alpha * 100)}\n disabled={disabled}\n onChange={handleAlphaChange}\n aria-label=\"Opacity\"\n />\n </div>\n )}\n </div>\n\n {/* Text input + format toggles + copy */}\n <div className=\"eidos-color-picker-inputs\">\n <div className=\"eidos-color-picker-format-btns\" role=\"group\" aria-label=\"Colour format\">\n {(['hex', 'rgb', 'hsl'] as ColorFormat[]).map((fmt) => (\n <button\n key={fmt}\n type=\"button\"\n className={[\n 'eidos-color-picker-format-btn',\n activeFormat === fmt && 'eidos-color-picker-format-btn--active',\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => handleFormatChange(fmt)}\n disabled={disabled}\n aria-pressed={activeFormat === fmt}\n >\n {fmt.toUpperCase()}\n </button>\n ))}\n </div>\n\n <input\n type=\"text\"\n className=\"eidos-color-picker-input\"\n value={inputText}\n disabled={disabled}\n spellCheck={false}\n aria-label=\"Colour value\"\n onChange={(e) => setInputText(e.target.value)}\n onFocus={() => {\n inputFocusedRef.current = true;\n }}\n onBlur={() => {\n inputFocusedRef.current = false;\n handleInputCommit();\n }}\n onKeyDown={(e) => {\n if (e.key === 'Enter') handleInputCommit();\n if (e.key === 'Escape') {\n setInputText(colorToText(hsvRef.current, alphaRef.current, activeFormatRef.current));\n }\n }}\n />\n\n <button\n type=\"button\"\n className={['eidos-color-picker-copy', copied && 'eidos-color-picker-copy--copied']\n .filter(Boolean)\n .join(' ')}\n onClick={handleCopy}\n disabled={disabled}\n aria-label=\"Copy colour value\"\n title=\"Copy colour value\"\n >\n {copied ? <Check size={14} /> : <Copy size={14} />}\n </button>\n </div>\n\n {/* Swatches */}\n {showSwatches && (\n <div className=\"eidos-color-picker-swatches\" role=\"group\" aria-label=\"Colour presets\">\n {swatches.map((swatchHex) => (\n <button\n key={swatchHex}\n type=\"button\"\n className={[\n 'eidos-color-picker-swatch',\n currentHex === swatchHex && 'eidos-color-picker-swatch--active',\n ]\n .filter(Boolean)\n .join(' ')}\n style={{ background: swatchHex }}\n onClick={() => handleSwatchClick(swatchHex)}\n disabled={disabled}\n aria-label={`Select ${swatchHex}`}\n title={swatchHex}\n />\n ))}\n </div>\n )}\n </div>\n );\n\n // ── Root element classes ───────────────────────────────────────────────────\n const rootClasses = [\n 'eidos-color-picker',\n `eidos-color-picker--${size}`,\n disabled && 'eidos-color-picker--disabled',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // ── Inline mode ───────────────────────────────────────────────────────────\n if (inline) {\n return (\n <div className={rootClasses}>\n {label && <span className=\"eidos-color-picker-label\">{label}</span>}\n {panel}\n </div>\n );\n }\n\n // ── Popover (trigger + Dropdown) ──────────────────────────────────────────\n return (\n <div className={rootClasses}>\n {label && <span className=\"eidos-color-picker-label\">{label}</span>}\n <Dropdown\n trigger={\n <button\n type=\"button\"\n className=\"eidos-color-picker-trigger\"\n disabled={disabled}\n aria-label={label ?? 'Open colour picker'}\n >\n <span\n className=\"eidos-color-picker-trigger-swatch\"\n style={{ background: currentHex }}\n />\n <span className=\"eidos-color-picker-trigger-value\">{currentHex}</span>\n </button>\n }\n content={panel}\n placement=\"bottom\"\n autoWidth={false}\n minWidth={260}\n disabled={disabled}\n />\n </div>\n );\n};\n\nColorPicker.displayName = 'ColorPicker';\n"]}
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
import {
|
|
2
|
+
fullWidthModifier
|
|
3
|
+
} from "./chunk-EAJHEYZM.js";
|
|
4
|
+
|
|
1
5
|
// src/components/NumberInput/NumberInput.component.tsx
|
|
2
6
|
import { forwardRef, useState, useEffect, useId } from "react";
|
|
3
7
|
import { Minus, Plus } from "lucide-react";
|
|
@@ -95,7 +99,7 @@ var NumberInput = forwardRef(
|
|
|
95
99
|
const rootClasses = [
|
|
96
100
|
"eidos-number-input",
|
|
97
101
|
`eidos-number-input--${size}`,
|
|
98
|
-
fullWidth && "eidos-number-input
|
|
102
|
+
fullWidth && fullWidthModifier("eidos-number-input"),
|
|
99
103
|
error && "eidos-number-input--error",
|
|
100
104
|
className
|
|
101
105
|
].filter(Boolean).join(" ");
|
|
@@ -196,4 +200,4 @@ NumberInput.displayName = "NumberInput";
|
|
|
196
200
|
export {
|
|
197
201
|
NumberInput
|
|
198
202
|
};
|
|
199
|
-
//# sourceMappingURL=chunk-
|
|
203
|
+
//# sourceMappingURL=chunk-M7PF4FKQ.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/NumberInput/NumberInput.component.tsx"],"sourcesContent":["import React, { forwardRef, useState, useEffect, useId } from 'react';\nimport { Minus, Plus } from 'lucide-react';\nimport { fullWidthModifier } from '../../utils';\nimport type { NumberInputProps } from './NumberInput.types';\n\nexport const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(\n (\n {\n value,\n defaultValue = 0,\n onChange,\n min,\n max,\n step = 1,\n precision = 0,\n placeholder,\n disabled = false,\n readOnly = false,\n label,\n helperText,\n error = false,\n errorMessage,\n size = 'md',\n fullWidth = false,\n allowTyping = true,\n className = '',\n id,\n name,\n },\n ref,\n ) => {\n const generatedId = useId();\n const inputId = id || `number-input-${generatedId}`;\n\n // Controlled / uncontrolled bridge\n const isControlled = value !== undefined;\n const [localValue, setLocalValue] = useState<number>(defaultValue);\n\n // Intermediate text while the user is actively typing\n const [inputText, setInputText] = useState<string>(defaultValue.toFixed(precision));\n const [isFocused, setIsFocused] = useState(false);\n\n const currentValue = isControlled ? value! : localValue;\n\n // When min/max props change (e.g. via Storybook controls), clamp the\n // uncontrolled localValue so the display never shows an out-of-range value.\n useEffect(() => {\n if (isControlled) return;\n setLocalValue((prev) => {\n let result = prev;\n if (min !== undefined) result = Math.max(min, result);\n if (max !== undefined) result = Math.min(max, result);\n return parseFloat(result.toFixed(precision));\n });\n }, [min, max, precision, isControlled]);\n\n // Clamp to [min, max] and apply precision rounding\n const clampValue = (raw: number): number => {\n let result = raw;\n if (min !== undefined) result = Math.max(min, result);\n if (max !== undefined) result = Math.min(max, result);\n return parseFloat(result.toFixed(precision));\n };\n\n const commitValue = (newVal: number) => {\n const clamped = clampValue(newVal);\n if (!isControlled) setLocalValue(clamped);\n onChange?.(clamped);\n };\n\n // ── Stepper buttons ────────────────────────────────────────────────────\n const handleDecrement = () => {\n if (disabled || readOnly) return;\n commitValue(currentValue - step);\n };\n\n const handleIncrement = () => {\n if (disabled || readOnly) return;\n commitValue(currentValue + step);\n };\n\n // ── Typing mode handlers ───────────────────────────────────────────────\n const handleTextFocus = () => {\n setInputText(currentValue.toFixed(precision));\n setIsFocused(true);\n };\n\n const handleTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n setInputText(e.target.value);\n };\n\n const handleTextBlur = () => {\n setIsFocused(false);\n const parsed = parseFloat(inputText);\n if (!isNaN(parsed)) {\n const clamped = clampValue(parsed);\n if (!isControlled) setLocalValue(clamped);\n onChange?.(clamped);\n setInputText(clamped.toFixed(precision));\n } else {\n // Revert to the last known-good value\n setInputText(currentValue.toFixed(precision));\n }\n };\n\n // ArrowUp / ArrowDown keyboard support for both display modes\n const handleDisplayKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n handleIncrement();\n } else if (e.key === 'ArrowDown') {\n e.preventDefault();\n handleDecrement();\n }\n };\n\n // ── Display value ──────────────────────────────────────────────────────\n // Show intermediate inputText while focused in typing mode;\n // otherwise always derive from the real (controlled/uncontrolled) value.\n const formattedValue = currentValue.toFixed(precision);\n const displayedText = allowTyping && isFocused ? inputText : formattedValue;\n\n // ── Disabled states for buttons ────────────────────────────────────────\n const isDecrementDisabled = disabled || readOnly || (min !== undefined && currentValue <= min);\n const isIncrementDisabled = disabled || readOnly || (max !== undefined && currentValue >= max);\n\n // ── CSS classes ────────────────────────────────────────────────────────\n const rootClasses = [\n 'eidos-number-input',\n `eidos-number-input--${size}`,\n fullWidth && fullWidthModifier('eidos-number-input'),\n error && 'eidos-number-input--error',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const controlClasses = [\n 'eidos-number-input-control',\n disabled && 'eidos-number-input-control--disabled',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClasses}>\n {label && (\n <label htmlFor={allowTyping ? inputId : undefined} className=\"eidos-number-input-label\">\n {label}\n </label>\n )}\n\n <div\n className={controlClasses}\n role={allowTyping ? undefined : 'spinbutton'}\n aria-valuemin={allowTyping ? undefined : min}\n aria-valuemax={allowTyping ? undefined : max}\n aria-valuenow={allowTyping ? undefined : currentValue}\n aria-label={allowTyping ? undefined : (label ?? 'Number input')}\n aria-disabled={disabled || undefined}\n tabIndex={!allowTyping && !disabled ? 0 : undefined}\n onKeyDown={!allowTyping ? handleDisplayKeyDown : undefined}\n >\n <button\n type=\"button\"\n className=\"eidos-number-input-btn\"\n onClick={handleDecrement}\n disabled={isDecrementDisabled}\n aria-label=\"Decrease\"\n >\n <Minus />\n </button>\n\n <div className=\"eidos-number-input-divider\" aria-hidden=\"true\" />\n\n {allowTyping ? (\n <input\n id={inputId}\n type=\"text\"\n className=\"eidos-number-input-display\"\n value={displayedText}\n onChange={handleTextChange}\n onFocus={handleTextFocus}\n onBlur={handleTextBlur}\n onKeyDown={handleDisplayKeyDown}\n placeholder={placeholder}\n disabled={disabled}\n readOnly={readOnly}\n inputMode=\"decimal\"\n role=\"spinbutton\"\n aria-valuemin={min}\n aria-valuemax={max}\n aria-valuenow={currentValue}\n aria-label={label ?? 'Number input'}\n />\n ) : (\n <span className=\"eidos-number-input-display\" aria-hidden=\"true\">\n {placeholder && formattedValue === (0).toFixed(precision) && !isFocused\n ? placeholder\n : formattedValue}\n </span>\n )}\n\n <div className=\"eidos-number-input-divider\" aria-hidden=\"true\" />\n\n <button\n type=\"button\"\n className=\"eidos-number-input-btn\"\n onClick={handleIncrement}\n disabled={isIncrementDisabled}\n aria-label=\"Increase\"\n >\n <Plus />\n </button>\n </div>\n\n {/* Hidden native <input type=\"number\"> for form integration */}\n <input\n ref={ref}\n type=\"number\"\n name={name}\n value={currentValue}\n onChange={() => {}}\n className=\"eidos-number-input-hidden\"\n tabIndex={-1}\n aria-hidden=\"true\"\n disabled={disabled}\n readOnly={readOnly}\n min={min}\n max={max}\n step={step}\n />\n\n {helperText && !error && <span className=\"eidos-number-input-helper\">{helperText}</span>}\n\n {error && errorMessage && (\n <span className=\"eidos-number-input-error\" role=\"alert\">\n {errorMessage}\n </span>\n )}\n </div>\n );\n },\n);\n\nNumberInput.displayName = 'NumberInput';\n"],"mappings":"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","names":[]}
|