@jirawatpyk/aura-react 5.8.0 → 5.9.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.
Files changed (63) hide show
  1. package/README.md +27 -0
  2. package/dist/aura.bundle.js +1485 -1085
  3. package/dist/cjs/index.cjs +1485 -1085
  4. package/dist/esm/Accordion.js +2 -1
  5. package/dist/esm/Alert.js +2 -1
  6. package/dist/esm/AppShell.js +2 -1
  7. package/dist/esm/Breadcrumb.js +2 -1
  8. package/dist/esm/Button.js +2 -1
  9. package/dist/esm/Checkbox.js +2 -1
  10. package/dist/esm/Combobox.js +7 -6
  11. package/dist/esm/Command.js +3 -2
  12. package/dist/esm/DataTable.js +35 -13
  13. package/dist/esm/DatePicker.js +8 -7
  14. package/dist/esm/Dialog.js +38 -5
  15. package/dist/esm/Field.js +2 -1
  16. package/dist/esm/FileUpload.js +4 -3
  17. package/dist/esm/FilterBar.js +3 -2
  18. package/dist/esm/FormErrorSummary.js +2 -1
  19. package/dist/esm/Icon.js +50 -31
  20. package/dist/esm/Menu.js +2 -1
  21. package/dist/esm/NumberField.js +3 -2
  22. package/dist/esm/Pagination.js +3 -2
  23. package/dist/esm/PasswordField.js +2 -1
  24. package/dist/esm/Popover.js +2 -1
  25. package/dist/esm/RadioGroup.js +2 -1
  26. package/dist/esm/Select.js +4 -3
  27. package/dist/esm/SideNav.js +3 -2
  28. package/dist/esm/Stat.js +8 -1
  29. package/dist/esm/Stepper.js +2 -1
  30. package/dist/esm/Tabs.js +79 -9
  31. package/dist/esm/Tag.js +3 -2
  32. package/dist/esm/TimePicker.js +5 -4
  33. package/dist/esm/Toaster.js +3 -2
  34. package/dist/esm/classes.js +14 -1
  35. package/dist/esm/colorScheme.js +8 -1
  36. package/dist/esm/display.js +22 -12
  37. package/dist/esm/iconSvg.js +53 -0
  38. package/dist/esm/icons.js +531 -0
  39. package/dist/esm/index.js +2 -1
  40. package/dist/esm/internal.js +1 -14
  41. package/dist/esm/locale.js +7 -0
  42. package/dist/esm/strings.js +4 -245
  43. package/dist/esm/strings.sv.js +127 -0
  44. package/dist/esm/strings.th.js +127 -0
  45. package/dist/icons/index.cjs +613 -0
  46. package/dist/icons/index.d.cts +106 -0
  47. package/dist/icons/index.d.ts +106 -0
  48. package/dist/index.d.cts +44 -2
  49. package/dist/index.d.ts +44 -2
  50. package/dist/locales/sv.cjs +149 -0
  51. package/dist/locales/sv.d.cts +96 -0
  52. package/dist/locales/sv.d.ts +96 -0
  53. package/dist/locales/th.cjs +149 -0
  54. package/dist/locales/th.d.cts +96 -0
  55. package/dist/locales/th.d.ts +96 -0
  56. package/dist/server/index.cjs +445 -314
  57. package/dist/server/index.d.cts +24 -0
  58. package/dist/server/index.d.ts +24 -0
  59. package/dist/server/index.js +445 -314
  60. package/dist/styles.css +1 -0
  61. package/dist/styles.layer.css +1 -0
  62. package/package.json +35 -3
  63. package/scripts/aura-icons-codemod.mjs +345 -0
