Align v10.38 (#698)

* chore(deps-dev): upgrade carbon-components to v10.38.0

* feat(text-input): support read-only variant

* docs: use consistent lingo for inline variant examples

* docs(popover): add Popover alignment example

* fix(file-uploader): adjust markup to avoid accessibility errors

Ref: 0dfde60e3

* fix(inline-loading): use error filled icon

* fix(inline-loading): render iconDescription as title in error/warning icons

Ref: 51c53c923

* fix(structured-list): update accessibility attributes

* fix(tooltip-definition): use span instead of div

Ref: cb6de3025

* fix(multi-select): close menu when blurring the last filterable option

* fix(multi-select): open/focus field for filterable multiselect #635

* fix(multi-select): unblock focus when blurring input #635

* fix(combo-box): select correct item with keys, allow input after clearing #195

* fix(combo-box): update input text if item is selected

* feat(combo-box): render checkmark icon for selected item

* fix(ui-shell): toggle SideNav rail when clicking the hamburger menu #699

* fix(context-menu): update context menu classes #684

* docs(context-menu): improve demo instructions #684

* fix(context-menu): close menu when clicking anywhere
This commit is contained in:
Eric Liu 2021-06-27 08:46:57 -07:00 committed by GitHub
commit e51f50da0c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
33 changed files with 285 additions and 88 deletions

View file

@ -59,12 +59,16 @@
/** Set to `true` to mark the field as required */
export let required = false;
/** Set to `true` to use inline version */
/** Set to `true` to use the inline variant */
export let inline = false;
/** Set to `true` to use the read-only variant */
export let readonly = false;
import { getContext } from "svelte";
import WarningFilled16 from "carbon-icons-svelte/lib/WarningFilled16/WarningFilled16.svelte";
import WarningAltFilled16 from "carbon-icons-svelte/lib/WarningAltFilled16/WarningAltFilled16.svelte";
import EditOff16 from "carbon-icons-svelte/lib/EditOff16/EditOff16.svelte";
const ctx = getContext("Form");
@ -77,6 +81,8 @@
class:bx--form-item="{true}"
class:bx--text-input-wrapper="{true}"
class:bx--text-input-wrapper--inline="{inline}"
class:bx--text-input-wrapper--light="{light}"
class:bx--text-input-wrapper--readonly="{readonly}"
on:click
on:mouseover
on:mouseenter
@ -142,6 +148,9 @@
bx--text-input__invalid-icon--warning"
/>
{/if}
{#if readonly}
<EditOff16 class="bx--text-input__readonly-icon" />
{/if}
<input
bind:this="{ref}"
data-invalid="{invalid || undefined}"
@ -155,6 +164,7 @@
type="{type}"
value="{value}"
required="{required}"
readonly="{readonly}"
class:bx--text-input="{true}"
class:bx--text-input--light="{light}"
class:bx--text-input--invalid="{invalid}"