@ceed/cds 1.34.0 → 1.35.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 (120) hide show
  1. package/dist/components/Accordions/Accordions.d.ts +1 -0
  2. package/dist/components/Alert/Alert.d.ts +5 -5
  3. package/dist/components/Autocomplete/Autocomplete.d.ts +2 -2
  4. package/dist/components/Avatar/Avatar.d.ts +7 -17
  5. package/dist/components/Box/Box.d.ts +1 -0
  6. package/dist/components/Breadcrumbs/Breadcrumbs.d.ts +6 -5
  7. package/dist/components/Button/Button.d.ts +3 -2
  8. package/dist/components/Calendar/Calendar.d.ts +1 -0
  9. package/dist/components/Card/Card.d.ts +1 -0
  10. package/dist/components/Checkbox/Checkbox.d.ts +1 -0
  11. package/dist/components/Chip/Chip.d.ts +1 -0
  12. package/dist/components/Container/Container.d.ts +6 -1
  13. package/dist/components/CurrencyInput/CurrencyInput.d.ts +1 -1
  14. package/dist/components/DialogActions/DialogActions.d.ts +1 -0
  15. package/dist/components/DialogContent/DialogContent.d.ts +1 -0
  16. package/dist/components/DialogFrame/DialogFrame.d.ts +1 -1
  17. package/dist/components/DialogTitle/DialogTitle.d.ts +1 -0
  18. package/dist/components/Divider/Divider.d.ts +1 -0
  19. package/dist/components/Drawer/Drawer.d.ts +1 -0
  20. package/dist/components/Dropdown/Dropdown.d.ts +28 -1
  21. package/dist/components/FormControl/FormControl.d.ts +1 -0
  22. package/dist/components/FormHelperText/FormHelperText.d.ts +1 -0
  23. package/dist/components/FormLabel/FormLabel.d.ts +1 -0
  24. package/dist/components/Grid/Grid.d.ts +1 -0
  25. package/dist/components/IconButton/IconButton.d.ts +3 -2
  26. package/dist/components/IconMenuButton/IconMenuButton.d.ts +7 -6
  27. package/dist/components/InfoSign/InfoSign.d.ts +3 -2
  28. package/dist/components/Input/Input.d.ts +8 -22
  29. package/dist/components/InsetDrawer/InsetDrawer.d.ts +1 -0
  30. package/dist/components/Markdown/Markdown.d.ts +9 -24
  31. package/dist/components/Menu/Menu.d.ts +2 -1
  32. package/dist/components/MenuButton/MenuButton.d.ts +10 -8
  33. package/dist/components/Modal/Modal.d.ts +4 -2
  34. package/dist/components/NavigationGroup/NavigationGroup.d.ts +3 -2
  35. package/dist/components/NavigationItem/NavigationItem.d.ts +3 -2
  36. package/dist/components/Navigator/Navigator.d.ts +5 -4
  37. package/dist/components/Pagination/Pagination.d.ts +1 -1
  38. package/dist/components/Radio/Radio.d.ts +1 -0
  39. package/dist/components/RadioList/RadioList.d.ts +3 -2
  40. package/dist/components/SearchBar/SearchBar.d.ts +6 -5
  41. package/dist/components/SearchBar/index.d.ts +3 -2
  42. package/dist/components/Select/Select.d.ts +12 -10
  43. package/dist/components/Sheet/Sheet.d.ts +1 -0
  44. package/dist/components/Stack/Stack.d.ts +1 -0
  45. package/dist/components/Stepper/Stepper.d.ts +2 -1
  46. package/dist/components/Switch/Switch.d.ts +1 -0
  47. package/dist/components/Table/Table.d.ts +7 -5
  48. package/dist/components/Tabs/Tabs.d.ts +1 -0
  49. package/dist/components/Textarea/Textarea.d.ts +8 -20
  50. package/dist/components/Tooltip/Tooltip.d.ts +1 -0
  51. package/dist/components/Typography/Typography.d.ts +1 -0
  52. package/dist/components/Uploader/Uploader.d.ts +18 -17
  53. package/dist/components/data-display/Avatar.md +60 -72
  54. package/dist/components/data-display/Badge.md +197 -181
  55. package/dist/components/data-display/Chip.md +164 -142
  56. package/dist/components/data-display/DataTable.md +843 -338
  57. package/dist/components/data-display/InfoSign.md +1 -3
  58. package/dist/components/data-display/Markdown.md +93 -125
  59. package/dist/components/data-display/Table.md +1453 -1007
  60. package/dist/components/data-display/Typography.md +113 -116
  61. package/dist/components/feedback/Alert.md +80 -86
  62. package/dist/components/feedback/CircularProgress.md +32 -36
  63. package/dist/components/feedback/Dialog.md +25 -17
  64. package/dist/components/feedback/Modal.md +296 -264
  65. package/dist/components/feedback/Skeleton.md +125 -89
  66. package/dist/components/index.d.ts +63 -4
  67. package/dist/components/inputs/Autocomplete.md +191 -95
  68. package/dist/components/inputs/Button.md +83 -83
  69. package/dist/components/inputs/ButtonGroup.md +195 -185
  70. package/dist/components/inputs/Calendar.md +25 -28
  71. package/dist/components/inputs/Checkbox.md +11 -29
  72. package/dist/components/inputs/CurrencyInput.md +4 -4
  73. package/dist/components/inputs/DatePicker.md +229 -110
  74. package/dist/components/inputs/DateRangePicker.md +248 -137
  75. package/dist/components/inputs/FilterableCheckboxGroup.md +115 -55
  76. package/dist/components/inputs/FormControl.md +75 -69
  77. package/dist/components/inputs/IconButton.md +229 -205
  78. package/dist/components/inputs/Input.md +131 -98
  79. package/dist/components/inputs/MonthPicker.md +186 -84
  80. package/dist/components/inputs/MonthRangePicker.md +73 -49
  81. package/dist/components/inputs/PercentageInput.md +15 -31
  82. package/dist/components/inputs/RadioButton.md +320 -256
  83. package/dist/components/inputs/RadioList.md +66 -50
  84. package/dist/components/inputs/RadioTileGroup.md +287 -170
  85. package/dist/components/inputs/SearchBar.md +154 -55
  86. package/dist/components/inputs/Select.md +106 -95
  87. package/dist/components/inputs/Slider.md +153 -102
  88. package/dist/components/inputs/Switch.md +193 -138
  89. package/dist/components/inputs/Textarea.md +15 -20
  90. package/dist/components/inputs/Uploader/Uploader.md +68 -39
  91. package/dist/components/layout/Box.md +841 -662
  92. package/dist/components/layout/Container.md +3 -11
  93. package/dist/components/layout/Grid.md +480 -394
  94. package/dist/components/layout/Stack.md +739 -566
  95. package/dist/components/navigation/Breadcrumbs.md +4 -4
  96. package/dist/components/navigation/Drawer.md +34 -25
  97. package/dist/components/navigation/Dropdown.md +745 -408
  98. package/dist/components/navigation/IconMenuButton.md +14 -6
  99. package/dist/components/navigation/InsetDrawer.md +8 -13
  100. package/dist/components/navigation/Link.md +1 -2
  101. package/dist/components/navigation/Menu.md +623 -502
  102. package/dist/components/navigation/MenuButton.md +18 -10
  103. package/dist/components/navigation/NavigationGroup.md +19 -50
  104. package/dist/components/navigation/NavigationItem.md +6 -6
  105. package/dist/components/navigation/Navigator.md +26 -28
  106. package/dist/components/navigation/Pagination.md +86 -75
  107. package/dist/components/navigation/Stepper.md +2 -12
  108. package/dist/components/navigation/Tabs.md +48 -36
  109. package/dist/components/surfaces/Accordions.md +89 -172
  110. package/dist/components/surfaces/Card.md +1094 -709
  111. package/dist/components/surfaces/Divider.md +562 -412
  112. package/dist/components/surfaces/Sheet.md +700 -518
  113. package/dist/guides/ThemeProvider.md +8 -8
  114. package/dist/index.browser.js +4 -4
  115. package/dist/index.browser.js.map +4 -4
  116. package/dist/index.cjs +1079 -1052
  117. package/dist/index.d.ts +2 -1
  118. package/dist/index.js +725 -690
  119. package/framer/index.js +1 -1
  120. package/package.json +32 -35
