mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-17 03:01:25 +00:00
Alignment with Carbon version 10.28 (#505)
* chore(deps-dev): remove @carbon/themes * chore(deps-dev): bump devDependencies * fix(tabs): forward click event to Tab * feat(toggle): dispatch toggle event * feat(tag): dispatch close event * feat(tooltip-icon): make tooltipText slottable * feat(dropdown): add hideLabel prop * docs(select): add "Hidden label" example * refactor(modal): use class directive * feat(modal): dispatch transitionend event * chore(deps-dev): upgrade carbon-components to 10.28.0-rc.0 * feat(date-picker): add warn state * feat(tag): support small size variant * fix(search): add semantic role * feat(toolbar-search): add disabled state * fix(composed-modal): add aria-label prop, update header semantic tags * chore(deps-dev): upgrade carbon-components to v10.28 * docs(overflow-menu): add light variant example * docs(link): document OutboundLink in Component API * chore(tooltip-icon): rename slot to "tooltipText" * docs(component-api): wrap code blocks to minimize width * docs(aspect-ratio): remove inline outline style * fix(tab): do not trigger focus when mounting * docs(tabs): add reactive example Closes #438
This commit is contained in:
Eric Liu
GitHub
parent
251f986304
commit
7cd3723960
47 changed files with 549 additions and 240 deletions
|
|
@ -659,16 +659,16 @@ None.
|
|||
|
||||
### Events
|
||||
|
||||
| Event name | Type | Detail |
|
||||
| :------------ | :--------- | :----- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| transitionend | forwarded | -- |
|
||||
| submit | dispatched | -- |
|
||||
| close | dispatched | -- |
|
||||
| open | dispatched | -- |
|
||||
| Event name | Type | Detail |
|
||||
| :------------ | :--------- | :------------------------------ |
|
||||
| transitionend | dispatched | <code>{ open: boolean; }</code> |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| submit | dispatched | -- |
|
||||
| close | dispatched | -- |
|
||||
| open | dispatched | -- |
|
||||
|
||||
## `Content`
|
||||
|
||||
|
|
@ -916,6 +916,8 @@ None.
|
|||
| hideLabel | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text |
|
||||
| invalid | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an invalid state |
|
||||
| invalidText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the invalid state text |
|
||||
| warn | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an warning state |
|
||||
| warnText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the warning state text |
|
||||
| name | <code>let</code> | No | <code>string</code> | -- | Set a name for the input element |
|
||||
|
||||
### Slots
|
||||
|
|
@ -988,6 +990,7 @@ export interface DropdownItem {
|
|||
| warnText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the warning state text |
|
||||
| helperText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the helper text |
|
||||
| label | <code>let</code> | No | <code>string</code> | -- | Specify the list box label |
|
||||
| hideLabel | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to visually hide the label text |
|
||||
| translateWithId | <code>let</code> | No | <code>(id: any) => string</code> | -- | Override the default translation ids |
|
||||
| id | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the list box component |
|
||||
| name | <code>let</code> | No | <code>string</code> | -- | Specify a name attribute for the list box |
|
||||
|
|
@ -2040,17 +2043,18 @@ None.
|
|||
|
||||
### Events
|
||||
|
||||
| Event name | Type | Detail |
|
||||
| :---------------------- | :--------- | :----- |
|
||||
| keydown | forwarded | -- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| submit | dispatched | -- |
|
||||
| click:button--secondary | dispatched | -- |
|
||||
| close | dispatched | -- |
|
||||
| open | dispatched | -- |
|
||||
| Event name | Type | Detail |
|
||||
| :---------------------- | :--------- | :------------------------------ |
|
||||
| transitionend | dispatched | <code>{ open: boolean; }</code> |
|
||||
| keydown | forwarded | -- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| submit | dispatched | -- |
|
||||
| click:button--secondary | dispatched | -- |
|
||||
| close | dispatched | -- |
|
||||
| open | dispatched | -- |
|
||||
|
||||
## `ModalBody`
|
||||
|
||||
|
|
@ -3401,6 +3405,7 @@ None.
|
|||
|
||||
| Event name | Type | Detail |
|
||||
| :--------- | :-------- | :----- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
|
|
@ -3624,6 +3629,7 @@ None.
|
|||
| Prop name | Kind | Reactive | Type | Default value | Description |
|
||||
| :-------- | :--------------- | :------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------ |
|
||||
| type | <code>let</code> | No | <code>"red" | "magenta" | "purple" | "blue" | "cyan" | "teal" | "green" | "gray" | "cool-gray" | "warm-gray" | "high-contrast"</code> | -- | Specify the type of tag |
|
||||
| size | <code>let</code> | No | <code>"sm" | "default"</code> | <code>"default"</code> | -- |
|
||||
| filter | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use filterable variant |
|
||||
| disabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable a filterable tag |
|
||||
| skeleton | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to display the skeleton state |
|
||||
|
|
@ -3639,18 +3645,21 @@ None.
|
|||
|
||||
### Events
|
||||
|
||||
| Event name | Type | Detail |
|
||||
| :--------- | :-------- | :----- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| Event name | Type | Detail |
|
||||
| :--------- | :--------- | :----- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| close | dispatched | -- |
|
||||
|
||||
## `TagSkeleton`
|
||||
|
||||
### Props
|
||||
|
||||
None.
|
||||
| Prop name | Kind | Reactive | Type | Default value | Description |
|
||||
| :-------- | :--------------- | :------- | :--------------------------------- | ---------------------- | ----------- |
|
||||
| size | <code>let</code> | No | <code>"sm" | "default"</code> | <code>"default"</code> | -- |
|
||||
|
||||
### Slots
|
||||
|
||||
|
|
@ -3957,16 +3966,17 @@ None.
|
|||
|
||||
### Events
|
||||
|
||||
| Event name | Type | Detail |
|
||||
| :--------- | :-------- | :----- |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| change | forwarded | -- |
|
||||
| keyup | forwarded | -- |
|
||||
| focus | forwarded | -- |
|
||||
| blur | forwarded | -- |
|
||||
| Event name | Type | Detail |
|
||||
| :--------- | :--------- | :--------------------------------- |
|
||||
| toggle | dispatched | <code>{ toggled: boolean; }</code> |
|
||||
| click | forwarded | -- |
|
||||
| mouseover | forwarded | -- |
|
||||
| mouseenter | forwarded | -- |
|
||||
| mouseleave | forwarded | -- |
|
||||
| change | forwarded | -- |
|
||||
| keyup | forwarded | -- |
|
||||
| focus | forwarded | -- |
|
||||
| blur | forwarded | -- |
|
||||
|
||||
## `ToggleSkeleton`
|
||||
|
||||
|
|
@ -4141,6 +4151,7 @@ None.
|
|||
| expanded | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to expand the search bar |
|
||||
| value | <code>let</code> | Yes | <code>number | string</code> | <code>""</code> | Specify the value of the search input |
|
||||
| persistent | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to keep the search bar expanded |
|
||||
| disabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the search bar |
|
||||
| tabindex | <code>let</code> | No | <code>string</code> | <code>"0"</code> | Specify the tabindex |
|
||||
|
||||
### Slots
|
||||
|
|
@ -4225,19 +4236,20 @@ None.
|
|||
|
||||
### Props
|
||||
|
||||
| Prop name | Kind | Reactive | Type | Default value | Description |
|
||||
| :---------- | :--------------- | :------- | :-------------------------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------- |
|
||||
| ref | <code>let</code> | Yes | <code>null | HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the button HTML element |
|
||||
| tooltipText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the tooltip text |
|
||||
| align | <code>let</code> | No | <code>"start" | "center" | "end"</code> | <code>"center"</code> | Set the alignment of the tooltip relative to the icon |
|
||||
| direction | <code>let</code> | No | <code>"top" | "right" | "bottom" | "left"</code> | <code>"bottom"</code> | Set the direction of the tooltip relative to the icon |
|
||||
| id | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the span element |
|
||||
| Prop name | Kind | Reactive | Type | Default value | Description |
|
||||
| :---------- | :--------------- | :------- | :-------------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------ |
|
||||
| ref | <code>let</code> | Yes | <code>null | HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the button HTML element |
|
||||
| tooltipText | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the tooltip text.<br />Alternatively, use the "tooltipText" slot |
|
||||
| align | <code>let</code> | No | <code>"start" | "center" | "end"</code> | <code>"center"</code> | Set the alignment of the tooltip relative to the icon |
|
||||
| direction | <code>let</code> | No | <code>"top" | "right" | "bottom" | "left"</code> | <code>"bottom"</code> | Set the direction of the tooltip relative to the icon |
|
||||
| id | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the span element |
|
||||
|
||||
### Slots
|
||||
|
||||
| Slot name | Default | Props | Fallback |
|
||||
| :-------- | :------ | :---- | :------- |
|
||||
| -- | Yes | -- | -- |
|
||||
| Slot name | Default | Props | Fallback |
|
||||
| :---------- | :------ | :---- | :------------------------- |
|
||||
| -- | Yes | -- | -- |
|
||||
| tooltipText | No | -- | <code>{tooltipText}</code> |
|
||||
|
||||
### Events
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue