diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index c524a444..415e6013 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1996,10 +1996,12 @@ None. ### Slots -| Slot name | Default | Props | Fallback | -| :-------- | :------ | :---- | :------- | -| -- | Yes | -- | -- | -| actions | No | -- | -- | +| Slot name | Default | Props | Fallback | +| :-------- | :------ | :---- | :---------------------- | +| -- | Yes | -- | -- | +| actions | No | -- | -- | +| subtitle | No | -- | {subtitle} | +| title | No | -- | {title} | ### Events @@ -4385,9 +4387,12 @@ export type CarbonTheme = "white" | "g10" | "g80" | "g90" | "g100"; ### Slots -| Slot name | Default | Props | Fallback | -| :-------- | :------ | :---- | :------- | -| -- | Yes | -- | -- | +| Slot name | Default | Props | Fallback | +| :-------- | :------ | :---- | :---------------------- | +| -- | Yes | -- | -- | +| caption | No | -- | {caption} | +| subtitle | No | -- | {subtitle} | +| title | No | -- | {title} | ### Events diff --git a/docs/package.json b/docs/package.json index d0bf6a7b..743c83fa 100644 --- a/docs/package.json +++ b/docs/package.json @@ -11,7 +11,7 @@ "devDependencies": { "@sveltech/routify": "^1.9.9", "autoprefixer": "^10.2.3", - "carbon-components": "10.46.0", + "carbon-components": "10.48.0", "carbon-components-svelte": "../", "carbon-icons-svelte": "^10.38.0", "clipboard-copy": "^4.0.1", diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index e3dbf224..41a03e33 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -5218,7 +5218,19 @@ ], "slots": [ { "name": "__default__", "default": true, "slot_props": "{}" }, - { "name": "actions", "default": false, "slot_props": "{}" } + { "name": "actions", "default": false, "slot_props": "{}" }, + { + "name": "subtitle", + "default": false, + "fallback": "{subtitle}", + "slot_props": "{}" + }, + { + "name": "title", + "default": false, + "fallback": "{title}", + "slot_props": "{}" + } ], "events": [ { @@ -12267,7 +12279,27 @@ "reactive": false } ], - "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], + "slots": [ + { "name": "__default__", "default": true, "slot_props": "{}" }, + { + "name": "caption", + "default": false, + "fallback": "{caption}", + "slot_props": "{}" + }, + { + "name": "subtitle", + "default": false, + "fallback": "{subtitle}", + "slot_props": "{}" + }, + { + "name": "title", + "default": false, + "fallback": "{title}", + "slot_props": "{}" + } + ], "events": [ { "type": "dispatched", diff --git a/docs/src/pages/components/InlineNotification.svx b/docs/src/pages/components/InlineNotification.svx index 80ff1f4a..88b75733 100644 --- a/docs/src/pages/components/InlineNotification.svx +++ b/docs/src/pages/components/InlineNotification.svx @@ -11,6 +11,13 @@ source: Notification/InlineNotification.svelte +### Slottable title, subtitle + + + Error: + An internal server error occurred. + + ### Hidden close button diff --git a/docs/src/pages/components/ToastNotification.svx b/docs/src/pages/components/ToastNotification.svx index eb7f6a0c..80ddaed4 100644 --- a/docs/src/pages/components/ToastNotification.svx +++ b/docs/src/pages/components/ToastNotification.svx @@ -11,6 +11,14 @@ source: Notification/ToastNotification.svelte +### Slottable title, subtitle, caption + + + Error: + An internal server error occurred. + {new Date().toLocaleString()} + + ### Hidden close button diff --git a/docs/yarn.lock b/docs/yarn.lock index ac4413ad..a61e65dc 100644 --- a/docs/yarn.lock +++ b/docs/yarn.lock @@ -845,14 +845,14 @@ caniuse-lite@^1.0.30001173, caniuse-lite@^1.0.30001178: integrity sha512-n8JVqXuZMVSPKiPiypjFtDTXc4jWIdjxull0f92WLo7e1MSi3uJ3NvveakSh/aCl1QKFAvIz3vIj0v+0K+FrXw== carbon-components-svelte@../: - version "0.47.6" + version "0.48.1" dependencies: flatpickr "4.6.9" -carbon-components@10.46.0: - version "10.46.0" - resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.46.0.tgz#f167baa23bbc08a0e53a312eca835a2414b67d21" - integrity sha512-BWO1d/CBGZgyMjGN+nOkjqlfRek56/uFpyKMs443IeaJGvhZ0r7SFC5aeipxlg/BCwhxl5dcruzQ9d0MykNxSw== +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== dependencies: "@carbon/telemetry" "0.0.0-alpha.6" flatpickr "4.6.1" diff --git a/package.json b/package.json index 1403ef26..9b9c587d 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.46.0", + "carbon-components": "10.48.0", "carbon-icons-svelte": "^10.38.0", "husky": "^4.3.8", "lint-staged": "^10.5.3", diff --git a/src/Notification/InlineNotification.svelte b/src/Notification/InlineNotification.svelte index 029e3f02..19cb0588 100644 --- a/src/Notification/InlineNotification.svelte +++ b/src/Notification/InlineNotification.svelte @@ -32,7 +32,6 @@ import { createEventDispatcher, onMount } from "svelte"; import NotificationIcon from "./NotificationIcon.svelte"; - import NotificationTextDetails from "./NotificationTextDetails.svelte"; import NotificationButton from "./NotificationButton.svelte"; const dispatch = createEventDispatcher(); @@ -78,13 +77,15 @@ >
- +
+

+ {title} +

+
+ {subtitle} +
- +
{#if !hideCloseButton} diff --git a/src/Notification/NotificationTextDetails.svelte b/src/Notification/NotificationTextDetails.svelte index c73a5e37..c3fd8fe7 100644 --- a/src/Notification/NotificationTextDetails.svelte +++ b/src/Notification/NotificationTextDetails.svelte @@ -1,4 +1,9 @@
  • diff --git a/src/UIShell/GlobalHeader/HeaderNavMenu.svelte b/src/UIShell/GlobalHeader/HeaderNavMenu.svelte index 74334d5a..78c94858 100644 --- a/src/UIShell/GlobalHeader/HeaderNavMenu.svelte +++ b/src/UIShell/GlobalHeader/HeaderNavMenu.svelte @@ -14,7 +14,23 @@ /** Obtain a reference to the HTML anchor element */ export let ref = null; + import { setContext } from "svelte"; + import { writable } from "svelte/store"; import ChevronDown16 from "../../icons/ChevronDown16.svelte"; + + const selectedItems = writable({}); + + setContext("HeaderNavMenu", { + updateSelectedItems(item) { + selectedItems.update((_items) => ({ + ..._items, + [item.id]: item.isSelected, + })); + }, + }); + + $: isCurrentSubmenu = + Object.values($selectedItems).filter(Boolean).length > 0; -
  • +
  • {} diff --git a/types/Notification/ToastNotification.svelte.d.ts b/types/Notification/ToastNotification.svelte.d.ts index 82d881a6..03e341b7 100644 --- a/types/Notification/ToastNotification.svelte.d.ts +++ b/types/Notification/ToastNotification.svelte.d.ts @@ -73,5 +73,5 @@ export default class ToastNotification extends SvelteComponentTyped< mouseenter: WindowEventMap["mouseenter"]; mouseleave: WindowEventMap["mouseleave"]; }, - { default: {} } + { default: {}; caption: {}; subtitle: {}; title: {} } > {} diff --git a/yarn.lock b/yarn.lock index 0e759b73..768ec49c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -447,10 +447,10 @@ caniuse-lite@^1.0.30001181: resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001183.tgz#7a57ba9d6584119bb5f2bc76d3cc47ba9356b3e2" integrity sha512-7JkwTEE1hlRKETbCFd8HDZeLiQIUcl8rC6JgNjvHCNaxOeNmQ9V4LvQXRUsKIV2CC73qKxljwVhToaA3kLRqTw== -carbon-components@10.46.0: - version "10.46.0" - resolved "https://registry.yarnpkg.com/carbon-components/-/carbon-components-10.46.0.tgz#f167baa23bbc08a0e53a312eca835a2414b67d21" - integrity sha512-BWO1d/CBGZgyMjGN+nOkjqlfRek56/uFpyKMs443IeaJGvhZ0r7SFC5aeipxlg/BCwhxl5dcruzQ9d0MykNxSw== +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== dependencies: "@carbon/telemetry" "0.0.0-alpha.6" flatpickr "4.6.1"