@@ -0,0 +1,106 @@
1
+ import * as React$1 from 'react';
2
+
3
+ /** An AURA icon name, or any icon element (e.g. `<Building />` from lucide-react). AURA sizes it and hides it from screen readers. */
4
+ export type IconInput = IconName | React$1.ReactElement;
5
+ export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor" | "panel-left-close" | "panel-left-open" | "server" | "globe" | "activity" | "shield-alert" | "phone" | "wrench";
6
+ /** Lucide stroke icon drawn inline in currentColor. */
7
+ export interface IconProps {
8
+ /** A name from the set, or an icon element of your own (sized and styled the same way). */
9
+ name: IconInput;
10
+ /** `sm` 16 (default) · `md` 20 · `lg` 24, or a px number. */
11
+ size?: "sm" | "md" | "lg" | number | undefined;
12
+ /** Accessible name. Omit for decorative icons next to a text label (then aria-hidden). */
13
+ label?: string | undefined;
14
+ /** Default 2 (Lucide's). */
15
+ strokeWidth?: number | undefined;
16
+ className?: string | undefined;
17
+ }
18
+ /** One SVG child: element name and its attributes. */
19
+ export type IconShape = [
20
+ string,
21
+ Record<string, string>
22
+ ];
23
+ /** An AURA icon component from `@jirawatpyk/aura-react/icons` (5.9), e.g. `IconUsers`. */
24
+ export type AuraIcon = React$1.ForwardRefExoticComponent<Omit<IconProps, "name"> & React$1.RefAttributes<SVGSVGElement>> & {
25
+ /** The icon's path data. */
26
+ readonly auraShapes: IconShape[];
27
+ /** Its name in the set, e.g. `users`. */
28
+ readonly iconName: string;
29
+ };
30
+ /** Makes an icon component from path data (24×24, stroked in currentColor, like Lucide). The per-icon exports are
31
+ * built with it; use it for an icon of your own that should look and behave exactly like AURA's. */
32
+ export declare function defineIcon(name: string, shapes: IconShape[]): AuraIcon;
33
+ export declare const IconCheck: AuraIcon;
34
+ export declare const IconX: AuraIcon;
35
+ export declare const IconPlus: AuraIcon;
36
+ export declare const IconMinus: AuraIcon;
37
+ export declare const IconSearch: AuraIcon;
38
+ export declare const IconChevronDown: AuraIcon;
39
+ export declare const IconChevronUp: AuraIcon;
40
+ export declare const IconChevronLeft: AuraIcon;
41
+ export declare const IconChevronRight: AuraIcon;
42
+ export declare const IconArrowRight: AuraIcon;
43
+ export declare const IconArrowUpRight: AuraIcon;
44
+ export declare const IconArrowUpDown: AuraIcon;
45
+ export declare const IconLoaderCircle: AuraIcon;
46
+ export declare const IconCircleAlert: AuraIcon;
47
+ export declare const IconCircleCheck: AuraIcon;
48
+ export declare const IconInfo: AuraIcon;
49
+ export declare const IconTriangleAlert: AuraIcon;
50
+ export declare const IconSettings: AuraIcon;
51
+ export declare const IconUser: AuraIcon;
52
+ export declare const IconUsers: AuraIcon;
53
+ export declare const IconFilter: AuraIcon;
54
+ export declare const IconEllipsis: AuraIcon;
55
+ export declare const IconExternalLink: AuraIcon;
56
+ export declare const IconCopy: AuraIcon;
57
+ export declare const IconTrash2: AuraIcon;
58
+ export declare const IconPencil: AuraIcon;
59
+ export declare const IconDownload: AuraIcon;
60
+ export declare const IconUpload: AuraIcon;
61
+ export declare const IconCalendar: AuraIcon;
62
+ export declare const IconBell: AuraIcon;
63
+ export declare const IconMenu: AuraIcon;
64
+ export declare const IconEye: AuraIcon;
65
+ export declare const IconLogOut: AuraIcon;
66
+ export declare const IconCircle: AuraIcon;
67
+ export declare const IconCircleDotDashed: AuraIcon;
68
+ export declare const IconBan: AuraIcon;
69
+ export declare const IconArrowUp: AuraIcon;
70
+ export declare const IconArrowDown: AuraIcon;
71
+ export declare const IconInbox: AuraIcon;
72
+ export declare const IconPin: AuraIcon;
73
+ export declare const IconPinOff: AuraIcon;
74
+ export declare const IconEyeOff: AuraIcon;
75
+ export declare const IconColumns3: AuraIcon;
76
+ export declare const IconArrowLeft: AuraIcon;
77
+ export declare const IconRotateCcw: AuraIcon;
78
+ export declare const IconHouse: AuraIcon;
79
+ export declare const IconLayoutDashboard: AuraIcon;
80
+ export declare const IconFolder: AuraIcon;
81
+ export declare const IconChartColumn: AuraIcon;
82
+ export declare const IconFileText: AuraIcon;
83
+ export declare const IconMail: AuraIcon;
84
+ export declare const IconLock: AuraIcon;
85
+ export declare const IconClock: AuraIcon;
86
+ export declare const IconTrendingUp: AuraIcon;
87
+ export declare const IconTrendingDown: AuraIcon;
88
+ export declare const IconImage: AuraIcon;
89
+ export declare const IconPaperclip: AuraIcon;
90
+ export declare const IconCloudUpload: AuraIcon;
91
+ export declare const IconFile: AuraIcon;
92
+ export declare const IconSun: AuraIcon;
93
+ export declare const IconMoon: AuraIcon;
94
+ export declare const IconMonitor: AuraIcon;
95
+ export declare const IconPanelLeftClose: AuraIcon;
96
+ export declare const IconPanelLeftOpen: AuraIcon;
97
+ export declare const IconServer: AuraIcon;
98
+ export declare const IconGlobe: AuraIcon;
99
+ export declare const IconActivity: AuraIcon;
100
+ export declare const IconShieldAlert: AuraIcon;
101
+ export declare const IconPhone: AuraIcon;
102
+ export declare const IconWrench: AuraIcon;
103
+ /** Every icon — what `registerIcons(allIcons)` takes to keep icon names as strings working in 6.0. */
104
+ export declare const allIcons: AuraIcon[];
105
+
106
+ export {};
@@ -0,0 +1,106 @@
1
+ import * as React$1 from 'react';
2
+
3
+ /** An AURA icon name, or any icon element (e.g. `<Building />` from lucide-react). AURA sizes it and hides it from screen readers. */
4
+ export type IconInput = IconName | React$1.ReactElement;
5
+ export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor" | "panel-left-close" | "panel-left-open" | "server" | "globe" | "activity" | "shield-alert" | "phone" | "wrench";
6
+ /** Lucide stroke icon drawn inline in currentColor. */
7
+ export interface IconProps {
8
+ /** A name from the set, or an icon element of your own (sized and styled the same way). */
9
+ name: IconInput;
10
+ /** `sm` 16 (default) · `md` 20 · `lg` 24, or a px number. */
11
+ size?: "sm" | "md" | "lg" | number | undefined;
12
+ /** Accessible name. Omit for decorative icons next to a text label (then aria-hidden). */
13
+ label?: string | undefined;
14
+ /** Default 2 (Lucide's). */
15
+ strokeWidth?: number | undefined;
16
+ className?: string | undefined;
17
+ }
18
+ /** One SVG child: element name and its attributes. */
19
+ export type IconShape = [
20
+ string,
21
+ Record<string, string>
22
+ ];
23
+ /** An AURA icon component from `@jirawatpyk/aura-react/icons` (5.9), e.g. `IconUsers`. */
24
+ export type AuraIcon = React$1.ForwardRefExoticComponent<Omit<IconProps, "name"> & React$1.RefAttributes<SVGSVGElement>> & {
25
+ /** The icon's path data. */
26
+ readonly auraShapes: IconShape[];
27
+ /** Its name in the set, e.g. `users`. */
28
+ readonly iconName: string;
29
+ };
30
+ /** Makes an icon component from path data (24×24, stroked in currentColor, like Lucide). The per-icon exports are
31
+ * built with it; use it for an icon of your own that should look and behave exactly like AURA's. */
32
+ export declare function defineIcon(name: string, shapes: IconShape[]): AuraIcon;
33
+ export declare const IconCheck: AuraIcon;
34
+ export declare const IconX: AuraIcon;
35
+ export declare const IconPlus: AuraIcon;
36
+ export declare const IconMinus: AuraIcon;
37
+ export declare const IconSearch: AuraIcon;
38
+ export declare const IconChevronDown: AuraIcon;
39
+ export declare const IconChevronUp: AuraIcon;
40
+ export declare const IconChevronLeft: AuraIcon;
41
+ export declare const IconChevronRight: AuraIcon;
42
+ export declare const IconArrowRight: AuraIcon;
43
+ export declare const IconArrowUpRight: AuraIcon;
44
+ export declare const IconArrowUpDown: AuraIcon;
45
+ export declare const IconLoaderCircle: AuraIcon;
46
+ export declare const IconCircleAlert: AuraIcon;
47
+ export declare const IconCircleCheck: AuraIcon;
48
+ export declare const IconInfo: AuraIcon;
49
+ export declare const IconTriangleAlert: AuraIcon;
50
+ export declare const IconSettings: AuraIcon;
51
+ export declare const IconUser: AuraIcon;
52
+ export declare const IconUsers: AuraIcon;
53
+ export declare const IconFilter: AuraIcon;
54
+ export declare const IconEllipsis: AuraIcon;
55
+ export declare const IconExternalLink: AuraIcon;
56
+ export declare const IconCopy: AuraIcon;
57
+ export declare const IconTrash2: AuraIcon;
58
+ export declare const IconPencil: AuraIcon;
59
+ export declare const IconDownload: AuraIcon;
60
+ export declare const IconUpload: AuraIcon;
61
+ export declare const IconCalendar: AuraIcon;
62
+ export declare const IconBell: AuraIcon;
63
+ export declare const IconMenu: AuraIcon;
64
+ export declare const IconEye: AuraIcon;
65
+ export declare const IconLogOut: AuraIcon;
66
+ export declare const IconCircle: AuraIcon;
67
+ export declare const IconCircleDotDashed: AuraIcon;
68
+ export declare const IconBan: AuraIcon;
69
+ export declare const IconArrowUp: AuraIcon;
70
+ export declare const IconArrowDown: AuraIcon;
71
+ export declare const IconInbox: AuraIcon;
72
+ export declare const IconPin: AuraIcon;
73
+ export declare const IconPinOff: AuraIcon;
74
+ export declare const IconEyeOff: AuraIcon;
75
+ export declare const IconColumns3: AuraIcon;
76
+ export declare const IconArrowLeft: AuraIcon;
77
+ export declare const IconRotateCcw: AuraIcon;
78
+ export declare const IconHouse: AuraIcon;
79
+ export declare const IconLayoutDashboard: AuraIcon;
80
+ export declare const IconFolder: AuraIcon;
81
+ export declare const IconChartColumn: AuraIcon;
82
+ export declare const IconFileText: AuraIcon;
83
+ export declare const IconMail: AuraIcon;
84
+ export declare const IconLock: AuraIcon;
85
+ export declare const IconClock: AuraIcon;
86
+ export declare const IconTrendingUp: AuraIcon;
87
+ export declare const IconTrendingDown: AuraIcon;
88
+ export declare const IconImage: AuraIcon;
89
+ export declare const IconPaperclip: AuraIcon;
90
+ export declare const IconCloudUpload: AuraIcon;
91
+ export declare const IconFile: AuraIcon;
92
+ export declare const IconSun: AuraIcon;
93
+ export declare const IconMoon: AuraIcon;
94
+ export declare const IconMonitor: AuraIcon;
95
+ export declare const IconPanelLeftClose: AuraIcon;
96
+ export declare const IconPanelLeftOpen: AuraIcon;
97
+ export declare const IconServer: AuraIcon;
98
+ export declare const IconGlobe: AuraIcon;
99
+ export declare const IconActivity: AuraIcon;
100
+ export declare const IconShieldAlert: AuraIcon;
101
+ export declare const IconPhone: AuraIcon;
102
+ export declare const IconWrench: AuraIcon;
103
+ /** Every icon — what `registerIcons(allIcons)` takes to keep icon names as strings working in 6.0. */
104
+ export declare const allIcons: AuraIcon[];
105
+
106
+ export {};
package/dist/index.d.cts CHANGED
@@ -223,7 +223,7 @@ export interface AuraProviderProps {
223
223
  locale?: "th" | "en" | "sv" | undefined;
224
224
  /** Default calendar for DatePicker / DateRangePicker / Calendar / formatDate callers that read it. Unset: `buddhist` (พ.ศ.) for `th`, `gregory` for `en` and `sv`. */
225
225
  calendar?: "buddhist" | "gregory" | undefined;
226
- /** Override individual strings. */
226
+ /** Override individual strings, or pass a whole locale pack (`strings={th}` from `@jirawatpyk/aura-react/locales/th`, 5.9). */
227
227
  strings?: Partial<Record<string, string | ((...args: any[]) => string)>> | undefined;
228
228
  /** IANA time zone for "today" in DatePicker, DateRangePicker and Calendar, e.g. `Asia/Bangkok` (4.19). Default: the browser's. */
229
229
  timeZone?: string | undefined;
@@ -596,6 +596,9 @@ export interface TabItem {
596
596
  /** A route (4.19). When every tab has one, Tabs renders a `nav` of links (section tabs that are pages), with
597
597
  * `aria-current="page"` on the current one and no panels. */
598
598
  href?: string | undefined;
599
+ /** Attributes for this tab's button (or link): `data-testid`, or an `aria-label` that starts with the visible
600
+ * label ("Card — switch payment method") so voice control still finds it (WCAG 2.5.3). (5.9, Chamber-OS 71) */
601
+ tabProps?: ButtonAttributes | undefined;
599
602
  }
600
603
  export interface TabsProps {
601
604
  tabs: TabItem[];
@@ -608,6 +611,12 @@ export interface TabsProps {
608
611
  /** Router link for tabs with `href`; defaults to AuraProvider's `linkComponent`, then `<a>`. (4.19) */
609
612
  linkComponent?: React$1.ElementType | undefined;
610
613
  className?: string | undefined;
614
+ /** Keep every panel mounted, the inactive ones `hidden`, so their state survives a switch (a payment iframe, a
615
+ * half-filled form). Default false: only the active panel is rendered. (5.9, Chamber-OS 71) */
616
+ keepMounted?: boolean | undefined;
617
+ /** `auto` (default): arrow keys select as they move. `manual`: arrows, Home and End only move focus; Enter, Space
618
+ * or a click selects — for tabs whose selection does work (loads data, starts a payment). (5.9) */
619
+ activation?: "auto" | "manual" | undefined;
611
620
  }
612
621
  export interface NavItem {
613
622
  id: string;
@@ -870,7 +879,14 @@ export interface DateRangePickerProps extends DateFieldProps {
870
879
  defaultValue?: DateRange | undefined;
871
880
  onChange?: ((value: DateRange) => void) | undefined;
872
881
  }
873
- export interface DrawerProps {
882
+ /** `data-*` attributes in an object prop (TypeScript checks object literals, where JSX would allow them anyway). */
883
+ export type DataAttributes = {
884
+ [key: `data-${string}`]: string | number | boolean | undefined;
885
+ };
886
+ /** Attributes for a button AURA renders for you (a Drawer's close button, a tab): `data-testid`, `aria-*`, `id`… */
887
+ export type ButtonAttributes = React$1.ButtonHTMLAttributes<HTMLButtonElement> & DataAttributes;
888
+ /** `id`, `data-*`, `aria-*`, `style`, `lang` and `dir` go on the `.aura-drawer` panel (5.9, Chamber-OS 70). */
889
+ export interface DrawerProps extends Pick<React$1.HTMLAttributes<HTMLDivElement>, "id" | "style" | "lang" | "dir">, React$1.AriaAttributes, DataAttributes {
874
890
  open: boolean;
875
891
  onClose: () => void;
876
892
  /** Default `right`. */
@@ -891,6 +907,11 @@ export interface DrawerProps {
891
907
  /** Needed when there is no title. */
892
908
  "aria-label"?: string | undefined;
893
909
  className?: string | undefined;
910
+ /** The close button's accessible name and tooltip, saying what it closes ("Close payment drawer"). Default: the
911
+ * built-in "Close" in the provider's language. (5.9) */
912
+ closeLabel?: string | undefined;
913
+ /** Attributes for the close button, e.g. `{ 'data-testid': 'pay-sheet-close' }`. (5.9) */
914
+ closeProps?: ButtonAttributes | undefined;
894
915
  }
895
916
  export type Breakpoint = "base" | "sm" | "md" | "lg" | "xl";
896
917
  export type Responsive<T> = T | Partial<Record<Breakpoint, T>>;
@@ -1247,7 +1268,22 @@ export type IconShape = [
1247
1268
  string,
1248
1269
  Record<string, string>
1249
1270
  ];
1271
+ /** An AURA icon component from `@jirawatpyk/aura-react/icons` (5.9), e.g. `IconUsers`. */
1272
+ export type AuraIcon = React$1.ForwardRefExoticComponent<Omit<IconProps, "name"> & React$1.RefAttributes<SVGSVGElement>> & {
1273
+ /** The icon's path data. */
1274
+ readonly auraShapes: IconShape[];
1275
+ /** Its name in the set, e.g. `users`. */
1276
+ readonly iconName: string;
1277
+ };
1278
+ /** @deprecated 5.9 — path data by name. In 6.0 it is removed; use the per-icon components or `allIcons` from
1279
+ * `@jirawatpyk/aura-react/icons`. */
1250
1280
  export declare const ICONS: Record<IconName, IconShape[]>;
1281
+ /** Makes icon names as strings work: `registerIcons(allIcons)` once at startup, with `allIcons` from
1282
+ * `@jirawatpyk/aura-react/icons`, or only the icons you use (`registerIcons([IconUsers, IconPlus])`). In 5.x every
1283
+ * name already works and this only says you are ready for 6.0 (it silences the notice); in 6.0 it is required. Call it in the module
1284
+ * graph that renders the names: a client module for the components, and also a server module if Server Components
1285
+ * render names with `/server`'s Icon (the two entries keep separate registries). */
1286
+ export declare function registerIcons(icons: readonly AuraIcon[]): void;
1251
1287
  export declare const Icon: React$1.ForwardRefExoticComponent<IconProps & React$1.RefAttributes<SVGSVGElement>>;
1252
1288
  /** Every icon name the bundle carries. */
1253
1289
  export declare const iconNames: IconName[];
@@ -1509,6 +1545,12 @@ export interface AuraStrings {
1509
1545
  pageN: (p: number) => string;
1510
1546
  accepts: (list?: string, max?: number | string) => string;
1511
1547
  }
1548
+ /** Built-in strings by locale. th and sv also ship as packs (`@jirawatpyk/aura-react/locales/th`, `/sv`, 5.9); in 6.0
1549
+ * only en stays built in and a Thai or Swedish app passes its pack to AuraProvider `strings`. */
1550
+ /** A whole language for AuraProvider `strings` (5.9): every built-in label, and assignable to the prop. */
1551
+ export type AuraLocalePack = AuraStrings & {
1552
+ [key: string]: string | ((...args: any[]) => string);
1553
+ };
1512
1554
  export declare const STRINGS: {
1513
1555
  en: AuraStrings;
1514
1556
  th: AuraStrings;
package/dist/index.d.ts CHANGED
@@ -223,7 +223,7 @@ export interface AuraProviderProps {
223
223
  locale?: "th" | "en" | "sv" | undefined;
224
224
  /** Default calendar for DatePicker / DateRangePicker / Calendar / formatDate callers that read it. Unset: `buddhist` (พ.ศ.) for `th`, `gregory` for `en` and `sv`. */
225
225
  calendar?: "buddhist" | "gregory" | undefined;
226
- /** Override individual strings. */
226
+ /** Override individual strings, or pass a whole locale pack (`strings={th}` from `@jirawatpyk/aura-react/locales/th`, 5.9). */
227
227
  strings?: Partial<Record<string, string | ((...args: any[]) => string)>> | undefined;
228
228
  /** IANA time zone for "today" in DatePicker, DateRangePicker and Calendar, e.g. `Asia/Bangkok` (4.19). Default: the browser's. */
229
229
  timeZone?: string | undefined;
@@ -596,6 +596,9 @@ export interface TabItem {
596
596
  /** A route (4.19). When every tab has one, Tabs renders a `nav` of links (section tabs that are pages), with
597
597
  * `aria-current="page"` on the current one and no panels. */
598
598
  href?: string | undefined;
599
+ /** Attributes for this tab's button (or link): `data-testid`, or an `aria-label` that starts with the visible
600
+ * label ("Card — switch payment method") so voice control still finds it (WCAG 2.5.3). (5.9, Chamber-OS 71) */
601
+ tabProps?: ButtonAttributes | undefined;
599
602
  }
600
603
  export interface TabsProps {
601
604
  tabs: TabItem[];
@@ -608,6 +611,12 @@ export interface TabsProps {
608
611
  /** Router link for tabs with `href`; defaults to AuraProvider's `linkComponent`, then `<a>`. (4.19) */
609
612
  linkComponent?: React$1.ElementType | undefined;
610
613
  className?: string | undefined;
614
+ /** Keep every panel mounted, the inactive ones `hidden`, so their state survives a switch (a payment iframe, a
615
+ * half-filled form). Default false: only the active panel is rendered. (5.9, Chamber-OS 71) */
616
+ keepMounted?: boolean | undefined;
617
+ /** `auto` (default): arrow keys select as they move. `manual`: arrows, Home and End only move focus; Enter, Space
618
+ * or a click selects — for tabs whose selection does work (loads data, starts a payment). (5.9) */
619
+ activation?: "auto" | "manual" | undefined;
611
620
  }
612
621
  export interface NavItem {
613
622
  id: string;
@@ -870,7 +879,14 @@ export interface DateRangePickerProps extends DateFieldProps {
870
879
  defaultValue?: DateRange | undefined;
871
880
  onChange?: ((value: DateRange) => void) | undefined;
872
881
  }
873
- export interface DrawerProps {
882
+ /** `data-*` attributes in an object prop (TypeScript checks object literals, where JSX would allow them anyway). */
883
+ export type DataAttributes = {
884
+ [key: `data-${string}`]: string | number | boolean | undefined;
885
+ };
886
+ /** Attributes for a button AURA renders for you (a Drawer's close button, a tab): `data-testid`, `aria-*`, `id`… */
887
+ export type ButtonAttributes = React$1.ButtonHTMLAttributes<HTMLButtonElement> & DataAttributes;
888
+ /** `id`, `data-*`, `aria-*`, `style`, `lang` and `dir` go on the `.aura-drawer` panel (5.9, Chamber-OS 70). */
889
+ export interface DrawerProps extends Pick<React$1.HTMLAttributes<HTMLDivElement>, "id" | "style" | "lang" | "dir">, React$1.AriaAttributes, DataAttributes {
874
890
  open: boolean;
875
891
  onClose: () => void;
876
892
  /** Default `right`. */
@@ -891,6 +907,11 @@ export interface DrawerProps {
891
907
  /** Needed when there is no title. */
892
908
  "aria-label"?: string | undefined;
893
909
  className?: string | undefined;
910
+ /** The close button's accessible name and tooltip, saying what it closes ("Close payment drawer"). Default: the
911
+ * built-in "Close" in the provider's language. (5.9) */
912
+ closeLabel?: string | undefined;
913
+ /** Attributes for the close button, e.g. `{ 'data-testid': 'pay-sheet-close' }`. (5.9) */
914
+ closeProps?: ButtonAttributes | undefined;
894
915
  }
895
916
  export type Breakpoint = "base" | "sm" | "md" | "lg" | "xl";
896
917
  export type Responsive<T> = T | Partial<Record<Breakpoint, T>>;
@@ -1247,7 +1268,22 @@ export type IconShape = [
1247
1268
  string,
1248
1269
  Record<string, string>
1249
1270
  ];
1271
+ /** An AURA icon component from `@jirawatpyk/aura-react/icons` (5.9), e.g. `IconUsers`. */
1272
+ export type AuraIcon = React$1.ForwardRefExoticComponent<Omit<IconProps, "name"> & React$1.RefAttributes<SVGSVGElement>> & {
1273
+ /** The icon's path data. */
1274
+ readonly auraShapes: IconShape[];
1275
+ /** Its name in the set, e.g. `users`. */
1276
+ readonly iconName: string;
1277
+ };
1278
+ /** @deprecated 5.9 — path data by name. In 6.0 it is removed; use the per-icon components or `allIcons` from
1279
+ * `@jirawatpyk/aura-react/icons`. */
1250
1280
  export declare const ICONS: Record<IconName, IconShape[]>;
1281
+ /** Makes icon names as strings work: `registerIcons(allIcons)` once at startup, with `allIcons` from
1282
+ * `@jirawatpyk/aura-react/icons`, or only the icons you use (`registerIcons([IconUsers, IconPlus])`). In 5.x every
1283
+ * name already works and this only says you are ready for 6.0 (it silences the notice); in 6.0 it is required. Call it in the module
1284
+ * graph that renders the names: a client module for the components, and also a server module if Server Components
1285
+ * render names with `/server`'s Icon (the two entries keep separate registries). */
1286
+ export declare function registerIcons(icons: readonly AuraIcon[]): void;
1251
1287
  export declare const Icon: React$1.ForwardRefExoticComponent<IconProps & React$1.RefAttributes<SVGSVGElement>>;
1252
1288
  /** Every icon name the bundle carries. */
1253
1289
  export declare const iconNames: IconName[];
@@ -1509,6 +1545,12 @@ export interface AuraStrings {
1509
1545
  pageN: (p: number) => string;
1510
1546
  accepts: (list?: string, max?: number | string) => string;
1511
1547
  }
1548
+ /** Built-in strings by locale. th and sv also ship as packs (`@jirawatpyk/aura-react/locales/th`, `/sv`, 5.9); in 6.0
1549
+ * only en stays built in and a Thai or Swedish app passes its pack to AuraProvider `strings`. */
1550
+ /** A whole language for AuraProvider `strings` (5.9): every built-in label, and assignable to the prop. */
1551
+ export type AuraLocalePack = AuraStrings & {
1552
+ [key: string]: string | ((...args: any[]) => string);
1553
+ };
1512
1554
  export declare const STRINGS: {
1513
1555
  en: AuraStrings;
1514
1556
  th: AuraStrings;
@@ -0,0 +1,149 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/strings.sv.ts
21
+ var strings_sv_exports = {};
22
+ __export(strings_sv_exports, {
23
+ sv: () => sv
24
+ });
25
+ module.exports = __toCommonJS(strings_sv_exports);
26
+ var nsv = function(x) {
27
+ return Number(x).toLocaleString("sv-SE");
28
+ };
29
+ var sv = {
30
+ close: "St\xE4ng",
31
+ dismiss: "St\xE4ng",
32
+ dismissToast: "St\xE4ng aviseringen",
33
+ showPassword: "Visa l\xF6senord",
34
+ filters: "Filter",
35
+ search: "S\xF6k",
36
+ clearFilters: "Rensa alla",
37
+ results: function(n) {
38
+ return n === 1 ? "1 tr\xE4ff" : n.toLocaleString("sv-SE") + " tr\xE4ffar";
39
+ },
40
+ commandMenu: "Kommandomeny",
41
+ commandPlaceholder: "Skriv ett kommando eller s\xF6k\u2026",
42
+ commandHint: "\u2191\u2193 flytta \xB7 Enter \xF6ppna \xB7 Esc st\xE4ng",
43
+ errorSummary: function(n) {
44
+ return n === 1 ? "R\xE4tta 1 f\xE4lt f\xF6r att forts\xE4tta" : "R\xE4tta " + n + " f\xE4lt f\xF6r att forts\xE4tta";
45
+ },
46
+ notifications: "Aviseringar",
47
+ mainNav: "Huvudmeny",
48
+ breadcrumb: "Br\xF6dsmulor",
49
+ navigation: "Navigering",
50
+ openNav: "\xD6ppna menyn",
51
+ collapseNav: "F\xE4ll ihop sidof\xE4ltet",
52
+ expandNav: "F\xE4ll ut sidof\xE4ltet",
53
+ searching: "S\xF6ker\u2026",
54
+ noMatches: "Inga tr\xE4ffar",
55
+ clear: function(what) {
56
+ return "Rensa " + (what || "urvalet");
57
+ },
58
+ keepTyping: function(total) {
59
+ return "Skriv mer f\xF6r att begr\xE4nsa " + nsv(total) + " alternativ";
60
+ },
61
+ sortAsc: "Sortera stigande",
62
+ sortDesc: "Sortera fallande",
63
+ pin: "F\xE4st till v\xE4nster",
64
+ unpin: "Lossa kolumnen",
65
+ moveLeft: "Flytta v\xE4nster",
66
+ moveRight: "Flytta h\xF6ger",
67
+ hideColumn: "D\xF6lj kolumnen",
68
+ resetColumns: "\xC5terst\xE4ll kolumner",
69
+ selectRows: "V\xE4lj rader",
70
+ selectAllRows: "V\xE4lj alla rader",
71
+ deselectAllRows: "Avmarkera alla rader",
72
+ selectAll: "V\xE4lj alla",
73
+ selectRow: function(k) {
74
+ return "V\xE4lj " + k;
75
+ },
76
+ selectedCount: function(c) {
77
+ return nsv(c) + " valda";
78
+ },
79
+ pinned: "F\xE4st",
80
+ columnOptions: function(label) {
81
+ return "Alternativ f\xF6r kolumnen " + label;
82
+ },
83
+ column: function(label) {
84
+ return label ? "Kolumnen " + label : "Kolumn";
85
+ },
86
+ columns: "Kolumner",
87
+ showHideColumns: "Visa eller d\xF6lj kolumner",
88
+ empty: "Inget h\xE4r \xE4nnu",
89
+ loading: "Laddar\u2026",
90
+ loadingRows: "Laddar rader",
91
+ range: function(a, b, total) {
92
+ return a + "\u2013" + b + " av " + nsv(total);
93
+ },
94
+ page: function(p, total) {
95
+ return "Sida " + p + " av " + total;
96
+ },
97
+ rangeOpen: function(a, b) {
98
+ return a + "\u2013" + b + " av m\xE5nga";
99
+ },
100
+ pageOpen: function(p) {
101
+ return "Sida " + p;
102
+ },
103
+ prevPage: "F\xF6reg\xE5ende sida",
104
+ nextPage: "N\xE4sta sida",
105
+ totals: "Summa",
106
+ rowCount: function(c) {
107
+ return nsv(c) + " rader";
108
+ },
109
+ actions: "\xC5tg\xE4rder",
110
+ optional: "valfritt",
111
+ timePlaceholder: "tt:mm",
112
+ timeInvalid: "Skriv en tid som 09:30",
113
+ timeOutOfRange: function(a, b) {
114
+ return "V\xE4lj en tid mellan " + a + " och " + b;
115
+ },
116
+ timeUnavailable: "Den tiden \xE4r inte ledig. V\xE4lj en annan.",
117
+ dropFiles: "Dra filer hit eller",
118
+ browse: "V\xE4lj filer",
119
+ browseOne: "V\xE4lj en fil",
120
+ remove: function(n) {
121
+ return "Ta bort " + n;
122
+ },
123
+ fileTooBig: function(max) {
124
+ return "St\xF6rre \xE4n " + max;
125
+ },
126
+ fileWrongType: "Den h\xE4r filtypen godtas inte",
127
+ tooManyFiles: function(n) {
128
+ return "H\xF6gst " + n + " filer";
129
+ },
130
+ colorScheme: "F\xE4rgl\xE4ge",
131
+ increase: "\xD6ka",
132
+ decrease: "Minska",
133
+ stepDone: "klart",
134
+ stepOf: function(i, total) {
135
+ return "Steg " + i + " av " + total;
136
+ },
137
+ schemeLight: "Ljust",
138
+ schemeDark: "M\xF6rkt",
139
+ schemeSystem: "System",
140
+ uploading: "Laddar upp\u2026",
141
+ images: "Bilder",
142
+ pagination: "Sidnumrering",
143
+ pageN: function(p) {
144
+ return "Sida " + p;
145
+ },
146
+ accepts: function(list, max) {
147
+ return [list, max && "h\xF6gst " + max + " per fil"].filter(Boolean).join(", ");
148
+ }
149
+ };
@@ -0,0 +1,96 @@
1
+ import * as React$1 from 'react';
2
+
3
+ /** Every built-in label. Function entries build the text from their arguments. */
4
+ export interface AuraStrings {
5
+ close: string;
6
+ dismiss: string;
7
+ dismissToast: string;
8
+ showPassword: string;
9
+ filters: string;
10
+ search: string;
11
+ clearFilters: string;
12
+ results: (n: number) => string;
13
+ commandMenu: string;
14
+ commandPlaceholder: string;
15
+ commandHint: string;
16
+ errorSummary: (n: number) => string;
17
+ notifications: string;
18
+ mainNav: string;
19
+ breadcrumb: string;
20
+ navigation: string;
21
+ openNav: string;
22
+ collapseNav: string;
23
+ expandNav: string;
24
+ searching: string;
25
+ noMatches: string;
26
+ clear: (what?: string) => string;
27
+ keepTyping: (total: number) => string;
28
+ sortAsc: string;
29
+ sortDesc: string;
30
+ pin: string;
31
+ unpin: string;
32
+ moveLeft: string;
33
+ moveRight: string;
34
+ hideColumn: string;
35
+ resetColumns: string;
36
+ selectRows: string;
37
+ selectAllRows: string;
38
+ deselectAllRows: string;
39
+ selectAll: string;
40
+ selectRow: (k: React$1.ReactNode) => string;
41
+ selectedCount: (c: number) => string;
42
+ pinned: string;
43
+ columnOptions: (label?: string) => string;
44
+ column: (label?: string) => string;
45
+ columns: string;
46
+ showHideColumns: string;
47
+ empty: string;
48
+ loading: string;
49
+ loadingRows: string;
50
+ range: (a: number | string, b: number | string, total: number) => string;
51
+ page: (p: number, total: number) => string;
52
+ /** Server paging without totalRows (5.2): the range and page when the total isn't known. */
53
+ rangeOpen: (a: number | string, b: number | string) => string;
54
+ pageOpen: (p: number) => string;
55
+ prevPage: string;
56
+ nextPage: string;
57
+ rowCount: (c: number) => string;
58
+ totals: string;
59
+ actions: string;
60
+ optional: string;
61
+ timePlaceholder: string;
62
+ timeInvalid: string;
63
+ timeOutOfRange: (a: number | string, b: number | string) => string;
64
+ /** A time inside the range that isTimeDisabled refuses (5.2). */
65
+ timeUnavailable: string;
66
+ dropFiles: string;
67
+ browse: string;
68
+ browseOne: string;
69
+ remove: (n: number | string) => string;
70
+ fileTooBig: (max?: number | string) => string;
71
+ fileWrongType: string;
72
+ tooManyFiles: (n: number | string) => string;
73
+ colorScheme: string;
74
+ increase: string;
75
+ decrease: string;
76
+ stepDone: string;
77
+ stepOf: (i: number, total: number) => string;
78
+ schemeLight: string;
79
+ schemeDark: string;
80
+ schemeSystem: string;
81
+ uploading: string;
82
+ images: string;
83
+ pagination: string;
84
+ pageN: (p: number) => string;
85
+ accepts: (list?: string, max?: number | string) => string;
86
+ }
87
+ /** Built-in strings by locale. th and sv also ship as packs (`@jirawatpyk/aura-react/locales/th`, `/sv`, 5.9); in 6.0
88
+ * only en stays built in and a Thai or Swedish app passes its pack to AuraProvider `strings`. */
89
+ /** A whole language for AuraProvider `strings` (5.9): every built-in label, and assignable to the prop. */
90
+ export type AuraLocalePack = AuraStrings & {
91
+ [key: string]: string | ((...args: any[]) => string);
92
+ };
93
+ /** Swedish built-in labels: `<AuraProvider locale="sv" strings={sv}>`. */
94
+ export declare const sv: AuraLocalePack;
95
+
96
+ export {};