From 4d51250173632ee50bc0e070ef03a423b6aa05b2 Mon Sep 17 00:00:00 2001 From: Eric Liu Date: Sat, 22 Jan 2022 08:02:24 -0800 Subject: [PATCH] Align 10.51 (#1021) * chore(deps-dev): upgrade carbon-components to v10.51.0 * fix(slider): input should also be labelled * refactor(date-picker): remove hotfix logic to prevent disabled icon from being clickable Ref: https://github.com/carbon-design-system/carbon-components-svelte/pull/860 * feat(progress-step): update icons for current, incomplete steps --- docs/package.json | 2 +- docs/yarn.lock | 8 ++-- package.json | 2 +- src/DatePicker/DatePickerInput.svelte | 5 +-- src/ProgressIndicator/ProgressStep.svelte | 14 ++----- src/Slider/Slider.svelte | 2 +- src/icons/CircleDash16.svelte | 51 +++++++++++++++++++++++ src/icons/Incomplete16.svelte | 51 +++++++++++++++++++++++ yarn.lock | 8 ++-- 9 files changed, 118 insertions(+), 25 deletions(-) create mode 100644 src/icons/CircleDash16.svelte create mode 100644 src/icons/Incomplete16.svelte diff --git a/docs/package.json b/docs/package.json index 48ca11124f..5a0fc2b20e 100644 --- a/docs/package.json +++ b/docs/package.json @@ -12,7 +12,7 @@ "@sveltech/routify": "^1.9.9", "@sveltejs/vite-plugin-svelte": "^1.0.0-next.33", "autoprefixer": "^10.2.3", - "carbon-components": "10.48.0", + "carbon-components": "10.51.0", "carbon-components-10.47": "npm:carbon-components@10.47", "carbon-components-svelte": "../", "carbon-icons-svelte": "^10.44.3", diff --git a/docs/yarn.lock b/docs/yarn.lock index a7cf4311f0..7782892d74 100644 --- a/docs/yarn.lock +++ b/docs/yarn.lock @@ -471,10 +471,10 @@ carbon-components-svelte@../: dependencies: flatpickr "4.6.9" -carbon-components@10.48.0: - version "10.48.0" - resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.48.0.tgz#e1c31b7b5d27cf12299fd86f6c9b8f0546bb6b43" - integrity sha512-kz6WlB4sVyOW/fUZLQ+f83cS2AAvcNRXkMi6au1guUHMdoTtIBz62AGKGxq54Xy2hQZK0Ca6aH01NopxOV4wUw== +carbon-components@10.51.0: + version "10.51.0" + resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.51.0.tgz#a09b259db12fa3ea7868489bbea6cb165d4f814a" + integrity sha512-TkcfsYdFioZBx5vasC6bMOxI4XqJPt6EM7AqWAjwOeS7HByfBREYALHbZ3pBslb9yauoSbxQFKO2JlK5l+Baag== dependencies: "@carbon/telemetry" "0.0.0-alpha.6" flatpickr "4.6.1" diff --git a/package.json b/package.json index c825055f61..b19c273797 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,7 @@ "@rollup/plugin-node-resolve": "^11.1.1", "@tsconfig/svelte": "^1.0.10", "autoprefixer": "^10.2.4", - "carbon-components": "10.48.0", + "carbon-components": "10.51.0", "carbon-components-10.47": "npm:carbon-components@10.47", "carbon-icons-svelte": "^10.38.0", "husky": "^4.3.8", diff --git a/src/DatePicker/DatePickerInput.svelte b/src/DatePicker/DatePickerInput.svelte index e39483e52c..2d6d87394e 100644 --- a/src/DatePicker/DatePickerInput.svelte +++ b/src/DatePicker/DatePickerInput.svelte @@ -154,10 +154,7 @@ class="bx--date-picker__icon" aria-label="{iconDescription}" title="{iconDescription}" - on:click="{() => { - if (disabled || ref.matches(':disabled')) return; - openCalendar(); - }}" + on:click="{openCalendar}" /> {/if} diff --git a/src/ProgressIndicator/ProgressStep.svelte b/src/ProgressIndicator/ProgressStep.svelte index fba6bb3345..e4ef4ba4e3 100644 --- a/src/ProgressIndicator/ProgressStep.svelte +++ b/src/ProgressIndicator/ProgressStep.svelte @@ -26,6 +26,8 @@ import { onMount, getContext } from "svelte"; import CheckmarkOutline16 from "../icons/CheckmarkOutline16.svelte"; import Warning16 from "../icons/Warning16.svelte"; + import CircleDash16 from "../icons/CircleDash16.svelte"; + import Incomplete16 from "../icons/Incomplete16.svelte"; let step = {}; @@ -84,19 +86,11 @@ {#if invalid} {:else if current} - - - {description} - + {:else if complete} {:else} - - {description} - - + {/if}

{label}

diff --git a/src/Slider/Slider.svelte b/src/Slider/Slider.svelte index 7142697791..16687a4cbc 100644 --- a/src/Slider/Slider.svelte +++ b/src/Slider/Slider.svelte @@ -172,7 +172,6 @@ tabindex="0" class:bx--slider__thumb="{true}" style="left: {left}%" - aria-labelledby="{labelId}" aria-valuemax="{max}" aria-valuemin="{min}" aria-valuenow="{value}" @@ -205,6 +204,7 @@ class:bx--text-input--light="{light}" class:bx--text-input--invalid="{invalid}" value="{value}" + aria-labelledby="{$$props['aria-label'] ? undefined : labelId}" aria-label="{$$props['aria-label'] || 'Slider number input'}" disabled="{disabled}" required="{required}" diff --git a/src/icons/CircleDash16.svelte b/src/icons/CircleDash16.svelte new file mode 100644 index 0000000000..a214819b8b --- /dev/null +++ b/src/icons/CircleDash16.svelte @@ -0,0 +1,51 @@ + + + + + + + {#if title} + {title} + {/if} + + diff --git a/src/icons/Incomplete16.svelte b/src/icons/Incomplete16.svelte new file mode 100644 index 0000000000..23c303d206 --- /dev/null +++ b/src/icons/Incomplete16.svelte @@ -0,0 +1,51 @@ + + + + + + + {#if title} + {title} + {/if} + + diff --git a/yarn.lock b/yarn.lock index 7941e60d12..91aa564eb0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -457,10 +457,10 @@ caniuse-lite@^1.0.30001181: lodash.debounce "^4.0.8" warning "^3.0.0" -carbon-components@10.48.0: - version "10.48.0" - resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.48.0.tgz#e1c31b7b5d27cf12299fd86f6c9b8f0546bb6b43" - integrity sha512-kz6WlB4sVyOW/fUZLQ+f83cS2AAvcNRXkMi6au1guUHMdoTtIBz62AGKGxq54Xy2hQZK0Ca6aH01NopxOV4wUw== +carbon-components@10.51.0: + version "10.51.0" + resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.51.0.tgz#a09b259db12fa3ea7868489bbea6cb165d4f814a" + integrity sha512-TkcfsYdFioZBx5vasC6bMOxI4XqJPt6EM7AqWAjwOeS7HByfBREYALHbZ3pBslb9yauoSbxQFKO2JlK5l+Baag== dependencies: "@carbon/telemetry" "0.0.0-alpha.6" flatpickr "4.6.1"