From eb381190c98e05fe51b5619e368d590ea854e352 Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 15 Jun 2022 07:14:09 -0700 Subject: [PATCH 001/755] fix(tree-view): fix type error when keyboard navigating an expanded node (#1350) Fixes #1349 --- src/TreeView/TreeViewNodeList.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/TreeView/TreeViewNodeList.svelte b/src/TreeView/TreeViewNodeList.svelte index b30fdd67..c5afefa3 100644 --- a/src/TreeView/TreeViewNodeList.svelte +++ b/src/TreeView/TreeViewNodeList.svelte @@ -109,7 +109,7 @@ if (parent && e.key === 'ArrowRight') { if (expanded) { - ref.lastChild.firstChild.focus(); + ref.lastChild.firstElementChild?.focus(); } else { expanded = true; expandNode(node, true); From 35031e800ccbb87d4f2ffe35ace37059b9fcb428 Mon Sep 17 00:00:00 2001 From: Eric Liu Date: Wed, 15 Jun 2022 07:15:27 -0700 Subject: [PATCH 002/755] v0.65.3 --- CHANGELOG.md | 6 ++++++ COMPONENT_INDEX.md | 2 +- package.json | 2 +- 3 files changed, 8 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 15aaed97..5ad5cba5 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.65.3](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.65.3) - 2022-06-15 + +**Fixes** + +- fix `TreeView` type error when keyboard navigating an expanded node + ## [0.65.2](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.65.2) - 2022-06-12 **Fixes** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index edc9c974..29cee82b 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.65.2. +> 165 components exported from carbon-components-svelte@0.65.3. ## Components diff --git a/package.json b/package.json index 5d749275..672a229c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.65.2", + "version": "0.65.3", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", From f8b1c8a23add3c90f614f892416918cb12672153 Mon Sep 17 00:00:00 2001 From: metonym Date: Sat, 18 Jun 2022 10:13:42 -0700 Subject: [PATCH 003/755] fix(select): use first `SelectItem` value as default if `selected` is undefined (#1353) Fixes #570 --- src/Select/Select.svelte | 22 ++++++++++++++++++++-- src/Select/SelectItem.svelte | 3 +++ 2 files changed, 23 insertions(+), 2 deletions(-) diff --git a/src/Select/Select.svelte b/src/Select/Select.svelte index b3365693..78eb8c97 100644 --- a/src/Select/Select.svelte +++ b/src/Select/Select.svelte @@ -71,8 +71,26 @@ const dispatch = createEventDispatcher(); const selectedValue = writable(selected); + const defaultSelectId = writable(null); + const defaultValue = writable(null); - setContext("Select", { selectedValue }); + setContext("Select", { + selectedValue, + setDefaultValue: (id, value) => { + /** + * Use the first `SelectItem` value as the + * default value if `selected` is `undefined`. + */ + if ($defaultValue === null) { + defaultSelectId.set(id); + defaultValue.set(value); + } else { + if ($defaultSelectId === id) { + selectedValue.set(value); + } + } + }, + }); afterUpdate(() => { selected = $selectedValue; @@ -80,7 +98,7 @@ }); $: errorId = `error-${id}`; - $: selectedValue.set(selected); + $: selectedValue.set(selected ?? $defaultValue);
diff --git a/src/Select/SelectItem.svelte b/src/Select/SelectItem.svelte index 7edae98c..abd4e771 100644 --- a/src/Select/SelectItem.svelte +++ b/src/Select/SelectItem.svelte @@ -13,8 +13,11 @@ import { getContext, onMount } from "svelte"; + const id = "ccs-" + Math.random().toString(36); const ctx = getContext("Select") || getContext("TimePickerSelect"); + $: ctx?.setDefaultValue?.(id, value); + let selected = false; const unsubscribe = ctx.selectedValue.subscribe((currentValue) => { From 78d3f1328aa07f8c43fd7945e32e33e6dd23e8dd Mon Sep 17 00:00:00 2001 From: metonym Date: Sat, 18 Jun 2022 11:09:41 -0700 Subject: [PATCH 004/755] feat(select): support `selected` prop number type (#1355) * feat(select): support number type * Run "yarn build:docs" * refactor(pagination): do not coerce `pageSize`, `page` to be numbers * test(select): assert selected prop number type --- COMPONENT_INDEX.md | 14 +++++++------- docs/src/COMPONENT_API.json | 4 ++-- src/Pagination/Pagination.svelte | 12 +----------- src/Select/Select.svelte | 26 +++++++++++++++++++------- src/Select/SelectItem.svelte | 5 ++++- tests/Select.test.svelte | 4 ++-- types/Select/Select.svelte.d.ts | 2 +- types/Select/SelectItem.svelte.d.ts | 2 +- 8 files changed, 37 insertions(+), 32 deletions(-) diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 29cee82b..a386f367 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -3147,7 +3147,7 @@ None. | Prop name | Required | Kind | Reactive | Type | Default value | Description | | :---------- | :------- | :--------------- | :------- | ------------------------------------------ | ------------------------------------------------ | ----------------------------------------------- | | ref | No | let | Yes | null | HTMLSelectElement | null | Obtain a reference to the select HTML element | -| selected | No | let | Yes | string | undefined | Specify the selected item value | +| selected | No | let | Yes | string | number | undefined | Specify the selected item value | | size | No | let | No | "sm" | "xl" | undefined | Set the size of the select input | | inline | No | let | No | boolean | false | Set to `true` to use the inline variant | | light | No | let | No | boolean | false | Set to `true` to enable the light variant | @@ -3184,12 +3184,12 @@ None. ### Props -| Prop name | Required | Kind | Reactive | Type | Default value | Description | -| :-------- | :------- | :--------------- | :------- | -------------------- | ------------------ | ----------------------------------- | -| value | No | let | No | string | "" | Specify the option value | -| text | No | let | No | string | "" | Specify the option text | -| hidden | No | let | No | boolean | false | Set to `true` to hide the option | -| disabled | No | let | No | boolean | false | Set to `true` to disable the option | +| Prop name | Required | Kind | Reactive | Type | Default value | Description | +| :-------- | :------- | :--------------- | :------- | --------------------------------- | ------------------ | ----------------------------------- | +| value | No | let | No | string | number | "" | Specify the option value | +| text | No | let | No | string | "" | Specify the option text | +| hidden | No | let | No | boolean | false | Set to `true` to hide the option | +| disabled | No | let | No | boolean | false | Set to `true` to disable the option | ### Slots diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index 975ca64b..5807768b 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -10027,7 +10027,7 @@ "name": "selected", "kind": "let", "description": "Specify the selected item value", - "type": "string", + "type": "string | number", "isFunction": false, "isFunctionDeclaration": false, "isRequired": false, @@ -10252,7 +10252,7 @@ "name": "value", "kind": "let", "description": "Specify the option value", - "type": "string", + "type": "string | number", "value": "\"\"", "isFunction": false, "isFunctionDeclaration": false, diff --git a/src/Pagination/Pagination.svelte b/src/Pagination/Pagination.svelte index 948c9270..acb01456 100644 --- a/src/Pagination/Pagination.svelte +++ b/src/Pagination/Pagination.svelte @@ -85,17 +85,7 @@ } }); - $: { - if (typeof page !== "number") { - page = Number(page); - } - - if (typeof pageSize !== "number") { - pageSize = Number(pageSize); - } - - dispatch("update", { pageSize, page }); - } + $: dispatch("update", { pageSize, page }); $: totalPages = Math.max(Math.ceil(totalItems / pageSize), 1); $: selectItems = Array.from({ length: totalPages }, (_, i) => i); $: backButtonDisabled = disabled || page === 1; diff --git a/src/Select/Select.svelte b/src/Select/Select.svelte index 78eb8c97..1fbbdf81 100644 --- a/src/Select/Select.svelte +++ b/src/Select/Select.svelte @@ -5,7 +5,7 @@ /** * Specify the selected item value - * @type {string} + * @type {string | number} */ export let selected = undefined; @@ -73,6 +73,7 @@ const selectedValue = writable(selected); const defaultSelectId = writable(null); const defaultValue = writable(null); + const itemTypesByValue = writable({}); setContext("Select", { selectedValue, @@ -89,9 +90,24 @@ selectedValue.set(value); } } + + itemTypesByValue.update((types) => ({ + ...types, + [value]: typeof value, + })); }, }); + const handleChange = ({ target }) => { + let value = target.value; + + if ($itemTypesByValue[value] === "number") { + value = Number(value); + } + + selectedValue.set(value); + }; + afterUpdate(() => { selected = $selectedValue; dispatch("change", $selectedValue); @@ -139,9 +155,7 @@ class:bx--select-input="{true}" class:bx--select-input--sm="{size === 'sm'}" class:bx--select-input--xl="{size === 'xl'}" - on:change="{({ target }) => { - selectedValue.set(target.value); - }}" + on:change="{handleChange}" on:input on:focus on:blur @@ -184,9 +198,7 @@ class:bx--select-input="{true}" class:bx--select-input--sm="{size === 'sm'}" class:bx--select-input--xl="{size === 'xl'}" - on:change="{({ target }) => { - selectedValue.set(target.value); - }}" + on:change="{handleChange}" on:input on:focus on:blur diff --git a/src/Select/SelectItem.svelte b/src/Select/SelectItem.svelte index abd4e771..e009ba62 100644 --- a/src/Select/SelectItem.svelte +++ b/src/Select/SelectItem.svelte @@ -1,5 +1,8 @@ ### Fluid form +Note that the `inline` input variants cannot be used within a `FluidForm`. + - + - \ No newline at end of file + + +### Invalid state + + \ No newline at end of file diff --git a/docs/src/pages/framed/FluidForm/FluidFormInvalid.svelte b/docs/src/pages/framed/FluidForm/FluidFormInvalid.svelte new file mode 100644 index 00000000..caabd8dc --- /dev/null +++ b/docs/src/pages/framed/FluidForm/FluidFormInvalid.svelte @@ -0,0 +1,25 @@ + + + + + + diff --git a/src/TextInput/PasswordInput.svelte b/src/TextInput/PasswordInput.svelte index 1066c401..a2d790b0 100644 --- a/src/TextInput/PasswordInput.svelte +++ b/src/TextInput/PasswordInput.svelte @@ -192,39 +192,47 @@ on:blur on:paste /> - + {#if isFluid && invalid} +
+
+ {invalidText} +
+ {/if} + {#if !(isFluid && invalid)} + + {/if}
{#if !isFluid && invalid}
From d5d6294b02d970f36293ee03f0f136924026a403 Mon Sep 17 00:00:00 2001 From: metonym Date: Sat, 25 Jun 2022 16:26:27 -0700 Subject: [PATCH 019/755] refactor(code-snippet): pass required `text` prop to `CopyButton` (#1372) This also passes the `copy` prop to `CopyButton` instead of wrapping it in another function. --- src/CodeSnippet/CodeSnippet.svelte | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/CodeSnippet/CodeSnippet.svelte b/src/CodeSnippet/CodeSnippet.svelte index 82eb63a3..a4b0cce3 100644 --- a/src/CodeSnippet/CodeSnippet.svelte +++ b/src/CodeSnippet/CodeSnippet.svelte @@ -110,11 +110,6 @@ if (height > 0) showMoreLess = ref.getBoundingClientRect().height > 255; } - function copyCode() { - copy(code); - dispatch("copy"); - } - $: expandText = expanded ? showLessText : showMoreText; $: minHeight = expanded ? 16 * 15 : 48; $: maxHeight = expanded ? "none" : 16 * 15 + "px"; @@ -174,7 +169,8 @@ {...$$restProps} on:click on:click="{() => { - copyCode(); + copy(code); + dispatch('copy'); if (animation === 'fade-in') return; animation = 'fade-in'; timeout = setTimeout(() => { @@ -229,12 +225,14 @@
{#if !hideCopyButton} {/if} From c346b8edc0a22b87ef39456e2237600a90f0bdca Mon Sep 17 00:00:00 2001 From: metonym Date: Sun, 26 Jun 2022 13:56:08 -0700 Subject: [PATCH 020/755] fix(side-nav-menu): remove title attribute from menu icon (#1373) --- src/UIShell/SideNavMenu.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/UIShell/SideNavMenu.svelte b/src/UIShell/SideNavMenu.svelte index 30b10107..12008482 100644 --- a/src/UIShell/SideNavMenu.svelte +++ b/src/UIShell/SideNavMenu.svelte @@ -45,7 +45,7 @@ class:bx--side-nav__icon--small="{true}" class:bx--side-nav__submenu-chevron="{true}" > - +
    Date: Sun, 26 Jun 2022 16:43:34 -0700 Subject: [PATCH 021/755] docs: rename `ComboBox` example, do not open modal in `DatePicker` by default (#1374) * docs(combo-box): "Selected id" -> " Initial selected id" * docs(date-picker): do not open modal by default to prevent stealing focusing --- docs/src/pages/components/ComboBox.svx | 2 +- .../pages/framed/DatePicker/DatePickerModal.svelte | 14 ++++++++++++-- 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/docs/src/pages/components/ComboBox.svx b/docs/src/pages/components/ComboBox.svx index 46ee62ed..4e7985b1 100644 --- a/docs/src/pages/components/ComboBox.svx +++ b/docs/src/pages/components/ComboBox.svx @@ -24,7 +24,7 @@ Override the default slot to customize the display of each item. Access the item -### Selected id +### Initial selected id - import { Modal, DatePicker, DatePickerInput } from "carbon-components-svelte"; + import { + Button, + Modal, + DatePicker, + DatePickerInput, + } from "carbon-components-svelte"; + + let open = false; + + From 5a8bd9ca57582d23059f491c0f36ca54e3c1b03a Mon Sep 17 00:00:00 2001 From: metonym Date: Mon, 27 Jun 2022 05:44:05 -0700 Subject: [PATCH 022/755] chore(code-snippet): preserve custom copy event type (#1375) --- COMPONENT_INDEX.md | 2 +- docs/src/COMPONENT_API.json | 8 ++------ src/CodeSnippet/CodeSnippet.svelte | 1 + types/CodeSnippet/CodeSnippet.svelte.d.ts | 2 +- 4 files changed, 5 insertions(+), 8 deletions(-) diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index e9341d08..a5a0a3b4 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -567,12 +567,12 @@ None. | :----------- | :--------- | :---------------- | | expand | dispatched | null | | collapse | dispatched | null | +| copy | dispatched | null | | click | forwarded | -- | | mouseover | forwarded | -- | | mouseenter | forwarded | -- | | mouseleave | forwarded | -- | | animationend | forwarded | -- | -| copy | dispatched | null | ## `CodeSnippetSkeleton` diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index d6c77fe8..88e67162 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -1235,6 +1235,7 @@ "events": [ { "type": "dispatched", "name": "expand", "detail": "null" }, { "type": "dispatched", "name": "collapse", "detail": "null" }, + { "type": "dispatched", "name": "copy", "detail": "null" }, { "type": "forwarded", "name": "click", @@ -1255,12 +1256,7 @@ "name": "mouseleave", "element": "CodeSnippetSkeleton" }, - { - "type": "forwarded", - "name": "animationend", - "element": "CopyButton" - }, - { "type": "dispatched", "name": "copy", "detail": "null" } + { "type": "forwarded", "name": "animationend", "element": "CopyButton" } ], "typedefs": [], "rest_props": { "type": "InlineComponent", "name": "CodeSnippetSkeleton" } diff --git a/src/CodeSnippet/CodeSnippet.svelte b/src/CodeSnippet/CodeSnippet.svelte index a4b0cce3..51358511 100644 --- a/src/CodeSnippet/CodeSnippet.svelte +++ b/src/CodeSnippet/CodeSnippet.svelte @@ -2,6 +2,7 @@ /** * @event {null} expand * @event {null} collapse + * @event {null} copy */ /** diff --git a/types/CodeSnippet/CodeSnippet.svelte.d.ts b/types/CodeSnippet/CodeSnippet.svelte.d.ts index e8e4db15..bdf23e0b 100644 --- a/types/CodeSnippet/CodeSnippet.svelte.d.ts +++ b/types/CodeSnippet/CodeSnippet.svelte.d.ts @@ -122,12 +122,12 @@ export default class CodeSnippet extends SvelteComponentTyped< { expand: CustomEvent; collapse: CustomEvent; + copy: CustomEvent; click: WindowEventMap["click"]; mouseover: WindowEventMap["mouseover"]; mouseenter: WindowEventMap["mouseenter"]; mouseleave: WindowEventMap["mouseleave"]; animationend: WindowEventMap["animationend"]; - copy: CustomEvent; }, { default: {} } > {} From 3b3a9c9a298332de1f68f683aea2ea999c8311e2 Mon Sep 17 00:00:00 2001 From: Eric Liu Date: Mon, 27 Jun 2022 05:51:31 -0700 Subject: [PATCH 023/755] v0.66.1 --- CHANGELOG.md | 20 ++++++++++++++++++++ COMPONENT_INDEX.md | 2 +- package.json | 2 +- 3 files changed, 22 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0830bd80..3edf04fd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,26 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.66.1](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.1) - 2022-06-27 + +**Fixes** + +- support `PasswordInput` invalid state when used in a `FluidForm` +- remove title attribute from `SideNavMenu` icon +- remove tabindex attribute from `SideNavMenu` icon +- override max-height in an expanded `SideNavMenu` +- fix `ComposedModal` type error where the focus node is possibly `null` + +**Refactor** + +- pass required `text` prop from `CodeSnippet` to `CopyButton` to prevent development warning + +**Documentation** + +- add `PasswordInput` example "Invalid state" +- rename `ComboBox` example "Selected id" to "Initial selected id" +- revise `DatePicker` example "DatePicker in a modal" to prevent iframe from stealing focus + ## [0.66.0](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.0) - 2022-06-18 **Features** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index a5a0a3b4..134d599c 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.66.0. +> 165 components exported from carbon-components-svelte@0.66.1. ## Components diff --git a/package.json b/package.json index 30c31073..9e764287 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.66.0", + "version": "0.66.1", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", From 924b6d352eebf5c82da63f0ead450dc59e80ca30 Mon Sep 17 00:00:00 2001 From: tlkh40 <72644753+tlkh40@users.noreply.github.com> Date: Wed, 29 Jun 2022 21:08:51 +0700 Subject: [PATCH 024/755] fix(notification): `on:close` should be cancellable (#1379) Fixes #927 --- src/Notification/InlineNotification.svelte | 10 ++++++++-- src/Notification/ToastNotification.svelte | 10 ++++++++-- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/src/Notification/InlineNotification.svelte b/src/Notification/InlineNotification.svelte index 19cb0588..4cd57717 100644 --- a/src/Notification/InlineNotification.svelte +++ b/src/Notification/InlineNotification.svelte @@ -40,8 +40,14 @@ let timeoutId = undefined; function close(closeFromTimeout) { - open = false; - dispatch("close", { timeout: closeFromTimeout === true }); + const shouldContinue = dispatch( + "close", + { timeout: closeFromTimeout === true }, + { cancelable: true } + ); + if (shouldContinue) { + open = false; + } } onMount(() => { diff --git a/src/Notification/ToastNotification.svelte b/src/Notification/ToastNotification.svelte index ff60b6c7..1d00ba4e 100644 --- a/src/Notification/ToastNotification.svelte +++ b/src/Notification/ToastNotification.svelte @@ -43,8 +43,14 @@ let timeoutId = undefined; function close(closeFromTimeout) { - open = false; - dispatch("close", { timeout: closeFromTimeout === true }); + const shouldContinue = dispatch( + "close", + { timeout: closeFromTimeout === true }, + { cancelable: true } + ); + if (shouldContinue) { + open = false; + } } onMount(() => { From 04f18ae5e99527fb6cb247af41d3d05e051acd08 Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 10:14:22 -0700 Subject: [PATCH 025/755] docs(notification): add examples "Prevent default close behavior" (#1380) Follow-up to #1379 --- .../src/pages/components/InlineNotification.svx | 15 +++++++++++++++ docs/src/pages/components/ToastNotification.svx | 17 ++++++++++++++++- 2 files changed, 31 insertions(+), 1 deletion(-) diff --git a/docs/src/pages/components/InlineNotification.svx b/docs/src/pages/components/InlineNotification.svx index 98b461d4..d976ee49 100644 --- a/docs/src/pages/components/InlineNotification.svx +++ b/docs/src/pages/components/InlineNotification.svx @@ -11,6 +11,21 @@ source: Notification/InlineNotification.svelte +### Prevent default close behavior + +`InlineNotification` is a controlled component. Prevent the default close behavior using the `e.preventDefault()` method in the dispatched `on:close` event. + + +
    + Svelte version 3.48.0 or greater is required. +
    +     + + { + e.preventDefault(); + // custom close logic (e.g., transitions) +}} /> + ### Slottable title, subtitle diff --git a/docs/src/pages/components/ToastNotification.svx b/docs/src/pages/components/ToastNotification.svx index 80ddaed4..a430fb8e 100644 --- a/docs/src/pages/components/ToastNotification.svx +++ b/docs/src/pages/components/ToastNotification.svx @@ -3,7 +3,7 @@ source: Notification/ToastNotification.svelte --- @@ -11,6 +11,21 @@ source: Notification/ToastNotification.svelte +### Prevent default close behavior + +`ToastNotification` is a controlled component. Prevent the default close behavior using the `e.preventDefault()` method in the dispatched `on:close` event. + + +
    + Svelte version 3.48.0 or greater is required. +
    +     + + { + e.preventDefault(); + // custom close logic (e.g., transitions) +}} /> + ### Slottable title, subtitle, caption From 5fa07ab44bd8eed1a88ee66a8c1f46b1aa33c31d Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 10:18:24 -0700 Subject: [PATCH 026/755] v0.66.2 --- CHANGELOG.md | 11 +++++++++++ COMPONENT_INDEX.md | 2 +- package.json | 2 +- 3 files changed, 13 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 3edf04fd..26f11728 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.66.2](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.2) - 2022-06-29 + +**Fixes** + +- allow close event in `ToastNotification`, `InlineNotification` to be cancellable + +**Documentation** + +- add `ToastNotification` example "Prevent default close behavior" +- add `InlineNotification` example "Prevent default close behavior" + ## [0.66.1](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.1) - 2022-06-27 **Fixes** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 134d599c..29f08e56 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.66.1. +> 165 components exported from carbon-components-svelte@0.66.2. ## Components diff --git a/package.json b/package.json index 9e764287..e6793100 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.66.1", + "version": "0.66.2", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", From 052acfc2cebb1c011046f253d97748a720af4e45 Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 10:57:37 -0700 Subject: [PATCH 027/755] Revert "fix(notification): `on:close` should be cancellable (#1379)" (#1381) This reverts commit 924b6d352eebf5c82da63f0ead450dc59e80ca30. --- src/Notification/InlineNotification.svelte | 10 ++-------- src/Notification/ToastNotification.svelte | 10 ++-------- 2 files changed, 4 insertions(+), 16 deletions(-) diff --git a/src/Notification/InlineNotification.svelte b/src/Notification/InlineNotification.svelte index 4cd57717..19cb0588 100644 --- a/src/Notification/InlineNotification.svelte +++ b/src/Notification/InlineNotification.svelte @@ -40,14 +40,8 @@ let timeoutId = undefined; function close(closeFromTimeout) { - const shouldContinue = dispatch( - "close", - { timeout: closeFromTimeout === true }, - { cancelable: true } - ); - if (shouldContinue) { - open = false; - } + open = false; + dispatch("close", { timeout: closeFromTimeout === true }); } onMount(() => { diff --git a/src/Notification/ToastNotification.svelte b/src/Notification/ToastNotification.svelte index 1d00ba4e..ff60b6c7 100644 --- a/src/Notification/ToastNotification.svelte +++ b/src/Notification/ToastNotification.svelte @@ -43,14 +43,8 @@ let timeoutId = undefined; function close(closeFromTimeout) { - const shouldContinue = dispatch( - "close", - { timeout: closeFromTimeout === true }, - { cancelable: true } - ); - if (shouldContinue) { - open = false; - } + open = false; + dispatch("close", { timeout: closeFromTimeout === true }); } onMount(() => { From f08175b6b30df87b870a535b31648250a1d9f98e Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 10:59:45 -0700 Subject: [PATCH 028/755] v0.66.3 --- CHANGELOG.md | 6 ++++++ COMPONENT_INDEX.md | 2 +- package.json | 2 +- 3 files changed, 8 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 26f11728..9547a0de 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.66.3](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.3) - 2022-06-29 + +**Fixes** + +- revert [924b6d35](924b6d352eebf5c82da63f0ead450dc59e80ca30) and re-publish since v0.66.2 contains breaking changes + ## [0.66.2](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.2) - 2022-06-29 **Fixes** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 29f08e56..87bed391 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.66.2. +> 165 components exported from carbon-components-svelte@0.66.3. ## Components diff --git a/package.json b/package.json index e6793100..e03775c2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.66.2", + "version": "0.66.3", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", From aee7f3ba765793b0615a0bc1f172e5f60110146a Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 11:11:33 -0700 Subject: [PATCH 029/755] Revert "Revert "fix(notification): `on:close` should be cancellable (#1379)" (#1381)" (#1382) This reverts commit 052acfc2cebb1c011046f253d97748a720af4e45. --- src/Notification/InlineNotification.svelte | 10 ++++++++-- src/Notification/ToastNotification.svelte | 10 ++++++++-- 2 files changed, 16 insertions(+), 4 deletions(-) diff --git a/src/Notification/InlineNotification.svelte b/src/Notification/InlineNotification.svelte index 19cb0588..4cd57717 100644 --- a/src/Notification/InlineNotification.svelte +++ b/src/Notification/InlineNotification.svelte @@ -40,8 +40,14 @@ let timeoutId = undefined; function close(closeFromTimeout) { - open = false; - dispatch("close", { timeout: closeFromTimeout === true }); + const shouldContinue = dispatch( + "close", + { timeout: closeFromTimeout === true }, + { cancelable: true } + ); + if (shouldContinue) { + open = false; + } } onMount(() => { diff --git a/src/Notification/ToastNotification.svelte b/src/Notification/ToastNotification.svelte index ff60b6c7..1d00ba4e 100644 --- a/src/Notification/ToastNotification.svelte +++ b/src/Notification/ToastNotification.svelte @@ -43,8 +43,14 @@ let timeoutId = undefined; function close(closeFromTimeout) { - open = false; - dispatch("close", { timeout: closeFromTimeout === true }); + const shouldContinue = dispatch( + "close", + { timeout: closeFromTimeout === true }, + { cancelable: true } + ); + if (shouldContinue) { + open = false; + } } onMount(() => { From f59daa20a2cb29252504ab891f28ee05d2dc0c22 Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 11:49:23 -0700 Subject: [PATCH 030/755] docs: specify minimum Svelte version requirement --- README.md | 2 ++ docs/src/pages/index.svelte | 12 ++++++++++-- 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 003757a5..f6579eee 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,8 @@ Other forms of documentation are auto-generated: Install `carbon-components-svelte` as a development dependency. +A minimum Svelte version of 3.48.0 is required to use this library. + ```sh # Yarn yarn add -D carbon-components-svelte diff --git a/docs/src/pages/index.svelte b/docs/src/pages/index.svelte index 5dc4726b..d439f9f1 100644 --- a/docs/src/pages/index.svelte +++ b/docs/src/pages/index.svelte @@ -12,6 +12,7 @@ OutboundLink, RadioButtonGroup, RadioButton, + InlineNotification, } from "carbon-components-svelte"; import TileCard from "../components/TileCard.svelte"; import { theme } from "../store"; @@ -89,8 +90,15 @@ - -

    Installation

    + +

    Installation

    +     From 2fedd6343f4fa0da66fb9e0feba1911e9303cb0f Mon Sep 17 00:00:00 2001 From: metonym Date: Wed, 29 Jun 2022 11:50:25 -0700 Subject: [PATCH 031/755] v0.67.0 --- CHANGELOG.md | 8 ++++++++ COMPONENT_INDEX.md | 2 +- package.json | 2 +- 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 9547a0de..e89ff162 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 +## [0.67.0](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.67.0) - 2022-06-29 + +**Breaking Changes** + +Svelte version >=3.48.0 is required. + +- re-revert [924b6d35](924b6d352eebf5c82da63f0ead450dc59e80ca30) to allow close event in `ToastNotification`, `InlineNotification` to be cancellable + ## [0.66.3](https://github.com/carbon-design-system/carbon-components-svelte/releases/tag/v0.66.3) - 2022-06-29 **Fixes** diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 87bed391..2e88611c 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.66.3. +> 165 components exported from carbon-components-svelte@0.67.0. ## Components diff --git a/package.json b/package.json index e03775c2..7aca2f38 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.66.3", + "version": "0.67.0", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", From 638a43714fdeb55b696a64f96b291f43af7374fe Mon Sep 17 00:00:00 2001 From: metonym Date: Tue, 12 Jul 2022 19:43:45 -0700 Subject: [PATCH 032/755] fix(side-nav): set high `z-index` on open overlay (#1388) Fixes #786 The UI Shell `SideNav` overlay can sometimes be superseded by other elements. This applies a `z-index` value of `6000` to the overlay when open. --- src/UIShell/SideNav.svelte | 1 + 1 file changed, 1 insertion(+) diff --git a/src/UIShell/SideNav.svelte b/src/UIShell/SideNav.svelte index 30aad9b3..6dbadb32 100644 --- a/src/UIShell/SideNav.svelte +++ b/src/UIShell/SideNav.svelte @@ -56,6 +56,7 @@ }}" class:bx--side-nav__overlay="{true}" class:bx--side-nav__overlay-active="{isOpen}" + style="{isOpen && 'z-index: 6000'}" > {/if}