-
+
+
Resources are provisioned based on your account's organization.
@@ -27,6 +27,12 @@
Bottom
Left
+### Alignment
+
+Start
+End
+Center
+
### Interactive
diff --git a/docs/yarn.lock b/docs/yarn.lock
index d8f2b669..26ee964f 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -771,24 +771,24 @@ caniuse-lite@^1.0.30001135, caniuse-lite@^1.0.30001137:
integrity sha512-VAy5RHDfTJhpxnDdp2n40GPPLp3KqNrXz1QqFv4J64HvArKs8nuNMOWkB3ICOaBTU/Aj4rYAo/ytdQDDFF/Pug==
carbon-components-svelte@../:
- version "0.21.0"
+ version "0.25.1"
dependencies:
- carbon-icons-svelte "^10.17.0"
+ carbon-icons-svelte "^10.21.0"
flatpickr "4.6.3"
-carbon-components@^10.23.1:
- version "10.23.1"
- resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.23.1.tgz#cf649a09aa25eac14dc158f0fb79ba625730026c"
- integrity sha512-izeyNCo9cPfdw9358y5VPsDRzmGAO1wAjSnkD5gGEQO46P2HBdQcgXV1IqjAbFuit+TgfG/MrP38u+pmjp4zyQ==
+carbon-components@^10.25.0:
+ version "10.25.0"
+ resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.25.0.tgz#268441eb5f06be35f72790770bed9ba0cd52a0b1"
+ integrity sha512-0XzHaDxJ7aO23xZ7L/efAkSLuo3pKf7h94CAP0RsXPp2c9KL7uYdjtSZLmAqMkDQrOSORnkUju6zQhI+ZYcEIw==
dependencies:
flatpickr "4.6.1"
lodash.debounce "^4.0.8"
warning "^3.0.0"
-carbon-icons-svelte@^10.17.0:
- version "10.17.0"
- resolved "https://registry.npmjs.org/carbon-icons-svelte/-/carbon-icons-svelte-10.17.0.tgz#f7559f58be9c789097ea4035e52dbc4c12691d45"
- integrity sha512-as1RN87YLvF7iepGAGWQOk2oleyb4w17BoHSYyQgE3MceOla04YdSWASK5c22XZZnmMJbbrT17Z34Cl70niz0Q==
+carbon-icons-svelte@^10.21.0:
+ version "10.21.0"
+ resolved "https://registry.npmjs.org/carbon-icons-svelte/-/carbon-icons-svelte-10.21.0.tgz#9bbdd37d5513d484e9706d6335c121f60f3186c4"
+ integrity sha512-5NNaRdmbS4N36dUGNj72Ys3VqVjH3fZ69AhYUHx+bH02GFYCwAaE49qjtP77kP7DKMtDV9NmMEti/P/JB83aYQ==
caseless@~0.12.0:
version "0.12.0"
diff --git a/package.json b/package.json
index b5b2a28c..d83c2d2d 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,7 @@
"@rollup/plugin-node-resolve": "^10.0.0",
"@tsconfig/svelte": "^1.0.10",
"autoprefixer": "^9.8.6",
- "carbon-components-10.23": "npm:carbon-components@10.23.1",
+ "carbon-components-10.25": "npm:carbon-components@10.25.0",
"gh-pages": "^3.1.0",
"husky": "^4.3.0",
"lint-staged": "^10.5.1",
diff --git a/scripts/build-css.js b/scripts/build-css.js
index a6fd0080..fbaa39a2 100644
--- a/scripts/build-css.js
+++ b/scripts/build-css.js
@@ -18,12 +18,12 @@ const shared = {
$css--default-type: true;
$css--plex: true;
- @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--reset.scss";
- @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--font-face.scss";
- @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--helpers.scss";
- @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--body.scss";
- @import "node_modules/carbon-components-10.23/scss/globals/grid/_grid.scss";
- @import "node_modules/carbon-components-10.23/scss/globals/scss/styles.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--reset.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--font-face.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--helpers.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--body.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/grid/_grid.scss";
+ @import "node_modules/carbon-components-10.25/scss/globals/scss/styles.scss";
`,
components: ``,
};
diff --git a/src/ComboBox/ComboBox.svelte b/src/ComboBox/ComboBox.svelte
index c6ab6d32..03d5f933 100644
--- a/src/ComboBox/ComboBox.svelte
+++ b/src/ComboBox/ComboBox.svelte
@@ -82,7 +82,7 @@
*/
export let listRef = null;
- import { createEventDispatcher, afterUpdate } from "svelte";
+ import { createEventDispatcher, afterUpdate, tick } from "svelte";
import WarningFilled16 from "carbon-icons-svelte/lib/WarningFilled16";
import {
ListBox,
@@ -173,9 +173,11 @@
{
if (disabled) return;
open = true;
+ await tick();
+ ref.focus();
}}"
id="{id}"
name="{name}"
@@ -220,7 +222,8 @@
on:focus
on:blur
on:blur="{({ relatedTarget }) => {
- if (relatedTarget && relatedTarget.getAttribute('role') !== 'button') {
+ if (!open || !relatedTarget) return;
+ if (relatedTarget.getAttribute('role') !== 'button' && relatedTarget.getAttribute('role') !== 'searchbox') {
ref.focus();
}
}}"
diff --git a/src/Dropdown/Dropdown.svelte b/src/Dropdown/Dropdown.svelte
index d0c93750..5032f582 100644
--- a/src/Dropdown/Dropdown.svelte
+++ b/src/Dropdown/Dropdown.svelte
@@ -189,11 +189,6 @@
change(-1);
}
}}"
- on:blur="{({ relatedTarget }) => {
- if (relatedTarget) {
- ref.focus();
- }
- }}"
disabled="{disabled}"
translateWithId="{translateWithId}"
id="{id}"
@@ -213,6 +208,7 @@
on:click="{() => {
selectedId = item.id;
selectedIndex = i;
+ ref.focus();
}}"
on:mouseenter="{() => {
highlightedIndex = i;
diff --git a/src/Search/Search.svelte b/src/Search/Search.svelte
index a9a978fd..33c792b5 100644
--- a/src/Search/Search.svelte
+++ b/src/Search/Search.svelte
@@ -120,6 +120,13 @@
}}"
on:focus
on:blur
+ on:keydown
+ on:keydown="{({ key }) => {
+ if (key === 'Escape') {
+ value = '';
+ dispatch('clear');
+ }
+ }}"
/>