@retray-dev/ui-kit 12.2.0 → 13.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/CONSUMER.md +26 -11
- package/DESIGN.md +2 -2
- package/README.md +15 -11
- package/{COMPONENTS.md → SKILL.md} +374 -996
- package/dist/Accordion.d.mts +2 -0
- package/dist/Accordion.d.ts +2 -0
- package/dist/Accordion.js +49 -210
- package/dist/Accordion.mjs +6 -6
- package/dist/AlertBanner.js +29 -153
- package/dist/AlertBanner.mjs +3 -4
- package/dist/AppHeader.d.mts +5 -2
- package/dist/AppHeader.d.ts +5 -2
- package/dist/AppHeader.js +45 -239
- package/dist/AppHeader.mjs +6 -8
- package/dist/Avatar.d.mts +17 -1
- package/dist/Avatar.d.ts +17 -1
- package/dist/Avatar.js +80 -115
- package/dist/Avatar.mjs +2 -3
- package/dist/Badge.js +24 -149
- package/dist/Badge.mjs +3 -4
- package/dist/Button.js +79 -267
- package/dist/Button.mjs +6 -7
- package/dist/ButtonGroup.mjs +0 -1
- package/dist/Card.js +15 -200
- package/dist/Card.mjs +4 -6
- package/dist/CategoryStrip.d.mts +0 -5
- package/dist/CategoryStrip.d.ts +0 -5
- package/dist/CategoryStrip.js +47 -265
- package/dist/CategoryStrip.mjs +6 -7
- package/dist/Checkbox.d.mts +2 -1
- package/dist/Checkbox.d.ts +2 -1
- package/dist/Checkbox.js +18 -201
- package/dist/Checkbox.mjs +5 -6
- package/dist/Chip.js +44 -236
- package/dist/Chip.mjs +7 -7
- package/dist/ConfirmDialog.d.mts +2 -1
- package/dist/ConfirmDialog.d.ts +2 -1
- package/dist/ConfirmDialog.js +110 -300
- package/dist/ConfirmDialog.mjs +7 -8
- package/dist/CurrencyDisplay.js +1 -114
- package/dist/CurrencyDisplay.mjs +2 -3
- package/dist/CurrencyInput.js +35 -162
- package/dist/CurrencyInput.mjs +5 -6
- package/dist/DetailRow.js +25 -150
- package/dist/DetailRow.mjs +3 -4
- package/dist/EmptyState.js +80 -268
- package/dist/EmptyState.mjs +7 -8
- package/dist/ErrorBoundary.js +32 -199
- package/dist/ErrorBoundary.mjs +4 -5
- package/dist/Form.js +1 -114
- package/dist/Form.mjs +2 -3
- package/dist/HolographicCard.d.mts +0 -28
- package/dist/HolographicCard.d.ts +0 -28
- package/dist/HolographicCard.js +20 -130
- package/dist/HolographicCard.mjs +9 -33
- package/dist/IconButton.js +36 -234
- package/dist/IconButton.mjs +5 -7
- package/dist/IconPicker.js +222 -929
- package/dist/IconPicker.mjs +5 -6
- package/dist/ImageUpload.d.mts +3 -3
- package/dist/ImageUpload.d.ts +3 -3
- package/dist/ImageUpload.js +49 -238
- package/dist/ImageUpload.mjs +5 -7
- package/dist/ImageViewer.js +75 -266
- package/dist/ImageViewer.mjs +8 -9
- package/dist/Input.d.mts +1 -1
- package/dist/Input.d.ts +1 -1
- package/dist/Input.js +35 -162
- package/dist/Input.mjs +4 -5
- package/dist/LabelValue.js +24 -149
- package/dist/LabelValue.mjs +3 -4
- package/dist/ListGroup.js +1 -114
- package/dist/ListGroup.mjs +2 -3
- package/dist/ListItem.d.mts +2 -1
- package/dist/ListItem.d.ts +2 -1
- package/dist/ListItem.js +41 -236
- package/dist/ListItem.mjs +5 -7
- package/dist/MediaCard.d.mts +0 -14
- package/dist/MediaCard.d.ts +0 -14
- package/dist/MediaCard.js +69 -315
- package/dist/MediaCard.mjs +5 -7
- package/dist/MenuGroup.js +1 -114
- package/dist/MenuGroup.mjs +2 -3
- package/dist/MenuItem.d.mts +2 -1
- package/dist/MenuItem.d.ts +2 -1
- package/dist/MenuItem.js +39 -235
- package/dist/MenuItem.mjs +5 -7
- package/dist/MonthPicker.js +8 -163
- package/dist/MonthPicker.mjs +3 -4
- package/dist/NumberStepper.d.mts +2 -1
- package/dist/NumberStepper.d.ts +2 -1
- package/dist/NumberStepper.js +44 -239
- package/dist/NumberStepper.mjs +5 -7
- package/dist/PagerDots.d.mts +1 -1
- package/dist/PagerDots.d.ts +1 -1
- package/dist/PagerDots.js +69 -224
- package/dist/PagerDots.mjs +6 -6
- package/dist/Pressable.js +14 -85
- package/dist/Pressable.mjs +4 -5
- package/dist/PricingCard.js +87 -272
- package/dist/PricingCard.mjs +8 -9
- package/dist/Progress.js +3 -123
- package/dist/Progress.mjs +3 -4
- package/dist/RadioGroup.js +52 -265
- package/dist/RadioGroup.mjs +5 -6
- package/dist/RetrayProvider.js +3 -6
- package/dist/RetrayProvider.mjs +3 -4
- package/dist/Select.d.mts +3 -1
- package/dist/Select.d.ts +3 -1
- package/dist/Select.js +27 -233
- package/dist/Select.mjs +4 -6
- package/dist/SelectableCard.js +33 -209
- package/dist/SelectableCard.mjs +5 -6
- package/dist/SelectableGrid.d.mts +0 -21
- package/dist/SelectableGrid.d.ts +0 -21
- package/dist/SelectableGrid.js +49 -272
- package/dist/SelectableGrid.mjs +5 -7
- package/dist/Separator.js +1 -114
- package/dist/Separator.mjs +2 -3
- package/dist/Sheet.d.mts +1 -1
- package/dist/Sheet.d.ts +1 -1
- package/dist/Sheet.js +33 -175
- package/dist/Sheet.mjs +3 -4
- package/dist/SheetSelect.js +39 -236
- package/dist/SheetSelect.mjs +6 -7
- package/dist/Skeleton.js +4 -124
- package/dist/Skeleton.mjs +3 -4
- package/dist/Slider.d.mts +2 -1
- package/dist/Slider.d.ts +2 -1
- package/dist/Slider.js +8 -161
- package/dist/Slider.mjs +3 -4
- package/dist/Spinner.js +3 -116
- package/dist/Spinner.mjs +2 -3
- package/dist/Stats.js +36 -234
- package/dist/Stats.mjs +5 -7
- package/dist/Switch.d.mts +2 -1
- package/dist/Switch.d.ts +2 -1
- package/dist/Switch.js +26 -176
- package/dist/Switch.mjs +5 -5
- package/dist/TabBar.js +43 -200
- package/dist/TabBar.mjs +5 -5
- package/dist/Tabs.js +15 -199
- package/dist/Tabs.mjs +5 -6
- package/dist/Text.js +9 -130
- package/dist/Text.mjs +2 -3
- package/dist/Textarea.d.mts +2 -1
- package/dist/Textarea.d.ts +2 -1
- package/dist/Textarea.js +71 -219
- package/dist/Textarea.mjs +4 -5
- package/dist/Toast.d.mts +12 -10
- package/dist/Toast.d.ts +12 -10
- package/dist/Toast.js +1 -114
- package/dist/Toast.mjs +2 -3
- package/dist/Toggle.js +39 -236
- package/dist/Toggle.mjs +6 -7
- package/dist/{chunk-ELGEOM7I.mjs → chunk-2QXJDRVU.mjs} +13 -10
- package/dist/{chunk-LIS6I5UP.mjs → chunk-2VIDP72N.mjs} +3 -3
- package/dist/{chunk-NHDI3VQB.mjs → chunk-422IVD3H.mjs} +16 -12
- package/dist/{chunk-DF7JA72E.mjs → chunk-4NQFTHN3.mjs} +13 -7
- package/dist/{chunk-3XCFYSX4.mjs → chunk-5MYNAAFE.mjs} +13 -17
- package/dist/{chunk-E7NEHHXV.mjs → chunk-62BBSSUF.mjs} +3 -3
- package/dist/{chunk-UBUXUMER.mjs → chunk-77UOVFIS.mjs} +7 -5
- package/dist/{chunk-M3C7XM2M.mjs → chunk-7BZJRB77.mjs} +28 -18
- package/dist/chunk-ARONDO7M.mjs +40 -0
- package/dist/{chunk-GH67YXG6.mjs → chunk-AZV7KNJI.mjs} +3 -3
- package/dist/{chunk-2P2CB235.mjs → chunk-BULKGOIZ.mjs} +7 -8
- package/dist/{chunk-RJNLAH76.mjs → chunk-C5ZRMR2E.mjs} +4 -2
- package/dist/chunk-CM2DG4MR.mjs +142 -0
- package/dist/{chunk-UQ4742ET.mjs → chunk-COA2YZOX.mjs} +8 -6
- package/dist/{chunk-EDLCGYIO.mjs → chunk-CZN6L2QU.mjs} +11 -8
- package/dist/{chunk-TS7DGUIR.mjs → chunk-DBHSUUKU.mjs} +2 -2
- package/dist/{chunk-57V2LXCK.mjs → chunk-DE25XTVQ.mjs} +3 -3
- package/dist/{chunk-RMRS44MQ.mjs → chunk-E2PONRJG.mjs} +13 -9
- package/dist/{chunk-GUTDFUNF.mjs → chunk-EHGBHFMH.mjs} +9 -17
- package/dist/{chunk-ZIMY2QUM.mjs → chunk-ERWJPVX7.mjs} +2 -2
- package/dist/{chunk-NLZY4TXU.mjs → chunk-ESQDPO5E.mjs} +7 -7
- package/dist/{chunk-VJBUCITV.mjs → chunk-EW2FIDSM.mjs} +1 -1
- package/dist/{chunk-HC4VVCWY.mjs → chunk-FTTI6T5Q.mjs} +4 -4
- package/dist/{chunk-MVMGPZN6.mjs → chunk-H6MQL7PS.mjs} +12 -7
- package/dist/{chunk-CF27NBXO.mjs → chunk-HHOOFDBA.mjs} +38 -41
- package/dist/{chunk-2HFD4IHU.mjs → chunk-HUSSF6TF.mjs} +1 -1
- package/dist/{chunk-HEDQPK4I.mjs → chunk-IDVUZIVY.mjs} +16 -22
- package/dist/chunk-IFYMBOEN.mjs +14 -0
- package/dist/{chunk-QOLWA2PW.mjs → chunk-IGU223UM.mjs} +80 -4
- package/dist/chunk-IJCMPVW5.mjs +121 -0
- package/dist/{chunk-AENAVIKT.mjs → chunk-ITG4JQM3.mjs} +4 -4
- package/dist/{chunk-E5UKLSJZ.mjs → chunk-K3QX2M26.mjs} +11 -8
- package/dist/{chunk-4OORJ2DY.mjs → chunk-K7TKID3V.mjs} +8 -7
- package/dist/{chunk-2LG326TT.mjs → chunk-KAGADD2O.mjs} +4 -4
- package/dist/{chunk-IVSRW4HS.mjs → chunk-KC5QDYGZ.mjs} +4 -4
- package/dist/{chunk-7AFZWSCI.mjs → chunk-KPTY7UYQ.mjs} +1 -1
- package/dist/{chunk-YTXRIXNZ.mjs → chunk-KSSVIFYR.mjs} +9 -12
- package/dist/chunk-L3YKPTJQ.mjs +119 -0
- package/dist/chunk-M53LC4Q7.mjs +35 -0
- package/dist/chunk-MZ6WRTD2.mjs +40 -0
- package/dist/chunk-NGEN2EES.mjs +581 -0
- package/dist/{chunk-ZR6HSEAB.mjs → chunk-NPCBNGNE.mjs} +17 -26
- package/dist/{chunk-C43HRKXH.mjs → chunk-OBV72JD4.mjs} +1 -1
- package/dist/{chunk-LPV4NJJK.mjs → chunk-PGQ6FMXS.mjs} +6 -5
- package/dist/{chunk-MEPSKGBO.mjs → chunk-PI6RULJX.mjs} +1 -1
- package/dist/{chunk-F3YTWO3T.mjs → chunk-RA6SAAFE.mjs} +9 -8
- package/dist/{chunk-UNNRUJTM.mjs → chunk-RRKM4MKB.mjs} +7 -7
- package/dist/{chunk-ULGNQPNE.mjs → chunk-S2VGME7X.mjs} +1 -1
- package/dist/{chunk-OLVJFKXS.mjs → chunk-S44XWTTC.mjs} +35 -25
- package/dist/{chunk-YMYIEVZP.mjs → chunk-SZEKQAOY.mjs} +1 -1
- package/dist/{chunk-BXF4AMHY.mjs → chunk-TMH263OK.mjs} +5 -4
- package/dist/{chunk-NJG7DHVF.mjs → chunk-U6DEBYU5.mjs} +10 -9
- package/dist/{chunk-QXDGGOLC.mjs → chunk-UMZTPUB3.mjs} +33 -21
- package/dist/{chunk-KSUWPU2F.mjs → chunk-WIPEDNSD.mjs} +7 -7
- package/dist/{chunk-QDAZGZUF.mjs → chunk-XCIG6HT2.mjs} +3 -3
- package/dist/{chunk-4J2PXL36.mjs → chunk-Y6YS33GM.mjs} +40 -38
- package/dist/{chunk-4XOB5TTD.mjs → chunk-ZKDKKQCE.mjs} +5 -5
- package/dist/{chunk-LOBLCFMN.mjs → chunk-ZTPYUU5C.mjs} +5 -5
- package/dist/fonts.mjs +0 -2
- package/dist/index.d.mts +13 -73
- package/dist/index.d.ts +13 -73
- package/dist/index.js +1149 -1892
- package/dist/index.mjs +81 -86
- package/package.json +20 -20
- package/src/components/Accordion/Accordion.tsx +15 -9
- package/src/components/AlertBanner/AlertBanner.tsx +7 -6
- package/src/components/AppHeader/AppHeader.tsx +25 -10
- package/src/components/Avatar/Avatar.tsx +92 -1
- package/src/components/Avatar/index.ts +2 -2
- package/src/components/Badge/Badge.tsx +2 -2
- package/src/components/Button/Button.tsx +50 -46
- package/src/components/Card/Card.tsx +1 -0
- package/src/components/CategoryStrip/CategoryStrip.tsx +36 -49
- package/src/components/Checkbox/Checkbox.tsx +3 -0
- package/src/components/Chip/Chip.tsx +5 -4
- package/src/components/ConfirmDialog/ConfirmDialog.tsx +33 -17
- package/src/components/DetailRow/DetailRow.tsx +3 -3
- package/src/components/EmptyState/EmptyState.tsx +2 -2
- package/src/components/ErrorBoundary/ErrorBoundary.tsx +6 -6
- package/src/components/HolographicCard/HolographicCard.tsx +14 -95
- package/src/components/IconButton/IconButton.tsx +2 -2
- package/src/components/IconPicker/IconPicker.tsx +13 -12
- package/src/components/ImageUpload/ImageUpload.tsx +43 -46
- package/src/components/ImageViewer/ImageViewer.tsx +3 -3
- package/src/components/Input/Input.tsx +11 -5
- package/src/components/LabelValue/LabelValue.tsx +2 -2
- package/src/components/ListItem/ListItem.tsx +7 -4
- package/src/components/MediaCard/MediaCard.tsx +21 -59
- package/src/components/MenuItem/MenuItem.tsx +5 -2
- package/src/components/MonthPicker/MonthPicker.tsx +2 -2
- package/src/components/NumberStepper/NumberStepper.tsx +10 -6
- package/src/components/PagerDots/PagerDots.tsx +38 -28
- package/src/components/PricingCard/PricingCard.tsx +6 -6
- package/src/components/RadioGroup/RadioGroup.tsx +18 -31
- package/src/components/Select/Select.tsx +35 -39
- package/src/components/SelectableCard/SelectableCard.tsx +4 -6
- package/src/components/SelectableGrid/SelectableGrid.tsx +37 -72
- package/src/components/Sheet/Sheet.tsx +28 -15
- package/src/components/Sheet/index.ts +2 -2
- package/src/components/SheetSelect/SheetSelect.tsx +3 -3
- package/src/components/Skeleton/Skeleton.tsx +1 -1
- package/src/components/Slider/Slider.tsx +3 -0
- package/src/components/Spinner/Spinner.tsx +2 -2
- package/src/components/Stats/Stats.tsx +2 -2
- package/src/components/Switch/Switch.tsx +12 -7
- package/src/components/TabBar/TabBar.tsx +9 -8
- package/src/components/Text/Text.tsx +13 -1
- package/src/components/Textarea/Textarea.tsx +18 -32
- package/src/components/Toggle/Toggle.tsx +3 -3
- package/src/hooks/useConfirmDialog.ts +31 -42
- package/src/index.ts +3 -4
- package/src/theme/ThemeProvider.tsx +1 -4
- package/src/theme/colorUtils.ts +1 -72
- package/src/theme/colors.ts +40 -1
- package/src/theme/types.ts +2 -2
- package/src/utils/animations.ts +0 -47
- package/src/utils/curatedIcons.ts +93 -801
- package/src/utils/haptics.ts +13 -208
- package/src/utils/icons.ts +27 -91
- package/src/utils/pressable.ts +10 -61
- package/dist/VirtualList.d.mts +0 -19
- package/dist/VirtualList.d.ts +0 -19
- package/dist/VirtualList.js +0 -38
- package/dist/VirtualList.mjs +0 -2
- package/dist/chunk-2BA3JMKK.mjs +0 -136
- package/dist/chunk-3DKJ2GIC.mjs +0 -30
- package/dist/chunk-7ELGZ66G.mjs +0 -164
- package/dist/chunk-DVK4G2GT.mjs +0 -59
- package/dist/chunk-EJ7ZPXOH.mjs +0 -163
- package/dist/chunk-KA7LTET3.mjs +0 -71
- package/dist/chunk-LNPKGWBG.mjs +0 -134
- package/dist/chunk-NC5ZTR2Y.mjs +0 -32
- package/dist/chunk-SAWUXP3A.mjs +0 -1114
- package/dist/chunk-Y6FXYEAI.mjs +0 -8
- package/dist/chunk-YNROWHQJ.mjs +0 -46
- package/src/components/VirtualList/VirtualList.tsx +0 -60
- package/src/components/VirtualList/index.ts +0 -1
- package/src/utils/fontGuard.ts +0 -35
- package/src/utils/hover.ts +0 -25
- package/src/utils/useColorTransition.ts +0 -40
- package/src/utils/usePressScale.ts +0 -75
|
@@ -2,43 +2,22 @@ import React from 'react';
|
|
|
2
2
|
import { ViewStyle } from 'react-native';
|
|
3
3
|
|
|
4
4
|
interface SelectableGridItem<T extends string | number = string> {
|
|
5
|
-
/** Unique value emitted on selection. */
|
|
6
5
|
value: T;
|
|
7
|
-
/** Label rendered under the icon. */
|
|
8
6
|
label?: string;
|
|
9
|
-
/** Icon name resolved via the icon registry. */
|
|
10
7
|
iconName?: string;
|
|
11
|
-
/** Custom icon node — overrides `iconName`. */
|
|
12
8
|
icon?: React.ReactNode;
|
|
13
9
|
disabled?: boolean;
|
|
14
10
|
}
|
|
15
11
|
interface SelectableGridProps<T extends string | number = string> {
|
|
16
12
|
items: SelectableGridItem<T>[];
|
|
17
|
-
/** Selected value(s). Array when `multiple`. */
|
|
18
13
|
value: T | T[] | null;
|
|
19
14
|
onChange: (value: T) => void;
|
|
20
|
-
/** Allow multiple selections. `value` should be an array. Defaults to false. */
|
|
21
15
|
multiple?: boolean;
|
|
22
|
-
/** Columns per row. Defaults to 4. Ignored when `orientation='horizontal'`. */
|
|
23
16
|
numColumns?: number;
|
|
24
|
-
/** Gap between cells (dp). Defaults to 12. */
|
|
25
17
|
gap?: number;
|
|
26
|
-
/** Layout orientation. 'grid' (default) wraps into rows. 'horizontal' creates a single scrollable row. */
|
|
27
18
|
orientation?: 'grid' | 'horizontal';
|
|
28
19
|
style?: ViewStyle;
|
|
29
20
|
}
|
|
30
|
-
/**
|
|
31
|
-
* Grid of selectable cells (icon + label) — for store / category / emoji pickers
|
|
32
|
-
* where a list would be the wrong shape. Single or multi select.
|
|
33
|
-
*
|
|
34
|
-
* @example
|
|
35
|
-
* <SelectableGrid
|
|
36
|
-
* items={categories}
|
|
37
|
-
* value={selected}
|
|
38
|
-
* onChange={setSelected}
|
|
39
|
-
* numColumns={4}
|
|
40
|
-
* />
|
|
41
|
-
*/
|
|
42
21
|
declare function SelectableGrid<T extends string | number = string>({ items, value, onChange, multiple, numColumns, gap, orientation, style, }: SelectableGridProps<T>): React.JSX.Element;
|
|
43
22
|
|
|
44
23
|
export { SelectableGrid, type SelectableGridItem, type SelectableGridProps };
|
package/dist/SelectableGrid.d.ts
CHANGED
|
@@ -2,43 +2,22 @@ import React from 'react';
|
|
|
2
2
|
import { ViewStyle } from 'react-native';
|
|
3
3
|
|
|
4
4
|
interface SelectableGridItem<T extends string | number = string> {
|
|
5
|
-
/** Unique value emitted on selection. */
|
|
6
5
|
value: T;
|
|
7
|
-
/** Label rendered under the icon. */
|
|
8
6
|
label?: string;
|
|
9
|
-
/** Icon name resolved via the icon registry. */
|
|
10
7
|
iconName?: string;
|
|
11
|
-
/** Custom icon node — overrides `iconName`. */
|
|
12
8
|
icon?: React.ReactNode;
|
|
13
9
|
disabled?: boolean;
|
|
14
10
|
}
|
|
15
11
|
interface SelectableGridProps<T extends string | number = string> {
|
|
16
12
|
items: SelectableGridItem<T>[];
|
|
17
|
-
/** Selected value(s). Array when `multiple`. */
|
|
18
13
|
value: T | T[] | null;
|
|
19
14
|
onChange: (value: T) => void;
|
|
20
|
-
/** Allow multiple selections. `value` should be an array. Defaults to false. */
|
|
21
15
|
multiple?: boolean;
|
|
22
|
-
/** Columns per row. Defaults to 4. Ignored when `orientation='horizontal'`. */
|
|
23
16
|
numColumns?: number;
|
|
24
|
-
/** Gap between cells (dp). Defaults to 12. */
|
|
25
17
|
gap?: number;
|
|
26
|
-
/** Layout orientation. 'grid' (default) wraps into rows. 'horizontal' creates a single scrollable row. */
|
|
27
18
|
orientation?: 'grid' | 'horizontal';
|
|
28
19
|
style?: ViewStyle;
|
|
29
20
|
}
|
|
30
|
-
/**
|
|
31
|
-
* Grid of selectable cells (icon + label) — for store / category / emoji pickers
|
|
32
|
-
* where a list would be the wrong shape. Single or multi select.
|
|
33
|
-
*
|
|
34
|
-
* @example
|
|
35
|
-
* <SelectableGrid
|
|
36
|
-
* items={categories}
|
|
37
|
-
* value={selected}
|
|
38
|
-
* onChange={setSelected}
|
|
39
|
-
* numColumns={4}
|
|
40
|
-
* />
|
|
41
|
-
*/
|
|
42
21
|
declare function SelectableGrid<T extends string | number = string>({ items, value, onChange, multiple, numColumns, gap, orientation, style, }: SelectableGridProps<T>): React.JSX.Element;
|
|
43
22
|
|
|
44
23
|
export { SelectableGrid, type SelectableGridItem, type SelectableGridProps };
|
package/dist/SelectableGrid.js
CHANGED
|
@@ -2,19 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
var React3 = require('react');
|
|
4
4
|
var reactNative = require('react-native');
|
|
5
|
-
var Animated = require('react-native-reanimated');
|
|
6
5
|
var AntDesign = require('@expo/vector-icons/AntDesign');
|
|
7
6
|
var Entypo = require('@expo/vector-icons/Entypo');
|
|
8
7
|
var Feather = require('@expo/vector-icons/Feather');
|
|
9
8
|
var FontAwesome5 = require('@expo/vector-icons/FontAwesome5');
|
|
10
9
|
var MaterialIcons = require('@expo/vector-icons/MaterialIcons');
|
|
11
10
|
var Ionicons = require('@expo/vector-icons/Ionicons');
|
|
11
|
+
var pressto = require('pressto');
|
|
12
12
|
var reactNativeSizeMatters = require('react-native-size-matters');
|
|
13
13
|
|
|
14
14
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
15
|
|
|
16
16
|
var React3__default = /*#__PURE__*/_interopDefault(React3);
|
|
17
|
-
var Animated__default = /*#__PURE__*/_interopDefault(Animated);
|
|
18
17
|
var AntDesign__default = /*#__PURE__*/_interopDefault(AntDesign);
|
|
19
18
|
var Entypo__default = /*#__PURE__*/_interopDefault(Entypo);
|
|
20
19
|
var Feather__default = /*#__PURE__*/_interopDefault(Feather);
|
|
@@ -22,126 +21,8 @@ var FontAwesome5__default = /*#__PURE__*/_interopDefault(FontAwesome5);
|
|
|
22
21
|
var MaterialIcons__default = /*#__PURE__*/_interopDefault(MaterialIcons);
|
|
23
22
|
var Ionicons__default = /*#__PURE__*/_interopDefault(Ionicons);
|
|
24
23
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
}) : x)(function(x) {
|
|
28
|
-
if (typeof require !== "undefined") return require.apply(this, arguments);
|
|
29
|
-
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
// src/theme/colorUtils.ts
|
|
33
|
-
function hexToRgb(hex) {
|
|
34
|
-
const clean = hex.replace("#", "");
|
|
35
|
-
const full = clean.length === 3 ? clean.split("").map((c) => c + c).join("") : clean;
|
|
36
|
-
if (full.length !== 6) return null;
|
|
37
|
-
return {
|
|
38
|
-
r: parseInt(full.slice(0, 2), 16),
|
|
39
|
-
g: parseInt(full.slice(2, 4), 16),
|
|
40
|
-
b: parseInt(full.slice(4, 6), 16)
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
function componentToHex(c) {
|
|
44
|
-
return Math.round(Math.max(0, Math.min(255, c))).toString(16).padStart(2, "0");
|
|
45
|
-
}
|
|
46
|
-
function rgbToHex(r, g, b) {
|
|
47
|
-
return `#${componentToHex(r)}${componentToHex(g)}${componentToHex(b)}`;
|
|
48
|
-
}
|
|
49
|
-
function withAlphaOnWhite(hex, alpha) {
|
|
50
|
-
const rgb = hexToRgb(hex);
|
|
51
|
-
if (!rgb) return hex;
|
|
52
|
-
const r = rgb.r * alpha + 255 * (1 - alpha);
|
|
53
|
-
const g = rgb.g * alpha + 255 * (1 - alpha);
|
|
54
|
-
const b = rgb.b * alpha + 255 * (1 - alpha);
|
|
55
|
-
return rgbToHex(r, g, b);
|
|
56
|
-
}
|
|
57
|
-
function withAlphaOnDark(hex, alpha, bgHex = "#0f0f0f") {
|
|
58
|
-
const rgb = hexToRgb(hex);
|
|
59
|
-
const bg = hexToRgb(bgHex);
|
|
60
|
-
if (!rgb || !bg) return hex;
|
|
61
|
-
const r = rgb.r * alpha + bg.r * (1 - alpha);
|
|
62
|
-
const g = rgb.g * alpha + bg.g * (1 - alpha);
|
|
63
|
-
const b = rgb.b * alpha + bg.b * (1 - alpha);
|
|
64
|
-
return rgbToHex(r, g, b);
|
|
65
|
-
}
|
|
66
|
-
function mixWithBackground(fgHex, bgHex, opacity) {
|
|
67
|
-
const fg = hexToRgb(fgHex);
|
|
68
|
-
const bg = hexToRgb(bgHex);
|
|
69
|
-
if (!fg || !bg) return fgHex;
|
|
70
|
-
const r = fg.r * opacity + bg.r * (1 - opacity);
|
|
71
|
-
const g = fg.g * opacity + bg.g * (1 - opacity);
|
|
72
|
-
const b = fg.b * opacity + bg.b * (1 - opacity);
|
|
73
|
-
return rgbToHex(r, g, b);
|
|
74
|
-
}
|
|
75
|
-
function lighten(hex, amount) {
|
|
76
|
-
return withAlphaOnWhite(hex, 1 - amount);
|
|
77
|
-
}
|
|
78
|
-
function darken(hex, amount) {
|
|
79
|
-
const rgb = hexToRgb(hex);
|
|
80
|
-
if (!rgb) return hex;
|
|
81
|
-
return rgbToHex(rgb.r * (1 - amount), rgb.g * (1 - amount), rgb.b * (1 - amount));
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
// src/theme/colors.ts
|
|
85
|
-
var defaultLight = {
|
|
86
|
-
background: "#ffffff",
|
|
87
|
-
foreground: "#1a1a1a",
|
|
88
|
-
card: "#ffffff",
|
|
89
|
-
primary: "#1a1a1a",
|
|
90
|
-
primaryForeground: "#ffffff",
|
|
91
|
-
// AUDIT FIX: brand accent — was undefined; falls back to primary when omitted
|
|
92
|
-
accent: "#d4561d",
|
|
93
|
-
accentForeground: "#ffffff",
|
|
94
|
-
border: "#dddddd",
|
|
95
|
-
// AUDIT FIX: was #e53935 (4.22:1 on white — fails AA); #c72828 = 5.59:1 ✓
|
|
96
|
-
destructive: "#c72828",
|
|
97
|
-
destructiveForeground: "#ffffff",
|
|
98
|
-
success: "#1a7a45",
|
|
99
|
-
successForeground: "#ffffff",
|
|
100
|
-
// AUDIT FIX: was #e67e00 (2.86:1 — severe fail); #9a5200 = 5.86:1 ✓ AAA-near
|
|
101
|
-
warning: "#9a5200",
|
|
102
|
-
warningForeground: "#ffffff"
|
|
103
|
-
};
|
|
104
|
-
function deriveColors(t, scheme) {
|
|
105
|
-
const dark = scheme === "dark";
|
|
106
|
-
const bg = t.background;
|
|
107
|
-
const foregroundSubtle = mixWithBackground(t.foreground, bg, 0.7);
|
|
108
|
-
const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
|
|
109
|
-
const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
|
|
110
|
-
const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
|
|
111
|
-
const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
|
|
112
|
-
const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
|
|
113
|
-
const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
|
|
114
|
-
const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
|
|
115
|
-
const successBorder = dark ? withAlphaOnDark(t.success, 0.45, bg) : withAlphaOnWhite(t.success, 0.3);
|
|
116
|
-
const warningTint = dark ? withAlphaOnDark(t.warning, 0.15, bg) : withAlphaOnWhite(t.warning, 0.08);
|
|
117
|
-
const warningBorder = dark ? withAlphaOnDark(t.warning, 0.45, bg) : withAlphaOnWhite(t.warning, 0.3);
|
|
118
|
-
return {
|
|
119
|
-
...t,
|
|
120
|
-
foregroundSubtle,
|
|
121
|
-
foregroundMuted,
|
|
122
|
-
surface,
|
|
123
|
-
surfaceStrong,
|
|
124
|
-
skeleton,
|
|
125
|
-
destructiveTint,
|
|
126
|
-
destructiveBorder,
|
|
127
|
-
successTint,
|
|
128
|
-
successBorder,
|
|
129
|
-
warningTint,
|
|
130
|
-
warningBorder,
|
|
131
|
-
overlay: t.overlay ?? "rgba(0,0,0,0.45)",
|
|
132
|
-
accentResolved: t.accent ?? t.primary,
|
|
133
|
-
accentForegroundResolved: t.accentForeground ?? t.primaryForeground,
|
|
134
|
-
ring: t.accent ?? t.primary,
|
|
135
|
-
input: t.border,
|
|
136
|
-
separator: dark ? lighten(t.border, 0.22) : darken(t.border, 0.16)
|
|
137
|
-
};
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
// src/theme/ThemeProvider.tsx
|
|
141
|
-
var ThemeContext = React3.createContext({
|
|
142
|
-
colors: deriveColors(defaultLight, "light"),
|
|
143
|
-
colorScheme: "light"
|
|
144
|
-
});
|
|
24
|
+
// src/components/SelectableGrid/SelectableGrid.tsx
|
|
25
|
+
var ThemeContext = React3.createContext(void 0);
|
|
145
26
|
function useTheme() {
|
|
146
27
|
const context = React3.useContext(ThemeContext);
|
|
147
28
|
if (!context) {
|
|
@@ -149,110 +30,50 @@ function useTheme() {
|
|
|
149
30
|
}
|
|
150
31
|
return context;
|
|
151
32
|
}
|
|
152
|
-
var glyphMapOf = (mod) => mod.glyphMap ?? {};
|
|
153
33
|
var ALL_FAMILIES = [
|
|
154
|
-
{ name: "
|
|
155
|
-
{ name: "
|
|
156
|
-
{ name: "
|
|
157
|
-
{ name: "
|
|
158
|
-
{ name: "
|
|
159
|
-
{ name: "
|
|
34
|
+
{ name: "Feather", component: Feather__default.default },
|
|
35
|
+
{ name: "AntDesign", component: AntDesign__default.default },
|
|
36
|
+
{ name: "Entypo", component: Entypo__default.default },
|
|
37
|
+
{ name: "FontAwesome5", component: FontAwesome5__default.default },
|
|
38
|
+
{ name: "MaterialIcons", component: MaterialIcons__default.default },
|
|
39
|
+
{ name: "Ionicons", component: Ionicons__default.default }
|
|
160
40
|
];
|
|
161
|
-
var
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
for (const
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
41
|
+
var glyphCacheInitialized = false;
|
|
42
|
+
function ensureGlyphCache() {
|
|
43
|
+
if (glyphCacheInitialized) return;
|
|
44
|
+
glyphCacheInitialized = true;
|
|
45
|
+
for (const entry of ALL_FAMILIES) {
|
|
46
|
+
try {
|
|
47
|
+
entry.glyphMap = entry.component.glyphMap;
|
|
48
|
+
} catch {
|
|
49
|
+
entry.glyphMap = {};
|
|
169
50
|
}
|
|
170
51
|
}
|
|
171
|
-
return cache;
|
|
172
|
-
}
|
|
173
|
-
function resolveFamily(name) {
|
|
174
|
-
if (!resolvedCache) {
|
|
175
|
-
resolvedCache = buildCache();
|
|
176
|
-
}
|
|
177
|
-
return resolvedCache.get(name) ?? null;
|
|
178
52
|
}
|
|
179
53
|
function Icon({ name, size, color, family }) {
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
const Component = resolved.component;
|
|
188
|
-
return React3__default.default.createElement(Component, { name, size, color });
|
|
189
|
-
}
|
|
190
|
-
function renderIcon(name, size, color) {
|
|
191
|
-
return React3__default.default.createElement(Icon, { name, size, color });
|
|
54
|
+
ensureGlyphCache();
|
|
55
|
+
const entry = family ? ALL_FAMILIES.find((f) => f.name === family) : ALL_FAMILIES.find((f) => {
|
|
56
|
+
const glyphMap = f.glyphMap;
|
|
57
|
+
return glyphMap ? name in glyphMap : false;
|
|
58
|
+
});
|
|
59
|
+
if (!entry) return null;
|
|
60
|
+
return React3__default.default.createElement(entry.component, { name, size, color });
|
|
192
61
|
}
|
|
193
|
-
var
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
pressOut: { stiffness: 280, damping: 22, mass: 0.8 }};
|
|
197
|
-
({
|
|
198
|
-
/** Material-style ease-out — natural deceleration for state changes. */
|
|
199
|
-
standard: Animated.Easing.bezier(0.2, 0, 0, 1),
|
|
200
|
-
/** Strong ease-out for expanding surfaces (Accordion open). */
|
|
201
|
-
expand: Animated.Easing.bezier(0.23, 1, 0.32, 1),
|
|
202
|
-
/** Quick ease-in for collapsing. */
|
|
203
|
-
collapse: Animated.Easing.in(Animated.Easing.ease)
|
|
62
|
+
var makePressable = (scale2) => pressto.createAnimatedPressable((progress) => {
|
|
63
|
+
"worklet";
|
|
64
|
+
return { transform: [{ scale: 1 - (1 - scale2) * progress }] };
|
|
204
65
|
});
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
const [hovered, setHovered] = React3.useState(false);
|
|
211
|
-
const onMouseEnter = React3.useCallback(() => setHovered(true), []);
|
|
212
|
-
const onMouseLeave = React3.useCallback(() => setHovered(false), []);
|
|
213
|
-
if (reactNative.Platform.OS !== "web") {
|
|
214
|
-
return { hovered: false, hoverHandlers: {} };
|
|
215
|
-
}
|
|
216
|
-
return { hovered, hoverHandlers: { onMouseEnter, onMouseLeave } };
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
// src/utils/usePressScale.ts
|
|
220
|
-
function usePressScale({
|
|
221
|
-
pressScale = PRESS_SCALE.button,
|
|
222
|
-
hoverScale = 1.02,
|
|
223
|
-
pressInSpring = SPRINGS.pressIn,
|
|
224
|
-
pressOutSpring = SPRINGS.pressOut,
|
|
225
|
-
disabled = false
|
|
226
|
-
} = {}) {
|
|
227
|
-
const scale2 = Animated.useSharedValue(1);
|
|
228
|
-
const { hovered, hoverHandlers } = useHover();
|
|
229
|
-
const onPressIn = React3.useCallback(() => {
|
|
230
|
-
if (disabled) return;
|
|
231
|
-
scale2.value = Animated.withSpring(pressScale, pressInSpring);
|
|
232
|
-
}, [disabled, pressScale, pressInSpring, scale2]);
|
|
233
|
-
const onPressOut = React3.useCallback(() => {
|
|
234
|
-
if (disabled) return;
|
|
235
|
-
scale2.value = Animated.withSpring(1, pressOutSpring);
|
|
236
|
-
}, [disabled, pressOutSpring, scale2]);
|
|
237
|
-
const hoverActive = reactNative.Platform.OS === "web" && hovered && hoverScale !== 1 && !disabled;
|
|
238
|
-
const animatedStyle = Animated.useAnimatedStyle(() => ({
|
|
239
|
-
transform: [
|
|
240
|
-
{ scale: scale2.value * (hoverActive ? hoverScale : 1) }
|
|
241
|
-
]
|
|
242
|
-
}));
|
|
243
|
-
return {
|
|
244
|
-
animatedStyle,
|
|
245
|
-
onPressIn,
|
|
246
|
-
onPressOut,
|
|
247
|
-
hoverHandlers
|
|
248
|
-
};
|
|
249
|
-
}
|
|
66
|
+
makePressable(0.95);
|
|
67
|
+
makePressable(0.98);
|
|
68
|
+
makePressable(0.97);
|
|
69
|
+
var PressableChip = makePressable(0.94);
|
|
70
|
+
makePressable(0.95);
|
|
250
71
|
var _haptics = null;
|
|
251
|
-
var
|
|
72
|
+
var _loaded = false;
|
|
252
73
|
async function getHaptics() {
|
|
253
74
|
if (reactNative.Platform.OS === "web") return null;
|
|
254
|
-
if (!
|
|
255
|
-
|
|
75
|
+
if (!_loaded) {
|
|
76
|
+
_loaded = true;
|
|
256
77
|
try {
|
|
257
78
|
_haptics = await import('expo-haptics');
|
|
258
79
|
} catch {
|
|
@@ -261,45 +82,8 @@ async function getHaptics() {
|
|
|
261
82
|
}
|
|
262
83
|
return _haptics;
|
|
263
84
|
}
|
|
264
|
-
var _pulsar = null;
|
|
265
|
-
var _pulsarChecked = false;
|
|
266
|
-
var _pulsarAvailable = false;
|
|
267
|
-
function isPulsarNativeRegistered() {
|
|
268
|
-
try {
|
|
269
|
-
const g = globalThis;
|
|
270
|
-
if (typeof g.__turboModuleProxy === "function") {
|
|
271
|
-
return g.__turboModuleProxy("RNPulsar") != null;
|
|
272
|
-
}
|
|
273
|
-
return reactNative.NativeModules?.RNPulsar != null;
|
|
274
|
-
} catch {
|
|
275
|
-
return false;
|
|
276
|
-
}
|
|
277
|
-
}
|
|
278
|
-
function getPulsar() {
|
|
279
|
-
if (reactNative.Platform.OS === "web") return null;
|
|
280
|
-
if (!_pulsarChecked) {
|
|
281
|
-
_pulsarChecked = true;
|
|
282
|
-
try {
|
|
283
|
-
if (isPulsarNativeRegistered()) {
|
|
284
|
-
_pulsar = __require("react-native-pulsar");
|
|
285
|
-
_pulsarAvailable = true;
|
|
286
|
-
}
|
|
287
|
-
} catch {
|
|
288
|
-
_pulsar = null;
|
|
289
|
-
_pulsarAvailable = false;
|
|
290
|
-
}
|
|
291
|
-
}
|
|
292
|
-
return _pulsarAvailable ? _pulsar : null;
|
|
293
|
-
}
|
|
294
85
|
function selectionAsync() {
|
|
295
|
-
|
|
296
|
-
getHaptics().then((h) => {
|
|
297
|
-
if (h) {
|
|
298
|
-
h.selectionAsync();
|
|
299
|
-
} else {
|
|
300
|
-
getPulsar()?.Presets.System.selection();
|
|
301
|
-
}
|
|
302
|
-
});
|
|
86
|
+
getHaptics().then((h) => h?.selectionAsync());
|
|
303
87
|
}
|
|
304
88
|
var isWeb = reactNative.Platform.OS === "web";
|
|
305
89
|
var s = isWeb ? (n) => n : reactNativeSizeMatters.scale;
|
|
@@ -318,29 +102,23 @@ function isSelected(value, candidate) {
|
|
|
318
102
|
}
|
|
319
103
|
function Cell({ item, selected, width, onPress }) {
|
|
320
104
|
const { colors } = useTheme();
|
|
321
|
-
const { animatedStyle, onPressIn, onPressOut, hoverHandlers } = usePressScale({
|
|
322
|
-
pressScale: PRESS_SCALE.chip,
|
|
323
|
-
disabled: item.disabled
|
|
324
|
-
});
|
|
325
105
|
const iconColor = selected ? colors.primary : colors.foregroundSubtle;
|
|
326
|
-
const iconNode = item.icon ?? (item.iconName ?
|
|
327
|
-
return /* @__PURE__ */ React3__default.default.createElement(
|
|
328
|
-
|
|
106
|
+
const iconNode = item.icon ?? (item.iconName ? /* @__PURE__ */ React3__default.default.createElement(Icon, { name: item.iconName, size: ms(24), color: iconColor }) : null);
|
|
107
|
+
return /* @__PURE__ */ React3__default.default.createElement(
|
|
108
|
+
PressableChip,
|
|
329
109
|
{
|
|
330
110
|
onPress,
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
disabled: item.disabled,
|
|
334
|
-
activeOpacity: 1,
|
|
111
|
+
enabled: !item.disabled,
|
|
112
|
+
rippleColor: "transparent",
|
|
335
113
|
touchSoundDisabled: true,
|
|
114
|
+
activateOnHover: true,
|
|
336
115
|
accessibilityRole: "button",
|
|
337
116
|
accessibilityState: { selected, disabled: item.disabled },
|
|
338
117
|
accessibilityLabel: item.label ?? String(item.value),
|
|
339
|
-
...hoverHandlers,
|
|
340
118
|
style: [
|
|
119
|
+
{ width },
|
|
341
120
|
styles.cell,
|
|
342
121
|
{
|
|
343
|
-
backgroundColor: selected ? colors.primary + "14" : colors.surface,
|
|
344
122
|
borderColor: selected ? colors.primary : "transparent"
|
|
345
123
|
},
|
|
346
124
|
item.disabled && styles.cellDisabled
|
|
@@ -356,7 +134,7 @@ function Cell({ item, selected, width, onPress }) {
|
|
|
356
134
|
},
|
|
357
135
|
item.label
|
|
358
136
|
) : null
|
|
359
|
-
)
|
|
137
|
+
);
|
|
360
138
|
}
|
|
361
139
|
function SelectableGrid({
|
|
362
140
|
items,
|
|
@@ -427,22 +205,21 @@ var styles = reactNative.StyleSheet.create({
|
|
|
427
205
|
paddingHorizontal: s(4)
|
|
428
206
|
},
|
|
429
207
|
cell: {
|
|
430
|
-
flex: 1,
|
|
431
208
|
borderRadius: RADIUS.md,
|
|
432
209
|
borderWidth: 2,
|
|
433
210
|
alignItems: "center",
|
|
434
211
|
justifyContent: "center",
|
|
435
212
|
gap: vs(4),
|
|
436
|
-
paddingHorizontal: s(
|
|
437
|
-
paddingVertical: vs(
|
|
213
|
+
paddingHorizontal: s(8),
|
|
214
|
+
paddingVertical: vs(10)
|
|
438
215
|
},
|
|
439
216
|
cellDisabled: {
|
|
440
217
|
opacity: 0.4
|
|
441
218
|
},
|
|
442
219
|
label: {
|
|
443
220
|
fontFamily: "Sohne-Medium",
|
|
444
|
-
fontSize: ms(
|
|
445
|
-
lineHeight: mvs(
|
|
221
|
+
fontSize: ms(11),
|
|
222
|
+
lineHeight: mvs(14),
|
|
446
223
|
textAlign: "center"
|
|
447
224
|
}
|
|
448
225
|
});
|
package/dist/SelectableGrid.mjs
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
export { SelectableGrid } from './chunk-
|
|
2
|
-
import './chunk-
|
|
3
|
-
import './chunk-
|
|
4
|
-
import './chunk-DVK4G2GT.mjs';
|
|
1
|
+
export { SelectableGrid } from './chunk-NPCBNGNE.mjs';
|
|
2
|
+
import './chunk-IFYMBOEN.mjs';
|
|
3
|
+
import './chunk-ARONDO7M.mjs';
|
|
5
4
|
import './chunk-QY3X2UYR.mjs';
|
|
6
|
-
import './chunk-
|
|
7
|
-
import './chunk-
|
|
5
|
+
import './chunk-MZ6WRTD2.mjs';
|
|
6
|
+
import './chunk-KSSVIFYR.mjs';
|
|
8
7
|
import './chunk-2CE3TQVY.mjs';
|
|
9
|
-
import './chunk-Y6FXYEAI.mjs';
|
package/dist/Separator.js
CHANGED
|
@@ -8,120 +8,7 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
|
8
8
|
var React2__default = /*#__PURE__*/_interopDefault(React2);
|
|
9
9
|
|
|
10
10
|
// src/components/Separator/Separator.tsx
|
|
11
|
-
|
|
12
|
-
// src/theme/colorUtils.ts
|
|
13
|
-
function hexToRgb(hex) {
|
|
14
|
-
const clean = hex.replace("#", "");
|
|
15
|
-
const full = clean.length === 3 ? clean.split("").map((c) => c + c).join("") : clean;
|
|
16
|
-
if (full.length !== 6) return null;
|
|
17
|
-
return {
|
|
18
|
-
r: parseInt(full.slice(0, 2), 16),
|
|
19
|
-
g: parseInt(full.slice(2, 4), 16),
|
|
20
|
-
b: parseInt(full.slice(4, 6), 16)
|
|
21
|
-
};
|
|
22
|
-
}
|
|
23
|
-
function componentToHex(c) {
|
|
24
|
-
return Math.round(Math.max(0, Math.min(255, c))).toString(16).padStart(2, "0");
|
|
25
|
-
}
|
|
26
|
-
function rgbToHex(r, g, b) {
|
|
27
|
-
return `#${componentToHex(r)}${componentToHex(g)}${componentToHex(b)}`;
|
|
28
|
-
}
|
|
29
|
-
function withAlphaOnWhite(hex, alpha) {
|
|
30
|
-
const rgb = hexToRgb(hex);
|
|
31
|
-
if (!rgb) return hex;
|
|
32
|
-
const r = rgb.r * alpha + 255 * (1 - alpha);
|
|
33
|
-
const g = rgb.g * alpha + 255 * (1 - alpha);
|
|
34
|
-
const b = rgb.b * alpha + 255 * (1 - alpha);
|
|
35
|
-
return rgbToHex(r, g, b);
|
|
36
|
-
}
|
|
37
|
-
function withAlphaOnDark(hex, alpha, bgHex = "#0f0f0f") {
|
|
38
|
-
const rgb = hexToRgb(hex);
|
|
39
|
-
const bg = hexToRgb(bgHex);
|
|
40
|
-
if (!rgb || !bg) return hex;
|
|
41
|
-
const r = rgb.r * alpha + bg.r * (1 - alpha);
|
|
42
|
-
const g = rgb.g * alpha + bg.g * (1 - alpha);
|
|
43
|
-
const b = rgb.b * alpha + bg.b * (1 - alpha);
|
|
44
|
-
return rgbToHex(r, g, b);
|
|
45
|
-
}
|
|
46
|
-
function mixWithBackground(fgHex, bgHex, opacity) {
|
|
47
|
-
const fg = hexToRgb(fgHex);
|
|
48
|
-
const bg = hexToRgb(bgHex);
|
|
49
|
-
if (!fg || !bg) return fgHex;
|
|
50
|
-
const r = fg.r * opacity + bg.r * (1 - opacity);
|
|
51
|
-
const g = fg.g * opacity + bg.g * (1 - opacity);
|
|
52
|
-
const b = fg.b * opacity + bg.b * (1 - opacity);
|
|
53
|
-
return rgbToHex(r, g, b);
|
|
54
|
-
}
|
|
55
|
-
function lighten(hex, amount) {
|
|
56
|
-
return withAlphaOnWhite(hex, 1 - amount);
|
|
57
|
-
}
|
|
58
|
-
function darken(hex, amount) {
|
|
59
|
-
const rgb = hexToRgb(hex);
|
|
60
|
-
if (!rgb) return hex;
|
|
61
|
-
return rgbToHex(rgb.r * (1 - amount), rgb.g * (1 - amount), rgb.b * (1 - amount));
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
// src/theme/colors.ts
|
|
65
|
-
var defaultLight = {
|
|
66
|
-
background: "#ffffff",
|
|
67
|
-
foreground: "#1a1a1a",
|
|
68
|
-
card: "#ffffff",
|
|
69
|
-
primary: "#1a1a1a",
|
|
70
|
-
primaryForeground: "#ffffff",
|
|
71
|
-
// AUDIT FIX: brand accent — was undefined; falls back to primary when omitted
|
|
72
|
-
accent: "#d4561d",
|
|
73
|
-
accentForeground: "#ffffff",
|
|
74
|
-
border: "#dddddd",
|
|
75
|
-
// AUDIT FIX: was #e53935 (4.22:1 on white — fails AA); #c72828 = 5.59:1 ✓
|
|
76
|
-
destructive: "#c72828",
|
|
77
|
-
destructiveForeground: "#ffffff",
|
|
78
|
-
success: "#1a7a45",
|
|
79
|
-
successForeground: "#ffffff",
|
|
80
|
-
// AUDIT FIX: was #e67e00 (2.86:1 — severe fail); #9a5200 = 5.86:1 ✓ AAA-near
|
|
81
|
-
warning: "#9a5200",
|
|
82
|
-
warningForeground: "#ffffff"
|
|
83
|
-
};
|
|
84
|
-
function deriveColors(t, scheme) {
|
|
85
|
-
const dark = scheme === "dark";
|
|
86
|
-
const bg = t.background;
|
|
87
|
-
const foregroundSubtle = mixWithBackground(t.foreground, bg, 0.7);
|
|
88
|
-
const foregroundMuted = mixWithBackground(t.foreground, bg, 0.62);
|
|
89
|
-
const surface = dark ? lighten(bg, -0.06) : darken(bg, 0.04);
|
|
90
|
-
const surfaceStrong = dark ? lighten(bg, -0.12) : darken(bg, 0.08);
|
|
91
|
-
const skeleton = dark ? lighten(bg, -0.1) : darken(bg, 0.1);
|
|
92
|
-
const destructiveTint = dark ? withAlphaOnDark(t.destructive, 0.15, bg) : withAlphaOnWhite(t.destructive, 0.08);
|
|
93
|
-
const destructiveBorder = dark ? withAlphaOnDark(t.destructive, 0.45, bg) : withAlphaOnWhite(t.destructive, 0.3);
|
|
94
|
-
const successTint = dark ? withAlphaOnDark(t.success, 0.15, bg) : withAlphaOnWhite(t.success, 0.08);
|
|
95
|
-
const successBorder = dark ? withAlphaOnDark(t.success, 0.45, bg) : withAlphaOnWhite(t.success, 0.3);
|
|
96
|
-
const warningTint = dark ? withAlphaOnDark(t.warning, 0.15, bg) : withAlphaOnWhite(t.warning, 0.08);
|
|
97
|
-
const warningBorder = dark ? withAlphaOnDark(t.warning, 0.45, bg) : withAlphaOnWhite(t.warning, 0.3);
|
|
98
|
-
return {
|
|
99
|
-
...t,
|
|
100
|
-
foregroundSubtle,
|
|
101
|
-
foregroundMuted,
|
|
102
|
-
surface,
|
|
103
|
-
surfaceStrong,
|
|
104
|
-
skeleton,
|
|
105
|
-
destructiveTint,
|
|
106
|
-
destructiveBorder,
|
|
107
|
-
successTint,
|
|
108
|
-
successBorder,
|
|
109
|
-
warningTint,
|
|
110
|
-
warningBorder,
|
|
111
|
-
overlay: t.overlay ?? "rgba(0,0,0,0.45)",
|
|
112
|
-
accentResolved: t.accent ?? t.primary,
|
|
113
|
-
accentForegroundResolved: t.accentForeground ?? t.primaryForeground,
|
|
114
|
-
ring: t.accent ?? t.primary,
|
|
115
|
-
input: t.border,
|
|
116
|
-
separator: dark ? lighten(t.border, 0.22) : darken(t.border, 0.16)
|
|
117
|
-
};
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
// src/theme/ThemeProvider.tsx
|
|
121
|
-
var ThemeContext = React2.createContext({
|
|
122
|
-
colors: deriveColors(defaultLight, "light"),
|
|
123
|
-
colorScheme: "light"
|
|
124
|
-
});
|
|
11
|
+
var ThemeContext = React2.createContext(void 0);
|
|
125
12
|
function useTheme() {
|
|
126
13
|
const context = React2.useContext(ThemeContext);
|
|
127
14
|
if (!context) {
|
package/dist/Separator.mjs
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
export { Separator } from './chunk-
|
|
2
|
-
import './chunk-
|
|
3
|
-
import './chunk-Y6FXYEAI.mjs';
|
|
1
|
+
export { Separator } from './chunk-EW2FIDSM.mjs';
|
|
2
|
+
import './chunk-KSSVIFYR.mjs';
|
package/dist/Sheet.d.mts
CHANGED
package/dist/Sheet.d.ts
CHANGED