panelui-native 0.51.1 → 0.53.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 +2 -1
- package/lib/module/components/candlestick-chart/index.js +1161 -0
- package/lib/module/components/candlestick-chart/index.js.map +1 -0
- package/lib/module/components/combobox/index.js +73 -7
- package/lib/module/components/combobox/index.js.map +1 -1
- package/lib/module/components/context-menu/index.js +529 -0
- package/lib/module/components/context-menu/index.js.map +1 -0
- package/lib/module/components/menu/index.js +18 -10
- package/lib/module/components/menu/index.js.map +1 -1
- package/lib/module/components/popover/index.js +71 -7
- package/lib/module/components/popover/index.js.map +1 -1
- package/lib/module/components/sortable/index.js +159 -23
- package/lib/module/components/sortable/index.js.map +1 -1
- package/lib/module/components/tabs/index.js +56 -15
- package/lib/module/components/tabs/index.js.map +1 -1
- package/lib/module/components/time-picker/index.js +295 -31
- package/lib/module/components/time-picker/index.js.map +1 -1
- package/lib/module/index.js +3 -1
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/src/components/candlestick-chart/index.d.ts +278 -0
- package/lib/typescript/src/components/candlestick-chart/index.d.ts.map +1 -0
- package/lib/typescript/src/components/combobox/index.d.ts.map +1 -1
- package/lib/typescript/src/components/context-menu/index.d.ts +270 -0
- package/lib/typescript/src/components/context-menu/index.d.ts.map +1 -0
- package/lib/typescript/src/components/menu/index.d.ts +20 -20
- package/lib/typescript/src/components/menu/index.d.ts.map +1 -1
- package/lib/typescript/src/components/popover/index.d.ts +51 -1
- package/lib/typescript/src/components/popover/index.d.ts.map +1 -1
- package/lib/typescript/src/components/sortable/index.d.ts +13 -3
- package/lib/typescript/src/components/sortable/index.d.ts.map +1 -1
- package/lib/typescript/src/components/tabs/index.d.ts +34 -2
- package/lib/typescript/src/components/tabs/index.d.ts.map +1 -1
- package/lib/typescript/src/components/time-picker/index.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +3 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/candlestick-chart/index.tsx +1360 -0
- package/src/components/combobox/index.tsx +84 -6
- package/src/components/context-menu/index.tsx +658 -0
- package/src/components/menu/index.tsx +17 -10
- package/src/components/popover/index.tsx +94 -6
- package/src/components/sortable/index.tsx +208 -22
- package/src/components/tabs/index.tsx +82 -16
- package/src/components/time-picker/index.tsx +330 -35
- package/src/index.ts +27 -0
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["PanelUIProvider","useTheme","useThemeMode","PANEL_THEMES","PANEL_THEME_NAMES","PANEL_EXTRA_THEMES","Portal","PortalHost","PortalProvider","Scrim","hasBlur","Text","Collapse","KeyboardAvoider","AnimatedPressable","ScrollProgress","useScrollProgress","hasNativeUI","hasHaptics","selectionTick","Accordion","Alert","Avatar","Attachment","AreaChart","useAreaChart","Badge","BarChart","useBarChart","BottomSheet","Breadcrumb","Button","ButtonGroup","ToggleButton","ToggleButtonGroup","useToggleButton","DatePicker","DateTimePicker","Dialog","Soundwave","Direction","useDirection","useDirectionSign","Fab","Flow","Frame","GridItem","HeatmapChart","useHeatmapChart","buildHeatmapCalendar","Map","useMap","hasMapLibre","CARTO_SOURCE","RadarChart","useRadarChart","Select","SectionRail","Tabs","Table","Carousel","useCarouselState","Calendar","Card","Checkbox","Chip","useChip","ColorPicker","Combobox","Drawer","EmptyState","Field","Form","useForm","useField","Input","InputGroup","NumberInput","OtpInput","Panelside","usePanelside","Pagination","paginationRange","PieChart","usePieChart","Textarea","Item","Kpi","Label","LineChart","useLineChart","Loader","MarkdownEditor","Marker","Menu","MessageScroller","useMessageScroller","useMessageScrollerVisibility","Message","Popover","Post","Progress","Questionnaire","RadioGroup","Rating","RingChart","useRingChart","ScatterChart","useScatterChart","ScrollFade","Separator","Signature","hasSignatureFileSystem","hasSignatureRaster","Shimmer","Reasoning","Response","Sources","Task","CodeBlock","resolveLanguage","Plan","ScrollText","TextAnimation","ScrollCanvas","ThinkingOrb","Skeleton","Slider","Sortable","reorderItems","useSortableItem","Spinner","Steps","Surface","Swipe","useSwipeGroup","Switch","TimePicker","Timeline","Toast","ToastViewport","toast","useToast","Tree","Tooltip","Typography","AlertTriangleIcon","AppleIcon","ArrowDownIcon","ArrowUpIcon","ArrowUpRightIcon","BadgeCheckIcon","BellIcon","BookmarkIcon","BoldIcon","CalendarIcon","CardIcon","CheckCircleIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","ChevronUpIcon","CircleIcon","CodeIcon","ClockIcon","CompassIcon","CopyIcon","CrosshairIcon","DownloadIcon","EllipsisIcon","EyeIcon","FacebookIcon","FileIcon","FolderIcon","FolderOpenIcon","GoogleIcon","HeartIcon","HeadingIcon","IconColorProvider","InfoIcon","ItalicIcon","ImageIcon","KeyboardIcon","LinkIcon","ListIcon","ListChecksIcon","ListOrderedIcon","LockIcon","MaximizeIcon","MenuIcon","MessageCircleIcon","MicIcon","MinusIcon","MoonIcon","PackageIcon","PaperclipIcon","PauseIcon","PencilIcon","PlayIcon","PlusIcon","PlusSquareIcon","QuoteIcon","ReceiptIcon","RepeatIcon","RotateCcwIcon","RotateCwIcon","SearchIcon","SendIcon","ShareNodesIcon","ShieldAlertIcon","ShieldCheckIcon","SparklesIcon","StarIcon","SunIcon","TrashIcon","UnlockIcon","XIcon","useIconColor","cn","formatColor","hsvToCss","hsvToHex","hsvToHsl","hsvToRgb","isValidColor","parseColor","rgbToHsv","clampTime","compareTime","displayHour","formatTime","isSameTime","isTimeInRange","meridiemLabels","minutesToTime","roundToStep","timeFromDate","timeToDate","timeToMinutes","timesOfDay"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":"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
|
|
1
|
+
{"version":3,"names":["PanelUIProvider","useTheme","useThemeMode","PANEL_THEMES","PANEL_THEME_NAMES","PANEL_EXTRA_THEMES","Portal","PortalHost","PortalProvider","Scrim","hasBlur","Text","Collapse","KeyboardAvoider","AnimatedPressable","ScrollProgress","useScrollProgress","hasNativeUI","hasHaptics","selectionTick","Accordion","Alert","Avatar","Attachment","AreaChart","useAreaChart","Badge","BarChart","useBarChart","CandlestickChart","useCandlestickChart","BottomSheet","Breadcrumb","Button","ButtonGroup","ToggleButton","ToggleButtonGroup","useToggleButton","DatePicker","DateTimePicker","Dialog","Soundwave","Direction","useDirection","useDirectionSign","Fab","Flow","Frame","GridItem","HeatmapChart","useHeatmapChart","buildHeatmapCalendar","Map","useMap","hasMapLibre","CARTO_SOURCE","RadarChart","useRadarChart","Select","SectionRail","Tabs","Table","Carousel","useCarouselState","Calendar","Card","Checkbox","Chip","useChip","ColorPicker","Combobox","ContextMenu","Drawer","EmptyState","Field","Form","useForm","useField","Input","InputGroup","NumberInput","OtpInput","Panelside","usePanelside","Pagination","paginationRange","PieChart","usePieChart","Textarea","Item","Kpi","Label","LineChart","useLineChart","Loader","MarkdownEditor","Marker","Menu","MessageScroller","useMessageScroller","useMessageScrollerVisibility","Message","Popover","usePopoverAnchor","Post","Progress","Questionnaire","RadioGroup","Rating","RingChart","useRingChart","ScatterChart","useScatterChart","ScrollFade","Separator","Signature","hasSignatureFileSystem","hasSignatureRaster","Shimmer","Reasoning","Response","Sources","Task","CodeBlock","resolveLanguage","Plan","ScrollText","TextAnimation","ScrollCanvas","ThinkingOrb","Skeleton","Slider","Sortable","reorderItems","useSortableItem","Spinner","Steps","Surface","Swipe","useSwipeGroup","Switch","TimePicker","Timeline","Toast","ToastViewport","toast","useToast","Tree","Tooltip","Typography","AlertTriangleIcon","AppleIcon","ArrowDownIcon","ArrowUpIcon","ArrowUpRightIcon","BadgeCheckIcon","BellIcon","BookmarkIcon","BoldIcon","CalendarIcon","CardIcon","CheckCircleIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","ChevronUpIcon","CircleIcon","CodeIcon","ClockIcon","CompassIcon","CopyIcon","CrosshairIcon","DownloadIcon","EllipsisIcon","EyeIcon","FacebookIcon","FileIcon","FolderIcon","FolderOpenIcon","GoogleIcon","HeartIcon","HeadingIcon","IconColorProvider","InfoIcon","ItalicIcon","ImageIcon","KeyboardIcon","LinkIcon","ListIcon","ListChecksIcon","ListOrderedIcon","LockIcon","MaximizeIcon","MenuIcon","MessageCircleIcon","MicIcon","MinusIcon","MoonIcon","PackageIcon","PaperclipIcon","PauseIcon","PencilIcon","PlayIcon","PlusIcon","PlusSquareIcon","QuoteIcon","ReceiptIcon","RepeatIcon","RotateCcwIcon","RotateCwIcon","SearchIcon","SendIcon","ShareNodesIcon","ShieldAlertIcon","ShieldCheckIcon","SparklesIcon","StarIcon","SunIcon","TrashIcon","UnlockIcon","XIcon","useIconColor","cn","formatColor","hsvToCss","hsvToHex","hsvToHsl","hsvToRgb","isValidColor","parseColor","rgbToHsv","clampTime","compareTime","displayHour","formatTime","isSameTime","isTimeInRange","meridiemLabels","minutesToTime","roundToStep","timeFromDate","timeToDate","timeToMinutes","timesOfDay"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,278 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* CandlestickChart — four numbers a period, drawn as one mark.
|
|
3
|
+
*
|
|
4
|
+
* Composed the same way every chart here is: the grid, the candles, the axes
|
|
5
|
+
* and the readout are separate children, so a chart that wants no grid simply
|
|
6
|
+
* does not have one.
|
|
7
|
+
*
|
|
8
|
+
* ```tsx
|
|
9
|
+
* <CandlestickChart data={session} xDataKey="day">
|
|
10
|
+
* <CandlestickChart.Grid />
|
|
11
|
+
* <CandlestickChart.Candles />
|
|
12
|
+
* <CandlestickChart.XAxis />
|
|
13
|
+
* <CandlestickChart.Tooltip />
|
|
14
|
+
* </CandlestickChart>
|
|
15
|
+
* ```
|
|
16
|
+
*
|
|
17
|
+
* ## One mark, four numbers
|
|
18
|
+
*
|
|
19
|
+
* A row is `{ open, high, low, close }`. The body spans open to close and is
|
|
20
|
+
* filled by direction — rising when the close is at or above the open, falling
|
|
21
|
+
* when it is below — and the wick spans low to high behind it. Colour is
|
|
22
|
+
* therefore the *sign* of the period rather than a series identity, which is
|
|
23
|
+
* why this chart has no series list and no legend: there is only ever one
|
|
24
|
+
* thing plotted, and the two colours are its two states.
|
|
25
|
+
*
|
|
26
|
+
* ## The baseline is not zero, and must not be
|
|
27
|
+
*
|
|
28
|
+
* A bar compares lengths, so its axis has to reach zero or twice as tall stops
|
|
29
|
+
* meaning twice as much. A candle compares nothing to zero. What is being read
|
|
30
|
+
* is the distance between four numbers that sit close together and far from the
|
|
31
|
+
* origin — a share at 180 that moved between 178 and 183 is a chart of that
|
|
32
|
+
* five-point span, and forcing zero onto the axis turns every candle in it into
|
|
33
|
+
* a dash. So the domain is derived from the lowest low and the highest high,
|
|
34
|
+
* with a margin so the extremes are not drawn on the frame.
|
|
35
|
+
*
|
|
36
|
+
* ## Two paths, not two per candle
|
|
37
|
+
*
|
|
38
|
+
* Every rising body is a subpath of one path and every falling body of another,
|
|
39
|
+
* and the wicks likewise — four animated props a frame whether the chart holds
|
|
40
|
+
* twenty candles or two hundred. A candle also cannot be drawn as a rectangle
|
|
41
|
+
* element and animated: the grow-in scales each body about its own middle, and
|
|
42
|
+
* that is a path rebuilt per frame on the UI thread rather than a transform
|
|
43
|
+
* that would take the wick and the neighbours with it.
|
|
44
|
+
*/
|
|
45
|
+
import { type ReactNode } from 'react';
|
|
46
|
+
import { type ViewProps } from 'react-native';
|
|
47
|
+
type Layer = 'svg' | 'overlay' | 'header';
|
|
48
|
+
export type CandlestickChartStatus = 'loading' | 'ready';
|
|
49
|
+
/**
|
|
50
|
+
* One period. `open`, `high`, `low` and `close` are required to be numbers —
|
|
51
|
+
* unlike a line, a candle cannot be drawn from some of them.
|
|
52
|
+
*/
|
|
53
|
+
export interface CandlestickChartDatum {
|
|
54
|
+
[key: string]: string | number | null | undefined;
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* The candle under the finger, for something rendered *inside* the chart. A
|
|
58
|
+
* readout in the card's header is outside this provider — use
|
|
59
|
+
* `onActiveIndexChange` for that.
|
|
60
|
+
*/
|
|
61
|
+
export declare function useCandlestickChart(): {
|
|
62
|
+
activeIndex: number;
|
|
63
|
+
activePoint: CandlestickChartDatum | null;
|
|
64
|
+
xDataKey: string;
|
|
65
|
+
};
|
|
66
|
+
export interface CandlestickChartProps extends ViewProps {
|
|
67
|
+
className?: string;
|
|
68
|
+
/** The rows. Each one is a period along the x-axis. */
|
|
69
|
+
data: CandlestickChartDatum[];
|
|
70
|
+
/** Key holding the period label. Used by the axis and the readout. */
|
|
71
|
+
xDataKey?: string;
|
|
72
|
+
/** Key holding the opening price. */
|
|
73
|
+
openDataKey?: string;
|
|
74
|
+
/** Key holding the period's high. */
|
|
75
|
+
highDataKey?: string;
|
|
76
|
+
/** Key holding the period's low. */
|
|
77
|
+
lowDataKey?: string;
|
|
78
|
+
/** Key holding the closing price. */
|
|
79
|
+
closeDataKey?: string;
|
|
80
|
+
/**
|
|
81
|
+
* `loading` draws a row of flat placeholder candles and grows them into the
|
|
82
|
+
* real ones when it turns `ready`. One component throughout, rather than a
|
|
83
|
+
* spinner swapped for a chart — swapping loses the transition.
|
|
84
|
+
*/
|
|
85
|
+
status?: CandlestickChartStatus;
|
|
86
|
+
/** Width ÷ height. `1.6` suits a chart this dense better than `2`. */
|
|
87
|
+
aspectRatio?: number;
|
|
88
|
+
/** Milliseconds for the candles to grow in on mount. */
|
|
89
|
+
animationDuration?: number;
|
|
90
|
+
/** Milliseconds for the price axis to settle after the data changes. */
|
|
91
|
+
domainDuration?: number;
|
|
92
|
+
/**
|
|
93
|
+
* Fix the price axis instead of deriving it from the lows and highs. Note
|
|
94
|
+
* that the derived domain deliberately does *not* include zero — see the
|
|
95
|
+
* notes on why a candle's axis is not a bar's.
|
|
96
|
+
*/
|
|
97
|
+
yDomain?: [number, number];
|
|
98
|
+
/**
|
|
99
|
+
* Fraction of each period's slice left empty, `0` to `1`. A fraction rather
|
|
100
|
+
* than a pixel gap so the proportions hold at any width.
|
|
101
|
+
*/
|
|
102
|
+
candleGap?: number;
|
|
103
|
+
/** Fixed body width in points. Derived from the slice when omitted. */
|
|
104
|
+
candleWidth?: number;
|
|
105
|
+
/** Opacity of the candles that are not under the finger. */
|
|
106
|
+
fadedOpacity?: number;
|
|
107
|
+
/**
|
|
108
|
+
* The candle under the finger as it moves, and `-1`/`null` when it lifts.
|
|
109
|
+
* This is how a readout in the card's header gets its value — that header is
|
|
110
|
+
* outside the chart, so it cannot use `useCandlestickChart`.
|
|
111
|
+
*
|
|
112
|
+
* Fires when the index changes, not per frame.
|
|
113
|
+
*/
|
|
114
|
+
onActiveIndexChange?: (index: number, datum: CandlestickChartDatum | null) => void;
|
|
115
|
+
/** Drop the axis padding, for a dense strip with no axis or readout. */
|
|
116
|
+
compact?: boolean;
|
|
117
|
+
children?: ReactNode;
|
|
118
|
+
}
|
|
119
|
+
/** Imperative handle: re-run the grow-in, for a "replay" control. */
|
|
120
|
+
export interface CandlestickChartHandle {
|
|
121
|
+
replay: () => void;
|
|
122
|
+
}
|
|
123
|
+
export interface CandlestickChartGridProps {
|
|
124
|
+
/** How many lines to draw across the price axis. */
|
|
125
|
+
rows?: number;
|
|
126
|
+
color?: string;
|
|
127
|
+
dashArray?: string;
|
|
128
|
+
opacity?: number;
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
131
|
+
* Lines across the price axis, so a candle can be read against a number rather
|
|
132
|
+
* than only against the candle beside it.
|
|
133
|
+
*/
|
|
134
|
+
declare function CandlestickChartGrid({ rows, color, dashArray, opacity, }: CandlestickChartGridProps): import("react").JSX.Element;
|
|
135
|
+
declare namespace CandlestickChartGrid {
|
|
136
|
+
var displayName: string;
|
|
137
|
+
var layer: Layer;
|
|
138
|
+
}
|
|
139
|
+
export interface CandlestickChartCandlesProps {
|
|
140
|
+
/** Colour of a period that closed at or above its open. Green by default. */
|
|
141
|
+
risingColor?: string;
|
|
142
|
+
/** Colour of a period that closed below its open. Red by default. */
|
|
143
|
+
fallingColor?: string;
|
|
144
|
+
/** Corner radius on a body. */
|
|
145
|
+
cornerRadius?: number;
|
|
146
|
+
}
|
|
147
|
+
/**
|
|
148
|
+
* The candles.
|
|
149
|
+
*
|
|
150
|
+
* Four paths, not four per candle: rising bodies, falling bodies, and the wicks
|
|
151
|
+
* behind each. A chart of two hundred periods is the same four animated props
|
|
152
|
+
* a frame as a chart of twenty, and the split by direction is what lets each
|
|
153
|
+
* half carry its own fill without a fill per mark.
|
|
154
|
+
*
|
|
155
|
+
* The wicks are drawn first so the bodies sit over them, which is what makes a
|
|
156
|
+
* body with a wick behind it read as one mark rather than as a line crossing a
|
|
157
|
+
* rectangle.
|
|
158
|
+
*/
|
|
159
|
+
declare function CandlestickChartCandles({ risingColor, fallingColor, cornerRadius, }: CandlestickChartCandlesProps): import("react").JSX.Element | null;
|
|
160
|
+
declare namespace CandlestickChartCandles {
|
|
161
|
+
var displayName: string;
|
|
162
|
+
var layer: Layer;
|
|
163
|
+
}
|
|
164
|
+
export interface CandlestickChartXAxisProps {
|
|
165
|
+
/** How many labels to show. Derived from the room available when omitted. */
|
|
166
|
+
ticks?: number;
|
|
167
|
+
/** Format a row's label. Defaults to the value at `xDataKey`. */
|
|
168
|
+
format?: (datum: CandlestickChartDatum, index: number) => string;
|
|
169
|
+
className?: string;
|
|
170
|
+
}
|
|
171
|
+
/**
|
|
172
|
+
* The period labels, one under each candle it has room for. Real text rather
|
|
173
|
+
* than SVG text, so they follow the theme's font and the platform's text
|
|
174
|
+
* scaling — SVG text does neither.
|
|
175
|
+
*/
|
|
176
|
+
declare function CandlestickChartXAxis({ ticks, format, className, }: CandlestickChartXAxisProps): import("react").JSX.Element;
|
|
177
|
+
declare namespace CandlestickChartXAxis {
|
|
178
|
+
var displayName: string;
|
|
179
|
+
var layer: Layer;
|
|
180
|
+
}
|
|
181
|
+
export interface CandlestickChartYAxisProps {
|
|
182
|
+
/** How many labels to show along the price axis. */
|
|
183
|
+
ticks?: number;
|
|
184
|
+
/** Format a price for its label. Defaults to a compact number. */
|
|
185
|
+
format?: (value: number) => string;
|
|
186
|
+
className?: string;
|
|
187
|
+
}
|
|
188
|
+
/** Price labels down the side, aligned to the grid lines. */
|
|
189
|
+
declare function CandlestickChartYAxis({ ticks, format, className, }: CandlestickChartYAxisProps): import("react").JSX.Element;
|
|
190
|
+
declare namespace CandlestickChartYAxis {
|
|
191
|
+
var displayName: string;
|
|
192
|
+
var layer: Layer;
|
|
193
|
+
var axis: "y";
|
|
194
|
+
}
|
|
195
|
+
export interface CandlestickChartTooltipProps {
|
|
196
|
+
/** Format one of the four prices. Defaults to a compact number. */
|
|
197
|
+
formatValue?: (value: number, field: 'open' | 'high' | 'low' | 'close') => string;
|
|
198
|
+
/** Format the readout's heading from the row. Defaults to the value at xDataKey. */
|
|
199
|
+
formatX?: (datum: CandlestickChartDatum) => string;
|
|
200
|
+
/** Show the period's change from open to close under the four prices. */
|
|
201
|
+
showChange?: boolean;
|
|
202
|
+
className?: string;
|
|
203
|
+
}
|
|
204
|
+
/**
|
|
205
|
+
* The readout, and the gesture that drives it.
|
|
206
|
+
*
|
|
207
|
+
* There is no crosshair. A candle is already the thing being pointed at, so
|
|
208
|
+
* highlighting it and dimming the rest says the same thing without drawing a
|
|
209
|
+
* line through the chart.
|
|
210
|
+
*
|
|
211
|
+
* The hit area is the whole plot. A readout you have to land on a candle to
|
|
212
|
+
* summon is a readout nobody finds — and candles are thin.
|
|
213
|
+
*/
|
|
214
|
+
declare function CandlestickChartTooltip({ formatValue, formatX, showChange, className, }: CandlestickChartTooltipProps): import("react").JSX.Element | null;
|
|
215
|
+
declare namespace CandlestickChartTooltip {
|
|
216
|
+
var displayName: string;
|
|
217
|
+
var layer: Layer;
|
|
218
|
+
}
|
|
219
|
+
export interface CandlestickChartHeaderProps extends ViewProps {
|
|
220
|
+
className?: string;
|
|
221
|
+
/** Small line above the value — what the chart is of. */
|
|
222
|
+
title?: string;
|
|
223
|
+
/** The readout. The largest thing on the card, and the first thing read. */
|
|
224
|
+
value?: string;
|
|
225
|
+
/** One muted line under the value — a period, a comparison, a change. */
|
|
226
|
+
caption?: string;
|
|
227
|
+
/** Name the two colours, for a reader who has not met the convention. */
|
|
228
|
+
legend?: boolean;
|
|
229
|
+
/** What the rising colour is called. */
|
|
230
|
+
risingLabel?: string;
|
|
231
|
+
/** What the falling colour is called. */
|
|
232
|
+
fallingLabel?: string;
|
|
233
|
+
/** Trailing slot — a control, a badge, a range picker. Wins over `legend`. */
|
|
234
|
+
children?: ReactNode;
|
|
235
|
+
}
|
|
236
|
+
/**
|
|
237
|
+
* The strip above the plot: what the chart is of, what it currently reads, and
|
|
238
|
+
* what the two colours mean.
|
|
239
|
+
*
|
|
240
|
+
* It belongs to the chart rather than to the card around it because it is about
|
|
241
|
+
* the *plot* — the number changes as a finger moves along the candles. The
|
|
242
|
+
* card's header is a caption on the tray the chart sits in; this is the chart
|
|
243
|
+
* introducing itself.
|
|
244
|
+
*
|
|
245
|
+
* The value is not derived here. A readout that follows the finger belongs to
|
|
246
|
+
* whoever owns the data — take it from `onActiveIndexChange` and pass the
|
|
247
|
+
* formatted string down, so one header can show the latest close when nothing
|
|
248
|
+
* is pressed and a period's close when something is.
|
|
249
|
+
*/
|
|
250
|
+
declare function CandlestickChartHeader({ className, title, value, caption, legend, risingLabel, fallingLabel, children, ...props }: CandlestickChartHeaderProps): import("react").JSX.Element;
|
|
251
|
+
declare namespace CandlestickChartHeader {
|
|
252
|
+
var displayName: string;
|
|
253
|
+
var layer: Layer;
|
|
254
|
+
}
|
|
255
|
+
export interface CandlestickChartLegendProps extends ViewProps {
|
|
256
|
+
className?: string;
|
|
257
|
+
/** What the rising colour is called. */
|
|
258
|
+
risingLabel?: string;
|
|
259
|
+
/** What the falling colour is called. */
|
|
260
|
+
fallingLabel?: string;
|
|
261
|
+
}
|
|
262
|
+
/** The two colours and what they mean, floated over the plot. */
|
|
263
|
+
declare function CandlestickChartLegend({ className, risingLabel, fallingLabel, ...props }: CandlestickChartLegendProps): import("react").JSX.Element;
|
|
264
|
+
declare namespace CandlestickChartLegend {
|
|
265
|
+
var displayName: string;
|
|
266
|
+
var layer: Layer;
|
|
267
|
+
}
|
|
268
|
+
export declare const CandlestickChart: import("react").ForwardRefExoticComponent<CandlestickChartProps & import("react").RefAttributes<CandlestickChartHandle>> & {
|
|
269
|
+
Header: typeof CandlestickChartHeader;
|
|
270
|
+
Grid: typeof CandlestickChartGrid;
|
|
271
|
+
Candles: typeof CandlestickChartCandles;
|
|
272
|
+
XAxis: typeof CandlestickChartXAxis;
|
|
273
|
+
YAxis: typeof CandlestickChartYAxis;
|
|
274
|
+
Tooltip: typeof CandlestickChartTooltip;
|
|
275
|
+
Legend: typeof CandlestickChartLegend;
|
|
276
|
+
};
|
|
277
|
+
export {};
|
|
278
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/candlestick-chart/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/combobox/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,OAAO,EAYL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAOL,KAAK,SAAS,EAEf,MAAM,cAAc,CAAC;AAkFtB,MAAM,MAAM,oBAAoB,GAAG,SAAS,GAAG,QAAQ,CAAC;AAExD,+CAA+C;AAC/C,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEjD,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,QAAQ,EAAE,MAAM,EAAE,CAAC;CACpB;AASD,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2EAA2E;IAC3E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,2EAA2E;AAC3E,iBAAS,YAAY,CAAC,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,KAAK,EACL,WAAW,GACZ,EAAE,iBAAiB,+BA2CnB;kBAjDQ,YAAY;;;AAmDrB,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,SAAS,EACT,cAAc,EACd,QAAQ,GACT,EAAE,kBAAkB,+BAepB;kBApBQ,aAAa;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/combobox/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,270 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ContextMenu — the actions that belong to a piece of content, opened on it.
|
|
3
|
+
*
|
|
4
|
+
* A `Menu` hangs off a control that exists to be pressed: a ⋯ button, a toolbar
|
|
5
|
+
* item, something whose whole job is to open the menu. A context menu has no
|
|
6
|
+
* such control. The target is the content itself — a message, a note, a photo,
|
|
7
|
+
* a row — and the actions are reached by pressing and holding it.
|
|
8
|
+
*
|
|
9
|
+
* ```tsx
|
|
10
|
+
* <ContextMenu>
|
|
11
|
+
* <ContextMenu.Trigger>
|
|
12
|
+
* <Message>Would you like an interactive todo list?</Message>
|
|
13
|
+
* </ContextMenu.Trigger>
|
|
14
|
+
* <ContextMenu.Content>
|
|
15
|
+
* <ContextMenu.Item icon={<Share2 size={16} />}>Share</ContextMenu.Item>
|
|
16
|
+
* <ContextMenu.Item icon={<Copy size={16} />}>Copy</ContextMenu.Item>
|
|
17
|
+
* <ContextMenu.Separator />
|
|
18
|
+
* <ContextMenu.Item variant="destructive" icon={<Flag size={16} />}>
|
|
19
|
+
* Report
|
|
20
|
+
* </ContextMenu.Item>
|
|
21
|
+
* </ContextMenu.Content>
|
|
22
|
+
* </ContextMenu>
|
|
23
|
+
* ```
|
|
24
|
+
*
|
|
25
|
+
* ## It is a Menu, and deliberately so
|
|
26
|
+
*
|
|
27
|
+
* The rows here *are* `Menu`'s rows — the same components, not a second set
|
|
28
|
+
* styled to match. `ContextMenu.Item` and `Menu.Item` are one implementation,
|
|
29
|
+
* so the destructive colour, the press-in scale, the indicator column and the
|
|
30
|
+
* dismiss-on-select rule cannot drift apart between the two ways of reaching
|
|
31
|
+
* them. The panel is `Menu`'s panel, which is `Popover`'s, so `presentation`,
|
|
32
|
+
* submenus and edge-flipping all arrive already working.
|
|
33
|
+
*
|
|
34
|
+
* What this component owns is the two things a menu opened on content needs and
|
|
35
|
+
* a menu opened from a button does not: the long press, and where the panel
|
|
36
|
+
* goes.
|
|
37
|
+
*
|
|
38
|
+
* ## Anchored to the finger, not to the target
|
|
39
|
+
*
|
|
40
|
+
* A toolbar menu is placed against its trigger, because the trigger is small
|
|
41
|
+
* and its position is the only sensible answer. A context menu's target is
|
|
42
|
+
* often most of the screen — a whole message, a whole card — and the middle of
|
|
43
|
+
* it is not where the finger was. So the anchor is the press point by default,
|
|
44
|
+
* and the panel unfolds from it the way a popover unfolds from a button.
|
|
45
|
+
*
|
|
46
|
+
* `anchor="target"` places it against the target's bounds instead, which is the
|
|
47
|
+
* better answer for something small and list-shaped, where the panel lining up
|
|
48
|
+
* with the row reads as belonging to it.
|
|
49
|
+
*
|
|
50
|
+
* ## Why the gesture is not a Pressable
|
|
51
|
+
*
|
|
52
|
+
* The target usually has a press of its own — open the thread, play the video,
|
|
53
|
+
* follow the link — and the two must not both fire. React Native's `Pressable`
|
|
54
|
+
* decides between them after the fact, and the tap can still get through on the
|
|
55
|
+
* way to a long press; the recogniser here is asked for the arbitration up
|
|
56
|
+
* front instead, so a hold that opens the menu never also counts as a press.
|
|
57
|
+
*
|
|
58
|
+
* It is also what lets the target be anything at all. A cloned `onLongPress`
|
|
59
|
+
* needs a child that takes one, which rules out exactly the plain views —
|
|
60
|
+
* bubbles, cards, images — that content-native actions are usually attached to.
|
|
61
|
+
*/
|
|
62
|
+
import { type ReactNode } from 'react';
|
|
63
|
+
import { type ViewProps } from 'react-native';
|
|
64
|
+
import { type MenuCheckboxItemProps, type MenuContentProps, type MenuItemProps, type MenuProps } from '../menu/index.js';
|
|
65
|
+
/**
|
|
66
|
+
* The root takes exactly what `Menu`'s root takes — `open`, `onOpenChange`,
|
|
67
|
+
* `defaultOpen`, `presentation` and `haptics` — because it *is* that root.
|
|
68
|
+
*/
|
|
69
|
+
export type ContextMenuProps = MenuProps;
|
|
70
|
+
/**
|
|
71
|
+
* The root. Provides the menu's own context and the popover underneath it.
|
|
72
|
+
*
|
|
73
|
+
* It renders a `Menu`, which is not a shortcut — it is the point. Everything a
|
|
74
|
+
* menu is, this is, and the parts below are the only difference.
|
|
75
|
+
*/
|
|
76
|
+
declare function ContextMenuRoot({ children, ...props }: ContextMenuProps): import("react").JSX.Element;
|
|
77
|
+
/** Which rectangle the panel is placed against. */
|
|
78
|
+
export type ContextMenuAnchor = 'point' | 'target';
|
|
79
|
+
export interface ContextMenuTriggerProps extends Omit<ViewProps, 'children'> {
|
|
80
|
+
/**
|
|
81
|
+
* Classes on the wrapper the content sits in, which lays out like any other
|
|
82
|
+
* view — it does not shrink to its child, because the things held are usually
|
|
83
|
+
* meant to fill their place in the layout. It is also the rect
|
|
84
|
+
* `anchor="target"` measures.
|
|
85
|
+
*/
|
|
86
|
+
className?: string;
|
|
87
|
+
/**
|
|
88
|
+
* The content the actions belong to. Anything at all — it is not required to
|
|
89
|
+
* be pressable, and is not cloned or altered.
|
|
90
|
+
*/
|
|
91
|
+
children: ReactNode;
|
|
92
|
+
/**
|
|
93
|
+
* `point` anchors the panel where the finger landed, `target` against the
|
|
94
|
+
* bounds of the whole trigger.
|
|
95
|
+
*
|
|
96
|
+
* Point is the default because a context menu's target is usually large, and
|
|
97
|
+
* the middle of a whole message is not where the press was. Reach for
|
|
98
|
+
* `target` when the target is small and list-shaped and the panel should read
|
|
99
|
+
* as lining up with it.
|
|
100
|
+
*/
|
|
101
|
+
anchor?: ContextMenuAnchor;
|
|
102
|
+
/** How long the hold has to last, in milliseconds. 350 by default. */
|
|
103
|
+
delay?: number;
|
|
104
|
+
/**
|
|
105
|
+
* How far the finger may move during the hold before it stops being one, in
|
|
106
|
+
* points. 12 by default.
|
|
107
|
+
*
|
|
108
|
+
* Loose rather than tight, because the target is usually inside a scroller: a
|
|
109
|
+
* threshold small enough to feel precise cancels the menu for anyone whose
|
|
110
|
+
* thumb drifts while holding still, and a scroll has travelled much further
|
|
111
|
+
* than this by the time the two need telling apart. Tighten it only for a
|
|
112
|
+
* target that cannot be scrolled.
|
|
113
|
+
*/
|
|
114
|
+
slop?: number;
|
|
115
|
+
/** A short press on the target, which the hold never also counts as. */
|
|
116
|
+
onPress?: () => void;
|
|
117
|
+
/**
|
|
118
|
+
* Tick the haptic engine as the menu opens. Needs the optional
|
|
119
|
+
* `expo-haptics`, and is silent without it.
|
|
120
|
+
*
|
|
121
|
+
* Worth setting more often than not. A hold has no edge to it the way a press
|
|
122
|
+
* does — nothing moves under the finger at the moment it takes — so the tick
|
|
123
|
+
* is what tells someone the hold has been long enough, before the panel has
|
|
124
|
+
* had time to say so.
|
|
125
|
+
*/
|
|
126
|
+
haptics?: boolean;
|
|
127
|
+
/** Nothing opens the menu, and the short press stops firing too. */
|
|
128
|
+
disabled?: boolean;
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
131
|
+
* Wraps the content and opens the menu when it is held.
|
|
132
|
+
*
|
|
133
|
+
* The wrapper is a plain view and lays out like one, stretching as a view does
|
|
134
|
+
* rather than shrinking to its child. That is the opposite of what a tooltip's
|
|
135
|
+
* trigger wants, and for the opposite reason: a tooltip names a control and
|
|
136
|
+
* belongs over it, while the things held here — a bubble, a card, a row — are
|
|
137
|
+
* usually meant to fill their place in the layout, and a wrapper that collapsed
|
|
138
|
+
* around them would change it.
|
|
139
|
+
*
|
|
140
|
+
* It is also the rect measured under `anchor="target"`, which is why that
|
|
141
|
+
* anchoring lines the panel up with the row rather than with the text in it.
|
|
142
|
+
*/
|
|
143
|
+
declare function ContextMenuTrigger({ className, children, anchor, delay, slop, onPress, haptics, disabled, ...props }: ContextMenuTriggerProps): import("react").JSX.Element;
|
|
144
|
+
export interface ContextMenuPreviewProps {
|
|
145
|
+
/**
|
|
146
|
+
* Drawn instead of the target itself. For a target that would be wrong to
|
|
147
|
+
* repeat — one carrying a video, a live map, a text field with a cursor in
|
|
148
|
+
* it — or one that should show more of itself once it has the screen.
|
|
149
|
+
*
|
|
150
|
+
* Left out, the target is drawn again as it stands, which is what makes the
|
|
151
|
+
* lift read as the content coming forward rather than as a picture of it
|
|
152
|
+
* appearing.
|
|
153
|
+
*/
|
|
154
|
+
children?: ReactNode;
|
|
155
|
+
/** Extra classes on the lifted copy. */
|
|
156
|
+
className?: string;
|
|
157
|
+
}
|
|
158
|
+
/**
|
|
159
|
+
* The target, lifted off the page while its actions are up.
|
|
160
|
+
*
|
|
161
|
+
* Declared inside `ContextMenu.Content`, but not drawn there — it floats over
|
|
162
|
+
* the dimmed screen at the place the target was measured, and the panel is
|
|
163
|
+
* anchored to that same rectangle so the two never overlap. Its presence is
|
|
164
|
+
* what switches the anchor: a panel placed at the press point would open across
|
|
165
|
+
* the very content the preview exists to hold up.
|
|
166
|
+
*
|
|
167
|
+
* What it draws is the trigger's own children, rendered a second time. That
|
|
168
|
+
* keeps the lift honest — it is the content itself coming forward, at the size
|
|
169
|
+
* and in the place it already occupied — and it is why a target that should not
|
|
170
|
+
* simply be repeated can pass its own `children` instead.
|
|
171
|
+
*
|
|
172
|
+
* It takes no touches. The actions are in the panel; the lifted content is
|
|
173
|
+
* there to say what they are about, and a second live copy of a pressable card
|
|
174
|
+
* would be a second place to press.
|
|
175
|
+
*/
|
|
176
|
+
declare function ContextMenuPreview({ children, className }: ContextMenuPreviewProps): import("react").JSX.Element | null;
|
|
177
|
+
declare namespace ContextMenuPreview {
|
|
178
|
+
var displayName: string;
|
|
179
|
+
}
|
|
180
|
+
export interface ContextMenuItemProps extends MenuItemProps {
|
|
181
|
+
/**
|
|
182
|
+
* The row's glyph, drawn at the trailing edge rather than in front of the
|
|
183
|
+
* label. Painted to match the label unless it carries a colour of its own.
|
|
184
|
+
*/
|
|
185
|
+
icon?: ReactNode;
|
|
186
|
+
}
|
|
187
|
+
/**
|
|
188
|
+
* One row: the verb at the leading edge, its glyph at the trailing one.
|
|
189
|
+
*
|
|
190
|
+
* The other way round is right for a menu dropped from a button, where the
|
|
191
|
+
* glyphs form a column the eye runs down to find the row it wants. A context
|
|
192
|
+
* menu is not read that way. It appears under the hand that opened it, already
|
|
193
|
+
* over the content, and what is being scanned is the *words* — so the words
|
|
194
|
+
* start at the edge, flush with one another, and the glyph sits at the far side
|
|
195
|
+
* confirming the row rather than introducing it.
|
|
196
|
+
*
|
|
197
|
+
* It is still `Menu.Item` underneath, handed the glyph as its trailing slot. So
|
|
198
|
+
* the press-in fill, the destructive colour and the dismiss-on-select rule are
|
|
199
|
+
* one implementation shared with `Menu`, and only the arrangement differs.
|
|
200
|
+
*/
|
|
201
|
+
declare function ContextMenuItem({ className, icon, variant, ...props }: ContextMenuItemProps): import("react").JSX.Element;
|
|
202
|
+
declare namespace ContextMenuItem {
|
|
203
|
+
var displayName: string;
|
|
204
|
+
}
|
|
205
|
+
/**
|
|
206
|
+
* A row carrying a state. Its tick stays at the leading edge, where `Menu` puts
|
|
207
|
+
* it, because a tick is not a glyph naming the row — it is the answer to it,
|
|
208
|
+
* and a column of them is what makes a set of choices readable as one.
|
|
209
|
+
*/
|
|
210
|
+
declare function ContextMenuCheckboxItem({ className, ...props }: MenuCheckboxItemProps): import("react").JSX.Element;
|
|
211
|
+
declare namespace ContextMenuCheckboxItem {
|
|
212
|
+
var displayName: string;
|
|
213
|
+
}
|
|
214
|
+
/**
|
|
215
|
+
* Everything `Menu.Content` takes. The four listed here are the ones whose
|
|
216
|
+
* defaults differ, and they are listed so the difference is visible.
|
|
217
|
+
*/
|
|
218
|
+
export interface ContextMenuContentProps extends MenuContentProps {
|
|
219
|
+
/** Which side of the anchor the panel opens on. Down from the press, flipping
|
|
220
|
+
* above it near the bottom of the screen. */
|
|
221
|
+
placement?: MenuContentProps['placement'];
|
|
222
|
+
/** Where it sits along the other axis. From the press, not centred on it. */
|
|
223
|
+
align?: MenuContentProps['align'];
|
|
224
|
+
/** Gap between the anchor and the panel. Small, so it reads as coming out of
|
|
225
|
+
* the press rather than floating near it. */
|
|
226
|
+
offset?: number;
|
|
227
|
+
/**
|
|
228
|
+
* Floor for the panel's width. A context menu has no trigger to take its
|
|
229
|
+
* width from, and a column of one-word verbs is too narrow to aim at.
|
|
230
|
+
*/
|
|
231
|
+
minWidth?: number;
|
|
232
|
+
/** Dim the screen behind the panel. On here, unlike a plain popover. */
|
|
233
|
+
scrim?: boolean;
|
|
234
|
+
}
|
|
235
|
+
/**
|
|
236
|
+
* The panel, with the defaults a context menu wants rather than a popover's.
|
|
237
|
+
*
|
|
238
|
+
* It unfolds down and from the press rather than being centred on it —
|
|
239
|
+
* centring is right for a panel under a button, and wrong for one at a
|
|
240
|
+
* fingertip, where it would put half the panel back under the hand that opened
|
|
241
|
+
* it. Near the bottom of the screen `Popover` flips it above the press and
|
|
242
|
+
* clamps it into the safe area, so the one case where down does not work
|
|
243
|
+
* answers itself.
|
|
244
|
+
*
|
|
245
|
+
* The gap to the anchor is small, so the panel reads as coming out of the press
|
|
246
|
+
* rather than floating near it.
|
|
247
|
+
*
|
|
248
|
+
* The screen dims behind it, which a popover does not do. A context menu is
|
|
249
|
+
* modal in practice — the content underneath is what the actions are *about*,
|
|
250
|
+
* so nothing else on the screen is available while it is up, and the dim is
|
|
251
|
+
* what says so.
|
|
252
|
+
*/
|
|
253
|
+
declare function ContextMenuContent({ placement, align, offset, minWidth, scrim, children, ...props }: ContextMenuContentProps): import("react").JSX.Element;
|
|
254
|
+
export declare const ContextMenu: typeof ContextMenuRoot & {
|
|
255
|
+
Trigger: typeof ContextMenuTrigger;
|
|
256
|
+
Content: typeof ContextMenuContent;
|
|
257
|
+
Preview: typeof ContextMenuPreview;
|
|
258
|
+
Background: typeof import("../menu/index.js").MenuBackground;
|
|
259
|
+
Label: typeof import("../menu/index.js").MenuLabel;
|
|
260
|
+
Item: typeof ContextMenuItem;
|
|
261
|
+
CheckboxItem: typeof ContextMenuCheckboxItem;
|
|
262
|
+
RadioGroup: typeof import("../menu/index.js").MenuRadioGroup;
|
|
263
|
+
RadioItem: typeof import("../menu/index.js").MenuRadioItem;
|
|
264
|
+
Separator: typeof import("../menu/index.js").MenuSeparator;
|
|
265
|
+
Sub: typeof import("../menu/index.js").MenuSub;
|
|
266
|
+
SubTrigger: typeof import("../menu/index.js").MenuSubTrigger;
|
|
267
|
+
SubContent: typeof import("../menu/index.js").MenuSubContent;
|
|
268
|
+
};
|
|
269
|
+
export {};
|
|
270
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/context-menu/index.tsx"],"names":[],"mappings":"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"}
|