mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 11:36:36 +00:00
Merge branch 'carbon-design-system:master' into patch-1
This commit is contained in:
commit
b2db84b564
30 changed files with 81 additions and 83 deletions
10
.github/workflows/ci.yml
vendored
10
.github/workflows/ci.yml
vendored
|
@ -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"
|
||||
|
|
18
CHANGELOG.md
18
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)
|
||||
|
||||
|
|
|
@ -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`
|
||||
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||

|
||||

|
||||
<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.
|
||||
|
||||
[](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
|
||||
|
|
|
@ -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": {
|
||||
|
|
|
@ -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" },
|
||||
|
|
|
@ -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 />
|
|
@ -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);
|
||||
|
|
|
@ -66,7 +66,7 @@
|
|||
</script>
|
||||
|
||||
<Content data-components>
|
||||
<Grid>
|
||||
<Grid class="fix-overflow">
|
||||
<Row>
|
||||
<Column>
|
||||
<h1>{component}</h1>
|
||||
|
|
|
@ -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('/')}"
|
||||
|
|
|
@ -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
|
||||
|
||||
|
|
|
@ -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>
|
||||
|
||||
|
|
|
@ -12,7 +12,7 @@ The `Theme` component can dyanmically update the Carbon theme on the client-side
|
|||
</InlineNotification>
|
||||
|
||||
The `all.css` StyleSheet uses [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) for dynamic theming.
|
||||
|
||||
|
||||
<CodeSnippet svx-ignore {code} />
|
||||
|
||||
## Default
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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"
|
||||
},
|
||||
|
|
|
@ -153,6 +153,7 @@
|
|||
}}"
|
||||
/>
|
||||
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
|
||||
<ul
|
||||
bind:this="{ref}"
|
||||
role="menu"
|
||||
|
|
|
@ -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}"
|
||||
|
|
|
@ -242,6 +242,7 @@
|
|||
/>
|
||||
</slot>
|
||||
{#if open}
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
|
||||
<ul
|
||||
bind:this="{menuRef}"
|
||||
role="menu"
|
||||
|
|
|
@ -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}"
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -1,4 +1,9 @@
|
|||
<script>
|
||||
/**
|
||||
* @event {string} "select"
|
||||
* @event {string} "deselect"
|
||||
*/
|
||||
|
||||
/** Set to `true` to select the tile */
|
||||
export let selected = false;
|
||||
|
||||
|
|
|
@ -188,6 +188,7 @@
|
|||
</label>
|
||||
{/if}
|
||||
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
|
||||
<ul
|
||||
{...$$restProps}
|
||||
role="tree"
|
||||
|
|
|
@ -75,6 +75,7 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
|
||||
<li
|
||||
bind:this="{ref}"
|
||||
role="treeitem"
|
||||
|
|
|
@ -72,6 +72,7 @@
|
|||
{/if}
|
||||
{/each}
|
||||
{:else}
|
||||
<!-- svelte-ignore a11y-no-noninteractive-element-to-interactive-role -->
|
||||
<li
|
||||
bind:this="{ref}"
|
||||
role="treeitem"
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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">
|
||||
|
|
|
@ -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}"
|
||||
|
|
2
types/Tile/SelectableTile.svelte.d.ts
vendored
2
types/Tile/SelectableTile.svelte.d.ts
vendored
|
@ -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"];
|
||||
|
|
10
yarn.lock
10
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"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue