From 7a98ec26eb6feb09101dc907d272e8000fcc35d1 Mon Sep 17 00:00:00 2001 From: brunnerh Date: Thu, 8 Dec 2022 05:02:24 +0100 Subject: [PATCH] fix(progress-step): inherit unclickable styling if `preventChangeOnClick` is `true` (#1535) Fixes #1534 --- src/ProgressIndicator/ProgressIndicator.svelte | 3 +++ src/ProgressIndicator/ProgressStep.svelte | 6 ++++-- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/src/ProgressIndicator/ProgressIndicator.svelte b/src/ProgressIndicator/ProgressIndicator.svelte index 63a7d7a9..9a0dee16 100644 --- a/src/ProgressIndicator/ProgressIndicator.svelte +++ b/src/ProgressIndicator/ProgressIndicator.svelte @@ -19,10 +19,12 @@ const stepsById = derived(steps, ($) => $.reduce((a, c) => ({ ...a, [c.id]: c }), {}) ); + const preventChangeOnClickStore = writable(preventChangeOnClick); setContext("ProgressIndicator", { steps, stepsById, + preventChangeOnClick: { subscribe: preventChangeOnClickStore.subscribe }, add: (step) => { steps.update((_) => { if (step.id in $stepsById) { @@ -58,6 +60,7 @@ current: i === currentIndex, })) ); + $: preventChangeOnClickStore.set(preventChangeOnClick); diff --git a/src/ProgressIndicator/ProgressStep.svelte b/src/ProgressIndicator/ProgressStep.svelte index 71f89db0..d3cde4ea 100644 --- a/src/ProgressIndicator/ProgressStep.svelte +++ b/src/ProgressIndicator/ProgressStep.svelte @@ -31,7 +31,8 @@ let step = {}; - const { stepsById, add, change } = getContext("ProgressIndicator"); + const { stepsById, add, change, preventChangeOnClick } = + getContext("ProgressIndicator"); $: add({ id, complete, disabled }); @@ -67,7 +68,8 @@ aria-disabled="{disabled}" tabindex="{!current && !disabled ? '0' : '-1'}" class:bx--progress-step-button="{true}" - class:bx--progress-step-button--unclickable="{current}" + class:bx--progress-step-button--unclickable="{current || + $preventChangeOnClick}" on:click on:click="{() => { if (!step.complete) return;