Merge branch 'carbon-design-system:master' into patch-1

2025-09-18 11:36:36 +00:00 · 2023-04-13 23:47:15 +02:00 · 2023-04-13 23:47:15 +02:00 · b2db84b564
commit b2db84b564
parent a2e6822920 8b57f235f2
30 changed files with 81 additions and 83 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@ -23,3 +23,13 @@ jobs:
          yarn build:lib
          yarn test:types
          yarn lint
+
+  deploy-docs:
+    if: github.ref == 'refs/heads/master'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Trigger deploy
+        env:
+          deploy_url: ${{ secrets.RENDER_DEPLOY_HOOK_URL }}
+        run: |
+          curl -X GET "$deploy_url"
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -2,26 +2,32 @@

 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.

-### [0.73.3](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.2...v0.73.3) (2023-03-11)
+### [0.73.5](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.4...v0.73.5) (2023-03-26)

+### [0.73.4](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.3...v0.73.4) (2023-03-21)

 ### Bug Fixes

-* **1684:** hide helper text container in password input when not used ([#1685](https://github.com/carbon-design-system/carbon-components-svelte/issues/1685)) ([42349eb](https://github.com/carbon-design-system/carbon-components-svelte/commit/42349ebc61fdc8756fc5209d4cb63f4f9a63dce9))
+- **selectable-tile:** include dispatched events in types ([#1695](https://github.com/carbon-design-system/carbon-components-svelte/issues/1695)) ([ca40dd1](https://github.com/carbon-design-system/carbon-components-svelte/commit/ca40dd18c2af1bc755b857c39469427038f20ece)), closes [#1694](https://github.com/carbon-design-system/carbon-components-svelte/issues/1694)
+- **text-input:** correctly set input padding for warning state ([#1688](https://github.com/carbon-design-system/carbon-components-svelte/issues/1688)) ([821233a](https://github.com/carbon-design-system/carbon-components-svelte/commit/821233ab4f0bf247dea6a8aa32b79d15424ff059)), closes [#1687](https://github.com/carbon-design-system/carbon-components-svelte/issues/1687)
+
+### [0.73.3](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.2...v0.73.3) (2023-03-11)
+
+### Bug Fixes
+
+- **1684:** hide helper text container in password input when not used ([#1685](https://github.com/carbon-design-system/carbon-components-svelte/issues/1685)) ([42349eb](https://github.com/carbon-design-system/carbon-components-svelte/commit/42349ebc61fdc8756fc5209d4cb63f4f9a63dce9))

 ### [0.73.2](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.1...v0.73.2) (2023-02-27)

-
 ### Bug Fixes

-* `readonly` should override `error` behavior in `TextInput`, `NumberInput` ([#1666](https://github.com/carbon-design-system/carbon-components-svelte/issues/1666)) ([6386c33](https://github.com/carbon-design-system/carbon-components-svelte/commit/6386c33f939b5fa310e8eb5a51412c6151de75d2)), closes [/github.com/carbon-design-system/carbon-components-svelte/pull/1666#pullrequestreview-1314558645](https://github.com/carbon-design-system//github.com/carbon-design-system/carbon-components-svelte/pull/1666/issues/pullrequestreview-1314558645)
+- `readonly` should override `error` behavior in `TextInput`, `NumberInput` ([#1666](https://github.com/carbon-design-system/carbon-components-svelte/issues/1666)) ([6386c33](https://github.com/carbon-design-system/carbon-components-svelte/commit/6386c33f939b5fa310e8eb5a51412c6151de75d2)), closes [/github.com/carbon-design-system/carbon-components-svelte/pull/1666#pullrequestreview-1314558645](https://github.com/carbon-design-system//github.com/carbon-design-system/carbon-components-svelte/pull/1666/issues/pullrequestreview-1314558645)

 ### [0.73.1](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.73.0...v0.73.1) (2023-02-19)

-
 ### Bug Fixes

-* **textinput/passwordinput:** apply aria-describedby to hint text ([b435be4](https://github.com/carbon-design-system/carbon-components-svelte/commit/b435be4f1221b30c9afd7a9e1c6867b38eeadeaa)), closes [#1633](https://github.com/carbon-design-system/carbon-components-svelte/issues/1633)
+- **textinput/passwordinput:** apply aria-describedby to hint text ([b435be4](https://github.com/carbon-design-system/carbon-components-svelte/commit/b435be4f1221b30c9afd7a9e1c6867b38eeadeaa)), closes [#1633](https://github.com/carbon-design-system/carbon-components-svelte/issues/1633)

 ### [0.73.0](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.72.3...v0.73.0) (2023-02-19)

--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@ -1,6 +1,6 @@
 # Component Index

-> 165 components exported from carbon-components-svelte@0.73.3.
+> 165 components exported from carbon-components-svelte@0.73.5.

 ## Components

@ -3274,13 +3274,15 @@ None.

 ### Events

-| Event name | Type      | Detail |
-| :--------- | :-------- | :----- |
-| click      | forwarded | --     |
-| mouseover  | forwarded | --     |
-| mouseenter | forwarded | --     |
-| mouseleave | forwarded | --     |
-| keydown    | forwarded | --     |
+| Event name | Type       | Detail              |
+| :--------- | :--------- | :------------------ |
+| select     | dispatched | <code>string</code> |
+| deselect   | dispatched | <code>string</code> |
+| click      | forwarded  | --                  |
+| mouseover  | forwarded  | --                  |
+| mouseenter | forwarded  | --                  |
+| mouseleave | forwarded  | --                  |
+| keydown    | forwarded  | --                  |

 ## `SideNav`

--- a/README.md
+++ b/README.md
@ -4,7 +4,7 @@
 ![GitHub](https://img.shields.io/github/license/ibm/carbon-components-svelte?color=262626&style=for-the-badge)
 ![npm downloads to date](https://img.shields.io/npm/dt/carbon-components-svelte?color=262626&style=for-the-badge)
 <a href="https://discord.gg/J7JEUEkTRX">
-  <img src="https://img.shields.io/discord/689212587170201628?color=5865F2&style=for-the-badge" alt="Chat with us on Discord">
+<img src="https://img.shields.io/discord/689212587170201628?color=5865F2&style=for-the-badge" alt="Chat with us on Discord">
 </a>

 Carbon Components Svelte is a [Svelte](https://github.com/sveltejs/svelte) component library that implements the [Carbon Design System](https://github.com/carbon-design-system), an open source design system by IBM.
@ -20,10 +20,6 @@ The Carbon Svelte portfolio also includes:

 ## [Documentation](https://carbon-components-svelte.onrender.com)

-The documentation site is deployed to [Render](https://render.com) as a Static Site. See [render.yaml](render.yaml) for details.
-
-[![Deploy to Render](https://render.com/images/deploy-to-render-button.svg)](https://render.com/deploy?repo=https://github.com/carbon-design-system/carbon-components-svelte)
-
 Other forms of documentation are auto-generated:

 - **[TypeScript definitions](types)**: Component TypeScript definitions
--- a/docs/package.json
+++ b/docs/package.json
@ -22,7 +22,7 @@
    "prism-svelte": "^0.4.7",
    "prismjs": "^1.28.0",
    "remark-slug": "^6.0.0",
-    "svelte": "^3.49.0",
+    "svelte": "^3.57.0",
    "vite": "^3.0.9"
  },
  "routify": {
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@ -10551,6 +10551,8 @@
      "moduleExports": [],
      "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }],
      "events": [
+        { "type": "dispatched", "name": "select", "detail": "string" },
+        { "type": "dispatched", "name": "deselect", "detail": "string" },
        { "type": "forwarded", "name": "click", "element": "label" },
        { "type": "forwarded", "name": "mouseover", "element": "label" },
        { "type": "forwarded", "name": "mouseenter", "element": "label" },
--- a/docs/src/components/Theme.svelte
+++ b/docs/src/components/Theme.svelte
@ -1,30 +0,0 @@
-<script>
-  export let persist = false;
-  export let persistKey = "carbon-theme";
-  export const themes = ["white", "g10", "g80", "g90", "g100"];
-
-  import { onMount, afterUpdate } from "svelte";
-  import { theme } from "../store";
-
-  const isValidTheme = (value) => themes.includes(value);
-
-  onMount(() => {
-    try {
-      const persisted_theme = localStorage.getItem(persistKey);
-      if (isValidTheme(persisted_theme)) theme.set(persisted_theme);
-    } catch (e) {}
-  });
-
-  afterUpdate(() => {
-    if (isValidTheme($theme)) {
-      document.documentElement.setAttribute("theme", $theme);
-      if (persist) {
-        try {
-          localStorage.setItem(persistKey, $theme);
-        } catch (e) {}
-      }
-    }
-  });
-</script>
-
-<slot />
--- a/docs/src/global.css
+++ b/docs/src/global.css
@ -33,6 +33,11 @@ html[theme="g90"] .code-override {
  overflow-x: auto;
 }

+/* Addig this to the layout grid fixes overstretching. */
+.fix-overflow {
+  min-width: 0;
+}
+
 .token.tag,
 .token.operator {
  color: #6ea6ff;
@ -167,16 +172,6 @@ html[theme="g90"] .code-override {
  margin-bottom: var(--cds-layout-01);
 }

-.table {
-  position: sticky;
-  max-height: calc(100vh - 3rem);
-  top: 3rem;
-  padding-top: var(--cds-spacing-05);
-  padding-bottom: var(--cds-spacing-05);
-  padding-left: var(--cds-spacing-08);
-  overflow-y: auto;
-}
-
 .code-01 {
  font-size: var(--cds-code-01-font-size);
  font-weight: var(--cds-code-01-font-weight);
--- a/docs/src/layouts/ComponentLayout.svelte
+++ b/docs/src/layouts/ComponentLayout.svelte
@ -66,7 +66,7 @@
 </script>

 <Content data-components>
-  <Grid>
+  <Grid class="fix-overflow">
    <Row>
      <Column>
        <h1>{component}</h1>
--- a/docs/src/pages/_layout.svelte
+++ b/docs/src/pages/_layout.svelte
@ -12,10 +12,11 @@
    SideNav,
    SideNavItems,
    SideNavMenuItem,
+    Theme,
    Tag,
  } from "carbon-components-svelte";
  import LogoGithub from "carbon-icons-svelte/lib/LogoGithub.svelte";
-  import Theme from "../components/Theme.svelte";
+  import { theme } from "../store";

  const deprecated = [];
  const new_components = [];
@ -38,7 +39,7 @@
 <!-- routify:options bundle=true -->
 <svelte:window bind:innerWidth />

-<Theme persist>
+<Theme persist bind:theme="{$theme}">
  <Header
    aria-label="Navigation"
    href="{$url('/')}"
--- a/docs/src/pages/components/Slider.svx
+++ b/docs/src/pages/components/Slider.svx
@ -9,17 +9,17 @@ components: ["Slider", "SliderSkeleton"]

 ## Default

-<Slider />
+<Slider labelText="Instances" value={0} />

 ## Full width

 Set `fullWidth` to `true` for the slider to span the full width of its containing element.

-<Slider fullWidth />
+<Slider labelText="Instances" fullWidth value={0} />

 ## Hidden text input

-<Slider hideTextInput />
+<Slider labelText="Instances" hideTextInput value={0} />

 ## Custom minimum, maximum values

--- a/docs/src/pages/components/Tag.svx
+++ b/docs/src/pages/components/Tag.svx
@ -41,7 +41,7 @@

 ## Custom icon

-Note: rendering a custom icon cannnot be used with the filterable variant.
+Note: rendering a custom icon cannot be used with the filterable variant.

 <Tag icon={IbmCloud}>IBM Cloud</Tag>

--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@ -165,7 +165,7 @@ bufferutil@^4.0.1:
    node-gyp-build "~3.7.0"

 carbon-components-svelte@../:
-  version "0.70.1"
+  version "0.73.3"
  dependencies:
    flatpickr "4.6.9"

@ -1280,10 +1280,10 @@ svelte-hmr@^0.14.12:
  resolved "https://registry.yarnpkg.com/svelte-hmr/-/svelte-hmr-0.14.12.tgz#a127aec02f1896500b10148b2d4d21ddde39973f"
  integrity sha512-4QSW/VvXuqVcFZ+RhxiR8/newmwOCTlbYIezvkeN6302YFRE8cXy0naamHcjz8Y9Ce3ITTZtrHrIL0AGfyo61w==

-svelte@^3.49.0:
-  version "3.49.0"
-  resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.49.0.tgz#5baee3c672306de1070c3b7888fc2204e36a4029"
-  integrity sha512-+lmjic1pApJWDfPCpUUTc1m8azDqYCG1JN9YEngrx/hUyIcFJo6VZhj0A1Ai0wqoHcEIuQy+e9tk+4uDgdtsFA==
+svelte@^3.57.0:
+  version "3.57.0"
+  resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.57.0.tgz#a3969cfe51f25f2a55e75f7b98dbd02c3af0980b"
+  integrity sha512-WMXEvF+RtAaclw0t3bPDTUe19pplMlfyKDsixbHQYgCWi9+O9VN0kXU1OppzrB9gPAvz4NALuoca2LfW2bOjTQ==

 symbol-tree@^3.2.4:
  version "3.2.4"
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "carbon-components-svelte",
-  "version": "0.73.3",
+  "version": "0.73.5",
  "license": "Apache-2.0",
  "description": "Svelte implementation of the Carbon Design System",
  "svelte": "./src/index.js",
@ -39,7 +39,7 @@
    "sass": "^1.49.11",
    "standard-version": "^9.5.0",
    "sveld": "^0.18.0",
-    "svelte": "^3.51.0",
+    "svelte": "^3.57.0",
    "svelte-check": "^2.8.1",
    "typescript": "^4.7.4"
  },
--- a/src/ContextMenu/ContextMenu.svelte
+++ b/src/ContextMenu/ContextMenu.svelte
@ -153,6 +153,7 @@
  }}"
 />

+<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
 <ul
  bind:this="{ref}"
  role="menu"
--- a/src/NumberInput/NumberInput.svelte
+++ b/src/NumberInput/NumberInput.svelte
@ -191,8 +191,8 @@
        type="number"
        pattern="[0-9]*"
        aria-describedby="{errorId}"
-        data-invalid="{(error) || undefined}"
-        aria-invalid="{(error) || undefined}"
+        data-invalid="{error || undefined}"
+        aria-invalid="{error || undefined}"
        aria-label="{label ? undefined : ariaLabel}"
        disabled="{disabled}"
        id="{id}"
--- a/src/OverflowMenu/OverflowMenu.svelte
+++ b/src/OverflowMenu/OverflowMenu.svelte
@ -242,6 +242,7 @@
    />
  </slot>
  {#if open}
+    <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
    <ul
      bind:this="{menuRef}"
      role="menu"
--- a/src/ProgressIndicator/ProgressStep.svelte
+++ b/src/ProgressIndicator/ProgressStep.svelte
@ -53,7 +53,6 @@

 <!-- svelte-ignore a11y-mouse-events-have-key-events -->
 <li
-  aria-disabled="{disabled}"
  id="{id}"
  class:bx--progress-step="{true}"
  class:bx--progress-step--current="{current}"
--- a/src/Tabs/Tabs.svelte
+++ b/src/Tabs/Tabs.svelte
@ -151,6 +151,7 @@
    </a>
    <ChevronDown aria-hidden="true" title="{iconDescription}" />
  </div>
+  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
  <ul
    bind:this="{refTabList}"
    role="tablist"
--- a/src/Tile/SelectableTile.svelte
+++ b/src/Tile/SelectableTile.svelte
@ -1,4 +1,9 @@
 <script>
+  /**
+   * @event {string} "select"
+   * @event {string} "deselect"
+   */
+
  /** Set to `true` to select the tile */
  export let selected = false;

--- a/src/TreeView/TreeView.svelte
+++ b/src/TreeView/TreeView.svelte
@ -188,6 +188,7 @@
  </label>
 {/if}

+<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
 <ul
  {...$$restProps}
  role="tree"
--- a/src/TreeView/TreeViewNode.svelte
+++ b/src/TreeView/TreeViewNode.svelte
@ -75,6 +75,7 @@
  }
 </script>

+<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
 <li
  bind:this="{ref}"
  role="treeitem"
--- a/src/TreeView/TreeViewNodeList.svelte
+++ b/src/TreeView/TreeViewNodeList.svelte
@ -72,6 +72,7 @@
    {/if}
  {/each}
 {:else}
+  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
  <li
    bind:this="{ref}"
    role="treeitem"
--- a/src/UIShell/HeaderNav.svelte
+++ b/src/UIShell/HeaderNav.svelte
@ -6,6 +6,7 @@
 </script>

 <nav {...props} class:bx--header__nav="{true}" {...$$restProps}>
+  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
  <ul {...props} role="menubar" class:bx--header__menu-bar="{true}">
    <slot />
  </ul>
--- a/src/UIShell/HeaderNavMenu.svelte
+++ b/src/UIShell/HeaderNavMenu.svelte
@ -94,6 +94,7 @@
    {text}
    <ChevronDown class="bx--header__menu-arrow" />
  </a>
+  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
  <ul
    bind:this="{menuRef}"
    role="menu"
--- a/src/UIShell/HeaderSearch.svelte
+++ b/src/UIShell/HeaderSearch.svelte
@ -134,6 +134,7 @@
  </div>

  {#if active && results.length > 0}
+    <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
    <ul aria-labelledby="search-label" role="menu" id="search-menu">
      {#each results as result, i}
        <li role="none">
--- a/src/UIShell/SideNavMenu.svelte
+++ b/src/UIShell/SideNavMenu.svelte
@ -48,6 +48,7 @@
      <ChevronDown />
    </div>
  </button>
+  <!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
  <ul
    role="menu"
    class:bx--side-nav__menu="{true}"
--- a/types/Tile/SelectableTile.svelte.d.ts
+++ b/types/Tile/SelectableTile.svelte.d.ts
@ -67,6 +67,8 @@ export interface SelectableTileProps
 export default class SelectableTile extends SvelteComponentTyped<
  SelectableTileProps,
  {
+    select: CustomEvent<string>;
+    deselect: CustomEvent<string>;
    click: WindowEventMap["click"];
    mouseover: WindowEventMap["mouseover"];
    mouseenter: WindowEventMap["mouseenter"];
--- a/yarn.lock
+++ b/yarn.lock
@ -2018,16 +2018,16 @@ svelte-preprocess@^4.10.6:
    sorcery "^0.10.0"
    strip-indent "^3.0.0"

-svelte@^3.51.0:
-  version "3.51.0"
-  resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.51.0.tgz#a1a0afb25dc518217f353dd73ea6471c128ddf84"
-  integrity sha512-PBITYIrsNOuW+Dtds00gSY68raNZQn7i59Dg/fjgf6WwyawPKeBwle692coO7ILZqSO+UJe9899aDn9sMdeOHA==
-
 svelte@^3.52.0:
  version "3.54.0"
  resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.54.0.tgz#b4bcd865bd9e927f9f7b76563288ef5f4d72867a"
  integrity sha512-tdrgeJU0hob0ZWAMoKXkhcxXA7dpTg6lZGxUeko5YqvPdJBiyRspGsCwV27kIrbrqPP2WUoSV9ca0gnLlw8YzQ==

+svelte@^3.57.0:
+  version "3.57.0"
+  resolved "https://registry.yarnpkg.com/svelte/-/svelte-3.57.0.tgz#a3969cfe51f25f2a55e75f7b98dbd02c3af0980b"
+  integrity sha512-WMXEvF+RtAaclw0t3bPDTUe19pplMlfyKDsixbHQYgCWi9+O9VN0kXU1OppzrB9gPAvz4NALuoca2LfW2bOjTQ==
+
 terser@^5.0.0:
  version "5.14.2"
  resolved "https://registry.yarnpkg.com/terser/-/terser-5.14.2.tgz#9ac9f22b06994d736174f4091aa368db896f1c10"