@krizaka/ui 3.1.0 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/achievement.js +1 -1
- package/dist/action-bar.js +1 -1
- package/dist/app-shell.js +1 -1
- package/dist/argument-card.js +2 -2
- package/dist/card-grid.js +1 -1
- package/dist/card.js +1 -1
- package/dist/choice-grid.js +1 -1
- package/dist/chunk-2FRWNSRO.js +23 -0
- package/dist/chunk-2FRWNSRO.js.map +1 -0
- package/dist/chunk-4LOMIQVX.js +21 -0
- package/dist/chunk-4LOMIQVX.js.map +1 -0
- package/dist/chunk-BTMFZ66D.js +135 -0
- package/dist/chunk-BTMFZ66D.js.map +1 -0
- package/dist/chunk-C2BRIFJG.js +13 -0
- package/dist/chunk-C2BRIFJG.js.map +1 -0
- package/dist/{chunk-K3SWZXYT.js → chunk-DGQMDJXK.js} +2 -2
- package/dist/chunk-G3ETON2A.js +22 -0
- package/dist/chunk-G3ETON2A.js.map +1 -0
- package/dist/chunk-IZ7MV6HM.js +26 -0
- package/dist/chunk-IZ7MV6HM.js.map +1 -0
- package/dist/chunk-KDXRYUD3.js +39 -0
- package/dist/chunk-KDXRYUD3.js.map +1 -0
- package/dist/{chunk-OGJI5X4W.js → chunk-ZKVQGXLD.js} +5 -3
- package/dist/{chunk-OGJI5X4W.js.map → chunk-ZKVQGXLD.js.map} +1 -1
- package/dist/chunk-ZNMFG62E.js +20 -0
- package/dist/chunk-ZNMFG62E.js.map +1 -0
- package/dist/cn.d.ts +9 -1
- package/dist/cn.js +5 -3
- package/dist/code-block.js +1 -1
- package/dist/command.js +1 -1
- package/dist/confirm-button.js +1 -1
- package/dist/continue-prompt.js +1 -1
- package/dist/cta-panel.js +1 -1
- package/dist/data-table.js +3 -2
- package/dist/data-table.js.map +1 -1
- package/dist/date-picker.d.ts +652 -61
- package/dist/date-picker.js +918 -122
- package/dist/date-picker.js.map +1 -1
- package/dist/decision-list.js +1 -1
- package/dist/dropdown-menu.js +1 -1
- package/dist/error-page.js +1 -1
- package/dist/field.js +1 -1
- package/dist/filter-bar.js +3 -2
- package/dist/form.d.ts +23 -12
- package/dist/form.js +11 -47
- package/dist/form.js.map +1 -1
- package/dist/gallery-page.js +1 -1
- package/dist/glow-card.js +1 -1
- package/dist/goal-gauge.js +1 -1
- package/dist/how-it-works-page.js +1 -1
- package/dist/image-cropper.js +3 -1
- package/dist/image-cropper.js.map +1 -1
- package/dist/landscape.js +1 -1
- package/dist/link-card.js +1 -1
- package/dist/longform-page.js +1 -1
- package/dist/marquee.js +1 -1
- package/dist/mascot-quote.js +1 -1
- package/dist/motion.css +18 -1
- package/dist/native/form.d.ts +60 -15
- package/dist/native/form.js +103 -42
- package/dist/native/form.js.map +1 -1
- package/dist/native.d.ts +443 -2
- package/dist/native.js +1655 -448
- package/dist/native.js.map +1 -1
- package/dist/nav-bar.js +1 -1
- package/dist/page-hero.js +2 -2
- package/dist/page.js +2 -2
- package/dist/popover.js +1 -1
- package/dist/pricing-page.js +1 -1
- package/dist/product-page.js +1 -1
- package/dist/profile-card.js +1 -1
- package/dist/promise-card.js +1 -1
- package/dist/radio-group.d.ts +66 -32
- package/dist/radio-group.js +54 -10
- package/dist/radio-group.js.map +1 -1
- package/dist/scroll-stage.js +1 -1
- package/dist/slider.d.ts +96 -35
- package/dist/slider.js +67 -13
- package/dist/slider.js.map +1 -1
- package/dist/stage-banner.js +1 -1
- package/dist/terminal-replay.js +34 -60
- package/dist/terminal-replay.js.map +1 -1
- package/dist/toast.js +1 -1
- package/dist/toc.js +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/video-player.js +3 -1
- package/dist/video-player.js.map +1 -1
- package/package.json +8 -8
- package/registry/cn.json +1 -1
- package/registry/combobox.json +225 -3
- package/registry/date-picker.json +1739 -288
- package/registry/dialog.json +74 -3
- package/registry/examples/combobox/native/multiple.d.ts +4 -0
- package/registry/examples/combobox/native/multiple.dark.png +0 -0
- package/registry/examples/combobox/native/multiple.js +15 -0
- package/registry/examples/combobox/native/multiple.light.png +0 -0
- package/registry/examples/combobox/native/multiple.tsx +15 -0
- package/registry/examples/combobox/native/search.d.ts +4 -0
- package/registry/examples/combobox/native/search.dark.png +0 -0
- package/registry/examples/combobox/native/search.js +15 -0
- package/registry/examples/combobox/native/search.light.png +0 -0
- package/registry/examples/combobox/native/search.tsx +15 -0
- package/registry/examples/date-picker/birth-date-wheel.d.ts +4 -0
- package/registry/examples/date-picker/birth-date-wheel.js +13 -0
- package/registry/examples/date-picker/birth-date-wheel.tsx +11 -0
- package/registry/examples/date-picker/birth-date.d.ts +4 -0
- package/registry/examples/date-picker/birth-date.js +25 -0
- package/registry/examples/date-picker/birth-date.tsx +21 -0
- package/registry/examples/date-picker/calendar.js +1 -1
- package/registry/examples/date-picker/calendar.tsx +2 -6
- package/registry/examples/date-picker/day-strip.d.ts +4 -0
- package/registry/examples/date-picker/day-strip.js +28 -0
- package/registry/examples/date-picker/day-strip.tsx +27 -0
- package/registry/examples/date-picker/month-year.d.ts +4 -0
- package/registry/examples/date-picker/month-year.js +13 -0
- package/registry/examples/date-picker/month-year.tsx +10 -0
- package/registry/examples/date-picker/native/birth-date-wheel.d.ts +4 -0
- package/registry/examples/date-picker/native/birth-date-wheel.dark.png +0 -0
- package/registry/examples/date-picker/native/birth-date-wheel.js +13 -0
- package/registry/examples/date-picker/native/birth-date-wheel.light.png +0 -0
- package/registry/examples/date-picker/native/birth-date-wheel.tsx +9 -0
- package/registry/examples/date-picker/native/calendar.d.ts +4 -0
- package/registry/examples/date-picker/native/calendar.dark.png +0 -0
- package/registry/examples/date-picker/native/calendar.js +13 -0
- package/registry/examples/date-picker/native/calendar.light.png +0 -0
- package/registry/examples/date-picker/native/calendar.tsx +8 -0
- package/registry/examples/date-picker/native/day-strip.d.ts +4 -0
- package/registry/examples/date-picker/native/day-strip.dark.png +0 -0
- package/registry/examples/date-picker/native/day-strip.js +29 -0
- package/registry/examples/date-picker/native/day-strip.light.png +0 -0
- package/registry/examples/date-picker/native/day-strip.tsx +26 -0
- package/registry/examples/date-picker/native/month-year.d.ts +4 -0
- package/registry/examples/date-picker/native/month-year.dark.png +0 -0
- package/registry/examples/date-picker/native/month-year.js +13 -0
- package/registry/examples/date-picker/native/month-year.light.png +0 -0
- package/registry/examples/date-picker/native/month-year.tsx +8 -0
- package/registry/examples/date-picker/native/time-slots.d.ts +4 -0
- package/registry/examples/date-picker/native/time-slots.dark.png +0 -0
- package/registry/examples/date-picker/native/time-slots.js +15 -0
- package/registry/examples/date-picker/native/time-slots.light.png +0 -0
- package/registry/examples/date-picker/native/time-slots.tsx +15 -0
- package/registry/examples/date-picker/native/time-wheel.d.ts +4 -0
- package/registry/examples/date-picker/native/time-wheel.dark.png +0 -0
- package/registry/examples/date-picker/native/time-wheel.js +13 -0
- package/registry/examples/date-picker/native/time-wheel.light.png +0 -0
- package/registry/examples/date-picker/native/time-wheel.tsx +8 -0
- package/registry/examples/date-picker/time-slots.d.ts +4 -0
- package/registry/examples/date-picker/time-slots.js +26 -0
- package/registry/examples/date-picker/time-slots.tsx +25 -0
- package/registry/examples/date-picker/time-wheel.d.ts +4 -0
- package/registry/examples/date-picker/time-wheel.js +13 -0
- package/registry/examples/date-picker/time-wheel.tsx +10 -0
- package/registry/examples/date-picker/wheel.d.ts +4 -0
- package/registry/examples/date-picker/wheel.js +14 -0
- package/registry/examples/date-picker/wheel.tsx +16 -0
- package/registry/examples/dialog/native/sheet.d.ts +4 -0
- package/registry/examples/dialog/native/sheet.dark.png +0 -0
- package/registry/examples/dialog/native/sheet.js +21 -0
- package/registry/examples/dialog/native/sheet.light.png +0 -0
- package/registry/examples/dialog/native/sheet.tsx +18 -0
- package/registry/examples/field/native/select.d.ts +4 -0
- package/registry/examples/field/native/select.dark.png +0 -0
- package/registry/examples/field/native/select.js +29 -0
- package/registry/examples/field/native/select.light.png +0 -0
- package/registry/examples/field/native/select.tsx +25 -0
- package/registry/examples/form/native/audience.dark.png +0 -0
- package/registry/examples/form/native/audience.light.png +0 -0
- package/registry/examples/form/native/profile.dark.png +0 -0
- package/registry/examples/form/native/profile.light.png +0 -0
- package/registry/examples/form/native/settings.dark.png +0 -0
- package/registry/examples/form/native/settings.light.png +0 -0
- package/registry/examples/form/native/sign-up.dark.png +0 -0
- package/registry/examples/form/native/sign-up.light.png +0 -0
- package/registry/examples/form/native/upload.dark.png +0 -0
- package/registry/examples/form/native/upload.light.png +0 -0
- package/registry/examples/radio-group/buttons.d.ts +4 -0
- package/registry/examples/radio-group/buttons.js +17 -0
- package/registry/examples/radio-group/buttons.tsx +21 -0
- package/registry/examples/radio-group/cards.js +1 -1
- package/registry/examples/radio-group/cards.tsx +2 -2
- package/registry/examples/radio-group/native/buttons.d.ts +4 -0
- package/registry/examples/radio-group/native/buttons.dark.png +0 -0
- package/registry/examples/radio-group/native/buttons.js +25 -0
- package/registry/examples/radio-group/native/buttons.light.png +0 -0
- package/registry/examples/radio-group/native/buttons.tsx +21 -0
- package/registry/examples/radio-group/native/cards.d.ts +4 -0
- package/registry/examples/radio-group/native/cards.dark.png +0 -0
- package/registry/examples/radio-group/native/cards.js +23 -0
- package/registry/examples/radio-group/native/cards.light.png +0 -0
- package/registry/examples/radio-group/native/cards.tsx +19 -0
- package/registry/examples/radio-group/native/list.d.ts +4 -0
- package/registry/examples/radio-group/native/list.dark.png +0 -0
- package/registry/examples/radio-group/native/list.js +24 -0
- package/registry/examples/radio-group/native/list.light.png +0 -0
- package/registry/examples/radio-group/native/list.tsx +20 -0
- package/registry/examples/radio-group/native/segmented.d.ts +4 -0
- package/registry/examples/radio-group/native/segmented.dark.png +0 -0
- package/registry/examples/radio-group/native/segmented.js +24 -0
- package/registry/examples/radio-group/native/segmented.light.png +0 -0
- package/registry/examples/radio-group/native/segmented.tsx +20 -0
- package/registry/examples/radio-group/segmented.d.ts +4 -0
- package/registry/examples/radio-group/segmented.js +15 -0
- package/registry/examples/radio-group/segmented.tsx +12 -0
- package/registry/examples/slider/floating.d.ts +4 -0
- package/registry/examples/slider/floating.js +11 -0
- package/registry/examples/slider/floating.tsx +12 -0
- package/registry/examples/slider/native/default.d.ts +4 -0
- package/registry/examples/slider/native/default.dark.png +0 -0
- package/registry/examples/slider/native/default.js +14 -0
- package/registry/examples/slider/native/default.light.png +0 -0
- package/registry/examples/slider/native/default.tsx +13 -0
- package/registry/examples/slider/native/range.d.ts +4 -0
- package/registry/examples/slider/native/range.dark.png +0 -0
- package/registry/examples/slider/native/range.js +12 -0
- package/registry/examples/slider/native/range.light.png +0 -0
- package/registry/examples/slider/native/range.tsx +11 -0
- package/registry/examples/slider/native/stepped.d.ts +4 -0
- package/registry/examples/slider/native/stepped.dark.png +0 -0
- package/registry/examples/slider/native/stepped.js +28 -0
- package/registry/examples/slider/native/stepped.light.png +0 -0
- package/registry/examples/slider/native/stepped.tsx +24 -0
- package/registry/examples/slider/native/vertical.d.ts +4 -0
- package/registry/examples/slider/native/vertical.dark.png +0 -0
- package/registry/examples/slider/native/vertical.js +16 -0
- package/registry/examples/slider/native/vertical.light.png +0 -0
- package/registry/examples/slider/native/vertical.tsx +13 -0
- package/registry/examples/slider/price-range.d.ts +4 -0
- package/registry/examples/slider/price-range.js +29 -0
- package/registry/examples/slider/price-range.tsx +27 -0
- package/registry/examples/slider/stepped.d.ts +4 -0
- package/registry/examples/slider/stepped.js +28 -0
- package/registry/examples/slider/stepped.tsx +24 -0
- package/registry/examples/slider/vertical.d.ts +4 -0
- package/registry/examples/slider/vertical.js +15 -0
- package/registry/examples/slider/vertical.tsx +14 -0
- package/registry/examples/switch/native/default.d.ts +4 -0
- package/registry/examples/switch/native/default.dark.png +0 -0
- package/registry/examples/switch/native/default.js +16 -0
- package/registry/examples/switch/native/default.light.png +0 -0
- package/registry/examples/switch/native/default.tsx +13 -0
- package/registry/examples/switch/native/settings.d.ts +4 -0
- package/registry/examples/switch/native/settings.dark.png +0 -0
- package/registry/examples/switch/native/settings.js +20 -0
- package/registry/examples/switch/native/settings.light.png +0 -0
- package/registry/examples/switch/native/settings.tsx +17 -0
- package/registry/field.json +15 -3
- package/registry/form.json +250 -42
- package/registry/index.json +29 -24
- package/registry/radio-group.json +227 -15
- package/registry/slider.json +314 -13
- package/registry/switch.json +115 -3
- package/registry/tabs.json +2 -2
- package/registry/theme.json +7 -0
- package/skills/choice-controls/SKILL.md +39 -0
- package/skills/date-picker/SKILL.md +43 -0
- package/skills/form/SKILL.md +3 -0
- package/dist/chunk-2USC2YT6.js +0 -17
- package/dist/chunk-2USC2YT6.js.map +0 -1
- package/dist/chunk-5AXLA4LK.js +0 -13
- package/dist/chunk-5AXLA4LK.js.map +0 -1
- package/dist/chunk-FJDSLNXK.js +0 -11
- package/dist/chunk-FJDSLNXK.js.map +0 -1
- package/dist/chunk-KNBYZGSQ.js +0 -11
- package/dist/chunk-KNBYZGSQ.js.map +0 -1
- package/dist/chunk-RUPRYJ45.js +0 -82
- package/dist/chunk-RUPRYJ45.js.map +0 -1
- package/dist/chunk-VCAAHCHL.js +0 -17
- package/dist/chunk-VCAAHCHL.js.map +0 -1
- /package/dist/{chunk-K3SWZXYT.js.map → chunk-DGQMDJXK.js.map} +0 -0
package/dist/native.d.ts
CHANGED
|
@@ -29,6 +29,28 @@ declare function composeDate(parts: Readonly<Record<DatePart, string>>): string;
|
|
|
29
29
|
declare function isRealDate(value: string): boolean;
|
|
30
30
|
/** The latest date of birth of someone `age` years old today (`YYYY-MM-DD`): an age gate's `max`, `value <= latestBirthDate(18)`. */
|
|
31
31
|
declare function latestBirthDate(age: number, today?: Date): string;
|
|
32
|
+
/** The days of a month (`month` 1–12). */
|
|
33
|
+
declare function daysInMonth(year: number, month: number): number;
|
|
34
|
+
/** The ISO date of today on this device (or of the `Date` given). */
|
|
35
|
+
declare function todayIso(now?: Date): string;
|
|
36
|
+
/** The age in whole years on `today` of someone born on `birth` (both ISO). */
|
|
37
|
+
declare function ageOn(birth: string, today?: string): number;
|
|
38
|
+
/** The month names of a locale, January first (`long` · `short` · `narrow`). */
|
|
39
|
+
declare function monthNames(locale: string, style?: "long" | "short" | "narrow"): string[];
|
|
40
|
+
/** A time of day, `HH:mm` on 24 hours (`"09:30"`, `"18:00"`): the value of every time picker. */
|
|
41
|
+
type TimeValue = string;
|
|
42
|
+
/** `"9:5"` / `"09:05"` → minutes since midnight; `null` when it is not a time. */
|
|
43
|
+
declare function timeToMinutes(value: string | null | undefined): number | null;
|
|
44
|
+
/** The slots of a day from `start` to `end` (excluded) every `step` minutes: `timeSlots("09:00", "12:00", 30)`. */
|
|
45
|
+
declare function timeSlots(start: TimeValue, end: TimeValue, step?: number): TimeValue[];
|
|
46
|
+
/** True when the locale writes the time on 12 hours with a day period (`en-US` → true, `fr-CA` → false). */
|
|
47
|
+
declare function uses12Hours(locale: string): boolean;
|
|
48
|
+
/** A time written the locale's way (`"18:30"` → `"6:30 PM"` in en-US, `"18 h 30"` in fr-CA). */
|
|
49
|
+
declare function formatTime(locale: string, value: TimeValue): string;
|
|
50
|
+
/** The ISO date `days` later (or earlier). */
|
|
51
|
+
declare const addDays: (iso: string, days: number) => string;
|
|
52
|
+
/** The ISO date `months` later (or earlier), the day kept inside the shorter months (`01-31` + 1 → `02-28`). */
|
|
53
|
+
declare const addMonths: (iso: string, months: number) => string;
|
|
32
54
|
|
|
33
55
|
type BrandId = "krizaka" | "orazaka" | "orochia" | "yazakia" | "yororis";
|
|
34
56
|
|
|
@@ -303,6 +325,71 @@ declare const Chip: typeof ChipBase & {
|
|
|
303
325
|
Group: typeof ChipGroup;
|
|
304
326
|
};
|
|
305
327
|
|
|
328
|
+
/** An option: the value stored and its words (passed translated), a line under them. */
|
|
329
|
+
type SelectOption = {
|
|
330
|
+
value: string;
|
|
331
|
+
label: string;
|
|
332
|
+
description?: string;
|
|
333
|
+
disabled?: boolean;
|
|
334
|
+
};
|
|
335
|
+
type FieldShared = {
|
|
336
|
+
/** The visible label, passed translated (the field's name). */
|
|
337
|
+
label: string;
|
|
338
|
+
/** Shown while nothing is chosen ("Choose a category"), passed translated. */
|
|
339
|
+
placeholder?: string;
|
|
340
|
+
/** A help text under the field. */
|
|
341
|
+
hint?: string;
|
|
342
|
+
/** An error under the field: a danger edge, read and announced. Replaces the hint. */
|
|
343
|
+
error?: string;
|
|
344
|
+
/** Not available. */
|
|
345
|
+
disabled?: boolean;
|
|
346
|
+
/** Called when the sheet closes (the field is left). */
|
|
347
|
+
onBlur?: () => void;
|
|
348
|
+
/** Styles merged last, on the field. */
|
|
349
|
+
style?: StyleProp<ViewStyle>;
|
|
350
|
+
};
|
|
351
|
+
type SelectProps = FieldShared & {
|
|
352
|
+
/** The choices. */
|
|
353
|
+
options: readonly SelectOption[];
|
|
354
|
+
/** The chosen value (controlled); `null` or `""` for none. */
|
|
355
|
+
value?: string | null;
|
|
356
|
+
/** The chosen value at first, uncontrolled. */
|
|
357
|
+
defaultValue?: string | null;
|
|
358
|
+
/** Called with the value picked. */
|
|
359
|
+
onValueChange?: (value: string) => void;
|
|
360
|
+
/** The sheet's title. Default: the label. */
|
|
361
|
+
sheetTitle?: string;
|
|
362
|
+
};
|
|
363
|
+
/** One choice among many — the web `<select>`: a field that opens a sheet of options; picking one closes it. */
|
|
364
|
+
declare function Select({ options, value: valueProp, defaultValue, onValueChange, sheetTitle, ...shared }: SelectProps): React.JSX.Element;
|
|
365
|
+
type ComboboxLabels = {
|
|
366
|
+
/** The search box's name and placeholder ("Search"). */
|
|
367
|
+
search: string;
|
|
368
|
+
/** While a search runs ("Searching…"). */
|
|
369
|
+
loading: string;
|
|
370
|
+
/** When nothing matches ("No results"). */
|
|
371
|
+
empty: string;
|
|
372
|
+
/** The button that closes a multiple choice ("Done"). */
|
|
373
|
+
done: string;
|
|
374
|
+
};
|
|
375
|
+
declare const comboboxLabels: ComboboxLabels;
|
|
376
|
+
type ComboboxProps = FieldShared & {
|
|
377
|
+
/** The options, filtered by what is typed. */
|
|
378
|
+
options?: readonly SelectOption[];
|
|
379
|
+
/** Fetches the options for a query (debounced 250 ms, aborted by a newer one). */
|
|
380
|
+
onSearch?: (query: string, signal: AbortSignal) => Promise<readonly SelectOption[]>;
|
|
381
|
+
/** Several values (`string[]`, checkboxes, a Done button); one by default. */
|
|
382
|
+
multiple?: boolean;
|
|
383
|
+
/** The chosen value(s) (controlled): a string, or strings with `multiple`. */
|
|
384
|
+
value?: string | readonly string[] | null;
|
|
385
|
+
/** Called with the value — or the values — chosen. */
|
|
386
|
+
onValueChange?: (value: string | string[]) => void;
|
|
387
|
+
/** The words, passed translated; English by default. */
|
|
388
|
+
labels?: Partial<ComboboxLabels>;
|
|
389
|
+
};
|
|
390
|
+
/** A choice among many, searched: a field that opens a sheet with a search box and the matching options. */
|
|
391
|
+
declare function Combobox({ options, onSearch, multiple, value, onValueChange, labels: given, ...shared }: ComboboxProps): React.JSX.Element;
|
|
392
|
+
|
|
306
393
|
type CountdownProps = {
|
|
307
394
|
/** The moment it counts down to: a Date, an ISO string or epoch milliseconds. */
|
|
308
395
|
target: Date | string | number;
|
|
@@ -376,6 +463,183 @@ type DateFieldProps = {
|
|
|
376
463
|
*/
|
|
377
464
|
declare function DateField({ label, hint, error, value, defaultValue, onValueChange, onBlur, locale, labels: given, autoComplete, disabled, inputRef, onSubmitEditing, returnKeyType, style }: DateFieldProps): React.JSX.Element;
|
|
378
465
|
|
|
466
|
+
type CalendarLabels = {
|
|
467
|
+
/** The previous-month button ("Previous month"). */
|
|
468
|
+
previousMonth: string;
|
|
469
|
+
/** The next-month button ("Next month"). */
|
|
470
|
+
nextMonth: string;
|
|
471
|
+
};
|
|
472
|
+
declare const calendarLabels: CalendarLabels;
|
|
473
|
+
type CalendarProps = {
|
|
474
|
+
/** The BCP 47 locale of the names: always explicit. */
|
|
475
|
+
locale: string;
|
|
476
|
+
/** The chosen date (one-date mode). */
|
|
477
|
+
value?: string | null;
|
|
478
|
+
/** The chosen range (range mode): its ends lit, the days between one band. */
|
|
479
|
+
range?: {
|
|
480
|
+
start: string;
|
|
481
|
+
end: string | null;
|
|
482
|
+
} | null;
|
|
483
|
+
/** Called with the day pressed. */
|
|
484
|
+
onSelect?: (date: string) => void;
|
|
485
|
+
/** The month shown at first (any day of it). Default: the value's, or today's. */
|
|
486
|
+
defaultMonth?: string;
|
|
487
|
+
/** The earliest date that can be picked. */
|
|
488
|
+
min?: string;
|
|
489
|
+
/** The latest date that can be picked. */
|
|
490
|
+
max?: string;
|
|
491
|
+
/** Refuses some dates. */
|
|
492
|
+
isDateDisabled?: (date: string) => boolean;
|
|
493
|
+
/** The first day of the week, 0 = Sunday. Default: the locale's. */
|
|
494
|
+
weekStartsOn?: number;
|
|
495
|
+
/** Today (marked by the node). Default: the device's date. */
|
|
496
|
+
today?: string;
|
|
497
|
+
/** The words, passed translated; English by default. */
|
|
498
|
+
labels?: Partial<CalendarLabels>;
|
|
499
|
+
/** Styles merged last. */
|
|
500
|
+
style?: StyleProp<ViewStyle>;
|
|
501
|
+
};
|
|
502
|
+
/** A month to pick a day or the ends of a period — the web `Calendar`: 44-pt days, today's node, the range as a band. */
|
|
503
|
+
declare function Calendar({ locale, value, range, onSelect, defaultMonth, min, max, isDateDisabled, weekStartsOn, today: todayProp, labels: given, style }: CalendarProps): React.JSX.Element;
|
|
504
|
+
type MonthPickerProps = {
|
|
505
|
+
/** The BCP 47 locale of the month names: always explicit. */
|
|
506
|
+
locale: string;
|
|
507
|
+
/** The chosen month, `YYYY-MM` (controlled); `null` for none. */
|
|
508
|
+
value?: string | null;
|
|
509
|
+
/** Called with the month pressed. */
|
|
510
|
+
onValueChange?: (value: string) => void;
|
|
511
|
+
/** The earliest month, `YYYY-MM`. */
|
|
512
|
+
min?: string;
|
|
513
|
+
/** The latest month, `YYYY-MM`. */
|
|
514
|
+
max?: string;
|
|
515
|
+
/** The words of the year buttons, passed translated. */
|
|
516
|
+
labels?: {
|
|
517
|
+
previousYear?: string;
|
|
518
|
+
nextYear?: string;
|
|
519
|
+
};
|
|
520
|
+
/** Styles merged last. */
|
|
521
|
+
style?: StyleProp<ViewStyle>;
|
|
522
|
+
};
|
|
523
|
+
/** A month of a year: the twelve months in a grid, the year above them — the web `MonthPicker`. */
|
|
524
|
+
declare function MonthPicker({ locale, value, onValueChange, min, max, labels, style }: MonthPickerProps): React.JSX.Element;
|
|
525
|
+
type DayStripProps = {
|
|
526
|
+
/** The group's accessible name ("Delivery day"), passed translated. */
|
|
527
|
+
label: string;
|
|
528
|
+
/** The BCP 47 locale: always explicit. */
|
|
529
|
+
locale: string;
|
|
530
|
+
/** The chosen day, ISO (controlled); `null` for none. */
|
|
531
|
+
value?: string | null;
|
|
532
|
+
/** The chosen day at first, uncontrolled. */
|
|
533
|
+
defaultValue?: string | null;
|
|
534
|
+
/** Called with the day pressed. */
|
|
535
|
+
onValueChange?: (value: string) => void;
|
|
536
|
+
/** The first day. Default: today. */
|
|
537
|
+
start?: string;
|
|
538
|
+
/** How many days. Default 14. */
|
|
539
|
+
days?: number;
|
|
540
|
+
/** Refuses some days (closed, full). */
|
|
541
|
+
isDateDisabled?: (date: string) => boolean;
|
|
542
|
+
/** Marks the days that have something: a dot, and `markedLabel` in their name. */
|
|
543
|
+
isDateMarked?: (date: string) => boolean;
|
|
544
|
+
/** Added to the name of a marked day ("has events"), passed translated. */
|
|
545
|
+
markedLabel?: string;
|
|
546
|
+
/** Today (the node). Default: the device's date. */
|
|
547
|
+
today?: string;
|
|
548
|
+
/** Styles merged last. */
|
|
549
|
+
style?: StyleProp<ViewStyle>;
|
|
550
|
+
};
|
|
551
|
+
/** The days ahead in a row that scrolls sideways — the web `DayStrip`: a radio group of 56×72-pt days. */
|
|
552
|
+
declare function DayStrip({ label, locale, value: valueProp, defaultValue, onValueChange, start, days, isDateDisabled, isDateMarked, markedLabel, today: todayProp, style }: DayStripProps): React.JSX.Element;
|
|
553
|
+
type TimePickerLabels = {
|
|
554
|
+
/** The hours' wheel ("Hours"). */
|
|
555
|
+
hours: string;
|
|
556
|
+
/** The minutes' wheel ("Minutes"). */
|
|
557
|
+
minutes: string;
|
|
558
|
+
/** The day period's wheel ("AM/PM"). */
|
|
559
|
+
period: string;
|
|
560
|
+
};
|
|
561
|
+
type TimePickerProps = {
|
|
562
|
+
/** The accessible name ("Pick-up time"), passed translated. */
|
|
563
|
+
label: string;
|
|
564
|
+
/** The BCP 47 locale: how times are written, 12 or 24 hours. */
|
|
565
|
+
locale: string;
|
|
566
|
+
/** The time, `HH:mm` on 24 hours (controlled); `null` for none. */
|
|
567
|
+
value?: TimeValue | null;
|
|
568
|
+
/** The time at first, uncontrolled. */
|
|
569
|
+
defaultValue?: TimeValue | null;
|
|
570
|
+
/** Called with the time chosen. */
|
|
571
|
+
onValueChange?: (value: TimeValue) => void;
|
|
572
|
+
/** `wheel` (default: hours, minutes and the period as wheels) or `slots` (the free times as buttons). */
|
|
573
|
+
variant?: "wheel" | "slots";
|
|
574
|
+
/** Wheels: the minutes' step. Default 5. */
|
|
575
|
+
minuteStep?: number;
|
|
576
|
+
/** Wheels: forces 12 or 24 hours. Default: the locale's. */
|
|
577
|
+
hour12?: boolean;
|
|
578
|
+
/** Wheels: the names of the wheels, passed translated. */
|
|
579
|
+
labels?: Partial<TimePickerLabels>;
|
|
580
|
+
/** Slots: the times offered, `HH:mm` (`timeSlots("09:00", "17:00", 30)`). */
|
|
581
|
+
slots?: readonly TimeValue[];
|
|
582
|
+
/** Slots: refuses some (taken). */
|
|
583
|
+
isTimeDisabled?: (time: TimeValue) => boolean;
|
|
584
|
+
/** Not available. */
|
|
585
|
+
disabled?: boolean;
|
|
586
|
+
/** Styles merged last. */
|
|
587
|
+
style?: StyleProp<ViewStyle>;
|
|
588
|
+
};
|
|
589
|
+
/** A time of day: wheels to set one, or slots to book one — the web `TimePicker`. */
|
|
590
|
+
declare function TimePicker({ label, locale, value: valueProp, defaultValue, onValueChange, variant, minuteStep, hour12, labels: given, slots, isTimeDisabled, disabled, style }: TimePickerProps): React.JSX.Element;
|
|
591
|
+
type DateWheelProps = {
|
|
592
|
+
/** The visible label, passed translated (the group's name). */
|
|
593
|
+
label: string;
|
|
594
|
+
/** The BCP 47 locale: the order of the wheels, the month names. */
|
|
595
|
+
locale: string;
|
|
596
|
+
/** The date, `YYYY-MM-DD` (controlled); `""` or `null` for none. */
|
|
597
|
+
value?: string | null;
|
|
598
|
+
/** The date at first, uncontrolled. */
|
|
599
|
+
defaultValue?: string | null;
|
|
600
|
+
/** Called with the date under the band: always a real date within `min` / `max`. */
|
|
601
|
+
onValueChange?: (value: string) => void;
|
|
602
|
+
/** The earliest date (ISO). Default: 120 years ago. */
|
|
603
|
+
min?: string;
|
|
604
|
+
/** The latest date (ISO): `latestBirthDate(18)` for an age gate. Default: today. */
|
|
605
|
+
max?: string;
|
|
606
|
+
/** Where the wheels rest while there is no value. Default: `max`. */
|
|
607
|
+
defaultView?: string;
|
|
608
|
+
/** A help text under the wheels. */
|
|
609
|
+
hint?: string;
|
|
610
|
+
/** An error under the wheels: a danger edge, read and announced. Replaces the hint. */
|
|
611
|
+
error?: string;
|
|
612
|
+
/** The names of the wheels (`day`, `month`, `year`), passed translated. */
|
|
613
|
+
labels?: Partial<Record<"day" | "month" | "year", string>>;
|
|
614
|
+
/** Not available. */
|
|
615
|
+
disabled?: boolean;
|
|
616
|
+
/** Styles merged last. */
|
|
617
|
+
style?: StyleProp<ViewStyle>;
|
|
618
|
+
};
|
|
619
|
+
/** Day, month and year as three wheels in the locale's order, bounded by `min` and `max` — the web `DateWheel`. */
|
|
620
|
+
declare function DateWheel({ label, locale, value: valueProp, defaultValue, onValueChange, min, max, defaultView, hint, error, labels: given, disabled, style }: DateWheelProps): React.JSX.Element;
|
|
621
|
+
|
|
622
|
+
type SheetProps = {
|
|
623
|
+
/** Open (controlled). */
|
|
624
|
+
open: boolean;
|
|
625
|
+
/** Called to close it: the scrim pressed, the back button, a choice made. */
|
|
626
|
+
onOpenChange: (open: boolean) => void;
|
|
627
|
+
/** The title at the top of the sheet (its accessible name), passed translated. */
|
|
628
|
+
title?: string;
|
|
629
|
+
/** The name of the close action read by screen readers ("Close"), passed translated. */
|
|
630
|
+
closeLabel?: string;
|
|
631
|
+
/** The content: a list, details, a form. */
|
|
632
|
+
children: React.ReactNode;
|
|
633
|
+
/** Styles merged last, on the sheet. */
|
|
634
|
+
style?: StyleProp<ViewStyle>;
|
|
635
|
+
};
|
|
636
|
+
/**
|
|
637
|
+
* A bottom sheet: it rises over a dimmed screen, its grip on top, the scrim closes it. The web `Dialog` on a phone —
|
|
638
|
+
* a choice (`Select`, `Combobox`), the details of a pin on a map, a short form. React Native's `Modal`: focus stays
|
|
639
|
+
* inside, the back button closes it. Rises with the theme's ease; still under reduced motion.
|
|
640
|
+
*/
|
|
641
|
+
declare function Sheet({ open, onOpenChange, title, closeLabel, children, style }: SheetProps): React.JSX.Element;
|
|
642
|
+
|
|
379
643
|
type EmptyStateProps = Omit<ViewProps, "children"> & {
|
|
380
644
|
/** A decorative icon (hidden from screen readers). */
|
|
381
645
|
icon?: React.ReactNode;
|
|
@@ -665,6 +929,44 @@ type ProgressProps = {
|
|
|
665
929
|
*/
|
|
666
930
|
declare function Progress({ variant, size, value, max, label, valueText, children, style }: ProgressProps): React.JSX.Element;
|
|
667
931
|
|
|
932
|
+
/** A choice: the value stored and its words (passed translated), a line under them, a second line on a key. */
|
|
933
|
+
type RadioOption = {
|
|
934
|
+
value: string;
|
|
935
|
+
label: string;
|
|
936
|
+
description?: string;
|
|
937
|
+
hint?: string;
|
|
938
|
+
disabled?: boolean;
|
|
939
|
+
};
|
|
940
|
+
type RadioGroupProps = {
|
|
941
|
+
/** The group's accessible name (the question), passed translated. */
|
|
942
|
+
label: string;
|
|
943
|
+
/** The choices, all visible (two to five, a few more for `buttons`). */
|
|
944
|
+
options: readonly RadioOption[];
|
|
945
|
+
/** The chosen value (controlled). */
|
|
946
|
+
value?: string | null;
|
|
947
|
+
/** The chosen value at first, uncontrolled. */
|
|
948
|
+
defaultValue?: string | null;
|
|
949
|
+
/** Called with the value pressed. */
|
|
950
|
+
onValueChange?: (value: string) => void;
|
|
951
|
+
/**
|
|
952
|
+
* `list` (a dot and its words, 44-pt rows), `cards` (whole cards, the check lit), `buttons` (tactile keys that press
|
|
953
|
+
* in: an `impact` haptic), `segmented` (a track of equal segments).
|
|
954
|
+
* @default "list"
|
|
955
|
+
*/
|
|
956
|
+
variant?: "list" | "cards" | "buttons" | "segmented";
|
|
957
|
+
/** An error under the group, read and announced. */
|
|
958
|
+
error?: string;
|
|
959
|
+
/** Not available. */
|
|
960
|
+
disabled?: boolean;
|
|
961
|
+
/** Styles merged last. */
|
|
962
|
+
style?: StyleProp<ViewStyle>;
|
|
963
|
+
};
|
|
964
|
+
/**
|
|
965
|
+
* One choice among a few, all visible — the web `RadioGroup` in its four looks. A radio group for VoiceOver and
|
|
966
|
+
* TalkBack; each press plays a haptic (`selection`, `impact` for a tactile key) when the app passes `haptics`.
|
|
967
|
+
*/
|
|
968
|
+
declare function RadioGroup({ label, options, value: valueProp, defaultValue, onValueChange, variant, error, disabled, style }: RadioGroupProps): React.JSX.Element;
|
|
969
|
+
|
|
668
970
|
type SearchFieldProps = Omit<TextInputProps, "value" | "defaultValue" | "onChangeText" | "style" | "onSubmitEditing"> & {
|
|
669
971
|
/** The accessible name of the input ("Search videos"), passed translated. */
|
|
670
972
|
label: string;
|
|
@@ -731,6 +1033,55 @@ type SkeletonProps = {
|
|
|
731
1033
|
/** A pulsing placeholder the size of what is loading — hidden from screen readers; still when the system reduces motion. */
|
|
732
1034
|
declare function Skeleton({ shape, width, height, style, testID }: SkeletonProps): React.JSX.Element;
|
|
733
1035
|
|
|
1036
|
+
type SliderValue = number | [number, number];
|
|
1037
|
+
type SliderProps<V extends SliderValue = number> = {
|
|
1038
|
+
/** The accessible name of the thumb (or of both thumbs of a range), passed translated. */
|
|
1039
|
+
label: string;
|
|
1040
|
+
/** For a range: each thumb's own name (["Minimum", "Maximum"]), passed translated. */
|
|
1041
|
+
thumbLabels?: [string, string];
|
|
1042
|
+
/** One number (a thumb) or two (a range), controlled. */
|
|
1043
|
+
value?: V;
|
|
1044
|
+
/** The value at first, uncontrolled. */
|
|
1045
|
+
defaultValue?: V;
|
|
1046
|
+
/** Called on every step the thumb passes. */
|
|
1047
|
+
onValueChange?: (value: V) => void;
|
|
1048
|
+
/** Called once the thumb is released (or an accessibility action is done). */
|
|
1049
|
+
onValueCommit?: (value: V) => void;
|
|
1050
|
+
/** The lowest value. Default 0. */
|
|
1051
|
+
min?: number;
|
|
1052
|
+
/** The highest value. Default 100. */
|
|
1053
|
+
max?: number;
|
|
1054
|
+
/** The step. Default 1. */
|
|
1055
|
+
step?: number;
|
|
1056
|
+
/** The value as words (read, and shown): "1.5×", "15 %". */
|
|
1057
|
+
formatValue?: (value: number) => string;
|
|
1058
|
+
/** Shows the label and the value above the track. */
|
|
1059
|
+
showLabel?: boolean;
|
|
1060
|
+
/** Shows the value floating over the thumb while it is dragged (`"always"`: at all times). */
|
|
1061
|
+
floatingValue?: boolean | "always";
|
|
1062
|
+
/** A graduation at every step (`true`, up to 40) or at the values given. */
|
|
1063
|
+
ticks?: boolean | readonly number[];
|
|
1064
|
+
/** Words under the track at some values. Horizontal only. */
|
|
1065
|
+
marks?: readonly {
|
|
1066
|
+
value: number;
|
|
1067
|
+
label: string;
|
|
1068
|
+
}[];
|
|
1069
|
+
/** `gradient` (accent → accent-2, default) or `solid`. */
|
|
1070
|
+
tone?: "gradient" | "solid";
|
|
1071
|
+
/** `horizontal` (default) or `vertical` (give the slider a height). */
|
|
1072
|
+
orientation?: "horizontal" | "vertical";
|
|
1073
|
+
/** Not available. */
|
|
1074
|
+
disabled?: boolean;
|
|
1075
|
+
/** Styles merged last. */
|
|
1076
|
+
style?: StyleProp<ViewStyle>;
|
|
1077
|
+
};
|
|
1078
|
+
/**
|
|
1079
|
+
* A slider for React Native — the web `Slider`: one value or a range, drawn by the theme, dragged anywhere on the track.
|
|
1080
|
+
* Each step the thumb passes ticks under the thumb (`selection` haptic); for VoiceOver and TalkBack each thumb is an
|
|
1081
|
+
* adjustable control (swipe up or down by a step), its value read as words.
|
|
1082
|
+
*/
|
|
1083
|
+
declare function Slider<V extends SliderValue = number>({ label, thumbLabels, value, defaultValue, onValueChange, onValueCommit, min, max, step, formatValue, showLabel, floatingValue, ticks, marks, tone, orientation, disabled, style, }: SliderProps<V>): React.JSX.Element;
|
|
1084
|
+
|
|
734
1085
|
type SpinnerProps = Omit<ActivityIndicatorProps, "size" | "color"> & {
|
|
735
1086
|
/** The accessible name of the wait, e.g. "Loading" — passed translated. */
|
|
736
1087
|
label: string;
|
|
@@ -740,6 +1091,35 @@ type SpinnerProps = Omit<ActivityIndicatorProps, "size" | "color"> & {
|
|
|
740
1091
|
/** An indeterminate wait: the platform's activity indicator in the accent, named by `label`. */
|
|
741
1092
|
declare function Spinner({ label, size, ...props }: SpinnerProps): React.JSX.Element;
|
|
742
1093
|
|
|
1094
|
+
type SwitchProps = {
|
|
1095
|
+
/** The accessible name ("Push notifications"), passed translated — also the visible words when `children` is not given and `showLabel` is set. */
|
|
1096
|
+
label: string;
|
|
1097
|
+
/** On (controlled). */
|
|
1098
|
+
checked?: boolean;
|
|
1099
|
+
/** On at first, uncontrolled. */
|
|
1100
|
+
defaultChecked?: boolean;
|
|
1101
|
+
/** Called with the new state. */
|
|
1102
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
1103
|
+
/** A line under the label, read with the switch ("Auctions you follow, new messages"). Shown with `showLabel`. */
|
|
1104
|
+
description?: string;
|
|
1105
|
+
/** Draws the label (and the description) beside the switch, the whole row pressable: a settings row. */
|
|
1106
|
+
showLabel?: boolean;
|
|
1107
|
+
/** sm · md (default). */
|
|
1108
|
+
size?: "sm" | "md";
|
|
1109
|
+
/** An error under the row, read and announced. */
|
|
1110
|
+
error?: string;
|
|
1111
|
+
/** Not available. */
|
|
1112
|
+
disabled?: boolean;
|
|
1113
|
+
/** Styles merged last. */
|
|
1114
|
+
style?: StyleProp<ViewStyle>;
|
|
1115
|
+
};
|
|
1116
|
+
/**
|
|
1117
|
+
* An on/off switch for React Native — the web `Switch`, drawn by the theme (the accent when on, the material's knob),
|
|
1118
|
+
* not the system's: the same look on iOS and Android, a `selection` haptic when it flips. `showLabel` makes it a
|
|
1119
|
+
* settings row (the label and its description beside it, all pressable).
|
|
1120
|
+
*/
|
|
1121
|
+
declare function Switch({ label, checked, defaultChecked, onCheckedChange, description, showLabel, size, error, disabled, style }: SwitchProps): React.JSX.Element;
|
|
1122
|
+
|
|
743
1123
|
type ThemeName = "dark" | "light";
|
|
744
1124
|
/** The colour roles of one theme (the @krizaka/tokens roles). */
|
|
745
1125
|
type Theme = {
|
|
@@ -828,6 +1208,11 @@ type ThemeFonts = {
|
|
|
828
1208
|
readonly display?: string;
|
|
829
1209
|
readonly mono?: string;
|
|
830
1210
|
};
|
|
1211
|
+
/**
|
|
1212
|
+
* A touch the hand feels: `selection` (a wheel's value, a slider's step, a radio picked), `impact` (a tactile button
|
|
1213
|
+
* pressed in), `success` / `warning` (an outcome).
|
|
1214
|
+
*/
|
|
1215
|
+
type HapticKind = "selection" | "impact" | "success" | "warning";
|
|
831
1216
|
type ThemeContextValue = {
|
|
832
1217
|
/** The chosen mode: dark, light or follow the system. */
|
|
833
1218
|
mode: Mode;
|
|
@@ -839,6 +1224,8 @@ type ThemeContextValue = {
|
|
|
839
1224
|
radius: Radius;
|
|
840
1225
|
motion: Motion;
|
|
841
1226
|
fonts: ThemeFonts;
|
|
1227
|
+
/** Plays a haptic (the app's `haptics`, through expo-haptics or another module); nothing without one. */
|
|
1228
|
+
haptic: (kind: HapticKind) => void;
|
|
842
1229
|
};
|
|
843
1230
|
type ThemeProviderProps = {
|
|
844
1231
|
children: React.ReactNode;
|
|
@@ -852,9 +1239,15 @@ type ThemeProviderProps = {
|
|
|
852
1239
|
overrides?: ThemeOverrides;
|
|
853
1240
|
/** Font families the app has loaded (`expo-font`…); absent: the system font. */
|
|
854
1241
|
fonts?: ThemeFonts;
|
|
1242
|
+
/**
|
|
1243
|
+
* Plays the haptics of the controls (a wheel's tick, a slider's step, a tactile button). The platform has no module:
|
|
1244
|
+
* the app passes one — `(kind) => kind === "selection" ? Haptics.selectionAsync() : Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light)`
|
|
1245
|
+
* with expo-haptics. Absent: no haptics.
|
|
1246
|
+
*/
|
|
1247
|
+
haptics?: (kind: HapticKind) => void;
|
|
855
1248
|
};
|
|
856
1249
|
/** Once, at the root of the app. Without it, `useTheme()` follows the system with the platform's roles. */
|
|
857
|
-
declare function ThemeProvider({ children, mode: controlled, defaultMode, onModeChange, overrides, fonts }: ThemeProviderProps): React.JSX.Element;
|
|
1250
|
+
declare function ThemeProvider({ children, mode: controlled, defaultMode, onModeChange, overrides, fonts, haptics }: ThemeProviderProps): React.JSX.Element;
|
|
858
1251
|
/** The current theme: `{ mode, setMode, scheme, theme, radius, motion, fonts }`. */
|
|
859
1252
|
declare function useTheme(): ThemeContextValue;
|
|
860
1253
|
/** True while the system asks to reduce motion: every loop and transition of /native stops. */
|
|
@@ -911,6 +1304,54 @@ type ToasterProps = {
|
|
|
911
1304
|
/** Mount once, at the root (inside `ThemeProvider`). Then call `toast()` from anywhere. */
|
|
912
1305
|
declare function Toaster({ closeLabel, position, offset, duration, max }: ToasterProps): React.JSX.Element | null;
|
|
913
1306
|
|
|
1307
|
+
/** A value of a wheel: what is stored, and its words (passed translated or formatted for the locale). */
|
|
1308
|
+
type WheelOption = {
|
|
1309
|
+
value: string;
|
|
1310
|
+
label: string;
|
|
1311
|
+
disabled?: boolean;
|
|
1312
|
+
};
|
|
1313
|
+
type WheelPickerProps = {
|
|
1314
|
+
/** The group's accessible name ("Departure time"), passed translated. */
|
|
1315
|
+
label: string;
|
|
1316
|
+
/** The wheels (`Wheel`), and dividers (`WheelDivider`) between them. */
|
|
1317
|
+
children: React.ReactNode;
|
|
1318
|
+
/** How many values are visible: 3, 5 (default) or 7. */
|
|
1319
|
+
visible?: 3 | 5 | 7;
|
|
1320
|
+
/** Marks the group invalid (a danger edge). */
|
|
1321
|
+
invalid?: boolean;
|
|
1322
|
+
/** Nothing is chosen yet: the values under the band stay quiet (secondary) until a wheel is turned. */
|
|
1323
|
+
unset?: boolean;
|
|
1324
|
+
/** Styles merged last. */
|
|
1325
|
+
style?: StyleProp<ViewStyle>;
|
|
1326
|
+
};
|
|
1327
|
+
/** The frame of one or several wheels: a raised surface, the lit band across them — the web `WheelPicker`. */
|
|
1328
|
+
declare function WheelPicker({ label, children, visible, invalid, unset, style }: WheelPickerProps): React.JSX.Element;
|
|
1329
|
+
/** A divider between two wheels (`:` between the hours and the minutes). */
|
|
1330
|
+
declare function WheelDivider({ children }: {
|
|
1331
|
+
children: string;
|
|
1332
|
+
}): React.JSX.Element;
|
|
1333
|
+
type WheelProps = {
|
|
1334
|
+
/** The column's accessible name ("Hour", "Month"), passed translated. */
|
|
1335
|
+
label: string;
|
|
1336
|
+
/** The values, in order. */
|
|
1337
|
+
options: readonly WheelOption[];
|
|
1338
|
+
/** The chosen value (controlled). */
|
|
1339
|
+
value?: string | null;
|
|
1340
|
+
/** The chosen value at first, uncontrolled. Default: the first one. */
|
|
1341
|
+
defaultValue?: string;
|
|
1342
|
+
/** Called with the value that comes to rest under the band. */
|
|
1343
|
+
onValueChange?: (value: string) => void;
|
|
1344
|
+
/** Not available. */
|
|
1345
|
+
disabled?: boolean;
|
|
1346
|
+
/** Styles merged last, on the column (a width). */
|
|
1347
|
+
style?: StyleProp<ViewStyle>;
|
|
1348
|
+
};
|
|
1349
|
+
/**
|
|
1350
|
+
* One column of a `WheelPicker`: values that snap under the band, a tick of the hand (`selection` haptic) at each one
|
|
1351
|
+
* passed. For VoiceOver and TalkBack it is an adjustable control: swipe up or down to change it, its value read as words.
|
|
1352
|
+
*/
|
|
1353
|
+
declare function Wheel({ label, options, value: valueProp, defaultValue, onValueChange, disabled, style }: WheelProps): React.JSX.Element;
|
|
1354
|
+
|
|
914
1355
|
/**
|
|
915
1356
|
* The Yazakia mark for React Native — the geometry of the web mark (marks/yazakia-geometry.ts): two voices, two
|
|
916
1357
|
* speech bubbles that overlap; the orbit and the pair turn slowly around them, the lens where they overlap breathes;
|
|
@@ -925,4 +1366,4 @@ declare function YazakiaMark({ size, animated, title, neutral }: NativeMarkProps
|
|
|
925
1366
|
*/
|
|
926
1367
|
declare function YororisMark({ size, animated, title, neutral }: NativeMarkProps): React__default.JSX.Element;
|
|
927
1368
|
|
|
928
|
-
export { Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, AvatarRoot, type AvatarSize, Badge, type BadgeProps, type BadgeTone, type BrandId, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, CardBody, type CardBodyProps, CardDescription, CardFooter, CardImage, type CardImageProps, CardMedia, type CardMediaProps, CardOverlay, type CardOverlayProps, CardRoot, type CardRootProps, CardTitle, Checkbox, type CheckboxProps, Chip, type ChipGroupProps, type ChipProps, type ChipSize, Countdown, type CountdownProps, type CountdownUnits, DateField, type DateFieldLabels, type DateFieldProps, type DatePart, EmptyState, type EmptyStateProps, ErrorState, GoalGauge, type GoalGaugeProps, IconButton, type IconButtonProps, KrizakaMark, LoadingState, Mascot, type MascotProps, MascotState, type MascotStateProps, type Mode, type Motion, type NativeMarkProps, OrazakaMark, OrochiaMark, Pagination, type PaginationLabels, type PaginationProps, Phoenix, type PhoenixProps, ProductMark, ProfileCard, type ProfileCardProps, type ProfileStat, Progress, type ProgressProps, type Radius, SearchField, type SearchFieldProps, Segmented, type SegmentedOption, type SegmentedProps, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, SuccessState, TextField, type TextFieldProps, type Theme, type ThemeContextValue, type ThemeFonts, type ThemeName, type ThemeOverrides, ThemeProvider, type ThemeProviderProps, type ToastItem, type ToastOptions, type ToastTone, Toaster, type ToasterProps, Txt, type TxtProps, type TxtTone, type TxtVariant, WelcomeState, YazakiaMark, YororisMark, alpha, composeDate, dateFieldLabels, datePartsOrder, isRealDate, latestBirthDate, splitDuration, textStyles, toast, useCountdown, useReducedMotion, useTheme };
|
|
1369
|
+
export { Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, AvatarRoot, type AvatarSize, Badge, type BadgeProps, type BadgeTone, type BrandId, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarLabels, type CalendarProps, Card, CardBody, type CardBodyProps, CardDescription, CardFooter, CardImage, type CardImageProps, CardMedia, type CardMediaProps, CardOverlay, type CardOverlayProps, CardRoot, type CardRootProps, CardTitle, Checkbox, type CheckboxProps, Chip, type ChipGroupProps, type ChipProps, type ChipSize, Combobox, type ComboboxLabels, type ComboboxProps, Countdown, type CountdownProps, type CountdownUnits, DateField, type DateFieldLabels, type DateFieldProps, type DatePart, DateWheel, type DateWheelProps, DayStrip, type DayStripProps, EmptyState, type EmptyStateProps, ErrorState, GoalGauge, type GoalGaugeProps, type HapticKind, IconButton, type IconButtonProps, KrizakaMark, LoadingState, Mascot, type MascotProps, MascotState, type MascotStateProps, type Mode, MonthPicker, type MonthPickerProps, type Motion, type NativeMarkProps, OrazakaMark, OrochiaMark, Pagination, type PaginationLabels, type PaginationProps, Phoenix, type PhoenixProps, ProductMark, ProfileCard, type ProfileCardProps, type ProfileStat, Progress, type ProgressProps, RadioGroup, type RadioGroupProps, type RadioOption, type Radius, SearchField, type SearchFieldProps, Segmented, type SegmentedOption, type SegmentedProps, Select, type SelectOption, type SelectProps, Sheet, type SheetProps, Skeleton, type SkeletonProps, Slider, type SliderProps, type SliderValue, Spinner, type SpinnerProps, SuccessState, Switch, type SwitchProps, TextField, type TextFieldProps, type Theme, type ThemeContextValue, type ThemeFonts, type ThemeName, type ThemeOverrides, ThemeProvider, type ThemeProviderProps, TimePicker, type TimePickerLabels, type TimePickerProps, type TimeValue, type ToastItem, type ToastOptions, type ToastTone, Toaster, type ToasterProps, Txt, type TxtProps, type TxtTone, type TxtVariant, WelcomeState, Wheel, WheelDivider, type WheelOption, WheelPicker, type WheelPickerProps, type WheelProps, YazakiaMark, YororisMark, addDays, addMonths, ageOn, alpha, calendarLabels, comboboxLabels, composeDate, dateFieldLabels, datePartsOrder, daysInMonth, formatTime, isRealDate, latestBirthDate, monthNames, splitDuration, textStyles, timeSlots, timeToMinutes, toast, todayIso, useCountdown, useReducedMotion, useTheme, uses12Hours };
|