@common-origin/design-system 2.15.0 → 2.17.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 (53) hide show
  1. package/README.md +1 -1
  2. package/dist/client.esm.js +949 -649
  3. package/dist/client.esm.js.map +1 -1
  4. package/dist/client.js +951 -647
  5. package/dist/client.js.map +1 -1
  6. package/dist/components/atoms/Button/Button.d.ts +13 -1
  7. package/dist/components/atoms/CategoryBadge/CategoryBadge.d.ts +12 -52
  8. package/dist/components/atoms/CategoryBadge/index.d.ts +1 -1
  9. package/dist/components/atoms/CategoryLabel/CategoryLabel.d.ts +69 -0
  10. package/dist/components/atoms/CategoryLabel/index.d.ts +2 -0
  11. package/dist/components/atoms/Chip/BooleanChip.d.ts +6 -1
  12. package/dist/components/atoms/Chip/Chip.d.ts +17 -12
  13. package/dist/components/atoms/Chip/FilterChip.d.ts +10 -24
  14. package/dist/components/atoms/Chip/InputChip.d.ts +27 -0
  15. package/dist/components/atoms/Chip/index.d.ts +1 -0
  16. package/dist/components/atoms/Chip/shared/types.d.ts +15 -1
  17. package/dist/components/atoms/Chip/shared/utils.d.ts +1 -85
  18. package/dist/components/atoms/DateFormatter/DateFormatter.d.ts +11 -1
  19. package/dist/components/atoms/Icon/Icon.d.ts +11 -0
  20. package/dist/components/atoms/StatusBadge/StatusBadge.d.ts +9 -55
  21. package/dist/components/atoms/StatusBadge/index.d.ts +1 -1
  22. package/dist/components/atoms/StatusLabel/StatusLabel.d.ts +17 -0
  23. package/dist/components/atoms/StatusLabel/StatusLabelBase.d.ts +49 -0
  24. package/dist/components/atoms/StatusLabel/index.d.ts +2 -0
  25. package/dist/components/atoms/Tag/Tag.d.ts +5 -0
  26. package/dist/components/atoms/index.d.ts +2 -0
  27. package/dist/components/molecules/Alert/Alert.d.ts +15 -2
  28. package/dist/components/molecules/DateGroup/DateGroup.d.ts +4 -1
  29. package/dist/components/molecules/InlineAlert/InlineAlert.d.ts +54 -0
  30. package/dist/components/molecules/InlineAlert/index.d.ts +2 -0
  31. package/dist/components/molecules/List/List.d.ts +3 -2
  32. package/dist/components/molecules/List/ListContext.d.ts +6 -0
  33. package/dist/components/molecules/List/ListItem.d.ts +5 -4
  34. package/dist/components/molecules/Modal/Modal.d.ts +6 -2
  35. package/dist/components/molecules/TabBar/TabBar.d.ts +8 -5
  36. package/dist/components/molecules/index.d.ts +1 -0
  37. package/dist/data.esm.js +89 -11
  38. package/dist/data.esm.js.map +1 -1
  39. package/dist/data.js +89 -11
  40. package/dist/data.js.map +1 -1
  41. package/dist/index.esm.js +1 -1
  42. package/dist/index.js +4 -0
  43. package/dist/index.js.map +1 -1
  44. package/dist/styles/tokens.json +89 -11
  45. package/dist/tokens/index.esm.js +89 -11
  46. package/dist/tokens/index.esm.js.map +1 -1
  47. package/dist/tokens/index.js +89 -11
  48. package/dist/tokens/index.js.map +1 -1
  49. package/dist/tokens/types/tokens.d.ts +81 -3
  50. package/dist/tokens.css +769 -0
  51. package/dist/tokens.css.d.ts +4 -0
  52. package/dist/types/tokens.d.ts +81 -3
  53. package/package.json +18 -6
package/dist/data.js CHANGED
@@ -108,6 +108,7 @@ var base = {
108
108
  fit: "fit-content"
109
109
  },
110
110
  color: {
111
+ transparent: "transparent",
111
112
  neutral: {
112
113
  "100": "#f8f9fa",
113
114
  "200": "#e9ecef",
@@ -328,8 +329,7 @@ var base = {
328
329
  easeInBack: "cubic-bezier(0.36, 0, 0.66, -0.56)",
329
330
  easeOutBack: "cubic-bezier(0.34, 1.56, 0.64, 1)",
330
331
  easeInOutBack: "cubic-bezier(0.68, -0.6, 0.32, 1.6)"
331
- },
332
- $ref: "./base/index.json"
332
+ }
333
333
  };