@@ -33,10 +33,10 @@ CircularProgress supports three sizes: `sm`, `md` (default), and `lg`.
33
33
 
34
34
  ```tsx
35
35
  <>
36
- <CircularProgress size="sm" />
37
- <CircularProgress size="md" />
38
- <CircularProgress size="lg" />
39
- </>
36
+ <CircularProgress size="sm" />
37
+ <CircularProgress size="md" />
38
+ <CircularProgress size="lg" />
39
+ </>
40
40
  ```
41
41
 
42
42
  ```tsx
@@ -51,12 +51,12 @@ Five semantic colors are available via the `color` prop. The default is `primary
51
51
 
52
52
  ```tsx
53
53
  <>
54
- <CircularProgress color="primary" />
55
- <CircularProgress color="neutral" />
56
- <CircularProgress color="danger" />
57
- <CircularProgress color="success" />
58
- <CircularProgress color="warning" />
59
- </>
54
+ <CircularProgress color="primary" />
55
+ <CircularProgress color="neutral" />
56
+ <CircularProgress color="danger" />
57
+ <CircularProgress color="success" />
58
+ <CircularProgress color="warning" />
59
+ </>
60
60
  ```
61
61
 
62
62
  ```tsx
@@ -73,11 +73,11 @@ Four visual variants are supported: `solid`, `soft` (default), `outlined`, and `
73
73
 
74
74
  ```tsx
75
75
  <>
76
- <CircularProgress variant="solid" />
77
- <CircularProgress variant="soft" />
78
- <CircularProgress variant="outlined" />
79
- <CircularProgress variant="plain" />
80
- </>
76
+ <CircularProgress variant="solid" />
77
+ <CircularProgress variant="soft" />
78
+ <CircularProgress variant="outlined" />
79
+ <CircularProgress variant="plain" />
80
+ </>
81
81
  ```
