dap-design-system 0.58.3 → 0.59.1
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/components/datatable/datatable.component.d.ts +7 -0
- package/dist/components/pager/pager.component.d.ts +13 -0
- package/dist/{components-C1PeiTAk.js → components-t--58ON2.js} +776 -732
- package/dist/components-t--58ON2.js.map +1 -0
- package/dist/components.js +1 -1
- package/dist/dds.js +1 -1
- package/dist/manifest/types/vue/index.d.ts +163 -149
- package/dist/manifest/vscode.html-custom-data.json +129 -109
- package/dist/manifest/web-types.json +364 -324
- package/dist/react/dap-ds-datatable/index.d.ts +3 -0
- package/dist/react/dap-ds-pager/index.d.ts +6 -0
- package/dist/react/index.d.ts +4 -4
- package/dist/react-types.ts +4 -4
- package/dist/react.js +58 -58
- package/dist/react.js.map +1 -1
- package/package.json +1 -1
- package/dist/components-C1PeiTAk.js.map +0 -1
|
@@ -2,33 +2,6 @@
|
|
|
2
2
|
"$schema": "https://raw.githubusercontent.com/microsoft/vscode-html-languageservice/main/docs/customData.schema.json",
|
|
3
3
|
"version": 1.1,
|
|
4
4
|
"tags": [
|
|
5
|
-
{
|
|
6
|
-
"name": "dap-ds-accordion-group",
|
|
7
|
-
"description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
|
|
8
|
-
"attributes": [
|
|
9
|
-
{
|
|
10
|
-
"name": "autoClose",
|
|
11
|
-
"description": "Whether to close other accordions when one is opened.",
|
|
12
|
-
"values": []
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"name": "variant",
|
|
16
|
-
"description": "The variant of the accordion",
|
|
17
|
-
"values": [
|
|
18
|
-
{ "name": "default" },
|
|
19
|
-
{ "name": "collapsed" },
|
|
20
|
-
{ "name": "clean" },
|
|
21
|
-
{ "name": "clean-collapsed" }
|
|
22
|
-
]
|
|
23
|
-
}
|
|
24
|
-
],
|
|
25
|
-
"references": [
|
|
26
|
-
{
|
|
27
|
-
"name": "Documentation",
|
|
28
|
-
"url": "https://shoelace.style/components/accordion-group"
|
|
29
|
-
}
|
|
30
|
-
]
|
|
31
|
-
},
|
|
32
5
|
{
|
|
33
6
|
"name": "dap-ds-avatar",
|
|
34
7
|
"description": "Avatar component can be used to display user profile images, initials, or icons.\n---\n\n\n### **Events:**\n - **dds-load** - Fired when the image loads successfully.\n- **dds-error** - Fired when the image fails to load.\n\n### **Slots:**\n - **icon** - The icon to display when variant is 'icon'.\n- **fallback** - Custom fallback content when image fails to load.\n\n### **CSS Properties:**\n - **--dds-avatar-border-radius** - The border radius of the avatar (default: 50%) _(default: undefined)_\n- **--dds-avatar-background-color** - The background color of the avatar (default: var(--dds-neutral-200)) _(default: undefined)_\n- **--dds-avatar-border-width** - The border width of the avatar (default: 0) _(default: undefined)_\n- **--dds-avatar-border-color** - The color of the avatar's border (default: transparent) _(default: undefined)_\n- **--dds-avatar-border-style** - The style of the avatar's border (default: solid) _(default: undefined)_\n- **--dds-avatar-transition** - The transition property for the avatar (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-avatar-text-color** - The text color for initials (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-avatar-font-weight** - The font weight for initials (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-avatar-lg-size** - Size for large avatars (default: var(--dds-avatar-size-lg)) _(default: undefined)_\n- **--dds-avatar-md-size** - Size for medium avatars (default: var(--dds-avatar-size-md)) _(default: undefined)_\n- **--dds-avatar-sm-size** - Size for small avatars (default: var(--dds-avatar-size-sm)) _(default: undefined)_\n- **--dds-avatar-xs-size** - Size for extra small avatars (default: var(--dds-avatar-size-xs)) _(default: undefined)_\n- **--dds-avatar-xxs-size** - Size for extra extra small avatars (default: var(--dds-avatar-size-xxs)) _(default: undefined)_\n- **--dds-avatar-font-size-lg** - Font size for large avatars (default: var(--dds-font-2xl)) _(default: undefined)_\n- **--dds-avatar-font-size-md** - Font size for medium avatars (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-avatar-font-size-sm** - Font size for small avatars (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-avatar-font-size-xs** - Font size for extra small avatars (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-avatar-font-size-xxs** - Font size for extra extra small avatars (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-avatar-hover-transform** - Transform applied on hover for interactive avatars (default: scale(1.05)) _(default: undefined)_\n- **--dds-avatar-active-transform** - Transform applied when active for interactive avatars (default: scale(0.95)) _(default: undefined)_\n- **--dds-avatar-focus-ring** - Focus ring style for interactive avatars (default: 0 0 0 2px var(--dds-focus-outer-ring)) _(default: undefined)_\n- **--dds-avatar-loading-background** - Background color when loading (default: var(--dds-neutral-100)) _(default: undefined)_\n- **--dds-avatar-error-background** - Background color when image fails to load (default: var(--dds-negative-100)) _(default: undefined)_\n- **--dds-avatar-error-color** - Text color when image fails to load (default: var(--dds-negative-600)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main avatar container.\n- **img** - The avatar image.\n- **initials** - The initials container.\n- **icon** - The icon container.\n- **fallback** - The fallback content container.\n- **loading** - The loading indicator.",
|
|
@@ -152,29 +125,6 @@
|
|
|
152
125
|
}
|
|
153
126
|
]
|
|
154
127
|
},
|
|
155
|
-
{
|
|
156
|
-
"name": "dap-ds-breadcrumb",
|
|
157
|
-
"description": "A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or Web application.\n---\n\n\n### **Slots:**\n - _default_ - The content of the breadcrumb.\n- **separator** - The separator between breadcrumb items. Default is '/'.\n\n### **CSS Properties:**\n - **--dds-breadcrumb-width** - The width of the breadcrumb container (default: 100%) _(default: undefined)_\n- **--dds-breadcrumb-overflow-x** - The horizontal overflow behavior of the breadcrumb (default: auto) _(default: undefined)_\n- **--dds-breadcrumb-transition** - The transition property for the breadcrumb (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-breadcrumb-list-display** - The display property of the breadcrumb list (default: flex) _(default: undefined)_\n- **--dds-breadcrumb-list-flex-wrap** - The flex-wrap property of the breadcrumb list (default: nowrap) _(default: undefined)_\n- **--dds-breadcrumb-list-align-items** - The align-items property of the breadcrumb list (default: center) _(default: undefined)_\n- **--dds-breadcrumb-list-min-width** - The minimum width of the breadcrumb list (default: max-content) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main breadcrumb container.\n- **separator** - The separator of the breadcrumb.",
|
|
158
|
-
"attributes": [
|
|
159
|
-
{ "name": "variant", "values": [] },
|
|
160
|
-
{
|
|
161
|
-
"name": "mobile",
|
|
162
|
-
"description": "Mobile version of the breadcrumb",
|
|
163
|
-
"values": []
|
|
164
|
-
},
|
|
165
|
-
{
|
|
166
|
-
"name": "aria-labelledby",
|
|
167
|
-
"description": "The aria-labelledby of the breadcrumb",
|
|
168
|
-
"values": []
|
|
169
|
-
}
|
|
170
|
-
],
|
|
171
|
-
"references": [
|
|
172
|
-
{
|
|
173
|
-
"name": "Documentation",
|
|
174
|
-
"url": "https://shoelace.style/components/breadcrumb"
|
|
175
|
-
}
|
|
176
|
-
]
|
|
177
|
-
},
|
|
178
128
|
{
|
|
179
129
|
"name": "dap-ds-banner",
|
|
180
130
|
"description": "A banner is a message displayed at the top of the page to provide important information to the user.\n---\n\n\n### **Events:**\n - **dds-close** - Event fired when the banner is closed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **actions** - Actions of banner\n- **icon** - The icon of the banner.\n\n### **CSS Properties:**\n - **--dds-banner-gap** - The gap between banner elements (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-banner-line-height** - The line height of the banner text (default: var(--dds-font-line-height-xlarge)) _(default: undefined)_\n- **--dds-banner-transition** - The transition property for the banner (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-banner-brand-background** - The background color of the brand banner (default: var(--dds-banner-background-brand)) _(default: undefined)_\n- **--dds-banner-brand-icon-color** - The color of the brand banner icon (default: var(--dds-banner-icon-brand)) _(default: undefined)_\n- **--dds-banner-brand-text-color** - The text color of the brand banner (default: var(--dds-banner-text-brand)) _(default: undefined)_\n- **--dds-banner-brand-action-color** - The color of the brand banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-info-background** - The background color of the info banner (default: var(--dds-banner-background-informative)) _(default: undefined)_\n- **--dds-banner-info-icon-color** - The color of the info banner icon (default: var(--dds-banner-icon-informative)) _(default: undefined)_\n- **--dds-banner-info-text-color** - The text color of the info banner (default: var(--dds-banner-text-informative)) _(default: undefined)_\n- **--dds-banner-info-action-color** - The color of the info banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-positive-background** - The background color of the positive banner (default: var(--dds-banner-background-positive)) _(default: undefined)_\n- **--dds-banner-positive-icon-color** - The color of the positive banner icon (default: var(--dds-banner-icon-positive)) _(default: undefined)_\n- **--dds-banner-positive-text-color** - The text color of the positive banner (default: var(--dds-banner-text-positive)) _(default: undefined)_\n- **--dds-banner-positive-action-color** - The color of the positive banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-warning-background** - The background color of the warning banner (default: var(--dds-banner-background-warning)) _(default: undefined)_\n- **--dds-banner-warning-icon-color** - The color of the warning banner icon (default: var(--dds-banner-icon-warning)) _(default: undefined)_\n- **--dds-banner-warning-text-color** - The text color of the warning banner (default: var(--dds-banner-text-warning)) _(default: undefined)_\n- **--dds-banner-warning-action-color** - The color of the warning banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n- **--dds-banner-negative-background** - The background color of the negative banner (default: var(--dds-banner-background-negative)) _(default: undefined)_\n- **--dds-banner-negative-icon-color** - The color of the negative banner icon (default: var(--dds-banner-icon-negative)) _(default: undefined)_\n- **--dds-banner-negative-text-color** - The text color of the negative banner (default: var(--dds-banner-text-negative)) _(default: undefined)_\n- **--dds-banner-negative-action-color** - The color of the negative banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main banner container.\n- **card-base** - The wrapper card container.\n- **icon** - The icon of the banner.\n- **icon-element** - The icon element of the banner.\n- **icon-base** - The base of the icon.\n- **closebutton** - The close button of the banner.\n- **close-icon-element** - The icon element of the close button.\n- **close-icon-base** - The base of the close button icon.\n- **actions** - The actions of the banner.\n- **title** - The title of the banner.",
|
|
@@ -223,6 +173,63 @@
|
|
|
223
173
|
}
|
|
224
174
|
]
|
|
225
175
|
},
|
|
176
|
+
{
|
|
177
|
+
"name": "dap-ds-badge",
|
|
178
|
+
"description": "A badge is a small status descriptor for UI elements.\n---\n\n\n### **Slots:**\n - _default_ - The content of the badge.\n- **icon** - The icon of the badge.\n\n### **CSS Properties:**\n - **--dds-badge-border-width** - The width of the badge's border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-badge-border-style** - The style of the badge's border (default: solid) _(default: undefined)_\n- **--dds-badge-border-radius** - The border radius of the badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-badge-font-weight** - The font weight of the badge text (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-badge-line-height** - The line height of the badge text (default: 1.2) _(default: undefined)_\n- **--dds-badge-transition** - The transition property for the badge (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-badge-padding-sm** - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-badge-padding-lg** - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-badge-font-size-sm** - The font size of the small badge (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-badge-font-size-lg** - The font size of the large badge (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-badge-neutral-border-color** - The border color of the neutral badge (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-badge-neutral-background** - The background color of the neutral badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-badge-neutral-color** - The text color of the neutral badge (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-badge-brand-border-color** - The border color of the brand badge (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-badge-brand-background** - The background color of the brand badge (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-badge-brand-color** - The text color of the brand badge (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-badge-info-border-color** - The border color of the info badge (default: var(--dds-border-informative-base)) _(default: undefined)_\n- **--dds-badge-info-background** - The background color of the info badge (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-badge-info-color** - The text color of the info badge (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-badge-positive-border-color** - The border color of the positive badge (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-badge-positive-background** - The background color of the positive badge (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-badge-positive-color** - The text color of the positive badge (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-badge-warning-border-color** - The border color of the warning badge (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-badge-warning-background** - The background color of the warning badge (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-badge-warning-color** - The text color of the warning badge (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-badge-negative-border-color** - The border color of the negative badge (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-badge-negative-background** - The background color of the negative badge (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-badge-negative-color** - The text color of the negative badge (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the badge.\n- **icon** - The icon of the badge.\n- **content** - The content of the badge.\n- **icon-base** - The base of the icon.",
|
|
179
|
+
"attributes": [
|
|
180
|
+
{
|
|
181
|
+
"name": "type",
|
|
182
|
+
"description": "The type of the badge",
|
|
183
|
+
"values": [
|
|
184
|
+
{ "name": "neutral" },
|
|
185
|
+
{ "name": "brand" },
|
|
186
|
+
{ "name": "info" },
|
|
187
|
+
{ "name": "positive" },
|
|
188
|
+
{ "name": "warning" },
|
|
189
|
+
{ "name": "negative" }
|
|
190
|
+
]
|
|
191
|
+
},
|
|
192
|
+
{
|
|
193
|
+
"name": "icon",
|
|
194
|
+
"description": "The icon of the badge, this is a name of a built in icon",
|
|
195
|
+
"values": []
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
"name": "live",
|
|
199
|
+
"description": "Whether the badge represents dynamic content that should announce changes",
|
|
200
|
+
"values": []
|
|
201
|
+
}
|
|
202
|
+
],
|
|
203
|
+
"references": [
|
|
204
|
+
{
|
|
205
|
+
"name": "Documentation",
|
|
206
|
+
"url": "https://shoelace.style/components/badge"
|
|
207
|
+
}
|
|
208
|
+
]
|
|
209
|
+
},
|
|
210
|
+
{
|
|
211
|
+
"name": "dap-ds-breadcrumb",
|
|
212
|
+
"description": "A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or Web application.\n---\n\n\n### **Slots:**\n - _default_ - The content of the breadcrumb.\n- **separator** - The separator between breadcrumb items. Default is '/'.\n\n### **CSS Properties:**\n - **--dds-breadcrumb-width** - The width of the breadcrumb container (default: 100%) _(default: undefined)_\n- **--dds-breadcrumb-overflow-x** - The horizontal overflow behavior of the breadcrumb (default: auto) _(default: undefined)_\n- **--dds-breadcrumb-transition** - The transition property for the breadcrumb (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-breadcrumb-list-display** - The display property of the breadcrumb list (default: flex) _(default: undefined)_\n- **--dds-breadcrumb-list-flex-wrap** - The flex-wrap property of the breadcrumb list (default: nowrap) _(default: undefined)_\n- **--dds-breadcrumb-list-align-items** - The align-items property of the breadcrumb list (default: center) _(default: undefined)_\n- **--dds-breadcrumb-list-min-width** - The minimum width of the breadcrumb list (default: max-content) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main breadcrumb container.\n- **separator** - The separator of the breadcrumb.",
|
|
213
|
+
"attributes": [
|
|
214
|
+
{ "name": "variant", "values": [] },
|
|
215
|
+
{
|
|
216
|
+
"name": "mobile",
|
|
217
|
+
"description": "Mobile version of the breadcrumb",
|
|
218
|
+
"values": []
|
|
219
|
+
},
|
|
220
|
+
{
|
|
221
|
+
"name": "aria-labelledby",
|
|
222
|
+
"description": "The aria-labelledby of the breadcrumb",
|
|
223
|
+
"values": []
|
|
224
|
+
}
|
|
225
|
+
],
|
|
226
|
+
"references": [
|
|
227
|
+
{
|
|
228
|
+
"name": "Documentation",
|
|
229
|
+
"url": "https://shoelace.style/components/breadcrumb"
|
|
230
|
+
}
|
|
231
|
+
]
|
|
232
|
+
},
|
|
226
233
|
{
|
|
227
234
|
"name": "dap-ds-anchor-heading",
|
|
228
235
|
"description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
|
|
@@ -246,36 +253,29 @@
|
|
|
246
253
|
]
|
|
247
254
|
},
|
|
248
255
|
{
|
|
249
|
-
"name": "dap-ds-
|
|
250
|
-
"description": "
|
|
256
|
+
"name": "dap-ds-accordion-group",
|
|
257
|
+
"description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
|
|
251
258
|
"attributes": [
|
|
252
259
|
{
|
|
253
|
-
"name": "
|
|
254
|
-
"description": "
|
|
255
|
-
"values": [
|
|
256
|
-
{ "name": "neutral" },
|
|
257
|
-
{ "name": "brand" },
|
|
258
|
-
{ "name": "info" },
|
|
259
|
-
{ "name": "positive" },
|
|
260
|
-
{ "name": "warning" },
|
|
261
|
-
{ "name": "negative" }
|
|
262
|
-
]
|
|
263
|
-
},
|
|
264
|
-
{
|
|
265
|
-
"name": "icon",
|
|
266
|
-
"description": "The icon of the badge, this is a name of a built in icon",
|
|
260
|
+
"name": "autoClose",
|
|
261
|
+
"description": "Whether to close other accordions when one is opened.",
|
|
267
262
|
"values": []
|
|
268
263
|
},
|
|
269
264
|
{
|
|
270
|
-
"name": "
|
|
271
|
-
"description": "
|
|
272
|
-
"values": [
|
|
265
|
+
"name": "variant",
|
|
266
|
+
"description": "The variant of the accordion",
|
|
267
|
+
"values": [
|
|
268
|
+
{ "name": "default" },
|
|
269
|
+
{ "name": "collapsed" },
|
|
270
|
+
{ "name": "clean" },
|
|
271
|
+
{ "name": "clean-collapsed" }
|
|
272
|
+
]
|
|
273
273
|
}
|
|
274
274
|
],
|
|
275
275
|
"references": [
|
|
276
276
|
{
|
|
277
277
|
"name": "Documentation",
|
|
278
|
-
"url": "https://shoelace.style/components/
|
|
278
|
+
"url": "https://shoelace.style/components/accordion-group"
|
|
279
279
|
}
|
|
280
280
|
]
|
|
281
281
|
},
|
|
@@ -593,43 +593,6 @@
|
|
|
593
593
|
}
|
|
594
594
|
]
|
|
595
595
|
},
|
|
596
|
-
{
|
|
597
|
-
"name": "dap-ds-checkbox",
|
|
598
|
-
"description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
|
|
599
|
-
"attributes": [
|
|
600
|
-
{
|
|
601
|
-
"name": "indeterminate",
|
|
602
|
-
"description": "Whether the checkbox is indeterminate",
|
|
603
|
-
"values": []
|
|
604
|
-
},
|
|
605
|
-
{
|
|
606
|
-
"name": "preventDefault",
|
|
607
|
-
"description": "Whether the checkbox should prevent the default action",
|
|
608
|
-
"values": []
|
|
609
|
-
},
|
|
610
|
-
{
|
|
611
|
-
"name": "border",
|
|
612
|
-
"description": "This sets up border around the checkbox, when true.",
|
|
613
|
-
"values": []
|
|
614
|
-
},
|
|
615
|
-
{
|
|
616
|
-
"name": "readonly",
|
|
617
|
-
"description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
|
|
618
|
-
"values": []
|
|
619
|
-
},
|
|
620
|
-
{
|
|
621
|
-
"name": "type",
|
|
622
|
-
"description": "The type of the checkbox",
|
|
623
|
-
"values": [{ "name": "normal" }, { "name": "background" }]
|
|
624
|
-
}
|
|
625
|
-
],
|
|
626
|
-
"references": [
|
|
627
|
-
{
|
|
628
|
-
"name": "Documentation",
|
|
629
|
-
"url": "https://shoelace.style/components/checkbox"
|
|
630
|
-
}
|
|
631
|
-
]
|
|
632
|
-
},
|
|
633
596
|
{
|
|
634
597
|
"name": "dap-ds-card-actions",
|
|
635
598
|
"description": "A card actions is a container for actions in a card.\n---\n\n\n### **Slots:**\n - _default_ - The content of the card actions.\n\n### **CSS Properties:**\n - **--dds-card-actions-gap** - The gap between items in the card actions. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-card-actions-padding-lg** - The padding for large size card actions. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-padding-md** - The padding for medium size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-padding-sm** - The padding for small size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-lg** - The margin for large size card actions spacing. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-margin-md** - The margin for medium size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-sm** - The margin for small size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main card actions container.",
|
|
@@ -787,6 +750,43 @@
|
|
|
787
750
|
}
|
|
788
751
|
]
|
|
789
752
|
},
|
|
753
|
+
{
|
|
754
|
+
"name": "dap-ds-checkbox",
|
|
755
|
+
"description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
|
|
756
|
+
"attributes": [
|
|
757
|
+
{
|
|
758
|
+
"name": "indeterminate",
|
|
759
|
+
"description": "Whether the checkbox is indeterminate",
|
|
760
|
+
"values": []
|
|
761
|
+
},
|
|
762
|
+
{
|
|
763
|
+
"name": "preventDefault",
|
|
764
|
+
"description": "Whether the checkbox should prevent the default action",
|
|
765
|
+
"values": []
|
|
766
|
+
},
|
|
767
|
+
{
|
|
768
|
+
"name": "border",
|
|
769
|
+
"description": "This sets up border around the checkbox, when true.",
|
|
770
|
+
"values": []
|
|
771
|
+
},
|
|
772
|
+
{
|
|
773
|
+
"name": "readonly",
|
|
774
|
+
"description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
|
|
775
|
+
"values": []
|
|
776
|
+
},
|
|
777
|
+
{
|
|
778
|
+
"name": "type",
|
|
779
|
+
"description": "The type of the checkbox",
|
|
780
|
+
"values": [{ "name": "normal" }, { "name": "background" }]
|
|
781
|
+
}
|
|
782
|
+
],
|
|
783
|
+
"references": [
|
|
784
|
+
{
|
|
785
|
+
"name": "Documentation",
|
|
786
|
+
"url": "https://shoelace.style/components/checkbox"
|
|
787
|
+
}
|
|
788
|
+
]
|
|
789
|
+
},
|
|
790
790
|
{
|
|
791
791
|
"name": "dap-ds-chip",
|
|
792
792
|
"description": "A chip is a small status descriptor for UI elements.\n---\n\n\n### **Events:**\n - **dds-remove** - Fired when the chip is removed\n- **dds-select** - Fired when the chip is selected\n\n### **CSS Properties:**\n - **--dds-chip-border** - Border of the chip (default: var(--dds-border-width-base) solid var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-chip-border-radius** - Border radius of the chip (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-chip-font-weight** - Font weight of the chip (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-chip-line-height** - Line height of the chip (default: 1.5) _(default: undefined)_\n- **--dds-chip-transition** - Transition timing for chip interactions (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-chip-padding-sm** - Padding for small chip size (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-chip-padding-lg** - Padding for large chip size (default: var(--dds-spacing-200) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-chip-font-size-sm** - Font size for small chip size (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-chip-font-size-lg** - Font size for large chip size (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-chip-background-color** - Background color of the chip (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-chip-text-color** - Text color of the chip (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-chip-hover-background-color** - Background color of the chip on hover (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-chip-active-background-color** - Background color of the chip when active (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-chip-selected-background-color** - Background color of the selected chip (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-chip-selected-text-color** - Text color of the selected chip (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-chip-selected-border-color** - Border color of the selected chip (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-chip-disabled-background-color** - Background color of the disabled chip (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-chip-disabled-text-color** - Text color of the disabled chip (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The base part\n- **content-container** - The container for the content\n- **remove-button** - The remove button\n- **remove-icon** - The icon of the remove icon\n- **remove-icon-base** - The base of the remove icon\n- **remove-icon-base-base** - The base of the remove icon base",
|
|
@@ -1094,7 +1094,7 @@
|
|
|
1094
1094
|
},
|
|
1095
1095
|
{
|
|
1096
1096
|
"name": "dap-ds-datatable",
|
|
1097
|
-
"description": "A data table is a component that displays data in a tabular format.\n---\n\n\n### **Events:**\n - **dds-sorting-change** - Fired when the sorting of the table changes.\n- **dds-selection-change** - Fired when the selection of the table changes.\n- **dds-pagination-change** - Fired when the pagination of the table changes.\n- **dds-row-click** - Fired when a row is clicked.\n\n### **Slots:**\n - **loading** - The loading content of the table.\n- **empty** - The empty content of the table.\n\n### **CSS Properties:**\n - **--dds-datatable-bg-color** - Background color of the table. (default: var(--dds-background-neutral-subtle)). _(default: undefined)_\n- **--dds-datatable-border-color** - Border color of the table cells. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-datatable-header-bg-color** - Background color of the table header. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-datatable-header-text-color** - Text color of the table header. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-datatable-row-hover-bg-color** - Background color of hovered rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-row-selected-bg-color** - Background color of selected rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-cell-padding** - Padding of table cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-header-padding** - Padding of header cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-last-column-padding** - Padding of the last column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-first-column-padding** - Padding of the first column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-border-width** - Width of table borders. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-datatable-stripe-color** - Background color for striped rows. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-datatable-border-radius** - Border radius of the table. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-datatable-shadow** - Box shadow of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-transition-duration** - Duration of hover/selection transitions. (default: 0.2s) _(default: undefined)_\n- **--dds-datatable-z-index** - Z-index of the table. (default: 1) _(default: undefined)_\n- **--dds-datatable-min-height** - Minimum height of the table. (default: auto) _(default: undefined)_\n- **--dds-datatable-max-height** - Maximum height of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-overflow-x** - Horizontal overflow behavior. (default: auto) _(default: undefined)_\n- **--dds-datatable-overflow-y** - Vertical overflow behavior. (default: auto) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main table container.\n- **header** - The header of the table.\n- **header-row** - The header row of the table.\n- **header-cell** - All cells of the header.\n- **body** - The body of the table.\n- **empty** - The empty content of the table.\n- **loading** - The loading content of the table.\n- **row** - All rows of the table.\n- **cell** - All cells of the table.\n- **pager** - The pager of the table.\n- **pager-base** - The base of the pager.\n- **pager-first** - The first button of the pager.\n- **pager-previous** - The previous button of the pager.\n- **pager-next** - The next button of the pager.\n- **pager-last** - The last button of the pager.\n- **pager-page-size-select** - The page size select of the pager.",
|
|
1097
|
+
"description": "A data table is a component that displays data in a tabular format.\n---\n\n\n### **Events:**\n - **dds-sorting-change** - Fired when the sorting of the table changes.\n- **dds-selection-change** - Fired when the selection of the table changes.\n- **dds-pagination-change** - Fired when the pagination of the table changes.\n- **dds-row-click** - Fired when a row is clicked.\n\n### **Slots:**\n - **loading** - The loading content of the table.\n- **empty** - The empty content of the table.\n\n### **CSS Properties:**\n - **--dds-datatable-bg-color** - Background color of the table. (default: var(--dds-background-neutral-subtle)). _(default: undefined)_\n- **--dds-datatable-border-color** - Border color of the table cells. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-datatable-header-bg-color** - Background color of the table header. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-datatable-header-text-color** - Text color of the table header. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-datatable-row-hover-bg-color** - Background color of hovered rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-row-selected-bg-color** - Background color of selected rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-cell-padding** - Padding of table cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-header-padding** - Padding of header cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-last-column-padding** - Padding of the last column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-first-column-padding** - Padding of the first column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-border-width** - Width of table borders. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-datatable-outer-border-width** - Width of the outer container border only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-header-border-width** - Width of the header row bottom border only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-row-border-width** - Width of the row (body cell) bottom borders only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-stripe-color** - Background color for striped rows. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-datatable-border-radius** - Border radius of the table. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-datatable-shadow** - Box shadow of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-transition-duration** - Duration of hover/selection transitions. (default: 0.2s) _(default: undefined)_\n- **--dds-datatable-z-index** - Z-index of the table. (default: 1) _(default: undefined)_\n- **--dds-datatable-min-height** - Minimum height of the table. (default: auto) _(default: undefined)_\n- **--dds-datatable-max-height** - Maximum height of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-overflow-x** - Horizontal overflow behavior. (default: auto) _(default: undefined)_\n- **--dds-datatable-overflow-y** - Vertical overflow behavior. (default: auto) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main table container.\n- **header** - The header of the table.\n- **header-row** - The header row of the table.\n- **header-cell** - All cells of the header.\n- **body** - The body of the table.\n- **empty** - The empty content of the table.\n- **loading** - The loading content of the table.\n- **row** - All rows of the table.\n- **cell** - All cells of the table.\n- **pager** - The pager of the table.\n- **pager-base** - The base of the pager.\n- **pager-first** - The first button of the pager.\n- **pager-previous** - The previous button of the pager.\n- **pager-next** - The next button of the pager.\n- **pager-last** - The last button of the pager.\n- **pager-page-size-select** - The page size select of the pager.",
|
|
1098
1098
|
"attributes": [
|
|
1099
1099
|
{
|
|
1100
1100
|
"name": "rowKey",
|
|
@@ -1244,6 +1244,16 @@
|
|
|
1244
1244
|
"description": "Show the last button.",
|
|
1245
1245
|
"values": []
|
|
1246
1246
|
},
|
|
1247
|
+
{
|
|
1248
|
+
"name": "showPageNumbers",
|
|
1249
|
+
"description": "Show numbered page buttons between the previous and next buttons.",
|
|
1250
|
+
"values": []
|
|
1251
|
+
},
|
|
1252
|
+
{
|
|
1253
|
+
"name": "siblingCount",
|
|
1254
|
+
"description": "How many page numbers to show on each side of the current page.",
|
|
1255
|
+
"values": []
|
|
1256
|
+
},
|
|
1247
1257
|
{
|
|
1248
1258
|
"name": "firstButtonLabel",
|
|
1249
1259
|
"description": "The label of the first button",
|
|
@@ -2709,7 +2719,7 @@
|
|
|
2709
2719
|
},
|
|
2710
2720
|
{
|
|
2711
2721
|
"name": "dap-ds-pager",
|
|
2712
|
-
"description": "A pager is a component that displays pagination controls.\n---\n\n\n### **Events:**\n - **dds-pagination-change** - Event fired when the pagination changes\n\n### **CSS Properties:**\n - **--dds-pager-spacing-vertical** - The vertical spacing of the pager (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-pager-spacing-horizontal** - The horizontal spacing of the pager (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-pager-button-padding** - The padding of the pager buttons (default: var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-pager-button-border-width** - The border width of the pager buttons (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-pager-button-border-color** - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-border-radius** - The border radius of the pager buttons (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-pager-button-background** - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-font-size** - The font size of the pager buttons (default: var(--dds-font-sm, 14px)) _(default: undefined)_\n- **--dds-pager-button-font-weight** - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main pager container.\n- **first** - The first page button.\n- **previous** - The previous page button.\n- **next** - The next page button.\n- **last** - The last page button.\n- **page-size** - The page size select.\n- **pager-button-first-base** - The base of the first page button.\n- **pager-button-first-content** - The content of the first page button.\n- **pager-button-previous-base** - The base of the previous page button.\n- **pager-button-previous-content** - The content of the previous page button.\n- **pager-button-next-base** - The base of the next page button.\n- **pager-button-next-content** - The content of the next page button.\n- **pager-button-last-base** - The base of the last page button.\n- **pager-button-last-content** - The content of the last page button.\n- **page-size-select-base** - The base of the page size select.\n- **page-size-select-trigger** - The trigger of the page size select.",
|
|
2722
|
+
"description": "A pager is a component that displays pagination controls.\n---\n\n\n### **Events:**\n - **dds-pagination-change** - Event fired when the pagination changes\n\n### **CSS Properties:**\n - **--dds-pager-spacing-vertical** - The vertical spacing of the pager (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-pager-spacing-horizontal** - The horizontal spacing of the pager (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-pager-button-padding** - The padding of the pager buttons (default: var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-pager-button-border-width** - The border width of the pager buttons (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-pager-button-border-color** - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-border-radius** - The border radius of the pager buttons (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-pager-button-background** - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-font-size** - The font size of the pager buttons (default: var(--dds-font-sm, 14px)) _(default: undefined)_\n- **--dds-pager-button-font-weight** - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main pager container.\n- **first** - The first page button.\n- **previous** - The previous page button.\n- **next** - The next page button.\n- **last** - The last page button.\n- **page-size** - The page size select.\n- **pager-button-first-base** - The base of the first page button.\n- **pager-button-first-content** - The content of the first page button.\n- **pager-button-previous-base** - The base of the previous page button.\n- **pager-button-previous-content** - The content of the previous page button.\n- **pager-button-next-base** - The base of the next page button.\n- **pager-button-next-content** - The content of the next page button.\n- **pager-button-last-base** - The base of the last page button.\n- **pager-button-last-content** - The content of the last page button.\n- **page-size-select-base** - The base of the page size select.\n- **page-size-select-trigger** - The trigger of the page size select.\n- **page-numbers** - The container of the numbered page buttons (shown when showPageNumbers is 'true').\n- **page-number** - Each numbered page button.\n- **page-number-active** - The active (current) numbered page button.\n- **page-number-base** - The base of each numbered page button.\n- **page-number-content** - The content of each numbered page button.\n- **page-info** - The page info / total count text.",
|
|
2713
2723
|
"attributes": [
|
|
2714
2724
|
{
|
|
2715
2725
|
"name": "disabled",
|
|
@@ -2776,6 +2786,16 @@
|
|
|
2776
2786
|
"description": "Show the last button.",
|
|
2777
2787
|
"values": []
|
|
2778
2788
|
},
|
|
2789
|
+
{
|
|
2790
|
+
"name": "showPageNumbers",
|
|
2791
|
+
"description": "Show numbered page buttons between the previous and next buttons.",
|
|
2792
|
+
"values": []
|
|
2793
|
+
},
|
|
2794
|
+
{
|
|
2795
|
+
"name": "siblingCount",
|
|
2796
|
+
"description": "How many page numbers to show on each side of the current page.",
|
|
2797
|
+
"values": []
|
|
2798
|
+
},
|
|
2779
2799
|
{
|
|
2780
2800
|
"name": "firstButtonLabel",
|
|
2781
2801
|
"description": "The first button label.",
|