334
334
  var component = {
335
335
  button: {
@@ -383,6 +383,20 @@ var component = {
383
383
  textColor: "#adb5bd"
384
384
  }
385
385
  },
386
+ accent: {
387
+ backgroundColor: "#0265DC",
388
+ textColor: "#ffffff",
389
+ hover: {
390
+ backgroundColor: "#0054B6"
391
+ },
392
+ active: {
393
+ backgroundColor: "#004491"
394
+ },
395
+ disabled: {
396
+ backgroundColor: "#dee2e6",
397
+ textColor: "#adb5bd"
398
+ }
399
+ },
386
400
  emphasis: {
387
401
  backgroundColor: "#0265DC",
388
402
  textColor: "#ffffff",
@@ -632,7 +646,7 @@ var component = {
632
646
  "default": {
633
647
  backgroundColor: "#ffffff",
634
648
  textColor: "#212529",
635
- borderColor: "#dee2e6",
649
+ borderColor: "#6c757d",
636
650
  borderRadius: "0.25rem",
637
651
  borderWidth: "0.0625rem",
638
652
  paddingY: "11px",
@@ -640,7 +654,7 @@ var component = {
640
654
  font: "400 1rem/1.5rem 'Inter', sans-serif"
641
655
  },
642
656
  placeholder: {
643
- textColor: "#adb5bd"
657
+ textColor: "#495057"
644
658
  },
645
659
  hover: {
646
660
  borderColor: "#343a40"
@@ -712,6 +726,42 @@ var component = {
712
726
  }
713
727
  },
714
728
  alert: {
729
+ severity: {
730
+ error: {
731
+ background: "#FFEBE7",
732
+ text: "#D31510"
733
+ },
734
+ warning: {
735
+ background: "#FFECCC",
736
+ text: "#B14C00"
737
+ },
738
+ info: {
739
+ background: "#E0F2FF",
740
+ text: "#0265DC"
741
+ },
742
+ success: {
743
+ background: "#CEF8E0",
744
+ text: "#007A4D"
745
+ }
746
+ },
747
+ appearance: {
748
+ outlined: {
749
+ borderColor: {
750
+ error: "#D31510",
751
+ warning: "#B14C00",
752
+ info: "#0265DC",
753
+ success: "#007A4D"
754
+ }
755
+ },
756
+ borderless: {
757
+ borderColor: {
758
+ error: "transparent",
759
+ warning: "transparent",
760
+ info: "transparent",
761
+ success: "transparent"
762
+ }
763
+ }
764
+ },
715
765
  title: {
716
766
  typography: "500 1.125rem/1.5rem 'Inter', sans-serif",
717
767
  fontWeight: "600",
@@ -810,8 +860,7 @@ var component = {
810
860
  },
811
861
  transactionListItem: {
812
862
  minHeight: "4.5rem"
813
- },
814
- $ref: "./component/index.json"
863
+ }
815
864
  };
816
865
  var semantic = {
817
866
  elevation: {
@@ -898,12 +947,20 @@ var semantic = {
898
947
  md: "35rem",
899
948
  lg: "45rem"
900
949
  },
950
+ label: {
951
+ small: "1.25rem",
952
+ medium: "1.5rem",
953
+ large: "2rem"
954
+ },
901
955
  menu: {
902
956
  maxHeight: "18.75rem"
903
957
  },
904
958
  dimension: {
905
959
  "1": "0.25rem",
960
+ "2": "0.5rem",
961
+ "4": "1rem",
906
962
  "5": "1.25rem",
963
+ "6": "1.5rem",
907
964
  "8": "2rem",
908
965
  "12": "3rem",
909
966
  "15": "3.75rem",
@@ -976,6 +1033,8 @@ var semantic = {
976
1033
  inverse: "#ffffff",
977
1034
  disabled: "#adb5bd",
978
1035
  interactive: "#0265DC",
1036
+ "interactive-hover": "#0054B6",
1037
+ "interactive-active": "#004491",
979
1038
  error: "#D31510",
980
1039
  success: "#007A4D",
981
1040
  warning: "#B14C00"
@@ -984,19 +1043,29 @@ var semantic = {
984
1043
  "default": "#f8f9fa",
985
1044
  subtle: "#ffffff",
986
1045
  emphasis: "#212529",
1046
+ "emphasis-hover": "#343a40",
1047
+ "emphasis-active": "#16191C",
987
1048
  surface: "#e9ecef",
988
1049
  inverse: "#343a40",
989
1050
  interactive: "#0265DC",
990
1051
  "interactive-subtle": "#E0F2FF",
1052
+ "interactive-subtle-hover": "#CAE8FF",
1053
+ "interactive-subtle-active": "#B5DEFF",
991
1054
  "interactive-hover": "#0054B6",
992
1055
  "interactive-active": "#004491",
993
1056
  error: "#D31510",
1057
+ "error-hover": "#B40000",
1058
+ "error-active": "#930000",
994
1059
  "error-subtle": "#FFEBE7",
995
1060
  success: "#007A4D",
996
1061
  "success-subtle": "#CEF8E0",
997
1062
  warning: "#B14C00",
998
1063
  "warning-subtle": "#FFECCC",
999
1064
  disabled: "#dee2e6",
1065
+ neutral: "#dee2e6",
1066
+ "neutral-hover": "#ced4da",
1067
+ "neutral-active": "#adb5bd",
1068
+ transparent: "transparent",
1000
1069
  progressTrack: "#dee2e6",
1001
1070
  page: "#f8f9fa",
1002
1071
  overlay: "rgba(33, 37, 41, 0.5)",
@@ -1007,11 +1076,13 @@ var semantic = {
1007
1076
  border: {
1008
1077
  "default": "#e9ecef",
1009
1078
  subtle: "#dee2e6",
1079
+ control: "#6c757d",
1010
1080
  strong: "#343a40",
1011
1081
  interactive: "#0265DC",
1012
1082
  error: "#D31510",
1013
1083
  success: "#007A4D",
1014
- warning: "#B14C00"
1084
+ warning: "#B14C00",
1085
+ none: "transparent"
1015
1086
  },
1016
1087
  icon: {
1017
1088
  "default": "#212529",
@@ -1058,10 +1129,18 @@ var semantic = {
1058
1129
  "orange-subtle": "#FFECCC",
1059
1130
  gray: "#495057",
1060
1131
  "gray-emphasis": "#212529",
1061
- "gray-subtle": "#e9ecef"
1132
+ "gray-subtle": "#e9ecef",
1133
+ "blue-text": "#0265DC",
1134
+ "purple-text": "#7E2EBD",
1135
+ "pink-text": "#B90064",
1136
+ "yellow-text": "#825800",
1137
+ "green-text": "#007A4D",
1138
+ "red-text": "#D31510",
1139
+ "orange-text": "#B14C00",
1140
+ "gray-text": "#212529"
1062
1141
  },
1063
1142
  status: {
1064
- pending: "#D39700",
1143
+ pending: "#825800",
1065
1144
  "pending-bg": "#FFF3D6",
1066
1145
  completed: "#007A4D",
1067
1146
  "completed-bg": "#CEF8E0",
@@ -1112,8 +1191,7 @@ var semantic = {
1112
1191
  hover: "background-color 150ms ease-out, color 150ms ease-out",
1113
1192
  focus: "outline 150ms ease-out, outline-offset 150ms ease-out",
1114
1193
  interactive: "transform 150ms ease-out, opacity 150ms ease-out"
1115
- },
1116
- $ref: "./semantic/index.json"
1194
+ }
1117
1195
  };
1118
1196
  var tokensJson = {
1119
1197
  base: base,
package/dist/data.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"data.js","sources":["../src/types/tokens.ts","../src/types/icons.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Icon type definitions for external consumption\n// This is a self-contained type that doesn't depend on JSON imports\n// to ensure it works correctly in consuming projects\n\nimport iconsJson from '../styles/icons.json'\n\nexport type IconName =\n | 'add'\n | 'addRing'\n | 'arrowDown'\n | 'arrowLeft'\n | 'arrowRight'\n | 'arrowUp'\n | 'back'\n | 'bell'\n | 'cancel'\n | 'caret'\n | 'caretDown'\n | 'caretUp'\n | 'check'\n | 'checkRing'\n | 'close'\n | 'copy'\n | 'creditCard'\n | 'crossCircle'\n | 'directionRight'\n | 'directionUp'\n | 'edit'\n | 'export'\n | 'fileDocSearch'\n | 'filter'\n | 'info'\n | 'kebab'\n | 'lamp'\n | 'lineOut'\n | 'link'\n | 'meatballs'\n | 'menu'\n | 'message'\n | 'move'\n | 'mic'\n | 'order'\n | 'paper'\n | 'pause'\n | 'play'\n | 'playBack'\n | 'refresh'\n | 'remove'\n | 'search'\n | 'star'\n | 'starFilled'\n | 'table'\n | 'trash'\n | 'userBox'\n | 'view'\n | 'viewHide'\n | 'wallet'\n\n/** Semantic category for grouping icons by purpose */\nexport type IconCategory =\n | 'action'\n | 'communication'\n | 'content'\n | 'feedback'\n | 'media'\n | 'navigation'\n | 'object'\n | 'status'\n | 'user'\n\n/** Enriched metadata for each icon entry in icons.json */\nexport interface IconMetadata {\n /** SVG path data */\n path: string\n /** Display name of the icon */\n name: string\n /** What the icon visually depicts */\n description: string\n /** Semantic category for grouping */\n category: IconCategory\n /** Alternative names and search terms */\n aliases: string[]\n /** When and why to use this icon */\n intent: string\n /** Whether the icon is typically decorative (true) or informative (false) */\n decorativeDefault: boolean\n /** Suggested accessible label when the icon conveys meaning */\n ariaLabelDefault: string\n}\n\n/** The full icon registry keyed by IconName */\nexport type IconRegistry = Record<IconName, IconMetadata>\n\n// Typed as IconRegistry so emitted .d.ts files don't import JSON (needs `resolveJsonModule` in consumers).\nexport const iconsData = iconsJson as IconRegistry\n"],"names":["tokens","tokensJson","iconsData","iconsJson"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACO,IAAMA,MAAM,GAAGC;;ACJtB;AACA;AACA;AA2FA;AACO,IAAMC,SAAS,GAAGC;;;;;;;"}
1
+ {"version":3,"file":"data.js","sources":["../src/types/tokens.ts","../src/types/icons.ts"],"sourcesContent":["import tokensJson from '../styles/tokens.json'\n\n// Re-declared as a const so emitted .d.ts files inline the token shape instead of importing JSON,\n// which consumers can only resolve with `resolveJsonModule`.\nexport const tokens = tokensJson\n\nexport type Tokens = typeof tokens\nexport type TokensBase = Tokens['base']\nexport type TokensSemantic = Tokens['semantic']\nexport type TokensComponent = Tokens['component']\n","// Icon type definitions for external consumption\n// This is a self-contained type that doesn't depend on JSON imports\n// to ensure it works correctly in consuming projects\n\nimport iconsJson from '../styles/icons.json'\n\nexport type IconName =\n | 'add'\n | 'addRing'\n | 'arrowDown'\n | 'arrowLeft'\n | 'arrowRight'\n | 'arrowUp'\n | 'back'\n | 'bell'\n | 'cancel'\n | 'caret'\n | 'caretDown'\n | 'caretUp'\n | 'check'\n | 'checkRing'\n | 'close'\n | 'copy'\n | 'creditCard'\n | 'crossCircle'\n | 'directionRight'\n | 'directionUp'\n | 'edit'\n | 'export'\n | 'fileDocSearch'\n | 'filter'\n | 'info'\n | 'kebab'\n | 'lamp'\n | 'lineOut'\n | 'link'\n | 'meatballs'\n | 'menu'\n | 'message'\n | 'move'\n | 'mic'\n | 'order'\n | 'paper'\n | 'pause'\n | 'play'\n | 'playBack'\n | 'refresh'\n | 'remove'\n | 'search'\n | 'star'\n | 'starFilled'\n | 'table'\n | 'trash'\n | 'userBox'\n | 'view'\n | 'viewHide'\n | 'wallet'\n\n/** Semantic category for grouping icons by purpose */\nexport type IconCategory =\n | 'action'\n | 'communication'\n | 'content'\n | 'feedback'\n | 'media'\n | 'navigation'\n | 'object'\n | 'status'\n | 'user'\n\n/** Enriched metadata for each icon entry in icons.json */\nexport interface IconMetadata {\n /** SVG path data */\n path: string\n /** Display name of the icon */\n name: string\n /** What the icon visually depicts */\n description: string\n /** Semantic category for grouping */\n category: IconCategory\n /** Alternative names and search terms */\n aliases: string[]\n /** When and why to use this icon */\n intent: string\n /** Whether the icon is typically decorative (true) or informative (false) */\n decorativeDefault: boolean\n /** Suggested accessible label when the icon conveys meaning */\n ariaLabelDefault: string\n}\n\n/** The full icon registry keyed by IconName */\nexport type IconRegistry = Record<IconName, IconMetadata>\n\n// Typed as IconRegistry so emitted .d.ts files don't import JSON (needs `resolveJsonModule` in consumers).\nexport const iconsData = iconsJson as IconRegistry\n"],"names":["tokens","tokensJson","iconsData","iconsJson"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA;AACA;AACO,IAAMA,MAAM,GAAGC;;ACJtB;AACA;AACA;AA2FA;AACO,IAAMC,SAAS,GAAGC;;;;;;;"}
package/dist/index.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- export { l as AccountCard, m as ActionSheet, n as AgentInput, o as Alert, A as Avatar, B as Badge, e as BooleanChip, b as Box, p as Breadcrumbs, c as Button, r as CardLarge, q as CardSmall, C as CategoryBadge, s as Checkbox, d as Chip, t as ChipGroup, u as CodeBlock, f as Container, D as DateFormatter, v as DateGroup, i as Divider, x as Dropdown, E as EmptyState, w as FeatureBlock, F as FilterChip, a as Grid, G as GridCol, I as Icon, g as IconButton, L as LegacyChip, y as List, z as ListItem, H as Modal, M as MoneyDisplay, N as NumberInput, J as PageTitle, K as PasswordField, P as Picture, h as ProgressBar, R as ResponsiveGrid, O as SearchField, Q as Sheet, U as Slider, S as Stack, j as StatusBadge, X as StyledInputBase, Y as StyledTextAreaBase, V as TabBar, T as Tag, W as TextField, Z as TransactionListItem, k as Typography } from './client.esm.js';
1
+ export { o as AccountCard, p as ActionSheet, q as AgentInput, r as Alert, A as Avatar, B as Badge, f as BooleanChip, b as Box, t as Breadcrumbs, c as Button, v as CardLarge, u as CardSmall, C as CategoryBadge, d as CategoryLabel, w as Checkbox, e as Chip, x as ChipGroup, y as CodeBlock, g as Container, D as DateFormatter, z as DateGroup, k as Divider, J as Dropdown, E as EmptyState, H as FeatureBlock, F as FilterChip, a as Grid, G as GridCol, h as Icon, i as IconButton, s as InlineAlert, I as InputChip, L as LegacyChip, K as List, N as ListItem, O as Modal, M as MoneyDisplay, Q as NumberInput, U as PageTitle, V as PasswordField, P as Picture, j as ProgressBar, R as ResponsiveGrid, W as SearchField, X as Sheet, Y as Slider, S as Stack, l as StatusBadge, m as StatusLabel, $ as StyledInputBase, a0 as StyledTextAreaBase, Z as TabBar, T as Tag, _ as TextField, a1 as TransactionListItem, n as Typography } from './client.esm.js';
2
2
  export { b as iconsData, a as tokens } from './data.esm.js';
3
3
  import 'react/jsx-runtime';
4
4
  import 'react';
package/dist/index.js CHANGED
@@ -23,6 +23,7 @@ exports.Button = client.Button;
23
23
  exports.CardLarge = client.CardLarge;
24
24
  exports.CardSmall = client.CardSmall;
25
25
  exports.CategoryBadge = client.CategoryBadge;
26
+ exports.CategoryLabel = client.CategoryLabel;
26
27
  exports.Checkbox = client.Checkbox;
27
28
  exports.Chip = client.Chip;
28
29
  exports.ChipGroup = client.ChipGroup;
@@ -39,6 +40,8 @@ exports.Grid = client.Grid;
39
40
  exports.GridCol = client.GridCol;
40
41
  exports.Icon = client.Icon;
41
42
  exports.IconButton = client.IconButton;
43
+ exports.InlineAlert = client.InlineAlert;
44
+ exports.InputChip = client.InputChip;
42
45
  exports.LegacyChip = client.LegacyChip;
43
46
  exports.List = client.List;
44
47
  exports.ListItem = client.ListItem;
@@ -55,6 +58,7 @@ exports.Sheet = client.Sheet;
55
58
  exports.Slider = client.Slider;
56
59
  exports.Stack = client.Stack;
57
60
  exports.StatusBadge = client.StatusBadge;
61
+ exports.StatusLabel = client.StatusLabel;
58
62
  exports.StyledInputBase = client.StyledInputBase;
59
63
  exports.StyledTextAreaBase = client.StyledTextAreaBase;
60
64
  exports.TabBar = client.TabBar;
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -107,6 +107,7 @@
107
107
  "fit": "fit-content"
108
108
  },
109
109
  "color": {
110
+ "transparent": "transparent",
110
111
  "neutral": {
111
112
  "100": "#f8f9fa",
112
113
  "200": "#e9ecef",
@@ -327,8 +328,7 @@
327
328
  "easeInBack": "cubic-bezier(0.36, 0, 0.66, -0.56)",
328
329
  "easeOutBack": "cubic-bezier(0.34, 1.56, 0.64, 1)",
329
330
  "easeInOutBack": "cubic-bezier(0.68, -0.6, 0.32, 1.6)"
330
- },
331
- "$ref": "./base/index.json"
331
+ }
332
332
  },
333
333
  "component": {
334
334
  "button": {
@@ -382,6 +382,20 @@
382
382
  "textColor": "#adb5bd"
383
383
  }
384
384
  },
385
+ "accent": {
386
+ "backgroundColor": "#0265DC",
387
+ "textColor": "#ffffff",
388
+ "hover": {
389
+ "backgroundColor": "#0054B6"
390
+ },
391
+ "active": {
392
+ "backgroundColor": "#004491"
393
+ },
394
+ "disabled": {
395
+ "backgroundColor": "#dee2e6",
396
+ "textColor": "#adb5bd"
397
+ }
398
+ },
385
399
  "emphasis": {
386
400
  "backgroundColor": "#0265DC",
387
401
  "textColor": "#ffffff",
@@ -631,7 +645,7 @@
631
645
  "default": {
632
646
  "backgroundColor": "#ffffff",
633
647
  "textColor": "#212529",
634
- "borderColor": "#dee2e6",
648
+ "borderColor": "#6c757d",
635
649
  "borderRadius": "0.25rem",
636
650
  "borderWidth": "0.0625rem",
637
651
  "paddingY": "11px",
@@ -639,7 +653,7 @@
639
653
  "font": "400 1rem/1.5rem 'Inter', sans-serif"
640
654
  },
641
655
  "placeholder": {
642
- "textColor": "#adb5bd"
656
+ "textColor": "#495057"
643
657
  },
644
658
  "hover": {
645
659
  "borderColor": "#343a40"
@@ -711,6 +725,42 @@
711
725
  }
712
726
  },
713
727
  "alert": {
728
+ "severity": {
729
+ "error": {
730
+ "background": "#FFEBE7",
731
+ "text": "#D31510"
732
+ },
733
+ "warning": {
734
+ "background": "#FFECCC",
735
+ "text": "#B14C00"
736
+ },
737
+ "info": {
738
+ "background": "#E0F2FF",
739
+ "text": "#0265DC"
740
+ },
741
+ "success": {
742
+ "background": "#CEF8E0",
743
+ "text": "#007A4D"
744
+ }
745
+ },
746
+ "appearance": {
747
+ "outlined": {
748
+ "borderColor": {
749
+ "error": "#D31510",
750
+ "warning": "#B14C00",
751
+ "info": "#0265DC",
752
+ "success": "#007A4D"
753
+ }
754
+ },
755
+ "borderless": {
756
+ "borderColor": {
757
+ "error": "transparent",
758
+ "warning": "transparent",
759
+ "info": "transparent",
760
+ "success": "transparent"
761
+ }
762
+ }
763
+ },
714
764
  "title": {
715
765
  "typography": "500 1.125rem/1.5rem 'Inter', sans-serif",
716
766
  "fontWeight": "600",
@@ -809,8 +859,7 @@
809
859
  },
810
860
  "transactionListItem": {
811
861
  "minHeight": "4.5rem"
812
- },
813
- "$ref": "./component/index.json"
862
+ }
814
863
  },
815
864
  "semantic": {
816
865
  "elevation": {
@@ -897,12 +946,20 @@
897
946
  "md": "35rem",
898
947
  "lg": "45rem"
899
948
  },
949
+ "label": {
950
+ "small": "1.25rem",
951
+ "medium": "1.5rem",
952
+ "large": "2rem"
953
+ },
900
954
  "menu": {
901
955
  "maxHeight": "18.75rem"
902
956
  },
903
957
  "dimension": {
904
958
  "1": "0.25rem",
959
+ "2": "0.5rem",
960
+ "4": "1rem",
905
961
  "5": "1.25rem",
962
+ "6": "1.5rem",
906
963
  "8": "2rem",
907
964
  "12": "3rem",
908
965
  "15": "3.75rem",
@@ -975,6 +1032,8 @@
975
1032
  "inverse": "#ffffff",
976
1033
  "disabled": "#adb5bd",
977
1034
  "interactive": "#0265DC",
1035
+ "interactive-hover": "#0054B6",
1036
+ "interactive-active": "#004491",
978
1037
  "error": "#D31510",
979
1038
  "success": "#007A4D",
980
1039
  "warning": "#B14C00"
@@ -983,19 +1042,29 @@
983
1042
  "default": "#f8f9fa",
984
1043
  "subtle": "#ffffff",
985
1044
  "emphasis": "#212529",
1045
+ "emphasis-hover": "#343a40",
1046
+ "emphasis-active": "#16191C",
986
1047
  "surface": "#e9ecef",
987
1048
  "inverse": "#343a40",
988
1049
  "interactive": "#0265DC",
989
1050
  "interactive-subtle": "#E0F2FF",
1051
+ "interactive-subtle-hover": "#CAE8FF",
1052
+ "interactive-subtle-active": "#B5DEFF",
990
1053
  "interactive-hover": "#0054B6",
991
1054
  "interactive-active": "#004491",
992
1055
  "error": "#D31510",
1056
+ "error-hover": "#B40000",
1057
+ "error-active": "#930000",
993
1058
  "error-subtle": "#FFEBE7",
994
1059
  "success": "#007A4D",
995
1060
  "success-subtle": "#CEF8E0",
996
1061
  "warning": "#B14C00",
997
1062
  "warning-subtle": "#FFECCC",
998
1063
  "disabled": "#dee2e6",
1064
+ "neutral": "#dee2e6",
1065
+ "neutral-hover": "#ced4da",
1066
+ "neutral-active": "#adb5bd",
1067
+ "transparent": "transparent",
999
1068
  "progressTrack": "#dee2e6",
1000
1069
  "page": "#f8f9fa",
1001
1070
  "overlay": "rgba(33, 37, 41, 0.5)",
@@ -1006,11 +1075,13 @@
1006
1075
  "border": {
1007
1076
  "default": "#e9ecef",
1008
1077
  "subtle": "#dee2e6",
1078
+ "control": "#6c757d",
1009
1079
  "strong": "#343a40",
1010
1080
  "interactive": "#0265DC",
1011
1081
  "error": "#D31510",
1012
1082
  "success": "#007A4D",
1013
- "warning": "#B14C00"
1083
+ "warning": "#B14C00",
1084
+ "none": "transparent"
1014
1085
  },
1015
1086
  "icon": {
1016
1087
  "default": "#212529",
@@ -1057,10 +1128,18 @@
1057
1128
  "orange-subtle": "#FFECCC",
1058
1129
  "gray": "#495057",
1059
1130
  "gray-emphasis": "#212529",
1060
- "gray-subtle": "#e9ecef"
1131
+ "gray-subtle": "#e9ecef",
1132
+ "blue-text": "#0265DC",
1133
+ "purple-text": "#7E2EBD",
1134
+ "pink-text": "#B90064",
1135
+ "yellow-text": "#825800",
1136
+ "green-text": "#007A4D",
1137
+ "red-text": "#D31510",
1138
+ "orange-text": "#B14C00",
1139
+ "gray-text": "#212529"
1061
1140
  },
1062
1141
  "status": {
1063
- "pending": "#D39700",
1142
+ "pending": "#825800",
1064
1143
  "pending-bg": "#FFF3D6",
1065
1144
  "completed": "#007A4D",
1066
1145
  "completed-bg": "#CEF8E0",
@@ -1111,7 +1190,6 @@
1111
1190
  "hover": "background-color 150ms ease-out, color 150ms ease-out",
1112
1191
  "focus": "outline 150ms ease-out, outline-offset 150ms ease-out",
1113
1192
  "interactive": "transform 150ms ease-out, opacity 150ms ease-out"
1114
- },
1115
- "$ref": "./semantic/index.json"
1193
+ }
1116
1194
  }
1117
1195
  }