82
82
 
83
83
  ```tsx
@@ -93,11 +93,11 @@ Set `determinate` to `true` and provide a `value` (0–100) to display specific
93
93
 
94
94
  ```tsx
95
95
  <>
96
- <CircularProgress determinate value={25} />
97
- <CircularProgress determinate value={50} />
98
- <CircularProgress determinate value={75} />
99
- <CircularProgress determinate value={100} />
100
- </>
96
+ <CircularProgress determinate value={25} />
97
+ <CircularProgress determinate value={50} />
98
+ <CircularProgress determinate value={75} />
99
+ <CircularProgress determinate value={100} />
100
+ </>
101
101
  ```
102
102
 
103
103
  ```tsx
@@ -113,8 +113,8 @@ Pass children to display a label inside the progress ring. This is useful for sh
113
113
 
114
114
  ```tsx
115
115
  <CircularProgress determinate value={66}>
116
- <Typography level="body-xs">66%</Typography>
117
- </CircularProgress>
116
+ <Typography level="body-xs">66%</Typography>
117
+ </CircularProgress>
118
118
  ```
119
119
 
120
120
  ```tsx
@@ -129,13 +129,11 @@ Use CircularProgress inside a Button to indicate a loading state.
129
129
 
130
130
  ```tsx
131
131
  <>
132
- <Button startDecorator={<CircularProgress variant="solid" size="sm" />}>
133
- Loading…
134
- </Button>
135
- <Button disabled>
136
- <CircularProgress variant="soft" size="sm" />
137
- </Button>
138
- </>
132
+ <Button startDecorator={<CircularProgress variant="solid" size="sm" />}>Loading…</Button>
133
+ <Button disabled>
134
+ <CircularProgress variant="soft" size="sm" />
135
+ </Button>
136
+ </>
139
137
  ```
140
138
 
141
139
  ```tsx
@@ -154,10 +152,10 @@ Control the stroke thickness of the progress ring with the `thickness` prop.
154
152
 
155
153
  ```tsx
156
154
  <>
157
- <CircularProgress thickness={2} />
158
- <CircularProgress thickness={4} />
159
- <CircularProgress thickness={8} />
160
- </>
155
+ <CircularProgress thickness={2} />
156
+ <CircularProgress thickness={4} />
157
+ <CircularProgress thickness={8} />
158
+ </>
161
159
  ```
162
160
 
163
161
  ```tsx
@@ -216,9 +214,7 @@ function SubmitButton({ isSubmitting }: { isSubmitting: boolean }) {
216
214
  return (
217
215
  <Button
218
216
  disabled={isSubmitting}
219
- startDecorator={
220
- isSubmitting ? <CircularProgress variant="solid" size="sm" /> : null
221
- }
217
+ startDecorator={isSubmitting ? <CircularProgress variant="solid" size="sm" /> : null}
222
218
  >
223
219
  {isSubmitting ? 'Submitting…' : 'Submit'}
224
220
  </Button>
@@ -87,9 +87,9 @@ Dialog with form inputs and keyboard event handling.
87
87
 
88
88
  ```tsx
89
89
  <DialogFrame {...args} title="Dialog Title" actions={<Button variant="plain">Action</Button>}>
90
- Dialog Content
91
- <Input />
92
- </DialogFrame>
90
+ Dialog Content
91
+ <Input />
92
+ </DialogFrame>
93
93
  ```
94
94
 
95
95
  ### Standalone Usage
@@ -106,20 +106,28 @@ DialogFrame can be used without a Modal wrapper for embedding dialog-style layou
106
106
  > DialogFrame inherits its dimensions from `ModalDialog`, which normally receives sizing from the Modal overlay. Without these constraints, the component will not render with correct dimensions.
107
107
 
108
108
  ```tsx
109
- <Box sx={{
110
- position: 'relative',
111
- width: 480,
112
- height: 300
113
- }}>
114
- <DialogFrame {...args} title="Standalone Dialog" actions={<>
115
- <Button variant="plain" color="neutral">
116
- Cancel
117
- </Button>
118
- <Button variant="plain">Confirm</Button>
119
- </>}>
120
- DialogFrame used without Modal. The parent container must provide explicit width and height.
121
- </DialogFrame>
122
- </Box>
109
+ <Box
110
+ sx={{
111
+ position: "relative",
112
+ width: 480,
113
+ height: 300
114
+ }}
115
+ >
116
+ <DialogFrame
117
+ {...args}
118
+ title="Standalone Dialog"
119
+ actions={
120
+ <>
121
+ <Button variant="plain" color="neutral">
122
+ Cancel
123
+ </Button>
124
+ <Button variant="plain">Confirm</Button>
125
+ </>
126
+ }
127
+ >
128
+ DialogFrame used without Modal. The parent container must provide explicit width and height.
129
+ </DialogFrame>
130
+ </Box>
123
131
  ```
124
132
 
125
133
  ```tsx