mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix(button): only set disabled attribute if true #755 (#757)

Browse source 
* fix(button): only set disabled attribute if true #755

Fixes #755

* Improve docs (#756)

* docs: remove Theme from new components

* docs: add styling instructions

* docs: add styling instructions

* docs: update copy

* fix(button): only set disabled attribute if true #755

Fixes #755

* docs(button): use inline notification for note [ci skip]
This commit is contained in:
Eric Liu 2021-07-18 05:53:56 -07:00 • committed by GitHub
commit 793ecd8dc2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

17
docs/src/pages/components/Button.svx
View file

@ -5,6 +5,7 @@
import TextBold16 from "carbon-icons-svelte/lib/TextBold16";
import TextItalic16 from "carbon-icons-svelte/lib/TextItalic16";
import TextUnderline16 from "carbon-icons-svelte/lib/TextUnderline16";
import Login16 from "carbon-icons-svelte/lib/Login16";
import Preview from "../../components/Preview.svelte";
let index = 1;
@ -36,7 +37,11 @@
### Danger tertiary, icon-only button
**Note:** you must provide an `iconDescription` for the button tooltip.
<InlineNotification svx-ignore title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">
You must provide an `iconDescription` for the button tooltip.
</div>
</InlineNotification>
<Button kind="danger-tertiary"iconDescription="Delete" icon={TrashCan16} />
@ -50,10 +55,18 @@
### Icon-only button
**Note:** you must provide an `iconDescription` for the button tooltip.
<InlineNotification svx-ignore title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">
You must provide an `iconDescription` for the button tooltip.
</div>
</InlineNotification>
<Button iconDescription="Tooltip text" icon={Add16} />
### Icon-only, link button
<Button iconDescription="Login" icon={Login16} href="#" />
### Icon-only button (custom tooltip position)
The tooltip position and alignment can be controlled by `tooltipPosition` and `tooltipAlignment`.

2
src/Button/Button.svelte
View file

@ -95,7 +95,7 @@
$: buttonProps = {
type: href && !disabled ? undefined : type,
tabindex,
disabled,
disabled: disabled === true ? true : undefined,
href,
"aria-pressed": hasIconOnly && kind === "ghost" ? isSelected : undefined,
...$$restProps,